yunxing 4 years ago
parent
commit
f5d4a6d8c4
2 changed files with 52 additions and 18 deletions
  1. 51 17
      src/views/equipmentFacilities/Equipment.vue
  2. 1 1
      src/views/equipmentFacilities/index.vue

+ 51 - 17
src/views/equipmentFacilities/Equipment.vue

@@ -8,14 +8,15 @@
             </template>
         </van-nav-bar>
         <div class='equipment-search-container'>
-            <van-search class='equipment-search' v-model='keyWord' placeholder='请输入设备关键字或编号' @search='onSearch'>
+            <van-search class='equipment-search' v-model='keyword' placeholder='请输入设备关键字或编号' @search='onSearch'>
                 <!-- <template #action>
                 <div class='search' @click='onSearch'>搜索</div>
                 </template>-->
             </van-search>
         </div>
-        <div class='equipment-list'>
-            <van-list v-model='loading' :finished='finished' finished-text='没有更多了' :immediate-check='false' @load='onLoad'>
+        <!-- 设备列表 -->
+        <div class='equipment-list' v-if='list.length'>
+            <van-list v-model='loading' :finished='finished' finished-text='没有更多了' :offset='20' :immediate-check='false' @load='onLoad'>
                 <!-- <van-cell v-for='item in list' :key='item' :title='item' /> -->
                 <van-cell is-link v-for='item in list' :key='item.classstructureid'>
                     <!-- 使用 title 插槽来自定义标题 -->
@@ -31,6 +32,17 @@
                 </van-cell>
             </van-list>
         </div>
+        <!-- 无数据 -->
+        <van-empty v-if='finished &&!list.length' description='暂无数据' />
+        <!-- 点击头部筛选,出现的右侧弹窗 -->
+        <van-popup class='m-popup' v-model='showPopup' position='right'>
+            <div class='m-popup-page'>
+                <div class='system'>
+                    <h1>专业系统</h1>
+                    <div class='system'></div>
+                </div>
+            </div>
+        </van-popup>
     </div>
 </template>
 <script>
@@ -40,8 +52,8 @@
  *
  */
 import Vue from 'vue'
-import { NavBar, Search, List, Cell, Icon } from 'vant'
-Vue.use(NavBar).use(Search).use(List).use(Cell).use(Icon)
+import { NavBar, Search, List, Cell, Icon, Popup, Empty } from 'vant'
+Vue.use(NavBar).use(Search).use(List).use(Cell).use(Icon).use(Popup).use(Empty)
 import { mapGetters } from 'vuex'
 
 import { queryEquipmentList } from '@/api/equipmentList'
@@ -52,13 +64,21 @@ export default {
     data() {
         return {
             title: '',
-            keyWord: '',
+            keyword: '',
             page: 1,
-            size: 10,
+            size: 20,
             list: [],
             loading: false,
             finished: false,
             category_code: '',
+            showPopup: false,
+            systemList: [
+                { text: '全部', smsxt: '', active: true },
+                { text: '供电系统', smsxt: '', active: false },
+                { text: '全部', smsxt: '' },
+                { text: '全部', smsxt: '' },
+                { text: '全部', smsxt: '' },
+            ],
         }
     },
     computed: {
@@ -79,19 +99,24 @@ export default {
             this.$router.go(-1)
         },
         handleRightClick() {
-            console.log(1111)
+            this.showPopup = true
         },
         /**
-         *
+         * 获取设备列表
          */
         async getList() {
+            console.log('getList')
             let data = {
-                    page: this.page,
-                    size: this.size,
-                    plazaId: this.plazaId,
-                    category_code: this.category_code,
-                },
-                postParams = { system_code: this.smsxt }
+                page: this.page,
+                size: this.size,
+                plazaId: this.plazaId,
+                category_code: this.category_code,
+            }
+            let postParams = { system_code: this.smsxt }
+            // TODO: keyword
+            if (this.keyword) {
+                data.keyword = `${this.keyword}:sbjc,assetnum;`
+            }
             let resData = await queryEquipmentList({ data, postParams })
             if (!resData && !resData?.data) {
                 return false
@@ -110,7 +135,7 @@ export default {
             })
             this.list = this.list.concat(res_data)
             this.count = resData.data?.count
-            console.log(JSON.stringify(res_data, null, 2))
+            // console.log(JSON.stringify(res_data, null, 2))
         },
         async onLoad() {
             console.log('onload')
@@ -136,13 +161,17 @@ export default {
                     this.finished = true
                 }
             }, 1000) */
-            this.getList()
         },
         /**
          * 搜索
          */
         onSearch() {
             
+            this.finished = false
+            this.page = 1
+            this.count = 0
+            this.list = []
+            this.onLoad()
         },
     },
 }
@@ -222,5 +251,10 @@ export default {
             background: #e6f3fc;
         }
     }
+    // 筛选弹窗
+    .m-popup {
+        width: 80%;
+        height: 100%;
+    }
 }
 </style>

+ 1 - 1
src/views/equipmentFacilities/index.vue

@@ -372,7 +372,7 @@ export default {
         handleFloor(item) {
             let title = this.systemText + '-楼层分布'
             // TODO: 楼层分布
-            // this.$router.push({ name: 'SystemFloor', params: { title } })
+            this.$router.push({ name: 'SystemFloor', params: { title } })
         },
         /**
          * 点击卡片,跳转设备列表页面