|
@@ -11,8 +11,39 @@
|
|
|
<van-search class='equipment-search' v-model='keyword' placeholder='请输入编号' @search='onSearch'></van-search>
|
|
|
</div>
|
|
|
<!-- 一个类的设备,如螺旋式冷水机组 -->
|
|
|
+ <van-list
|
|
|
+ class='equipment-container'
|
|
|
+ :class='{"one-list":list.length === 1}'
|
|
|
+ v-model='loading'
|
|
|
+ :finished='finished'
|
|
|
+ @load='onLoad'
|
|
|
+ finished-text
|
|
|
+ >
|
|
|
+ <div class='switch-room' v-for='(item,index) in list' :key='index'>
|
|
|
+ <!-- title -->
|
|
|
+ <div class='title' v-show='item.data.length'>
|
|
|
+ <span>{{item.classqc}}</span>
|
|
|
+ <span>{{item.count}}</span>
|
|
|
+ </div>
|
|
|
+ <!-- 第1页 -->
|
|
|
+ <van-cell is-link v-for='detail in item.data.slice(0,innerSize) || []' @click='goToDetail(detail)' :key='detail.classstructureid'>
|
|
|
+ <!-- 使用 title 插槽来自定义标题 -->
|
|
|
+ <template #title>
|
|
|
+ <span class='number'>{{detail.classstructureid}}</span>
|
|
|
+ <span class='name'>{{detail.sbjc}}</span>
|
|
|
+ </template>
|
|
|
+ <template #right-icon>
|
|
|
+ <span class='wx' v-if='detail._type === "维修"'>维修</span>
|
|
|
+ <span class='wb' v-else-if='detail._type === "维保"'>维保</span>
|
|
|
+ <van-icon name='arrow' class='arrow-icon' />
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ <!-- 加载更多 -->
|
|
|
+ <div class='load-more' v-show='item.loadMore && item.data && item.data.length>=5' @click='locationLoadMore(item,index)'>加载更多</div>
|
|
|
+ </div>
|
|
|
+ </van-list>
|
|
|
<div class='equipment-container' v-if='1'>
|
|
|
- <div class='switch-room' v-for='ii in 3' :key='ii'>
|
|
|
+ <div class='switch-room' v-for='ii in 0' :key='ii'>
|
|
|
<div class='title'>
|
|
|
<span>螺旋式冷水机组</span>
|
|
|
<span>10</span>
|
|
@@ -87,7 +118,7 @@ import { NavBar, Search, List, Cell, Icon, Popup, Button, Empty } from 'vant'
|
|
|
Vue.use(NavBar).use(Search).use(List).use(Cell).use(Icon).use(Popup).use(Button).use(Empty)
|
|
|
import { mapGetters } from 'vuex'
|
|
|
|
|
|
-import { queryMoreAsset, queryAssetClass } from '@/api/equipmentList'
|
|
|
+import { queryMoreAsset, queryAssetClass, queryEquipmentList } from '@/api/equipmentList'
|
|
|
import { queryPic } from '@/api/public'
|
|
|
import ImagePreview from '@/components/ImagePreview'
|
|
|
import { sleep } from '@/utils/util'
|
|
@@ -102,7 +133,8 @@ export default {
|
|
|
title: '更多设备',
|
|
|
keyword: '',
|
|
|
page: 1,
|
|
|
- size: 20, //TODO: size1500
|
|
|
+ size: 5,
|
|
|
+ innerSize: 4,
|
|
|
list: [],
|
|
|
loading: false,
|
|
|
finished: false,
|
|
@@ -132,104 +164,7 @@ export default {
|
|
|
system: '',
|
|
|
sbss: '全部',
|
|
|
},
|
|
|
- mockList: [
|
|
|
- {
|
|
|
- assetid: 1206624,
|
|
|
- assetnum: '26466',
|
|
|
- assetuid: 1221607,
|
|
|
- category_code: 'gde',
|
|
|
- classstructureid: '1932',
|
|
|
- floorcode: 'B2',
|
|
|
- fws: '上海恒锦动力科技有限公司',
|
|
|
- importance: 12,
|
|
|
- is_detecting: false,
|
|
|
- is_exception: false,
|
|
|
- manufacturer: '上海恒锦动力科技有限公司',
|
|
|
- sb_status: '运行',
|
|
|
- sbglgs: '商管',
|
|
|
- sbjbm: '1',
|
|
|
- sbjc: '发电机',
|
|
|
- sbxh: 'MX-1030-4',
|
|
|
- seq: -200,
|
|
|
- sl: 1,
|
|
|
- system_code: '1001',
|
|
|
- type_code: 'gd0112',
|
|
|
- type_name: '柴油发电机组',
|
|
|
- wzjc: '商业楼/B2/地下建筑-发电机房-地下1层车库发电机房',
|
|
|
- },
|
|
|
- {
|
|
|
- assetid: 1206624,
|
|
|
- assetnum: '26466',
|
|
|
- assetuid: 1221607,
|
|
|
- category_code: 'gde',
|
|
|
- classstructureid: '1933',
|
|
|
- floorcode: 'B2',
|
|
|
- fws: '上海恒锦动力科技有限公司',
|
|
|
- importance: 12,
|
|
|
- is_detecting: false,
|
|
|
- is_exception: false,
|
|
|
- manufacturer: '上海恒锦动力科技有限公司',
|
|
|
- sb_status: '运行',
|
|
|
- sbglgs: '商管',
|
|
|
- sbjbm: '1',
|
|
|
- sbjc: '发电机',
|
|
|
- sbxh: 'MX-1030-4',
|
|
|
- seq: -200,
|
|
|
- sl: 1,
|
|
|
- system_code: '1001',
|
|
|
- type_code: 'gd0112',
|
|
|
- type_name: '柴油发电机组',
|
|
|
- wzjc: '商业楼/B2/地下建筑-发电机房-地下2层车库发电机房',
|
|
|
- },
|
|
|
- {
|
|
|
- assetid: 1206624,
|
|
|
- assetnum: '26466',
|
|
|
- assetuid: 1221607,
|
|
|
- category_code: 'gde',
|
|
|
- classstructureid: '1933',
|
|
|
- floorcode: 'B2',
|
|
|
- fws: '上海恒锦动力科技有限公司',
|
|
|
- importance: 12,
|
|
|
- is_detecting: false,
|
|
|
- is_exception: false,
|
|
|
- manufacturer: '上海恒锦动力科技有限公司',
|
|
|
- sb_status: '运行',
|
|
|
- sbglgs: '商管',
|
|
|
- sbjbm: '1',
|
|
|
- sbjc: '发电机',
|
|
|
- sbxh: 'MX-1030-4',
|
|
|
- seq: -200,
|
|
|
- sl: 1,
|
|
|
- system_code: '1001',
|
|
|
- type_code: 'gd0112',
|
|
|
- type_name: '柴油发电机组',
|
|
|
- wzjc: '商业楼/B2/地下建筑-发电机房-地下3层车库发电机房',
|
|
|
- },
|
|
|
- {
|
|
|
- assetid: 1206624,
|
|
|
- assetnum: '26466',
|
|
|
- assetuid: 1221607,
|
|
|
- category_code: 'gde',
|
|
|
- classstructureid: '1933',
|
|
|
- floorcode: 'B2',
|
|
|
- fws: '上海恒锦动力科技有限公司',
|
|
|
- importance: 12,
|
|
|
- is_detecting: false,
|
|
|
- is_exception: false,
|
|
|
- manufacturer: '上海恒锦动力科技有限公司',
|
|
|
- sb_status: '运行',
|
|
|
- sbglgs: '商管',
|
|
|
- sbjbm: '1',
|
|
|
- sbjc: '发电机',
|
|
|
- sbxh: 'MX-1030-4',
|
|
|
- seq: -200,
|
|
|
- sl: 1,
|
|
|
- system_code: '1001',
|
|
|
- type_code: 'gd0112',
|
|
|
- type_name: '柴油发电机组',
|
|
|
- wzjc: '商业楼/B2/地下建筑-发电机房-地下4层车库发电机房',
|
|
|
- },
|
|
|
- ],
|
|
|
+ noDataFlag: false,
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
@@ -282,11 +217,39 @@ export default {
|
|
|
if (this.keyword) {
|
|
|
data.keyword = `${this.keyword}:sbjc,assetnum;`
|
|
|
}
|
|
|
- let resData = await queryMoreAsset({ data, postParams })
|
|
|
- if (!resData && !resData?.data) {
|
|
|
+ let res = await queryMoreAsset({ data, postParams })
|
|
|
+ if (!res?.data?.data) {
|
|
|
return false
|
|
|
}
|
|
|
- console.log(resData)
|
|
|
+ console.log(res?.data)
|
|
|
+ res.data.data.map((item, index, arr) => {
|
|
|
+ // console.log(item)
|
|
|
+ if (item?.count >= 4 || item?.data?.length >= 4) {
|
|
|
+ // console.log(item)
|
|
|
+ arr[index] = {
|
|
|
+ ...item,
|
|
|
+ loadMore: true,
|
|
|
+ loading: true,
|
|
|
+ finished: false,
|
|
|
+ list: [],
|
|
|
+ page: 2,
|
|
|
+ size: this.innerSize,
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ item.loadMore = false
|
|
|
+ }
|
|
|
+ if (!item.data) {
|
|
|
+ item.data = []
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.list = [...this.list, ...res.data.data]
|
|
|
+ // console.log('%csssss', 'color:blue')
|
|
|
+ // console.log(this.list)
|
|
|
+ this.count = res.data.count
|
|
|
+ // 是否显示无数据的标志
|
|
|
+ let noDataFlag = !Boolean(this.list.filter((v) => v.data.length).length)
|
|
|
+ console.log(noDataFlag)
|
|
|
+ this.noDataFlag = noDataFlag
|
|
|
},
|
|
|
async onLoad() {
|
|
|
console.log('onload')
|
|
@@ -300,11 +263,16 @@ export default {
|
|
|
this.finished = true
|
|
|
}
|
|
|
},
|
|
|
+
|
|
|
+ /**
|
|
|
+ *
|
|
|
+ */
|
|
|
+ locationLoadMore() {},
|
|
|
/**
|
|
|
* 跳转设备详情页
|
|
|
*/
|
|
|
- goToDetail(item) {
|
|
|
- const { assetid } = item
|
|
|
+ goToDetail(detail) {
|
|
|
+ const { assetid } = detail
|
|
|
assetid && this.$router.push({ name: 'AssetDetail', query: { assetid } })
|
|
|
},
|
|
|
onSearch() {
|