修改测试bug 优化页面

This commit is contained in:
guanj
2026-01-04 14:55:31 +08:00
parent cc0f8bc8b6
commit a765cdf9ee
68 changed files with 5396 additions and 3096 deletions

View File

@@ -77,7 +77,6 @@
</el-descriptions-item> -->
</el-descriptions>
<el-tabs v-model.trim="dataSet" type="border-card" class="device-control-box-card" @tab-click="handleClick">
<el-tab-pane
lazy
:label="item.name"
@@ -87,7 +86,7 @@
>
<template #label>
<span class="custom-tabs-label">
<el-icon>
<!-- <el-icon>
<TrendCharts v-if="item.name == 'APF模块数据'" />
<DataLine v-if="item.name == '历史APF模块数据'" />
<DataAnalysis v-if="item.name.includes('趋势数据')" />
@@ -113,7 +112,7 @@
!item.name.includes('暂态事件')
"
/>
</el-icon>
</el-icon> -->
<span>{{ item.name }}</span>
</span>
</template>
@@ -157,7 +156,7 @@
</el-select> -->
<el-radio-group
v-model.trim="formInline.dataLevel"
v-if="!dataSet.includes('_moduleData')"
v-if="!dataSet.includes('_moduleData') && TrendList?.lineType == 1"
:disabled="TrendList?.lineType != 1"
@change="handleClick"
>
@@ -733,14 +732,14 @@ const handleHarmonicSpectrum = async () => {
// getRealDataMqttMsg()
await getBasicRealData(lineId.value).then((res: any) => {
if (res.code == 'A0000') {
ElMessage.success('装置应答成功')
ElMessage.success('装置应答成功')
// mqttMessage.value = {}
realDataTimer.value = window.setInterval(() => {
if (!dataSet.value.includes('_realtimedata')) return
getBasicRealData(lineId.value).then((res: any) => {
console.log(res, '获取基础实时数据')
console.log(res, '获取基础实时数据')
})
}, 30000)
}
@@ -838,8 +837,8 @@ const devData: any = ref({})
const lineId: any = ref('')
const dataLevel: any = ref('')
const dataSource = ref([])
const nodeClick = async (e: anyObj) => {
console.log("🚀 ~ nodeClick ~ e:", e)
const engineeringName = ref('')
const nodeClick = async (e: anyObj, node: any) => {
if (e == undefined || e.level == 2) {
return (loading.value = false)
}
@@ -855,6 +854,8 @@ const nodeClick = async (e: anyObj) => {
//选中设备名称后,点击标签页也能查询数据,要求点击设备名称后,点击标签页默认查询第一个监测点数据
if (e.level == 3 || e.level == 2) {
engineeringName.value = node?.parent.parent.data.name
await queryDictType({
lineId: e?.id,
conType: e.conType
@@ -985,44 +986,42 @@ const getRealDataMqttMsg = async () => {
JSON.parse(JSON.stringify(JSON.parse(new TextDecoder().decode(message))))
)
let obj = JSON.parse(JSON.stringify(JSON.parse(new TextDecoder().decode(message))))
if (lineId.value != obj.lineId || adminInfo.userIndex != obj.userId) return
//处理mqtt数据 1转2除 2转1乘
//如果消息返回值是二次值,下拉框是二次值只需要单位换算 除以1000
//如果消息返回值是一次值,下拉框是一次值只需要单位换算 除以1000
if (obj.dataLevel == formInline.dataLevel) {
obj = {
...obj,
// 电压有效值
vRmsA: obj.vRmsA ,
vRmsB: obj.vRmsB ,
vRmsC: obj.vRmsC ,
vRmsA: obj.vRmsA,
vRmsB: obj.vRmsB,
vRmsC: obj.vRmsC,
//基波电压幅值
v1A: obj.v1A ,
v1B: obj.v1B ,
v1C: obj.v1C ,
v1A: obj.v1A,
v1B: obj.v1B,
v1C: obj.v1C,
//有功功率
pA: obj.pA ,
pB: obj.pB ,
pC: obj.pC ,
pTot: obj.pTot ,
pA: obj.pA,
pB: obj.pB,
pC: obj.pC,
pTot: obj.pTot,
//无功功率
qA: obj.qA ,
qB: obj.qB ,
qC: obj.qC ,
qTot: obj.qTot ,
qA: obj.qA,
qB: obj.qB,
qC: obj.qC,
qTot: obj.qTot,
//视在功率
sA: obj.sA ,
sB: obj.sB ,
sC: obj.sC ,
sTot: obj.sTot
sA: obj.sA,
sB: obj.sB,
sC: obj.sC,
sTot: obj.sTot
}
}
//如果消息返回值是二次值,下拉框是一次值需要单位换算 除以1000 并且乘以pt ct
if (obj.dataLevel == 'Secondary' && formInline.dataLevel == 'Primary') {
obj = {
...obj,
// 电压有效值
@@ -1103,9 +1102,11 @@ const getRealDataMqttMsg = async () => {
}
if (obj.hasOwnProperty('pA') && obj.hasOwnProperty('pB')) {
mqttMessage.value = obj
//更新实时数据主页面值
realTimeFlag.value && realTimeRef.value && realTimeRef.value.setRealData(mqttMessage.value,formInline.dataLevel)
realTimeFlag.value &&
realTimeRef.value &&
realTimeRef.value.setRealData(mqttMessage.value, formInline.dataLevel)
tableLoading.value = false
//更新实时趋势折线图数据
if (sonTab.value == 2) {
@@ -1229,6 +1230,7 @@ const handleClick = async (tab?: any) => {
let obj = {
devId: deviceId.value, //e.id
lineId: lineId.value, //e.pid
engineeringName: engineeringName.value, //e.name
type: 3,
list: [
{
@@ -1423,9 +1425,7 @@ const echoName = (value: any, arr: any[]) => {
return value ? arr.find(item => item.value == value)?.label : '/'
}
onMounted(() => {
})
onMounted(() => {})
onBeforeUnmount(() => {
clearInterval(realDataTimer.value)
clearInterval(trendTimer.value)

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -2,8 +2,13 @@
<div class="view">
<TableHeader datePicker ref="headerRef" v-if="!isWaveCharts" :showReset="false"></TableHeader>
<Table ref="tableRef" v-if="!isWaveCharts" />
<waveFormAnalysis v-loading="loading" v-if="isWaveCharts" ref="waveFormAnalysisRef"
@handleHideCharts="isWaveCharts = false" :wp="wp" />
<waveFormAnalysis
v-loading="loading"
v-if="isWaveCharts"
ref="waveFormAnalysisRef"
@handleHideCharts="isWaveCharts = false"
:wp="wp"
/>
</div>
</template>
<script lang="ts" setup>
@@ -15,7 +20,7 @@ import TableHeader from '@/components/table/header/index.vue'
import waveFormAnalysis from './components/waveFormAnalysis.vue'
import { ArrowLeft, Message } from '@element-plus/icons-vue'
import { ElMessage } from 'element-plus'
import { analyseWave,getFileByEventId } from '@/api/common'
import { analyseWave, getFileByEventId } from '@/api/common'
import { getFileZip } from '@/api/cs-harmonic-boot/datatrend'
const tableParams: any = ref({})
const refheader = ref()
@@ -31,12 +36,11 @@ const waveFormAnalysisRef = ref()
const headerRef = ref()
const props = defineProps({
deviceType: {
type: String,
default: '0'
}
});
deviceType: {
type: String,
default: '0'
}
})
const tableStore: any = new TableStore({
url: '/cs-device-boot/csGroup/deviceDataByType',
@@ -45,7 +49,9 @@ const tableStore: any = new TableStore({
column: [
// { width: '60', type: 'checkbox', fixed: 'left' },
{
title: '序号', width: 80, formatter: (row: any) => {
title: '序号',
width: 80,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
@@ -65,10 +71,11 @@ const tableStore: any = new TableStore({
title: '持续时间(s)',
minWidth: 100,
formatter: (row: any) => {
console.log('row.cellValue', row.cellValue)
console.log('row.cellValue', row.cellValue)
row.cellValue = row.cellValue ? row.cellValue.toFixed(2) : '/'
return row.cellValue
}, sortable: true
},
sortable: true
},
{
field: 'featureAmplitude',
@@ -109,7 +116,9 @@ const tableStore: any = new TableStore({
row.loading1 = false
if (res != undefined) {
boxoList.value = row
boxoList.value.systemType = 'WX'
boxoList.value.systemType = 'YPT'
boxoList.value.engineeringName = tableParams.value.engineeringName
console.log("🚀 ~ tableParams.value.engineeringName:", tableParams.value.engineeringName)
wp.value = res.data
view.value = false
view2.value = true
@@ -134,7 +143,7 @@ const tableStore: any = new TableStore({
icon: 'el-icon-DataLine',
render: 'basicButton',
disabled: row => {
return row.showName != '未知';
return row.showName != '未知'
}
},
{
@@ -158,25 +167,24 @@ const tableStore: any = new TableStore({
document.body.appendChild(link)
link.click() //执行下载
document.body.removeChild(link) //释放标签
})
}
},
{
name: 'edit',
title: '波形补召',
type: 'primary',
icon: 'el-icon-Check',
render: 'basicButton',
disabled: row => {
return props.deviceType === '2' && row.wavePath || row.showName === '未知';
},
click: row => {
getFileByEventId(row.id).then(res => {
name: 'edit',
title: '波形补召',
type: 'primary',
icon: 'el-icon-Check',
render: 'basicButton',
disabled: row => {
return (props.deviceType === '2' && row.wavePath) || row.showName === '未知'
},
click: row => {
getFileByEventId(row.id).then(res => {
ElMessage.success(res.message)
tableStore.index()
})
}
}
}
]
}
@@ -186,9 +194,10 @@ const tableStore: any = new TableStore({
tableStore.table.params.devId = tableParams.value.devId
tableStore.table.params.lineId = tableParams.value.lineId
tableStore.table.params.list = tableParams.value.list
console.log('🚀 ~ ableParams.value:', tableParams.value)
tableStore.table.params.type = 3
},
loadCallback: () => { }
loadCallback: () => {}
})
provide('tableStore', tableStore)
const isWaveCharts = ref(false)

View File

@@ -232,6 +232,7 @@ const init = async () => {
loading.value = true
// 选择指标的时候切换legend内容和data数据
let list: any = []
echartsData.value={}
legendDictList.value?.selectedList?.map((item: any) => {
searchForm.value.index.map((vv: any) => {
if (item.dataType == vv) {

View File

@@ -1,5 +1,5 @@
<template>
<div class="default-main device-manage" :style="{ height: pageHeight.height }" v-loading="loading">
<div class=" device-manage" :style="{ height: pageHeight.height }" v-loading="loading">
<GetMarketList @node-click="selectUser" @selectUser="selectUser"></GetMarketList>
<div class="device-manage-right" :style="{ height: pageHeight.height }">
<el-descriptions title="用户基本信息" class="mb10" :column="2" border>
@@ -65,10 +65,10 @@ import { queryByUseId, add, removeMarketData, queryEnginnerByUseId } from '@/api
import { ref, onMounted } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
const pageHeight = mainHeight(20)
const pageHeight = mainHeight(60)
const loading = ref(true)
const tableHeight = mainHeight(135)
const tableHeight = mainHeight(173)
const user: any = ref({})
const tableData = ref([])
const tableData2 = ref([])

View File

@@ -1,5 +1,5 @@
<template>
<div class="default-main device-manage" :style="{ height: pageHeight.height }" v-loading="loading">
<div class=" device-manage" :style="{ height: pageHeight.height }" v-loading="loading">
<OfficialUserTree @node-click="selectUser" @selectUser="selectUser"></OfficialUserTree>
<div class="device-manage-right" :style="{ height: pageHeight.height }">
<div class="el-descriptions__header">
@@ -134,7 +134,7 @@ import { add, removeUserDev, queryDevByUseId } from '@/api/cs-system-boot/offici
import { ref } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
const pageHeight = mainHeight(20)
const pageHeight = mainHeight(60)
const loading = ref(true)
const user: any = ref({})

View File

@@ -0,0 +1,22 @@
<template>
<div class="default-main">
<el-tabs type="border-card" v-model="activeName">
<el-tab-pane label="营销用户" name="1"><Disposition v-if="activeName == '1'" /></el-tab-pane>
<el-tab-pane label="正式用户" name="2"><OfficialUser v-if="activeName == '2'" /></el-tab-pane>
<el-tab-pane label="游客" name="3"><Tourist v-if="activeName == '3'" /></el-tab-pane>
</el-tabs>
</div>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import Disposition from '@/views/govern/device/disposition/index.vue'
import OfficialUser from '@/views/govern/device/officialUser/index.vue'
import Tourist from '@/views/govern/device/tourist/index.vue'
const activeName = ref('1')
</script>
<style lang="scss" scoped>
:deep(.el-tabs--border-card > .el-tabs__content) {
padding: 0px;
}
</style>

View File

@@ -1,191 +1,191 @@
<template>
<div>
<Table ref="tableRef" v-if="!isWaveCharts" />
<waveFormAnalysis v-loading="loading" v-if="isWaveCharts" ref="waveFormAnalysisRef"
@handleHideCharts="isWaveCharts = false" :wp="wp" />
</div>
<!-- <TableHeader :showReset="false">
</TableHeader> -->
</template>
<script setup lang='ts'>
import { ref, provide, onMounted, nextTick } from 'vue'
import { getEventByItem } from '@/api/cs-device-boot/planData'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage } from 'element-plus'
import waveFormAnalysis from '@/views/govern/device/control/tabs/components/waveFormAnalysis.vue';
import { analyseWave } from '@/api/common'
import { mainHeight } from '@/utils/layout'
import { getFileZip } from '@/api/cs-harmonic-boot/datatrend'
const props = defineProps({
activeName: String,
activeColName: [Object, String]
})
const loading = ref(false)
const waveFormAnalysisRef = ref()
const isWaveCharts = ref(false)
const boxoList: any = ref([])
const wp = ref({})
const tableStore = new TableStore({
url: '/cs-harmonic-boot/data/getEventByItem',
method: 'POST',
paramsPOST: true,
showPage: false,
publicHeight: 355,
column: [
// { width: '60', type: 'checkbox', fixed: 'left' },
{
title: '序号', width: 80, formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'startTime', title: '发生时刻', minWidth: 170, sortable: true },
{ field: 'showName', title: '事件描述', minWidth: 170 },
{
field: 'phaseType',
title: '相别',
minWidth: 100,
formatter: (row: any) => {
row.cellValue = row.cellValue ? row.cellValue : '/'
return row.cellValue
}
},
{
field: 'persistTime',
title: '持续时间(s)',
minWidth: 100,
formatter: (row: any) => {
row.cellValue = row.cellValue ? row.cellValue.toFixed(2) : '/'
return row.cellValue
}, sortable: true
},
{
field: 'featureAmplitude',
title: '暂降(聚升)幅值(%)',
minWidth: 100,
formatter: (row: any) => {
row.cellValue = row.cellValue + '' ? row.cellValue.toFixed(2) : '/'
if (String(row.cellValue).split('.')[1] == '00') {
row.cellValue = String(row.cellValue).split('.')[0]
}
return row.cellValue
}, sortable: true
},
{
title: '操作',
width: 180,
render: 'buttons',
fixed: 'right',
buttons: [
{
name: 'edit',
title: '波形分析',
type: 'primary',
icon: 'el-icon-Check',
render: 'basicButton',
loading: 'loading1',
disabled: row => {
// && row.evtParamTm < 20
return !row.wavePath
},
click: async row => {
row.loading1 = true
loading.value = true
isWaveCharts.value = true
await analyseWave(row.id)
.then(res => {
row.loading1 = false
if (res != undefined) {
boxoList.value = row
boxoList.value.systemType = 'WX'
wp.value = res.data
}
loading.value = false
})
.catch(() => {
row.loading1 = false
loading.value = false
})
nextTick(() => {
waveFormAnalysisRef.value && waveFormAnalysisRef.value.getWpData(wp.value, boxoList.value, true)
setHeight()
})
}
},
{
name: 'edit',
text: '暂无波形',
type: 'info',
icon: 'el-icon-DataLine',
render: 'basicButton',
disabled: row => {
return row.wavePath
}
},
{
name: 'edit',
title: '波形下载',
type: 'primary',
loading: 'loading2',
icon: 'el-icon-Check',
render: 'basicButton',
disabled: row => {
// && row.evtParamTm < 20
return !row.wavePath
},
click: row => {
getFileZip({ eventId: row.id }).then(res => {
let blob = new Blob([res], { type: 'application/zip' }) // console.log(blob) // var href = window.URL.createObjectURL(blob); //创建下载的链接
const url = window.URL.createObjectURL(blob)
const link = document.createElement('a') // 创建a标签
link.href = url
link.download = row.wavePath.split('/')[2] || '波形文件' // 设置下载的文件名
document.body.appendChild(link)
link.click() //执行下载
document.body.removeChild(link) //释放标签
})
}
}
]
}
],
loadCallback: () => {
}
})
const setHeight = () => {
if (props.activeColName == '0') {
waveFormAnalysisRef.value && waveFormAnalysisRef.value.setHeight(350, 485)
tableStore.table.height = mainHeight(380).height
} else {
waveFormAnalysisRef.value && waveFormAnalysisRef.value.setHeight(350, 350)
tableStore.table.height = mainHeight(240).height
}
}
provide('tableStore', tableStore)
const init = () => {
tableStore.table.params.id = props.activeName
// getEventByItem({ id: props.activeName }).then(res => {
// })
tableStore.index()
}
onMounted(() => {
})
defineExpose({ init, setHeight })
</script>
<style lang="scss" scoped></style>
<template>
<div>
<Table ref="tableRef" v-if="!isWaveCharts" />
<waveFormAnalysis v-loading="loading" v-if="isWaveCharts" ref="waveFormAnalysisRef"
@handleHideCharts="isWaveCharts = false" :wp="wp" />
</div>
<!-- <TableHeader :showReset="false">
</TableHeader> -->
</template>
<script setup lang='ts'>
import { ref, provide, onMounted, nextTick } from 'vue'
import { getEventByItem } from '@/api/cs-device-boot/planData'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage } from 'element-plus'
import waveFormAnalysis from '@/views/govern/device/control/tabs/components/waveFormAnalysis.vue';
import { analyseWave } from '@/api/common'
import { mainHeight } from '@/utils/layout'
import { getFileZip } from '@/api/cs-harmonic-boot/datatrend'
const props = defineProps({
activeName: String,
activeColName: [Object, String]
})
const loading = ref(false)
const waveFormAnalysisRef = ref()
const isWaveCharts = ref(false)
const boxoList: any = ref([])
const wp = ref({})
const tableStore = new TableStore({
url: '/cs-harmonic-boot/data/getEventByItem',
method: 'POST',
paramsPOST: true,
showPage: false,
publicHeight: 355,
column: [
// { width: '60', type: 'checkbox', fixed: 'left' },
{
title: '序号', width: 80, formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'startTime', title: '发生时刻', minWidth: 170, sortable: true },
{ field: 'showName', title: '事件描述', minWidth: 170 },
{
field: 'phaseType',
title: '相别',
minWidth: 100,
formatter: (row: any) => {
row.cellValue = row.cellValue ? row.cellValue : '/'
return row.cellValue
}
},
{
field: 'persistTime',
title: '持续时间(s)',
minWidth: 100,
formatter: (row: any) => {
row.cellValue = row.cellValue ? row.cellValue.toFixed(2) : '/'
return row.cellValue
}, sortable: true
},
{
field: 'featureAmplitude',
title: '暂降(聚升)幅值(%)',
minWidth: 100,
formatter: (row: any) => {
row.cellValue = row.cellValue + '' ? row.cellValue.toFixed(2) : '/'
if (String(row.cellValue).split('.')[1] == '00') {
row.cellValue = String(row.cellValue).split('.')[0]
}
return row.cellValue
}, sortable: true
},
{
title: '操作',
width: 180,
render: 'buttons',
fixed: 'right',
buttons: [
{
name: 'edit',
title: '波形分析',
type: 'primary',
icon: 'el-icon-Check',
render: 'basicButton',
loading: 'loading1',
disabled: row => {
// && row.evtParamTm < 20
return !row.wavePath
},
click: async row => {
row.loading1 = true
loading.value = true
isWaveCharts.value = true
await analyseWave(row.id)
.then(res => {
row.loading1 = false
if (res != undefined) {
boxoList.value = row
boxoList.value.systemType = 'YPT'
wp.value = res.data
}
loading.value = false
})
.catch(() => {
row.loading1 = false
loading.value = false
})
nextTick(() => {
waveFormAnalysisRef.value && waveFormAnalysisRef.value.getWpData(wp.value, boxoList.value, true)
setHeight()
})
}
},
{
name: 'edit',
text: '暂无波形',
type: 'info',
icon: 'el-icon-DataLine',
render: 'basicButton',
disabled: row => {
return row.wavePath
}
},
{
name: 'edit',
title: '波形下载',
type: 'primary',
loading: 'loading2',
icon: 'el-icon-Check',
render: 'basicButton',
disabled: row => {
// && row.evtParamTm < 20
return !row.wavePath
},
click: row => {
getFileZip({ eventId: row.id }).then(res => {
let blob = new Blob([res], { type: 'application/zip' }) // console.log(blob) // var href = window.URL.createObjectURL(blob); //创建下载的链接
const url = window.URL.createObjectURL(blob)
const link = document.createElement('a') // 创建a标签
link.href = url
link.download = row.wavePath.split('/')[2] || '波形文件' // 设置下载的文件名
document.body.appendChild(link)
link.click() //执行下载
document.body.removeChild(link) //释放标签
})
}
}
]
}
],
loadCallback: () => {
}
})
const setHeight = () => {
if (props.activeColName == '0') {
waveFormAnalysisRef.value && waveFormAnalysisRef.value.setHeight(350, 485)
tableStore.table.height = mainHeight(380).height
} else {
waveFormAnalysisRef.value && waveFormAnalysisRef.value.setHeight(350, 350)
tableStore.table.height = mainHeight(240).height
}
}
provide('tableStore', tableStore)
const init = () => {
tableStore.table.params.id = props.activeName
// getEventByItem({ id: props.activeName }).then(res => {
// })
tableStore.index()
}
onMounted(() => {
})
defineExpose({ init, setHeight })
</script>
<style lang="scss" scoped></style>

View File

@@ -1,95 +1,96 @@
<template>
<div class="default-main device-manage" :style="{ height: pageHeight.height }" v-loading="loading">
<DeviceTree
:showCheckbox="true"
:default-checked-keys="defaultCheckedKeys"
@checkChange="checkChange"
></DeviceTree>
<div class="device-manage-right" :style="{ height: pageHeight.height }">
<vxe-table v-bind="defaultAttribute" :data="tableData" height="auto" style="width: 100%">
<vxe-column field="enginerName" title="工程名称"></vxe-column>
<vxe-column field="projectName" title="项目名称"></vxe-column>
<vxe-column field="deviceName" title="装置名称"></vxe-column>
</vxe-table>
</div>
</div>
</template>
<script setup lang="ts">
defineOptions({
name: 'govern/tourist/index'
})
import { defaultAttribute } from '@/components/table/defaultAttribute'
import DeviceTree from '@/components/tree/govern/deviceTree.vue'
import { mainHeight } from '@/utils/layout'
import { getVisitorConfig, updateVisitorConfig } from '@/api/cs-device-boot/user'
import { ref, onMounted } from 'vue'
const pageHeight = mainHeight(20)
const loading = ref(true)
const defaultCheckedKeys: any = ref([])
const tableData = ref([])
const checkChange = (data: any) => {
if (data.data.level === 2) {
if (data.checked) {
defaultCheckedKeys.value.push(data.data.id)
} else {
defaultCheckedKeys.value.splice(defaultCheckedKeys.value.indexOf(data.data.id), 1)
}
loading.value = true
updateVisitorConfigs()
}
}
const updateVisitorConfigs = () => {
const result = Array.from(new Set(defaultCheckedKeys.value))
updateVisitorConfig(
result.map(item => {
return {
deviceId: item
}
})
).then((res: any) => {
if (res.code === 'A0000') {
getVisitorConfigs()
}
})
}
const getVisitorConfigs = () => {
getVisitorConfig().then((res:any) => {
if (res.code === 'A0000') {
tableData.value = res.data
loading.value = false
if (defaultCheckedKeys.value.length > 0) return
defaultCheckedKeys.value = [] // 清空
res.data.forEach((item:any) => {
defaultCheckedKeys.value.push(item.deviceId)
})
}
})
}
onMounted(() => {
// if (!adminInfo.token) return router.push({ name: 'login' })
getVisitorConfigs()
})
</script>
<style lang="scss">
.device-manage {
display: flex;
&-right {
overflow: hidden;
flex: 1;
padding: 10px 10px 10px 0;
.el-descriptions__header {
height: 36px;
margin-bottom: 7px;
display: flex;
align-items: center;
}
}
}
</style>
<template>
<div class=" device-manage" :style="{ height: pageHeight.height }" v-loading="loading">
<DeviceTree
:showCheckbox="true"
:default-checked-keys="defaultCheckedKeys"
@checkChange="checkChange"
:height="35"
></DeviceTree>
<div class="device-manage-right" :style="{ height: pageHeight.height }">
<vxe-table v-bind="defaultAttribute" :data="tableData" height="auto" style="width: 100%">
<vxe-column field="enginerName" title="工程名称"></vxe-column>
<vxe-column field="projectName" title="项目名称"></vxe-column>
<vxe-column field="deviceName" title="装置名称"></vxe-column>
</vxe-table>
</div>
</div>
</template>
<script setup lang="ts">
defineOptions({
name: 'govern/tourist/index'
})
import { defaultAttribute } from '@/components/table/defaultAttribute'
import DeviceTree from '@/components/tree/govern/deviceTree.vue'
import { mainHeight } from '@/utils/layout'
import { getVisitorConfig, updateVisitorConfig } from '@/api/cs-device-boot/user'
import { ref, onMounted } from 'vue'
const pageHeight = mainHeight(60)
const loading = ref(true)
const defaultCheckedKeys: any = ref([])
const tableData = ref([])
const checkChange = (data: any) => {
if (data.data.level === 2) {
if (data.checked) {
defaultCheckedKeys.value.push(data.data.id)
} else {
defaultCheckedKeys.value.splice(defaultCheckedKeys.value.indexOf(data.data.id), 1)
}
loading.value = true
updateVisitorConfigs()
}
}
const updateVisitorConfigs = () => {
const result = Array.from(new Set(defaultCheckedKeys.value))
updateVisitorConfig(
result.map(item => {
return {
deviceId: item
}
})
).then((res: any) => {
if (res.code === 'A0000') {
getVisitorConfigs()
}
})
}
const getVisitorConfigs = () => {
getVisitorConfig().then((res:any) => {
if (res.code === 'A0000') {
tableData.value = res.data
loading.value = false
if (defaultCheckedKeys.value.length > 0) return
defaultCheckedKeys.value = [] // 清空
res.data.forEach((item:any) => {
defaultCheckedKeys.value.push(item.deviceId)
})
}
})
}
onMounted(() => {
// if (!adminInfo.token) return router.push({ name: 'login' })
getVisitorConfigs()
})
</script>
<style lang="scss">
.device-manage {
display: flex;
&-right {
overflow: hidden;
flex: 1;
padding: 10px 10px 10px 0;
.el-descriptions__header {
height: 36px;
margin-bottom: 7px;
display: flex;
align-items: center;
}
}
}
</style>