Files
app-govern/pages/index/comp/device.vue
2023-08-11 11:03:31 +08:00

309 lines
11 KiB
Vue

<template>
<view class="device">
<view class="nav" :style="{ top: navHeight + 'px' }">
<!-- <view class="nav-menu" :class="{ 'nav-menu-active': select.engineeringName }" @click="openDrawer"
>{{ select.engineeringName || '工程' }}
</view> -->
<picker
@change="projectNameChange"
@cancel="selectProject = false"
:value="select.projectNameIndex"
:range="projectList"
range-key="text"
v-if="store.params.engineerId"
>
<view class="nav-menu" :class="{ 'nav-menu-active': select.projectName }" @click="selectProject = true">
{{
select.projectName
? select.projectName.length > 4
? select.projectName.substring(0, 4) + '...'
: select.projectName
: '全部项目'
}}
<uni-icons
type="top"
size="14"
:color="select.projectName ? '#376cf3' : '#666'"
v-if="selectProject"
></uni-icons>
<uni-icons
type="bottom"
size="14"
:color="select.projectName ? '#376cf3' : '#666'"
v-else
></uni-icons>
</view>
</picker>
<view style="flex: 1"></view>
<template v-if="deviceListFilter.length">
<template v-if="transfer || share">
<view class="nav-menu nav-menu-btn" @click="submit">完成 </view>
</template>
<template v-else>
<view
class="nav-menu nav-menu-btn"
@click="transfer = true"
v-if="userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'"
>移交
</view>
<view
class="nav-menu nav-menu-btn"
@click="share = true"
v-if="userInfo.authorities === 'app_vip_user'"
>分享
</view>
</template>
</template>
<!-- <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.equipmentName"
:sub-title="item.projectName"
:extra="item.projectType"
padding="0"
v-for="(item, index) in deviceListFilter"
:key="index"
@click="jump(item)"
:thumbnail="deviceIcon(item.runStatus)"
>
<!-- <text>{{ item.project }} {{ item.type }}</text> -->
<template v-slot:title v-if="transfer || share">
<view class="switch-title">
<view class="switch-title-left">{{ item.equipmentName }}</view>
<switch
:checked="checkList.indexOf(item.equipmentId) > -1"
style="transform: scale(0.8)"
@change="switchChange(item)"
/>
</view>
</template>
</uni-card>
<uni-load-more
v-if="store.status == 'loading' || deviceListFilter.length > 0"
:status="store.status"
></uni-load-more>
<Cn-empty v-else></Cn-empty>
</view>
</view>
</template>
<script>
import { getProjectList } from '@/common/api/project'
import { queryDictData } from '@/common/api/dictionary'
export default {
props: {
store: {
type: Object,
default: {},
},
},
data() {
return {
loading: false,
transfer: false,
share: false,
checkList: [],
select: {
projectName: '',
projectNameIndex: 0,
projectType: '',
projectTypeIndex: 0,
},
minHeight: '',
engineeringList: [],
projectList: [],
projectType: [],
navHeight: 0,
userInfo: {},
selectProject: false,
}
},
computed: {
deviceListFilter() {
return this.store.data.filter((item) => {
if (this.select.projectName && this.select.projectType) {
return item.project === this.select.projectName && item.type === this.select.projectType
} else if (this.select.projectName) {
return item.projectId === this.projectList[this.select.projectNameIndex].id
} else if (this.select.projectType) {
return item.projectType === this.projectType[this.select.projectTypeIndex].id
} else {
return true
}
})
},
},
created() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
},
methods: {
deviceIcon(e) {
let str = ''
switch (e) {
case 1:
str = '/static/device_bad.png'
break
case 2:
str = '/static/device.png'
break
default:
str = '/static/device.png'
break
}
return str
},
switchChange(e) {
console.log(e)
let index = this.checkList.indexOf(e.equipmentId)
if (index > -1) {
this.checkList.splice(index, 1)
} else {
this.checkList.push(e.equipmentId)
}
},
submit() {
console.log(this.checkList)
if (this.transfer) {
this.transfer = false
uni.navigateTo({ url: '/pages/device/transfer?id=' + this.checkList.join(',') })
} else if (this.share) {
this.share = false
this.$emit('share', this.shareList)
}
this.checkList = []
},
async init() {
this.getProjectList()
this.getDeviceList()
},
getDeviceList() {
this.store.params.pageSize = 999
this.store.firstCallBack = () => {
// 获取nav高度
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect2) => {
if (!rect2) return
// #ifdef H5
this.minHeight = 'calc(100vh - env(safe-area-inset-bottom) - ' + (50 + rect2.height) + 'px)'
// #endif
// #ifdef APP-PLUS
this.minHeight = 'calc(100vh - ' + rect2.height + 'px)'
// #endif
})
.exec()
}
this.store.reload()
},
getProjectList() {
getProjectList({
pageNum: 1,
pageSize: 9999,
engineeringId: this.store.params.engineerId,
}).then((res) => {
console.log(res)
let arr = [
{
text: '全部项目',
value: '-1',
},
...res.data.records.map((item) => {
return {
text: item.name,
value: item.id,
...item,
}
}),
]
this.projectList = arr
})
},
queryDictData() {
queryDictData('项目类型').then((res) => {
this.projectType = [
{
text: '全部类型',
value: '',
},
...res.data.map((item) => {
return {
text: item.anotherName,
value: item.id,
}
}),
]
})
},
submitFeedBack() {
uni.navigateTo({ url: '/pages/home/feedback' })
},
projectTypeChange(e) {
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) {
this.selectProject = false
console.log(e)
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: '提示',
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) {
uni.navigateTo({
url: '/pages/device/APF/detail?id=' + item.equipmentId + '&isPrimaryUser=' + item.isPrimaryUser,
})
},
},
}
</script>
<style lang="scss">
/deep/ .switch-title {
display: flex;
align-items: center;
padding: 20rpx 0;
&-left {
flex: 1;
margin-right: 10px;
}
}
</style>