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-02-23 08:44:46 +08:00
parent 95db305cee
commit 89f0e79ceb
25 changed files with 830 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

134
pages/index/comp/indexGongCheng.vue
View File

@@ -1,5 +1,5 @@
<template>
<view class="index-gongcheng">
<view class="index-zhuyonghu">
<div class="header">
<div class="header-item">
<div class="header-item-value">3</div>
@@ -14,24 +14,124 @@
<div class="header-item-label">离线设备</div>
</div>
</div>
<uni-card title="基础设备" sub-title="副标题" :extra="item % 2 ? 'APF' : 'DVR'" v-for="item in 3" :key="item"
@click="jump(item)" thumbnail="/static/device.png">
<text>设备基础信息 </text>
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
<view style="padding:20rpx 20rpx 0">
<Cn-grid title="注册">
<Cn-grid-item src="/static/device2.png" text="设备" @click="registerDevice"></Cn-grid-item>
<Cn-grid-item src="/static/gateway2.png" text="网关" @click="registerGateway"></Cn-grid-item>
<Cn-grid-item background="#fff"></Cn-grid-item>
<Cn-grid-item background="#fff"></Cn-grid-item>
</Cn-grid>
</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 class="content device" :style="{ minHeight: minHeight }">
<uni-card :title="item.name" :sub-title="item.project" :extra="item.type" padding="0"
v-for="(item, index) in deviceListFilter" :key="index" @click="jump(item)" thumbnail="/static/device.png">
<!-- <text>{{ item.project }} {{ item.type }}</text> -->
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
</view>
</view>
</template>
<script>
export default {
data () {
return {
loading: false
loading: false,
navMenuList: [{
text: '全部'
}, {
text: '监测'
}, {
text: '治理'
}],
navMenuActive: 0,
navHeight: 0,
minHeight: '',
deviceList: [
{
name: '设备1',
des: '设备描述1',
type: 'APF',
project: '监测',
},
{
name: '设备2',
des: '设备描述2',
type: 'DVR',
project: '治理'
},
{
name: '设备3',
des: '设备描述3',
type: 'DVR',
project: '治理'
},
{
name: '设备4',
des: '设备描述4',
type: 'DVR',
project: '治理'
},
{
name: '设备5',
des: '设备描述5',
type: 'APF',
project: '治理'
},
{
name: '设备6',
des: '设备描述6',
type: 'APF',
project: '治理'
}
]
}
},
computed: {
deviceListFilter () {
if (this.navMenuActive == 0) {
return this.deviceList
} else {
return this.deviceList.filter(item => item.project == this.navMenuList[this.navMenuActive].text)
}
}
},
methods: {
registerDevice () {
uni.showModal({
title: '提示',
content: '请选择设备类型',
confirmText: '直连装置',
cancelText: '网关接入',
cancelColor: '#007aff',
success: ({ confirm, cancel }) => {
if (confirm) {
uni.navigateTo({
url: '/pages/device/new'
})
} else if (cancel) {
uni.navigateTo({
url: '/pages/gateway/list'
})
}
}
})
},
registerGateway () {
uni.navigateTo({
url: '/pages/gateway/new'
})
},
navMenuClick (index) {
this.navMenuActive = index
},
jump (item) {
if (item % 2) {
uni.navigateTo({
if (item.type == 'APF') {
uni.navigateTo({
url: '/pages/device/APF/detail'
})
} else {
@@ -40,9 +140,23 @@ export default {
})
}
},
},
mounted () {
setTimeout(() => {
// 获取nav高度
uni.createSelectorQuery().select('.nav').boundingClientRect((rect) => {
this.navHeight = rect.height
// #ifdef H5
this.minHeight = 'calc(100vh - env(safe-area-inset-bottom) - ' + (50 + this.navHeight) + 'px)'
// #endif
// #ifdef APP-PLUS
this.minHeight = 'calc(100vh - ' + this.navHeight + 'px)'
// #endif
}).exec()
}, 1000);
}
}
</script>
<style lang='scss'>
.index-gongcheng {}
</style>

134
pages/index/comp/indexYunWei.vue
View File

@@ -1,5 +1,5 @@
<template>
<view class="index-yunwei">
<view class="index-zhuyonghu">
<div class="header">
<div class="header-item">
<div class="header-item-value">3</div>
@@ -14,24 +14,124 @@
<div class="header-item-label">离线设备</div>
</div>
</div>
<uni-card title="基础设备" sub-title="副标题" :extra="item % 2 ? 'APF' : 'DVR'" v-for="item in 3" :key="item"
@click="jump(item)" thumbnail="/static/device.png">
<text>设备基础信息 </text>
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
<view style="padding:20rpx 20rpx 0">
<Cn-grid title="注册">
<Cn-grid-item src="/static/device2.png" text="设备" @click="registerDevice"></Cn-grid-item>
<Cn-grid-item src="/static/gateway2.png" text="网关" @click="registerGateway"></Cn-grid-item>
<Cn-grid-item background="#fff"></Cn-grid-item>
<Cn-grid-item background="#fff"></Cn-grid-item>
</Cn-grid>
</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 class="content device" :style="{ minHeight: minHeight }">
<uni-card :title="item.name" :sub-title="item.project" :extra="item.type" padding="0"
v-for="(item, index) in deviceListFilter" :key="index" @click="jump(item)" thumbnail="/static/device.png">
<!-- <text>{{ item.project }} {{ item.type }}</text> -->
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
</view>
</view>
</template>
<script>
export default {
data () {
return {
loading: false
loading: false,
navMenuList: [{
text: '全部'
}, {
text: '监测'
}, {
text: '治理'
}],
navMenuActive: 0,
navHeight: 0,
minHeight: '',
deviceList: [
{
name: '设备1',
des: '设备描述1',
type: 'APF',
project: '监测',
},
{
name: '设备2',
des: '设备描述2',
type: 'DVR',
project: '治理'
},
{
name: '设备3',
des: '设备描述3',
type: 'DVR',
project: '治理'
},
{
name: '设备4',
des: '设备描述4',
type: 'DVR',
project: '治理'
},
{
name: '设备5',
des: '设备描述5',
type: 'APF',
project: '治理'
},
{
name: '设备6',
des: '设备描述6',
type: 'APF',
project: '治理'
}
]
}
},
computed: {
deviceListFilter () {
if (this.navMenuActive == 0) {
return this.deviceList
} else {
return this.deviceList.filter(item => item.project == this.navMenuList[this.navMenuActive].text)
}
}
},
methods: {
registerDevice () {
uni.showModal({
title: '提示',
content: '请选择设备类型',
confirmText: '直连装置',
cancelText: '网关接入',
cancelColor: '#007aff',
success: ({ confirm, cancel }) => {
if (confirm) {
uni.navigateTo({
url: '/pages/device/new'
})
} else if (cancel) {
uni.navigateTo({
url: '/pages/gateway/list'
})
}
}
})
},
registerGateway () {
uni.navigateTo({
url: '/pages/gateway/new'
})
},
navMenuClick (index) {
this.navMenuActive = index
},
jump (item) {
if (item % 2) {
uni.navigateTo({
if (item.type == 'APF') {
uni.navigateTo({
url: '/pages/device/APF/detail'
})
} else {
@@ -40,9 +140,23 @@ export default {
})
}
},
},
mounted () {
setTimeout(() => {
// 获取nav高度
uni.createSelectorQuery().select('.nav').boundingClientRect((rect) => {
this.navHeight = rect.height
// #ifdef H5
this.minHeight = 'calc(100vh - env(safe-area-inset-bottom) - ' + (50 + this.navHeight) + 'px)'
// #endif
// #ifdef APP-PLUS
this.minHeight = 'calc(100vh - ' + this.navHeight + 'px)'
// #endif
}).exec()
}, 1000);
}
}
</script>
<style lang='scss'>
.index-yunwei {}
</style>

16
pages/index/comp/indexZhuYongHu.vue
View File

@@ -27,15 +27,14 @@
v-for="(item, index) in navMenuList" :key="index" @click="navMenuClick(index)">{{ item.text }}
</view>
</view>
<view class="content" :style="{ minHeight: minHeight }">
<uni-card :title="item.name" :sub-title="item.project" :extra="item.type"
v-for="(item, index) in deviceListFilter" :key="index" style="margin-top:4rpx" @click="jump(item)"
thumbnail="/static/device.png">
<text>{{ item.project }} {{ item.type }}</text>
<view class="content device" :style="{ minHeight: minHeight }">
<uni-card :title="item.name" :sub-title="item.project" :extra="item.type" padding="0"
v-for="(item, index) in deviceListFilter" :key="index" @click="jump(item)" thumbnail="/static/device.png">
<!-- <text>{{ item.project }} {{ item.type }}</text> -->
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
</view>
</view>
</view>
</template>
<script>
export default {
@@ -153,10 +152,11 @@ export default {
// #ifdef APP-PLUS
this.minHeight = 'calc(100vh - ' + this.navHeight + 'px)'
// #endif
}).exec()
}, 1000);
}
}
</script>
<style lang='scss'></style>
<style lang='scss'>
</style>

134
pages/index/comp/indexZiYongHu.vue
View File

@@ -1,5 +1,5 @@
<template>
<view class="index-ziyonghu">
<view class="index-zhuyonghu">
<div class="header">
<div class="header-item">
<div class="header-item-value">3</div>
@@ -14,24 +14,124 @@
<div class="header-item-label">离线设备</div>
</div>
</div>
<uni-card title="基础设备" sub-title="副标题" :extra="item % 2 ? 'APF' : 'DVR'" v-for="item in 3" :key="item"
@click="jump(item)" thumbnail="/static/device.png">
<text>设备基础信息 </text>
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
<!-- <view style="padding:20rpx 20rpx 0">
<Cn-grid title="注册">
<Cn-grid-item src="/static/device2.png" text="设备" @click="registerDevice"></Cn-grid-item>
<Cn-grid-item src="/static/gateway2.png" text="网关" @click="registerGateway"></Cn-grid-item>
<Cn-grid-item background="#fff"></Cn-grid-item>
<Cn-grid-item background="#fff"></Cn-grid-item>
</Cn-grid>
</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 class="content device" :style="{ minHeight: minHeight }">
<uni-card :title="item.name" :sub-title="item.project" :extra="item.type" padding="0"
v-for="(item, index) in deviceListFilter" :key="index" @click="jump(item)" thumbnail="/static/device.png">
<!-- <text>{{ item.project }} {{ item.type }}</text> -->
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
</view>
</view>
</template>
<script>
export default {
data () {
return {
loading: false
loading: false,
navMenuList: [{
text: '全部'
}, {
text: '监测'
}, {
text: '治理'
}],
navMenuActive: 0,
navHeight: 0,
minHeight: '',
deviceList: [
{
name: '设备1',
des: '设备描述1',
type: 'APF',
project: '监测',
},
{
name: '设备2',
des: '设备描述2',
type: 'DVR',
project: '治理'
},
{
name: '设备3',
des: '设备描述3',
type: 'DVR',
project: '治理'
},
{
name: '设备4',
des: '设备描述4',
type: 'DVR',
project: '治理'
},
{
name: '设备5',
des: '设备描述5',
type: 'APF',
project: '治理'
},
{
name: '设备6',
des: '设备描述6',
type: 'APF',
project: '治理'
}
]
}
},
computed: {
deviceListFilter () {
if (this.navMenuActive == 0) {
return this.deviceList
} else {
return this.deviceList.filter(item => item.project == this.navMenuList[this.navMenuActive].text)
}
}
},
methods: {
registerDevice () {
uni.showModal({
title: '提示',
content: '请选择设备类型',
confirmText: '直连装置',
cancelText: '网关接入',
cancelColor: '#007aff',
success: ({ confirm, cancel }) => {
if (confirm) {
uni.navigateTo({
url: '/pages/device/new'
})
} else if (cancel) {
uni.navigateTo({
url: '/pages/gateway/list'
})
}
}
})
},
registerGateway () {
uni.navigateTo({
url: '/pages/gateway/new'
})
},
navMenuClick (index) {
this.navMenuActive = index
},
jump (item) {
if (item % 2) {
uni.navigateTo({
if (item.type == 'APF') {
uni.navigateTo({
url: '/pages/device/APF/detail'
})
} else {
@@ -40,9 +140,23 @@ export default {
})
}
},
},
mounted () {
setTimeout(() => {
// 获取nav高度
uni.createSelectorQuery().select('.nav').boundingClientRect((rect) => {
this.navHeight = rect.height
// #ifdef H5
this.minHeight = 'calc(100vh - env(safe-area-inset-bottom) - ' + (50 + this.navHeight) + 'px)'
// #endif
// #ifdef APP-PLUS
this.minHeight = 'calc(100vh - ' + this.navHeight + 'px)'
// #endif
}).exec()
}, 1000);
}
}
</script>
<style lang='scss'>
.index-ziyonghu {}
</style>

44
pages/index/index.vue
View File

@@ -16,7 +16,7 @@
@trigger="trigger" />
</view>
</view>
</Cn-page>
</Cn-page>
</template>
<script>
import YunWei from "./comp/indexYunWei.vue";
@@ -60,15 +60,6 @@ export default {
text: '子用户',
}
]
// if (arr.indexOf(this.userInfo.role) > -1) {
// content.push({
// iconPath: '/static/device.png',
// text: '添加设备',
// }, {
// iconPath: '/static/gateway.png',
// text: '添加网关',
// })
// }
return content
}
},
@@ -104,18 +95,35 @@ export default {
switch (e.index + 1) {
case 1:
roleName = '运维管理'
uni.removeTabBarBadge({
index: 1
})
break
case 2:
roleName = '专职管理'
uni.removeTabBarBadge({
index: 1
})
break
case 3:
roleName = '工程'
uni.removeTabBarBadge({
index: 1
})
break
case 4:
roleName = '主用户'
uni.setTabBarBadge({
index: 1,
text: '6'
})
break
case 5:
roleName = '子用户'
uni.setTabBarBadge({
index: 1,
text: '6'
})
break
}
this.$util.toast(roleName + '角色切换成功')
@@ -127,7 +135,21 @@ export default {
this.loading = false
},
onShow () {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo) || { role: 4 }
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
if (!this.userInfo) {
this.userInfo = {
role: 4
}
uni.setStorageSync('userInfo', {
role: 4
})
}
if (this.userInfo.role == 4 || this.userInfo.role == 5) {
uni.setTabBarBadge({
index: 1,
text: '6'
})
}
}
}
</script>

13
pages/index/message.vue
View File

@@ -11,13 +11,13 @@
<view class="message-nav-label">反馈</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="message-nav" @click="jump('report')">
<view class="message-nav" @click="jump('report')" v-if="userInfo.role == '4' || userInfo.role == '5'">
<image mode="aspectFill" class="message-nav-icon" src="/static/report.png" />
<view class="message-nav-label">告警</view>
<uni-badge text="3"></uni-badge>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="message-nav" @click="jump('incident')">
<view class="message-nav" @click="jump('incident')" v-if="userInfo.role == '4' || userInfo.role == '5'">
<image mode="aspectFill" class="message-nav-icon" src="/static/incident.png" />
<view class="message-nav-label">事件</view>
<uni-badge text="3"></uni-badge>
@@ -31,11 +31,13 @@
export default {
data () {
return {
loading: false
loading: false,
userInfo: {}
}
},
methods: {
init () {
this.userInfo = uni.getStorageSync('userInfo')
},
upgrade (code) {
console.log(code);
@@ -67,7 +69,7 @@ export default {
}
}
},
onLoad () {
onShow () {
this.init()
},
}
@@ -76,6 +78,7 @@ export default {
<style lang="scss">
.message {
padding-top: 20rpx;
.message-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
@@ -108,7 +111,7 @@ export default {
}
.message-nav {
padding: 34rpx;
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;

18
pages/index/mine.vue
View File

@@ -22,12 +22,18 @@
<view class="mine-nav-label">子用户列表</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view> -->
<view class="mine-nav" @click="jump('project')" v-if="userInfo.role == 4">
<view class="mine-nav" @click="jump('scan')">
<image mode="aspectFill" class="mine-nav-icon" src="/static/scan.png" />
<view class="mine-nav-label">扫一扫</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('project')" v-if="userInfo.role == 4 || userInfo.role == 3">
<image mode="aspectFill" class="mine-nav-icon" src="/static/project.png" />
<view class="mine-nav-label">项目管理</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('gateway')" v-if="userInfo.role == 4 || userInfo.role == 3"
<view class="mine-nav" @click="jump('gateway')"
v-if="userInfo.role == 4 || userInfo.role == 3 || userInfo.role == 5"
style="border-bottom: none; box-shadow: 0 4rpx 8rpx #e7e7e74c;">
<image mode="aspectFill" class="mine-nav-icon" src="/static/gateway.png" />
<view class="mine-nav-label">网关列表</view>
@@ -97,6 +103,14 @@ export default {
},
jump (type) {
switch (type) {
case 'scan':
uni.scanCode({
success: function (res) {
console.log('条码类型：' + res.scanType);
console.log('条码内容：' + res.result);
}
});
break;
case 'login':
uni.navigateTo({
url: `/pages/user/login`