App/app-govern
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

页面切图

Browse Source
This commit is contained in:
仲么了
2023-03-08 13:45:57 +08:00
parent 7494382309
commit 43419da4c7
7 changed files with 734 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

116
pages/device/APF/detail.vue
View File

@@ -3,28 +3,86 @@
<view slot='body'>
<view class='detail'>
<view class="detail-header">
<view class="header">
<image src="/static/test2.pic.png" mode="widthFix" style="width: 100%;" />
<view class="point" :style="{ left: '480rpx', top: '130rpx' }">负载THDI:<view></view>1703. 384%</view>
<view class="point" :style="{ left: '200rpx', top: '130rpx' }">电网THDI:<view></view>80. 831%</view>
<view class="header" ref="header" @click="htmlToCanvas">
<img src="/static/test2.pic.png" mode="widthFix" style="width: 100%;object-fit:cover" />
<view class="point" :style="{ left: '480rpx', top: '80rpx' }">负载THDI(%)
<view class="grid-card mt10">
<view class="grid-card-content-2">
<view class="item">L1</view>
<view class="item">
558.2
</view>
<view class="item">L2</view>
<view class="item">
883.7
</view>
<view class="item">L3</view>
<view class="item">
403.4
</view>
</view>
</view>
</view>
<view class="point" :style="{ left: '200rpx', top: '80rpx' }">电网THDI(%)
<view class="grid-card mt10">
<view class="grid-card-content-2">
<view class="item">L1</view>
<view class="item">
55.3
</view>
<view class="item">L2</view>
<view class="item">
61.4
</view>
<view class="item">L3</view>
<view class="item">
55.2
</view>
</view>
</view>
</view>
<view class="module">
<view class="grid-card">
<view class="grid-card-content-2">
<view class="item">模块一(300A)</view>
<view class="item">模块一</view>
<view class="item">
THDI：4.6% THDU：4.6%
<view class="status-point-success mr10"></view>
<view style="width:30rpx">
15
</view>
<view>
°C
</view>
</view>
<view class="item">模块二(300A)</view>
<view class="item">模块二</view>
<view class="item">
THDI：4.6% THDU：4.6%
<view class="status-point-error mr10"></view>
<view style="width:30rpx">
0
</view>
<view>
°C
</view>
</view>
<view class="item">模块三(300A)</view>
<view class="item">模块三</view>
<view class="item">
THDI：4.6% THDU：4.6%
<view class="status-point-success mr10"></view>
<view style="width:30rpx">
15
</view>
<view>
°C
</view>
</view>
<view class="item">模块四(300A)</view>
<view class="item">模块四</view>
<view class="item">
THDI：4.6% THDU：4.6%
<view class="status-point-success mr10"></view>
<view style="width:30rpx">
15
</view>
<view>
°C
</view>
</view>
</view>
</view>
@@ -70,6 +128,8 @@ import xieBo from "./comp/xieBo.vue";
import power from "./comp/power.vue";
import oscillogram from "./comp/oscillogram.vue";
import IO from "./comp/IO.vue";
import html2canvas from 'html2canvas';
export default {
components: {
@@ -206,6 +266,20 @@ export default {
this.navHeight = rect.height
}).exec()
}, 1000);
},
htmlToCanvas () {
// 获取设备dpi
let dom = this.$refs.header.$el
html2canvas(dom, {
scale: 8,
}).then((canvas) => {
// this.$refs.header.appendChild(canvas);
console.log(canvas);
uni.previewImage({
current: 0,
urls: [canvas.toDataURL('image/png')]
})
});
}
},
onLoad (options) {
@@ -226,18 +300,27 @@ export default {
color: #111;
z-index: 2;
text-align: center;
font-size: 20rpx;
color: #111;
width: 110rpx;
font-size: 16rpx;
.grid-card-content-2 {
font-size: 16rpx;
.item {
min-height: unset;
}
}
}
.module {
position: absolute;
bottom: 0;
right: 0;
width: 300rpx;
right: 20rpx;
width: 200rpx;
.grid-card-content-2 {
font-size: 14rpx;
font-size: 16rpx;
.item {
min-height: unset;
@@ -265,5 +348,6 @@ export default {
z-index: 2;
background: #f3f4f5;
}
}
</style>

23
pages/device/feedback.vue
View File

@@ -2,16 +2,19 @@
<Cn-page :loading='loading'>
<view slot='body'>
<view class='index'>
<view class="content" v-for="(item, index) in formData" :key="index">
<view class="content" :key="index">
<uni-forms>
<!-- <uni-forms-item label="类型">
<uni-data-select v-model="item.type" :localdata="range"></uni-data-select>
</uni-forms-item> -->
<uni-forms-item label="标题">
<uni-easyinput type="text" v-model="item.title" placeholder="请输入问题简要" />
<uni-easyinput type="text" v-model="formData.title" placeholder="请输入问题简要" />
</uni-forms-item>
<uni-forms-item label="描述">
<uni-easyinput type="textarea" v-model="item.des" placeholder="请输入详细描述" />
<uni-easyinput type="textarea" v-model="formData.des" placeholder="请输入详细描述" />
</uni-forms-item>
<uni-forms-item label="图片">
<uni-file-picker :auto-upload="false" :fileList="formData.fileList" @change="fileChange" />
</uni-forms-item>
</uni-forms>
</view>
@@ -27,12 +30,11 @@ export default {
data () {
return {
loading: false,
formData: [
{
title: '',
des: '',
}
],
formData: {
title: '',
des: '',
fileList: []
},
range: [
{ value: 0, text: "DVR" },
{ value: 1, text: "APF" },
@@ -60,7 +62,7 @@ export default {
.content {
margin-bottom: 20rpx;
padding: 34rpx;
padding: 34rpx;
background: $uni-theme-white;
border-radius: 12rpx;
}
@@ -83,5 +85,4 @@ export default {
}
}
}
</style>

4
pages/device/new.vue
View File

@@ -42,14 +42,14 @@
<uni-icons type="image" color="#007aff" size="26" class="ml20" @click="chooseGplot"></uni-icons>
</view>
</uni-forms-item>
<uni-forms-item label="监测点" v-if="pointList.length">
<!-- <uni-forms-item label="监测点" v-if="pointList.length">
<view class="point-item" v-for="(item2, index2) in pointList" :key="index2"
@click="editPoint(item2, index2)">
<view style="flex:1" v-if="item2.pointName">{{ item2.pointName }}</view>
<view style="flex:1;color:#999" v-else>请选择监测点</view>
<uni-icons type="compose" color="#007aff" size="26" class="ml20"></uni-icons>
</view>
</uni-forms-item>
</uni-forms-item> -->
<!-- <uni-forms-item label="监测点" v-if="pointList.length">
<view class="point-item center" v-for="(item, index) in pointList" :key="index">
<view style="flex:1" class="center">{{ item.pointName }}</view>