Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改 模块运行状态页面添加数据展示

Browse Source
This commit is contained in:
guanj
2025-07-09 16:48:18 +08:00
parent e1851f7ebb
commit 7ab8e4ed9c
9 changed files with 404 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/echarts/MyEchart.vue
View File

@@ -103,7 +103,7 @@ const initChart = () => {
type: 'inside',
height: 13,
start: 0,
bottom: '20px',
end: 100
},
@@ -130,7 +130,7 @@ const initChart = () => {
handlerBar(options)
// 处理柱状图
chart.setOption(options, true)
chart.group = 'group'
setTimeout(() => {
chart.resize()
}, 0)

134
src/components/tree/device.vue
View File

@@ -1,34 +1,73 @@
<!-- 设备管理使用折叠面板渲染多个tree -->
<template>
<div :style="{ width: menuCollapse ? '40px' : props.width }" style="display: flex; overflow: hidden">
<Icon v-show="menuCollapse" @click="onMenuCollapse" :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
:class="menuCollapse ? 'unfold' : ''" size="18" class="fold ml10 mt20 menu-collapse"
style="cursor: pointer" />
<div :style="{ width: menuCollapse ? '40px' : props.width }" style="display: flex; overflow: hidden">
<Icon
v-show="menuCollapse"
@click="onMenuCollapse"
:name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
:class="menuCollapse ? 'unfold' : ''"
size="18"
class="fold ml10 mt20 menu-collapse"
style="cursor: pointer"
/>
<div class="cn-tree" :style="{ opacity: menuCollapse ? 0 : 1 }">
<div style="display: flex; align-items: center" class="mb10">
<!-- <el-form-item> -->
<el-input maxlength="32" show-word-limit v-model.trim="filterText" autocomplete="off"
placeholder="请输入内容" clearable>
<el-input
maxlength="32"
show-word-limit
v-model.trim="filterText"
autocomplete="off"
placeholder="请输入内容"
clearable
>
<template #prefix>
<Icon name="el-icon-Search" style="font-size: 16px" />
</template>
</el-input>
<!-- </el-form-item> -->
<Icon @click="onMenuCollapse" :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
:class="menuCollapse ? 'unfold' : ''" size="18" class="fold ml10 menu-collapse"
style="cursor: pointer" v-if="props.canExpand" />
<Icon
@click="onMenuCollapse"
:name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
:class="menuCollapse ? 'unfold' : ''"
size="18"
class="fold ml10 menu-collapse"
style="cursor: pointer"
v-if="props.canExpand"
/>
</div>
<el-collapse :accordion="true" v-model.trim="activeName" style="flex: 1; height: 100%"
@change="changeDevice">
<el-collapse
:accordion="true"
v-model.trim="activeName"
style="flex: 1; height: 100%"
@change="changeDevice"
>
<el-collapse-item title="治理设备" name="0" v-if="zlDeviceData.length != 0">
<el-select v-model.trim="process" clearable placeholder="请选择状态" class="mb10">
<el-option label="功能调试" value="2"></el-option>
<el-option label="出厂调试" value="3"></el-option>
<el-option label="正式投运" value="4"></el-option>
</el-select>
<el-tree
:style="{ height: bxsDeviceData.length != 0 ? 'calc(100vh - 300px)' : 'calc(100vh - 238px)' }"
ref="treeRef1" :props="defaultProps" highlight-current :filter-node-method="filterNode"
node-key="id" default-expand-all v-bind="$attrs" :data="zlDeviceData" style="overflow: auto">
:style="{ height: bxsDeviceData.length != 0 ? 'calc(100vh - 340px)' : 'calc(100vh - 278px)' }"
ref="treeRef1"
:props="defaultProps"
highlight-current
:filter-node-method="filterNode"
node-key="id"
default-expand-all
v-bind="$attrs"
:data="zlDevList"
style="overflow: auto"
>
<template #default="{ node, data }">
<span class="custom-tree-node">
<Icon :name="data.icon" style="font-size: 16px" :style="{ color: data.color }"
v-if="data.icon" />
<Icon
:name="data.icon"
style="font-size: 16px"
:style="{ color: data.color }"
v-if="data.icon"
/>
<span style="margin-left: 4px">{{ node.label }}</span>
</span>
</template>
@@ -37,13 +76,24 @@
<el-collapse-item title="便携式设备" name="1" v-if="bxsDeviceData.length != 0">
<el-tree
:style="{ height: zlDeviceData.length != 0 ? 'calc(100vh - 280px)' : 'calc(100vh - 238px)' }"
ref="treeRef2" :props="defaultProps" highlight-current default-expand-all
:filter-node-method="filterNode" node-key="id" :data="bxsDeviceData" v-bind="$attrs"
style="overflow: auto">
ref="treeRef2"
:props="defaultProps"
highlight-current
default-expand-all
:filter-node-method="filterNode"
node-key="id"
:data="bxsDeviceData"
v-bind="$attrs"
style="overflow: auto"
>
<template #default="{ node, data }">
<span class="custom-tree-node">
<Icon :name="data.icon" style="font-size: 16px" :style="{ color: data.color }"
v-if="data.icon" />
<Icon
:name="data.icon"
style="font-size: 16px"
:style="{ color: data.color }"
v-if="data.icon"
/>
<span style="margin-left: 4px">{{ node.label }}</span>
</span>
</template>
@@ -84,8 +134,10 @@ const defaultProps = {
label: 'name',
value: 'id'
}
const process = ref('2')
//治理设备数据
const zlDeviceData = ref([])
const zlDevList = ref<any>([])
//便携式设备数据
const bxsDeviceData = ref([])
watch(
@@ -118,6 +170,35 @@ watch(filterText, val => {
treeRef2.value!.filter(val)
}
})
watch(process, val => {
if (val == '') {
zlDevList.value = JSON.parse(JSON.stringify(zlDeviceData.value))
} else {
zlDevList.value = filterProcess(JSON.parse(JSON.stringify(zlDeviceData.value)))
}
setTimeout(() => {
changeDevice(activeName.value)
}, 0)
})
function filterProcess(nodes: any) {
return nodes
.map(node => {
// 递归处理子节点
const children = node.children ? filterProcess(node.children) : []
// 如果当前节点的process=4，或者有子节点满足条件，则保留当前节点
if (node.process == process.value || children.length > 0) {
return {
...node,
children: node.children
}
}
// 否则过滤掉当前节点
return null
})
.filter(Boolean) // 移除null节点
}
const onMenuCollapse = () => {
menuCollapse.value = !menuCollapse.value
proxy.eventBus.emit('cnTreeCollapse', menuCollapse)
@@ -126,14 +207,12 @@ const filterNode = (value: string, data: any, node: any) => {
if (!value) return true
// return data.name.includes(value)
if (data.name) {
return chooseNode(value, data, node)
}
}
// 过滤父节点 / 子节点 (如果输入的参数是父节点且能匹配，则返回该节点以及其下的所有子节点；如果参数是子节点，则返回该节点的父节点。name是中文字符，enName是英文字符.
const chooseNode = (value: string, data: any, node: any) => {
if (data.name.indexOf(value) !== -1) {
return true
}
@@ -161,7 +240,9 @@ const chooseNode = (value: string, data: any, node: any) => {
const changeDevice = (val: any) => {
let arr1: any = []
zlDeviceData.value.forEach((item: any) => {
//zlDeviceData
zlDevList.value.forEach((item: any) => {
item.children.forEach((item2: any) => {
item2.children.forEach((item3: any) => {
arr1.push(item3)
@@ -197,6 +278,7 @@ defineExpose({ treeRef1, treeRef2 })
onMounted(() => {
setTimeout(() => {
if (zlDeviceData.value.length != 0) {
zlDevList.value = filterProcess(JSON.parse(JSON.stringify(zlDeviceData.value)))
activeName.value = '0'
}
if (zlDeviceData.value.length === 0 && bxsDeviceData.value.length != 0) {
@@ -205,7 +287,9 @@ onMounted(() => {
if (!zlDeviceData.value && !bxsDeviceData.value) {
activeName.value = ''
}
changeDevice(activeName.value)
nextTick(() => {
changeDevice(activeName.value)
})
}, 500)
})
</script>

52
src/components/tree/point.vue
View File

@@ -35,8 +35,14 @@
@change="changeDevice"
>
<el-collapse-item title="治理设备" name="0" v-if="zlDeviceData.length != 0">
<el-select v-model.trim="process" clearable placeholder="请选择状态" class="mb10">
<el-option label="功能调试" value="2"></el-option>
<el-option label="出厂调试" value="3"></el-option>
<el-option label="正式投运" value="4"></el-option>
</el-select>
<el-tree
:style="{ height: bxsDeviceData.length != 0 ? 'calc(100vh - 300px)' : 'calc(100vh - 238px)' }"
:style="{ height: bxsDeviceData.length != 0 ? 'calc(100vh - 340px)' : 'calc(100vh - 278px)' }"
ref="treeRef1"
:props="defaultProps"
highlight-current
@@ -44,7 +50,7 @@
node-key="id"
default-expand-all
v-bind="$attrs"
:data="zlDeviceData"
:data="zlDevList"
style="overflow: auto"
>
<template #default="{ node, data }">
@@ -94,7 +100,7 @@
<script lang="ts" setup>
import useCurrentInstance from '@/utils/useCurrentInstance'
import { ElTree } from 'element-plus'
import { ref, watch, defineEmits, onMounted, nextTick } from 'vue'
import { ref, watch, defineEmits, onMounted, nextTick, computed } from 'vue'
import { useRoute } from 'vue-router'
defineOptions({
name: 'govern/tree'
@@ -113,7 +119,7 @@ const props = withDefaults(defineProps<Props>(), {
type: '',
data: []
})
const process = ref('2')
const route = useRoute()
const { proxy } = useCurrentInstance()
const menuCollapse = ref(false)
@@ -125,6 +131,7 @@ const defaultProps = {
}
//治理设备数据
const zlDeviceData = ref<any>([])
const zlDevList = ref<any>([])
//便携式设备数据
const bxsDeviceData = ref<any>([])
watch(
@@ -144,6 +151,7 @@ watch(
}
})
if (zlDeviceData.value.length != 0) {
zlDevList.value = filterProcess(JSON.parse(JSON.stringify(zlDeviceData.value)))
activeName.value = '0'
}
if (zlDeviceData.value.length === 0 && bxsDeviceData.value.length != 0) {
@@ -152,7 +160,9 @@ watch(
if (!zlDeviceData.value && !bxsDeviceData.value) {
activeName.value = ''
}
changeDevice(activeName.value)
nextTick(() => {
changeDevice(activeName.value)
})
}
},
{
@@ -168,9 +178,21 @@ watch(filterText, val => {
treeRef2.value!.filter(val)
}
})
watch(process, val => {
if (val == '') {
zlDevList.value = JSON.parse(JSON.stringify(zlDeviceData.value))
} else {
zlDevList.value = filterProcess(JSON.parse(JSON.stringify(zlDeviceData.value)))
}
setTimeout(() => {
changeDevice(activeName.value)
}, 0)
})
const changeDevice = (val: any) => {
let arr1: any = []
zlDeviceData.value.forEach((item: any) => {
//zlDeviceData
zlDevList.value.forEach((item: any) => {
item.children.forEach((item2: any) => {
item2.children.forEach((item3: any) => {
item3.children.forEach((item4: any) => {
@@ -215,7 +237,25 @@ const filterNode = (value: string, data: any, node: any) => {
return chooseNode(value, data, node)
}
}
function filterProcess(nodes: any) {
return nodes
.map(node => {
// 递归处理子节点
const children = node.children ? filterProcess(node.children) : []
// 如果当前节点的process=4，或者有子节点满足条件，则保留当前节点
if (node.process == process.value || children.length > 0) {
return {
...node,
children: node.children
}
}
// 否则过滤掉当前节点
return null
})
.filter(Boolean) // 移除null节点
}
// 过滤父节点 / 子节点 (如果输入的参数是父节点且能匹配，则返回该节点以及其下的所有子节点；如果参数是子节点，则返回该节点的父节点。name是中文字符，enName是英文字符.
const chooseNode = (value: string, data: any, node: any) => {
if (data.name.indexOf(value) !== -1) {

2
src/views/govern/alarm/Device.vue
View File

@@ -2,7 +2,7 @@
<TableHeader datePicker ref="refheader" showExport>
<template v-slot:select>
<el-form-item label="数据来源">
<el-cascader v-model.trim="tableStore.table.params.cascader" placeholder="请选择数据来源"
<el-cascader v-model.trim="tableStore.table.params.cascader" filterable placeholder="请选择数据来源"
@change="sourceChange" :options="deviceTreeOptions" :show-all-levels="false"
:props="{ checkStrictly: true }" clearable></el-cascader>
<!-- <el-input maxlength="32" show-word-limit v-model.trim="tableStore.table.params.searchValue" placeholder="请输入设备名称" /> -->

2
src/views/govern/alarm/Steady.vue
View File

@@ -2,7 +2,7 @@
<TableHeader datePicker ref="refheader" showExport>
<template v-slot:select>
<el-form-item label="数据来源">
<el-cascader v-model.trim="tableStore.table.params.cascader" placeholder="请选择数据来源"
<el-cascader v-model.trim="tableStore.table.params.cascader" filterable placeholder="请选择数据来源"
@change="sourceChange" :options="deviceTreeOptions" :show-all-levels="false"
:props="{ checkStrictly: true }" clearable></el-cascader>
<!-- <el-input maxlength="32" show-word-limit v-model.trim="tableStore.table.params.searchValue" placeholder="请输入设备名称" /> -->

2
src/views/govern/alarm/Transient.vue
View File

@@ -3,7 +3,7 @@
<TableHeader datePicker showExport>
<template v-slot:select>
<el-form-item label="数据来源">
<el-cascader placeholder="请选择数据来源" @change="sourceChange"
<el-cascader placeholder="请选择数据来源" @change="sourceChange" filterable
v-model.trim="tableStore.table.params.cascader" :options="deviceTreeOptions"
:show-all-levels="false" :props="{ checkStrictly: true }" clearable></el-cascader>
<!-- <el-input maxlength="32" show-word-limit v-model.trim="tableStore.table.params.searchValue" placeholder="请输入设备名称" /> -->

55
src/views/govern/device/control/index.vue
View File

@@ -1267,38 +1267,35 @@ const handleClick = async (tab?: any) => {
}
//模块数据
if (dataSet.value.includes('_moduleData')) {
setTimeout(async () => {
if (tab.props != undefined) await (datePickerRef.value && datePickerRef.value?.setInterval(5))
setTimeout(() => {
if ((tab && tab.props) != undefined) {
datePickerRef.value && datePickerRef.value?.setInterval(5)
let obj = {
// devId: deviceId.value, //e.id
lineId: lineId.value, //e.pid
startTime: datePickerRef.value && datePickerRef.value.timeValue[0],
endTime: datePickerRef.value && datePickerRef.value.timeValue[1]
}
}, 0)
let obj = {
// devId: deviceId.value, //e.id
lineId: lineId.value, //e.pid
startTime: datePickerRef.value && datePickerRef.value.timeValue[0],
endTime: datePickerRef.value && datePickerRef.value.timeValue[1]
}
await setTimeout(() => {
allModelData(obj)
.then((res: any) => {
tableData.value = res.data
formInline.total = res.data.total
tableLoading.value = false
setTimeout(() => {
//targetType
moduleDataRef.value?.setData(res.data)
}, 500)
setTimeout(() => {
loading.value = false
}, 1500)
})
.catch(e => {
setTimeout(() => {
await setTimeout(() => {
allModelData(obj)
.then((res: any) => {
tableData.value = res.data
formInline.total = res.data.total
tableLoading.value = false
}, 1500)
})
setTimeout(() => {
//targetType
moduleDataRef.value?.setData(res.data)
}, 500)
setTimeout(() => {
loading.value = false
}, 1500)
})
.catch(e => {
setTimeout(() => {
tableLoading.value = false
}, 1500)
})
}, 0)
}, 0)
}

219
src/views/govern/device/control/moduleData.vue
View File

@@ -4,7 +4,7 @@
<div class="container">
<div class="tabs-container">
<!-- 左侧标签头 -->
<div class="tab-list" :style="echartHeight" style="overflow-y: auto">
<div class="tab-list" :style="titleHeight" style="overflow-y: auto">
<button
v-for="(item, index) in list"
:key="index"
@@ -12,12 +12,7 @@
@click="changeTab(index)"
>
<span>{{ item.moduleName }}</span>
<el-tag
class="ml10"
:type="item.moduleState == '离线' ? 'danger' : 'success'"
size="small"
effect="dark"
>
<el-tag class="ml10" :type="getType(item.moduleState)" size="small" effect="dark">
{{ item.moduleState }}
</el-tag>
</button>
@@ -25,10 +20,20 @@
<!-- 右侧内容区域 -->
<div class="tab-content-container flex-1" :key="activeTab">
<div :style="echartHeight">
<MyEchart :options="echartList.options" v-if="echartList.dataList != null" />
<el-empty description="暂无数据" style="width: 100%; height: 100%" v-else></el-empty>
</div>
<el-tabs v-model="activeName" type="card" v-if="echartList?.dataList != null">
<el-tab-pane label="状态" name="0">
<div :style="echartHeight" class="pt10">
<MyEchart :options="echartList.options" />
</div>
</el-tab-pane>
<el-tab-pane label="数据" name="1">
<div :style="echartHeight" class="pt10">
<MyEchart style="height: 50%" :options="echartList.loadList" />
<MyEchart style="height: 50%" :options="echartList.modOutList" />
</div>
</el-tab-pane>
</el-tabs>
<el-empty description="暂无数据" style="width: 100%; height: 100%" v-else></el-empty>
</div>
</div>
</div>
@@ -56,20 +61,23 @@
</div>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { ref, reactive,onBeforeUnmount } from 'vue'
import { mainHeight } from '@/utils/layout'
import { WarnTriangleFilled } from '@element-plus/icons-vue'
import { getModuleState } from '@/api/cs-device-boot/EquipmentDelivery'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { ElMessage } from 'element-plus'
import { chain } from 'lodash'
import { yMethod } from '@/utils/echartMethod'
import { k } from 'vite/dist/node/types.d-aGj9QkWt'
const list: any = ref([])
const loading = ref(false)
const height = ref(mainHeight(290))
const echartHeight = ref(mainHeight(302))
const titleHeight = ref(mainHeight(302))
const echartHeight = ref(mainHeight(342))
const activeTab = ref(0)
const activeName = ref('0')
const echartList: any = ref({})
import * as echarts from 'echarts' // 全引入
const setData = (data: any) => {
activeTab.value = 0
// echartHeight.value = mainHeight(292 + data.length * 49, data.length)
@@ -107,7 +115,7 @@ const setData = (data: any) => {
legend: {
show: true,
type: 'plain',
top: 0,
top: 10,
itemWidth: 14, // 图例标记宽度
itemHeight: 14, // 图例标记高度
data: [
@@ -131,20 +139,21 @@ const setData = (data: any) => {
top: '30px'
},
yAxis: {
max: 1,
data: ['运行', '中断'],
interval: 1,
max: 1.03,
data: ['运行', '停止', '中断'],
interval: 0.01,
axisLabel: {
formatter: value => {
// if (value === 0) {
// return ` `
// }
if (value === 0) {
return `{lx|离线} `
}
if (value === 1) {
return `{yx|运行} `
if (value === 0.03) {
return `{lx|离线}`
} else if (value === 0.5) {
return `{tz|停止}`
} else if (value === 1) {
return `{yx|运行}`
}
},
rich: {
@@ -173,8 +182,24 @@ const setData = (data: any) => {
width: 35,
height: 20,
borderColor: '#000'
},
tz: {
backgroundColor: '#e6a23c',
color: '#fff',
borderRadius: 5,
padding: [1, 3],
fontWeight: 600,
fontSize: 12,
align: 'center',
textAlign: 'center',
width: 35,
height: 20,
borderColor: '#000'
}
}
},
splitLine: {
show: false
}
},
@@ -185,7 +210,7 @@ const setData = (data: any) => {
type: 'line',
data: item.dataList.map((k: any) => [
k.time,
k.stateDesc == '离线' ? 0 : 1,
k.stateDesc == '离线' ? 0.03 : k.stateDesc == '运行' ? 1 : 0.5,
k.stateDesc,
k.dataType,
k.eventName
@@ -202,7 +227,7 @@ const setData = (data: any) => {
.filter((k: any) => k.dataType === 1)
.map((k: any) => ({
name: k.stateDesc,
coord: [k.time, k.stateDesc === '离线' ? 0 : 1],
coord: [k.time, k.stateDesc == '离线' ? 0.03 : k.stateDesc == '运行' ? 1 : 0.5],
itemStyle: {
color: '#FFB74D', // 亮黄色填充
borderColor: '#FFB74D', // 边框颜色
@@ -214,10 +239,138 @@ const setData = (data: any) => {
]
}
}
let [loadMin, loadMax] = yMethod(item.loadList.map(k => (k.data == 3.14159 ? 0 : k.data)))
item.loadList = {
title: {
text: '负载电流'
},
xAxis: {
type: 'time',
name: '时间',
//
axisLabel: {
formatter: {
day: '{MM}-{dd}',
month: '{MM}',
year: '{yyyy}'
}
}
},
toolbox: {
show: false
},
grid: {
top: '30px'
},
yAxis: {
name: 'A',
min: loadMin,
max: loadMax
},
color: ['#FFCC00', '#009900', '#CC0000'],
options: {
series: [
{
name: 'A相',
type: 'line',
data: item.loadList
.filter((k: any) => k.phasicType == 'A')
.map((k: any) => [k.time, k.data == 3.14159 ? null : k.data]),
smooth: true, //让线变得平滑
symbol: 'none'
},
{
name: 'B相',
type: 'line',
data: item.loadList
.filter((k: any) => k.phasicType == 'B')
.map((k: any) => [k.time, k.data == 3.14159 ? null : k.data]),
smooth: true, //让线变得平滑
symbol: 'none'
},
{
name: 'C相',
type: 'line',
data: item.loadList
.filter((k: any) => k.phasicType == 'C')
.map((k: any) => [k.time, k.data == 3.14159 ? null : k.data]),
smooth: true, //让线变得平滑
symbol: 'none'
}
]
}
}
let [modOuMin, modOuMax] = yMethod(item.modOutList.map(k => (k.data == 3.14159 ? 0 : k.data)))
item.modOutList = {
title: {
text: '输出电流'
},
xAxis: {
type: 'time',
name: '时间',
//
axisLabel: {
formatter: {
day: '{MM}-{dd}',
month: '{MM}',
year: '{yyyy}'
}
}
},
toolbox: {
show: false
},
grid: {
top: '30px'
},
yAxis: {
name: 'A',
min: modOuMin,
max: modOuMax
},
color: ['#FFCC00', '#009900', '#CC0000'],
options: {
series: [
{
name: 'A相',
type: 'line',
data: item.modOutList
.filter((k: any) => k.phasicType == 'A')
.map((k: any) => [k.time, k.data == 3.14159 ? null : k.data]),
smooth: true, //让线变得平滑
symbol: 'none'
},
{
name: 'B相',
type: 'line',
data: item.modOutList
.filter((k: any) => k.phasicType == 'B')
.map((k: any) => [k.time, k.data == 3.14159 ? null : k.data]),
smooth: true, //让线变得平滑
symbol: 'none'
},
{
name: 'C相',
type: 'line',
data: item.modOutList
.filter((k: any) => k.phasicType == 'C')
.map((k: any) => [k.time, k.data == 3.14159 ? null : k.data]),
smooth: true, //让线变得平滑
symbol: 'none'
}
]
}
}
})
list.value = data
echartList.value = list.value[activeTab.value]
echarts.connect('group')
}
const getModule = async (id: string) => {
loading.value = true
@@ -238,8 +391,21 @@ const changeTab = (e: any) => {
echartList.value = list.value[e]
activeTab.value = e
}
const getType = (type: string) => {
switch (type) {
case '运行':
return 'success'
case '离线':
return 'danger'
default:
return 'warning'
}
}
defineExpose({ setData, getModule })
onBeforeUnmount(() => {
echarts.disconnect('group')
})
</script>
<style lang="scss" scoped>
@@ -311,5 +477,6 @@ defineExpose({ setData, getModule })
.tab-content-container {
flex: 1;
padding: 0 10px;
}
</style>

30
src/views/govern/manage/factory.vue
View File

@@ -10,13 +10,30 @@
placeholder="请输入设备名称/网络设备ID"
/>
</el-form-item>
<el-form-item label="流程状态">
<el-form-item label="流程阶段">
<el-select v-model.trim="tableStore.table.params.process" clearable placeholder="请选择状态">
<el-option label="功能调试" :value="2"></el-option>
<el-option label="出厂调试" :value="3"></el-option>
<el-option label="正式投运" :value="4"></el-option>
</el-select>
</el-form-item>
<el-form-item label="物联状态">
<el-select
v-model.trim="tableStore.table.params.connectStatus"
clearable
placeholder="请选择物联状态"
>
<el-option label="已连接" :value="1"></el-option>
<el-option label="未连接" :value="0"></el-option>
</el-select>
</el-form-item>
<el-form-item label="设备状态">
<el-select v-model.trim="tableStore.table.params.runStatus" clearable placeholder="请选择状态">
<el-option label="在线" :value="2"></el-option>
<el-option label="离线" :value="1"></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="设备类型">
<el-select
v-model.trim="tableStore.table.params.devType"
@@ -283,6 +300,7 @@ const formDevModelOptionsFilter = computed(() => {
const tableStore = new TableStore({
url: '/cs-device-boot/EquipmentDelivery/list',
method: 'POST',
column: [
{
width: '60',
@@ -369,7 +387,7 @@ const tableStore = new TableStore({
},
// { title: 'MQTT状态', field: 'connectStatus', width: 100, },
{
title: 'MQTT状态',
title: '物联状态',
field: 'connectStatus',
width: 100,
render: 'tag',
@@ -384,7 +402,7 @@ const tableStore = new TableStore({
},
{
title: '通讯状态',
title: '设备状态',
field: 'runStatus',
width: 100,
render: 'tag',
@@ -398,7 +416,7 @@ const tableStore = new TableStore({
}
},
{
title: '流程状态',
title: '流程阶段',
field: 'process',
width: 100,
render: 'tag',
@@ -684,12 +702,14 @@ const tableStore = new TableStore({
tableStore.table.params.orderBy = 'desc'
tableStore.table.params.devType = ''
tableStore.table.params.devModel = ''
tableStore.table.params.process = ''
tableStore.table.params.process = 2
tableStore.table.params.devAccessMethod = ''
tableStore.table.params.status = ''
tableStore.table.params.sortBy = ''
tableStore.table.params.orderBy = ''
tableStore.table.params.searchValue = ''
tableStore.table.params.connectStatus = ''
tableStore.table.params.runStatus = ''
// 设备类型
const devTypeChange = (e: any) => {