页面切图
This commit is contained in:
@@ -2,19 +2,21 @@
|
||||
<Cn-page :loading='loading' noPadding>
|
||||
<view slot='body'>
|
||||
<view class='detail'>
|
||||
<view class="header">
|
||||
<image src="/static/test2.pic.jpg" mode="widthFix" style="width: 100%;" />
|
||||
</view>
|
||||
<view class="des">
|
||||
<text>设备基础信息</text>
|
||||
<text class="ml10">设备状态</text>
|
||||
</view>
|
||||
<view class="nav">
|
||||
<view class="nav-menu" :class="{ 'nav-menu-active': navMenuActive == index }"
|
||||
v-for="(item, index) in navMenuList" :key="index" @click="navMenuClick(index)">{{ item.text }}
|
||||
<view class="detail-header">
|
||||
<view class="header">
|
||||
<image src="/static/test2.pic.jpg" mode="widthFix" style="width: 100%;" />
|
||||
</view>
|
||||
<!-- <view class="des">
|
||||
<text>设备基础信息</text>
|
||||
<text class="ml10">设备状态</text>
|
||||
</view> -->
|
||||
<view class="nav">
|
||||
<view class="nav-menu" :class="{ 'nav-menu-active': navMenuActive == index }"
|
||||
v-for="(item, index) in navMenuList" :key="index" @click="navMenuClick(index)">{{ item.text }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content" :style="{ minHeight: 'calc(100vh - ' + navHeight + 'px)' }">
|
||||
<view class="content" >
|
||||
<view v-if="navMenuActive == 0">
|
||||
<basic></basic>
|
||||
</view>
|
||||
@@ -211,7 +213,13 @@ export default {
|
||||
box-sizing: border-box;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.detail-header{
|
||||
position: sticky;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
background: #f3f4f5;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
@@ -6,8 +6,7 @@
|
||||
<uni-forms-item label="设备识别码">
|
||||
<view style="display:flex">
|
||||
<uni-easyinput type="number" v-model="code" placeholder="请输入设备识别码" />
|
||||
<uni-icons type="camera" color="#007aff" size="26" class="ml20"
|
||||
@click="scanCode"></uni-icons>
|
||||
<uni-icons type="camera" color="#007aff" size="26" class="ml20" @click="scanCode"></uni-icons>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</uni-forms>
|
||||
@@ -18,8 +17,15 @@
|
||||
</template>
|
||||
<template v-else>
|
||||
|
||||
<view class="content" v-for="(item, index) in formData" :key="index">
|
||||
<view class="content">
|
||||
<uni-forms>
|
||||
<uni-forms-item label="项目">
|
||||
<uni-data-select v-model="formData.project" :localdata="projectRange"></uni-data-select>
|
||||
</uni-forms-item>
|
||||
<!-- <uni-forms-item label="型号">
|
||||
<uni-data-select v-model="formData.type" :localdata="typeRange"
|
||||
@change="typeChange(item)"></uni-data-select>
|
||||
</uni-forms-item> -->
|
||||
<uni-forms-item label="位置">
|
||||
<view style="display:flex;">
|
||||
<uni-easyinput :clearable="false" type="textarea" autoHeight v-model="formData.address"
|
||||
@@ -33,11 +39,18 @@
|
||||
<view style="flex:1">
|
||||
<image class="gplot" src="/static/test2.pic.jpg" mode="aspectFill" />
|
||||
</view>
|
||||
<uni-icons type="image" color="#007aff" size="26" class="ml20"
|
||||
@click="chooseGplot"></uni-icons>
|
||||
<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">
|
||||
<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 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>
|
||||
<uni-icons type="trash" color="#007aff" size="26" class="ml20"
|
||||
@@ -45,20 +58,19 @@
|
||||
<uni-icons type="compose" color="#007aff" size="26" class="ml20"
|
||||
@click="editPoint(index)"></uni-icons>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</uni-forms-item> -->
|
||||
</uni-forms>
|
||||
|
||||
</view>
|
||||
<view class="btn-wrap">
|
||||
<view class="btn-wrap-item" @click="add"> 添加监测点 </view>
|
||||
<!-- <view class="btn-wrap-item" @click="add"> 添加监测点 </view> -->
|
||||
<view class="btn-wrap-item ml20" @click="submit"> 提交 </view>
|
||||
</view>
|
||||
<uni-drawer ref="gplot" mode="right" :mask-click="false">
|
||||
<scroll-view style="height: 100%;" scroll-y="true">
|
||||
<view class="content">
|
||||
<image class="gplot gplot-box" mode="aspectFill" :class="{ 'gplot-active': key == activeGplot }"
|
||||
src="/static/test2.pic.jpg" @click="activeGplot = key" v-for="(item, key) in 3"
|
||||
:key="key" />
|
||||
src="/static/test2.pic.jpg" @click="activeGplot = key" v-for="(item, key) in 3" :key="key" />
|
||||
<view class="btn-wrap">
|
||||
<view class="btn-wrap-item" @click="closeDrawer"> 取消 </view>
|
||||
<view class="btn-wrap-item ml20" @click="closeDrawer"> 确定 </view>
|
||||
@@ -106,18 +118,57 @@ export default {
|
||||
type: 1,
|
||||
formData: {
|
||||
address: '',
|
||||
type: '',
|
||||
project: '',
|
||||
},
|
||||
projectRange: [
|
||||
{ value: 1, text: "监测", point: 1 },
|
||||
{ value: 2, text: "治理", point: 2 },
|
||||
{ value: 3, text: "用能", point: 1 },
|
||||
],
|
||||
// typeRange: [
|
||||
// { value: 1, text: "POS-882AX", point: 1 },
|
||||
// { value: 2, text: "NPOS-681", point: 2 },
|
||||
// { value: 3, text: "NPOS-681", point: 1 },
|
||||
// { value: 4, text: "POV-500", point: 2 },
|
||||
// { value: 5, text: "PQV-300", point: 1 },
|
||||
// { value: 6, text: "NPOS-571W", point: 3 },
|
||||
// { value: 7, text: "NPQS-572W", point: 3 },
|
||||
// { value: 8, text: "POS-882B6", point: 2 },
|
||||
// { value: 9, text: "PQS-882B5", point: 1 },
|
||||
// { value: 10, text: "POS-882B4", point: 2 },
|
||||
// { value: 11, text: "PQS-882B2", point: 1 },
|
||||
// { value: 12, text: "POS-882A", point: 2 },
|
||||
// { value: 13, text: "POS-883A", point: 1 },
|
||||
// { value: 14, text: "NPOS-581", point: 2 },
|
||||
// { value: 15, text: "PQS-681", point: 1 },
|
||||
// { value: 16, text: "POS-8825", point: 3 },
|
||||
// { value: 17, text: "PQS-782", point: 1 },
|
||||
// { value: 18, text: "POS-880X", point: 3 },
|
||||
// { value: 19, text: "NPQS-580", point: 1 },
|
||||
// { value: 20, text: "NPOS-572", point: 2 },
|
||||
// ],
|
||||
point: {
|
||||
x: 170,
|
||||
y: 100,
|
||||
},
|
||||
pointName: '',
|
||||
pointList: [],
|
||||
activeGplot: 1,
|
||||
pointList: [{
|
||||
name: '',
|
||||
x: 170,
|
||||
y: 100,
|
||||
}, {
|
||||
name: '',
|
||||
x: 170,
|
||||
y: 100,
|
||||
}],
|
||||
activeGplot: 0,
|
||||
editIndex: -1,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
projectChange (e) {
|
||||
},
|
||||
scanCode () {
|
||||
uni.scanCode({
|
||||
success: function (res) {
|
||||
@@ -185,11 +236,11 @@ export default {
|
||||
deletePoint (index) {
|
||||
this.pointList.splice(index, 1)
|
||||
},
|
||||
editPoint (index) {
|
||||
editPoint (item, index) {
|
||||
this.editIndex = index
|
||||
this.point.x = this.pointList[index].x
|
||||
this.point.y = this.pointList[index].y
|
||||
this.pointName = this.pointList[index].pointName
|
||||
this.point.x = item.x
|
||||
this.point.y = item.y
|
||||
this.pointName = item.pointName
|
||||
this.$refs.point.open()
|
||||
},
|
||||
dragPoint (e) {
|
||||
@@ -208,7 +259,7 @@ export default {
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
.new {
|
||||
padding: 34rpx;
|
||||
padding: 34rpx;
|
||||
|
||||
.new-btn {
|
||||
display: flex;
|
||||
@@ -230,7 +281,7 @@ export default {
|
||||
}
|
||||
|
||||
margin-bottom: 20rpx;
|
||||
padding: 34rpx;
|
||||
padding: 34rpx;
|
||||
background: $uni-theme-white;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<view class='index'>
|
||||
<view class="content" v-for="(item, index) in deviceList" :key="index">
|
||||
<uni-forms :label-width="80">
|
||||
<uni-forms-item label="类型">
|
||||
<uni-forms-item label="型号">
|
||||
<uni-data-select v-model="item.type" :localdata="range"
|
||||
@change="typeChange(item)"></uni-data-select>
|
||||
</uni-forms-item>
|
||||
@@ -112,7 +112,6 @@ export default {
|
||||
{ value: 18, text: "POS-880X", point: 3 },
|
||||
{ value: 19, text: "NPQS-580", point: 1 },
|
||||
{ value: 20, text: "NPOS-572", point: 2 },
|
||||
|
||||
],
|
||||
point: {
|
||||
x: 170,
|
||||
|
||||
@@ -7,11 +7,8 @@
|
||||
<view>灿能电力</view>
|
||||
<view class="tag">{{ roleName }}</view>
|
||||
</view>
|
||||
<image
|
||||
src="/static/erweima.png"
|
||||
style="height: 50rpx;width: 50rpx;border-radius:12rpx"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
<image src="/static/erweima.png" style="height: 50rpx;width: 50rpx;border-radius:12rpx"
|
||||
mode="scaleToFill" />
|
||||
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
|
||||
</view>
|
||||
<!-- <view class="mine-nav" @click="jump('upgrade')">
|
||||
@@ -36,8 +33,12 @@
|
||||
<view class="mine-nav-label">网关列表</view>
|
||||
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
|
||||
</view>
|
||||
|
||||
<view class="mine-nav" @click="jump('setup')" style="margin-top:20rpx;border-bottom: none; ">
|
||||
<view class="mine-nav" @click="jump('setupMessage')">
|
||||
<image mode="aspectFill" class="mine-nav-icon" src="/static/notice2.png" />
|
||||
<view class="mine-nav-label">消息配置</view>
|
||||
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
|
||||
</view>
|
||||
<view class="mine-nav" @click="jump('setup')" style="border-bottom: none; ">
|
||||
<image mode="aspectFill" class="mine-nav-icon" src="/static/setup.png" />
|
||||
<view class="mine-nav-label">设置</view>
|
||||
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
|
||||
@@ -168,7 +169,7 @@ export default {
|
||||
}
|
||||
|
||||
.mine-nav {
|
||||
padding: 34rpx;
|
||||
padding: 34rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: $uni-theme-white;
|
||||
|
||||
@@ -9,10 +9,10 @@
|
||||
<view class="mine-nav-label">修改密码</view>
|
||||
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
|
||||
</view>
|
||||
<view class="mine-nav" @click="jump('setupMessage')" style="margin-top:20rpx;border-bottom: none; ">
|
||||
<!-- <view class="mine-nav" @click="jump('setupMessage')" style="margin-top:20rpx;border-bottom: none; ">
|
||||
<view class="mine-nav-label">消息配置</view>
|
||||
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="mine-nav" @click="jump('agreement')" style="margin-top:20rpx;">
|
||||
<view class="mine-nav-label">用户协议</view>
|
||||
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
|
||||
|
||||
@@ -512,9 +512,9 @@
|
||||
margin: 6px;
|
||||
margin-left: 0;
|
||||
height: 80px;
|
||||
min-height: 80px;
|
||||
// min-height: 80px;
|
||||
/* #ifndef APP-NVUE */
|
||||
min-height: 80px;
|
||||
// min-height: 80px;
|
||||
width: auto;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user