页面切图

2023-02-28 14:03:38 +08:00
parent 66c615eb80
commit 841cf9ae2d
20 changed files with 776 additions and 261 deletions
--- a/pages/index/comp/indexGongCheng.vue
+++ b/pages/index/comp/indexGongCheng.vue
@@ -23,9 +23,14 @@
            </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>
+            <picker @change="projectNameChange" :value="select.projectNameIndex" :range="projectList" range-key="text">
+                <view class="nav-menu" :class="{ 'nav-menu-active': select.projectName }">{{
+                    select.projectName || '项目' }} </view>
+            </picker>
+            <picker @change="projectTypeChange" :value="select.projectTypeIndex" :range="projectType" range-key="text">
+                <view class="nav-menu" :class="{ 'nav-menu-active': select.projectType }">{{
+                    select.projectType || '类型' }} </view>
+            </picker>
        </view>
        <view class="content device" :style="{ minHeight: minHeight }">
            <uni-card :title="item.name" :sub-title="item.project" :extra="item.type" padding="0"
@@ -41,66 +46,128 @@ export default {
    data () {
        return {
            loading: false,
-            navMenuList: [{
-                text: '全部'
-            }, {
-                text: '监测'
-            }, {
-                text: '治理'
-            }],
-            navMenuActive: 0,
+            select: {
+                projectName: '',
+                projectNameIndex: 0,
+                projectType: '',
+                projectTypeIndex: 0
+            },
+            projectType: [
+                {
+                    text: '全部类型',
+                    value: 0
+                },
+                {
+                    text: '监测',
+                    value: 1
+                },
+                {
+                    text: '用能',
+                    value: 2
+                },
+                {
+                    text: '环境',
+                    value: 3
+                },
+                {
+                    text: '安防',
+                    value: 4
+                },
+                {
+                    text: '其他',
+                    value: 5
+                }
+            ],
+            projectList: [
+                {
+                    text: '全部项目',
+                    value: 1
+                },
+                {
+                    text: 'XXX项目1',
+                    value: 1
+                },
+                {
+                    text: 'XXX项目2',
+                    value: 1
+                },
+                {
+                    text: 'XXX项目3',
+                    value: 1
+                },
+
+            ],
            navHeight: 0,
            minHeight: '',
            deviceList: [
                {
-                    name: '设备1',
+                    name: '设备APF-1',
                    des: '设备描述1',
-                    type: 'APF',
-                    project: '监测',
+                    type: '监测',
+                    project: 'XXX项目1',
                },
                {
-                    name: '设备2',
+                    name: '设备APF-2',
+                    des: '设备描述1',
+                    type: '监测',
+                    project: 'XXX项目1',
+                },
+                {
+                    name: '设备APF-3',
                    des: '设备描述2',
-                    type: 'DVR',
-                    project: '治理'
+                    type: '用能',
+                    project: 'XXX项目2'
                },
                {
-                    name: '设备3',
+                    name: '设备DVR-1',
                    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: '治理'
+                    type: '监测',
+                    project: 'XXX项目3'
                }
            ]
        }
    },
    computed: {
        deviceListFilter () {
-            if (this.navMenuActive == 0) {
-                return this.deviceList
-            } else {
-                return this.deviceList.filter(item => item.project == this.navMenuList[this.navMenuActive].text)
-            }
+            return this.deviceList.filter(item => {
+                if (this.select.projectName) {
+                    return item.project === this.select.projectName
+                } else if (this.select.projectType) {
+                    return item.type === this.select.projectType
+                } else {
+                    return true
+                }
+            })
        }
    },
    methods: {
+        projectTypeChange (e) {
+            // 重置name
+            this.select.projectName = ''
+            this.select.projectNameIndex = 0
+
+            this.select.projectTypeIndex = e.detail.value
+            if (e.detail.value === 0) {
+                this.select.projectType = ''
+                return
+            }
+            this.select.projectType = this.projectType[e.detail.value].text
+
+
+        },
+        projectNameChange (e) {
+            console.log(e);
+            // 重置type
+            this.select.projectType = ''
+            this.select.projectTypeIndex = 0
+
+            this.select.projectNameIndex = e.detail.value
+            if (e.detail.value === 0) {
+                this.select.projectName = ''
+                return
+            }
+            this.select.projectName = this.projectList[e.detail.value].text
+        },
        registerDevice () {
            uni.showModal({
                title: '提示',
@@ -130,11 +197,11 @@ export default {
            this.navMenuActive = index
        },
        jump (item) {
-            if (item.type == 'APF') {
+            if (item.name.indexOf('APF') > -1) {
                uni.navigateTo({
                    url: '/pages/device/APF/detail'
                })
-            } else {
+            } else if (item.name.indexOf('DVR') > -1) {
                uni.navigateTo({
                    url: '/pages/device/DVR/detail'
                })
@@ -157,6 +224,4 @@ export default {
    }
 }
 </script>
-<style lang='scss'>
-
-</style>
+<style lang='scss'></style>