绘制并联调icd文件管理页面

绘制并联调终端型号管理页面
This commit is contained in:
GGJ
2025-04-17 16:26:09 +08:00
parent 021a1ae89b
commit c97efb5beb
13 changed files with 807 additions and 255 deletions

View File

@@ -126,3 +126,19 @@ export function selectUserList(data: any) {
data data
}) })
} }
//查询列表
export function getStatusManageList(data: any) {
return createAxios({
url: '/device-boot/maintain/getStatusManageList',
method: 'post',
data
})
}
//设置终端状态
export function updateRunFlagManage(data: any) {
return createAxios({
url: '/device-boot/maintain/updateRunFlagManage',
method: 'post',
data
})
}

View File

@@ -0,0 +1,34 @@
import createAxios from '@/utils/request'
// icd删除
export function delIcdPath(data: any) {
return createAxios({
url: '/device-boot/icd/delIcdPath',
method: 'post',
data
})
}
// 查询icd全部信息
export function getIcdList() {
return createAxios({
url: '/device-boot/icd/getIcdList',
method: 'post',
})
}
// 新增icd模型
export function addIcdPath(data: any) {
return createAxios({
url: '/device-boot/icd/addIcdPath',
method: 'post',
data
})
}
// 更新icd模型
export function updateIcdPath(data: any) {
return createAxios({
url: '/device-boot/icd/updateIcdPath',
method: 'post',
data
})
}

View File

@@ -0,0 +1,34 @@
import createAxios from '@/utils/request'
// 新增装置型号
export function addDevType(data: any) {
return createAxios({
url: '/device-boot/devType/addDevType',
method: 'post',
data
})
}
// 删除新装置型号
export function delDevType(data: any) {
return createAxios({
url: '/device-boot/devType/delDevType',
method: 'post',
data
})
}
// 更新装置型号
export function updateDevType(data: any) {
return createAxios({
url: '/device-boot/devType/updateDevType',
method: 'post',
data
})
}
// 查询装置型号全部信息
export function getDevTypeList() {
return createAxios({
url: '/device-boot/devType/getDevTypeList',
method: 'post',
})
}

View File

@@ -182,8 +182,9 @@ import TableStore from '@/utils/tableStore'
import { defaultAttribute } from '@/components/table/defaultAttribute' import { defaultAttribute } from '@/components/table/defaultAttribute'
import TableHeader from '@/components/table/header/index.vue' import TableHeader from '@/components/table/header/index.vue'
import { mainHeight } from '@/utils/layout' import { mainHeight } from '@/utils/layout'
import { getTerminalUpLog } from '@/api/device-boot/Business.ts' import { getTerminalUpLog } from '@/api/device-boot/Business'
import XEUtils from 'xe-utils' import XEUtils from 'xe-utils'
import { getDevTypeList } from '@/api/device-boot/modelManage'
import { debounce } from 'lodash-es' import { debounce } from 'lodash-es'
import { useDictData } from '@/stores/dictData' import { useDictData } from '@/stores/dictData'
defineOptions({ defineOptions({
@@ -193,7 +194,7 @@ defineOptions({
const pageHeight = mainHeight(83) const pageHeight = mainHeight(83)
const dialogHeight = mainHeight(300) const dialogHeight = mainHeight(300)
const dictData = useDictData() const dictData = useDictData()
const teriminaloption: any = dictData.getBasicData('Dev_Type') const teriminaloption: any = ref([])
const teriminalstatusoption = ref([ const teriminalstatusoption = ref([
{ name: '全部', id: '' }, { name: '全部', id: '' },
{ name: '投运', id: 0 }, { name: '投运', id: 0 },
@@ -256,15 +257,13 @@ tableStore.table.params.searchEvent = ''
tableStore.table.params.filterName = '' tableStore.table.params.filterName = ''
provide('tableStore', tableStore) provide('tableStore', tableStore)
const tree2List = (list: any, id: any) => { const tree2List = (list: any, id: any) => {
//存储结果的数组 //存储结果的数组
let arr: any = [] let arr: any = []
// 遍历 tree 数组 // 遍历 tree 数组
list.forEach((item: any) => { list.forEach((item: any) => {
item.uPid = id item.uPid = id
item.uId = (Math.random() * 1000) item.uId = Math.random() * 1000
// 判断item是否存在children // 判断item是否存在children
if (!item.children) return arr.push(item) if (!item.children) return arr.push(item)
@@ -280,10 +279,12 @@ const tree2List = (list: any, id: any) => {
return arr return arr
} }
tableStore.table.params.searchValue = '' tableStore.table.params.searchValue = ''
tableStore.table.params.searchState = 0 tableStore.table.params.searchState = 0
onMounted(() => { onMounted(() => {
getDevTypeList().then(res => {
teriminaloption.value = res.data
})
tableStore.index() tableStore.index()
}) })
const add = () => {} const add = () => {}
@@ -316,7 +317,7 @@ const format = (percentage: any) => {
const formFilter = (row: any) => { const formFilter = (row: any) => {
let title = '/' let title = '/'
if (row.cellValue != null) { if (row.cellValue != null) {
teriminaloption.forEach((item: any) => { teriminaloption.value.forEach((item: any) => {
if (item.id == row.cellValue) { if (item.id == row.cellValue) {
title = item.name title = item.name
} }

View File

@@ -0,0 +1,112 @@
<template>
<el-dialog draggable v-model="dialogVisible" v-if="dialogVisible" title="终端使用详情" width="70%">
<MyEchart :options="echartsXq" style="width: 100%; height: 300px" />
<vxe-table v-bind="defaultAttribute" height="400" :data="tableData">
<vxe-colgroup title="cup使用率">
<vxe-column field="date" title="使用率"></vxe-column>
<vxe-column field="date" title="总量"></vxe-column>
<vxe-column field="date" title="使用量"></vxe-column>
<vxe-column field="date" title="未使用量"></vxe-column>
</vxe-colgroup>
<vxe-colgroup title="内存使用率">
<vxe-column field="date" title="使用率"></vxe-column>
<vxe-column field="date" title="总量"></vxe-column>
<vxe-column field="date" title="使用量"></vxe-column>
<vxe-column field="date" title="未使用量"></vxe-column>
</vxe-colgroup>
<vxe-colgroup title="磁盘使用率">
<vxe-column field="date" title="使用率"></vxe-column>
<vxe-column field="date" title="总量"></vxe-column>
<vxe-column field="date" title="使用量"></vxe-column>
<vxe-column field="date" title="未使用量"></vxe-column>
</vxe-colgroup>
</vxe-table>
</el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { ElMessage } from 'element-plus'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import MyEchart from '@/components/echarts/MyEchart.vue'
import {} from '@/api/device-boot/Business'
const echartsXq: any = ref([])
const dialogVisible = ref(false)
const tableData = ref([])
const open = (e: any) => {
console.log("🚀 ~ open ~ e:", e)
echartsXq.value = {
title: {
text: e.name + '性能详情'
},
legend: {
data: ['cpu使用率', '内存使用率', '磁盘使用率'],
icon: 'path://M0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z'
},
xAxis: {
type: 'time',
name: '时间'
},
yAxis: {
max: '100',
name: '%'
},
options: {
series: [
{
name: 'cpu使用率',
type: 'line',
smooth: true,
data: [
['2022-02-01 12:12:11', 10],
['2022-02-01 12:12:12', 20],
['2022-02-01 12:12:13', 30],
['2022-02-01 12:12:14', 44],
['2022-02-01 12:12:15', 50],
['2022-02-01 12:12:16', 65],
['2022-02-01 12:12:17', 76]
]
},
{
name: '内存使用率',
type: 'line',
smooth: true,
data: [
['2022-02-01 12:12:11', 13],
['2022-02-01 12:12:12', 54],
['2022-02-01 12:12:13', 34],
['2022-02-01 12:12:14', 44],
['2022-02-01 12:12:15', 35],
['2022-02-01 12:12:16', 53]
]
},
{
name: '磁盘使用率',
type: 'line',
smooth: true,
data: [
['2022-02-01 12:12:11', 13],
['2022-02-01 12:12:12', 2],
['2022-02-01 12:12:13', 2],
['2022-02-01 12:12:14', 32],
['2022-02-01 12:12:15', 43],
['2022-02-01 12:12:16', 23],
['2022-02-01 12:12:17', 23]
]
}
]
}
}
dialogVisible.value = true
}
const cancel = () => {
dialogVisible.value = false
}
defineExpose({ open })
</script>
<style lang="scss" scoped></style>

View File

@@ -0,0 +1,130 @@
<template>
<!-- 网路参数 终端状态 基础流量 扩展流量 流量策略 策略类型 -->
<!-- 新增 -->
<el-dialog draggable :title="title" v-model="dialogVisible" width="50%" :before-close="cancel">
<el-form :inline="true" :model="formInline" style="display: flex; justify-content: space-between">
<el-form-item label="终端状态">
<el-select v-model="formInline.state" placeholder="Select" size="large" style="width: 240px">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-button type="primary" icon="el-icon-Check" @click="submit">设置提交</el-button>
</el-form>
<div :style="`height: calc(50vh)`">
<vxe-table
v-loading="loading"
height="auto"
auto-resize
ref="tableRef"
v-bind="defaultAttribute"
:data="treeData"
show-overflow
:tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
:scroll-y="{ enabled: true }"
:checkbox-config="{ labelField: 'name' }"
>
<vxe-column field="name" align="left" title="电网拓扑" min-width="200" tree-node></vxe-column>
<vxe-column field="ip" title="网络参数"></vxe-column>
<vxe-column field="runFlag" title="终端状态" v-if="key == 0">
<template #default="{ row }">
<el-tag v-if="row.runFlag === 0" type="success" size="small">投运</el-tag>
<el-tag v-if="row.runFlag === 1" type="warning" size="small">热备用</el-tag>
<el-tag v-if="row.runFlag === 2" type="danger" size="small">停运</el-tag>
</template>
</vxe-column>
<vxe-column field="baseFlowMeal" title="基础套餐(MB)" v-if="key == 1"></vxe-column>
<vxe-column field="reamFlowMeal" title="扩展套餐(MB)" v-if="key == 1"></vxe-column>
<vxe-column field="flowStrategy" title="流量策略" v-if="key == 2"></vxe-column>
<vxe-column field="strategyFlag" title="策略类型" v-if="key == 2">
<template #default="{ row }">
<el-tag v-if="row.level === 4" type="primary">
{{ row.strategyFlag === 0 ? '定制' : '默认' }}
</el-tag>
</template>
</vxe-column>
</vxe-table>
</div>
</el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { useDictData } from '@/stores/dictData'
import { ElMessage } from 'element-plus'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { getStatusManageList, updateRunFlagManage } from '@/api/device-boot/Business'
const dictData = useDictData()
const dialogVisible = ref(false)
const emit = defineEmits(['onSubmit'])
const loading = ref(false)
const title = ref('')
const tableRef = ref()
const key = ref(0) //判断是什么配置
const treeData: any = ref([])
const treeDataCopy: any = ref([])
const formInline = reactive({
state: '0'
})
const ids = ref([])
const options = [
{ value: '0', label: '投运' },
{ value: '1', label: '热备用' },
{ value: '2', label: '停运' }
]
const open = (e: any) => {
ids.value = []
title.value = e.title
loading.value = true
key.value = e.key
ids.value = e.id
getStatusManageList(e.id).then(res => {
treeData.value = tree2List(res.data, Math.random() * 1000)
treeDataCopy.value = JSON.parse(JSON.stringify(treeData.value))
setTimeout(() => {
tableRef.value.setAllTreeExpand(true)
}, 0)
loading.value = false
})
dialogVisible.value = true
}
// 提交配置
const submit = () => {
updateRunFlagManage({
ids: ids.value,
runFlag: formInline.state
}).then(res => {
ElMessage.success('设置成功')
emit('onSubmit')
dialogVisible.value = false
})
}
// 处理大数据卡顿
const tree2List = (list: any, id: any) => {
//存储结果的数组
let arr: any = []
// 遍历 tree 数组
list.forEach((item: any) => {
item.uPid = id
item.uId = Math.random() * 1000
// 判断item是否存在children
if (!item.children) return arr.push(item)
// 函数递归对children数组进行tree2List的转换
const children = tree2List(item.children, item.uId)
// 删除item的children属性
delete item.children
// 把item和children数组添加至结果数组
//..children: 意思是把children数组展开
arr.push(item, ...children)
})
// 返回结果数组
return arr
}
const cancel = () => {
dialogVisible.value = false
}
defineExpose({ open })
</script>
<style lang="scss" scoped></style>

View File

@@ -3,47 +3,89 @@
<TableHeader> <TableHeader>
<template #select> <template #select>
<el-form-item label="终端型号"> <el-form-item label="终端型号">
<el-select v-model="tableStore.table.params.devType" clearable placeholder="请选择终端型号"> <el-select
<el-option v-for="item in teriminaloption" :key="item.id" :label="item.name" v-model="tableStore.table.params.devType"
:value="item.id"></el-option> filterable
clearable
placeholder="请选择终端型号"
>
<el-option
v-for="item in teriminaloption"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="终端状态"> <el-form-item label="终端状态">
<el-select v-model="tableStore.table.params.runFlag" clearable placeholder="请选择终端状态"> <el-select v-model="tableStore.table.params.runFlag" clearable placeholder="请选择终端状态">
<el-option v-for="item in teriminalstatusoption" :key="item.id" :label="item.name" <el-option
:value="item.id"></el-option> v-for="item in teriminalstatusoption"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="通讯状态"> <el-form-item label="通讯状态">
<el-select v-model="tableStore.table.params.comFlag" clearable placeholder="请选择通讯状态"> <el-select v-model="tableStore.table.params.comFlag" clearable placeholder="请选择通讯状态">
<el-option v-for="item in stateoption" :key="item.id" :label="item.name" <el-option
:value="item.id"></el-option> v-for="item in stateoption"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="筛选"> <el-form-item label="筛选">
<el-input v-model="tableStore.table.params.filterName" @keyup="searchEvent" placeholder="输入关键字筛选" /> <el-input
v-model="tableStore.table.params.filterName"
@keyup="searchEvent"
clearable
placeholder="输入关键字筛选"
/>
</el-form-item> </el-form-item>
</template> </template>
<template #operation> <template #operation>
<!-- <el-button icon="el-icon-Download" type="primary" @click="add">导出</el-button> <el-button type="primary" icon="el-icon-DataLine" @click="manage('终端状态管理', 0)">
<el-button icon="el-icon-Check" type="primary" @click="add">批量升级</el-button> --> 终端状态管理
<el-button type="primary" icon="el-icon-DataLine" @click="deviceData">终端状态管理</el-button> </el-button>
<el-button type="primary" icon="el-icon-Operation" @click="liuniangconfig">流量套餐配置</el-button> <!-- <el-button type="primary" icon="el-icon-Operation" @click="manage('流量套餐配置', 1)">
<el-button type="primary" icon="el-icon-Menu" @click="configliul">流量策略配置</el-button> 流量套餐配置
<el-button type="primary" icon="el-icon-Histogram" @click="liultjData">流量统计</el-button> </el-button> -->
<el-button type="primary" icon="el-icon-Setting" @click="resect">重启前置程序</el-button> <!-- <el-button type="primary" icon="el-icon-Menu" @click="manage('流量策略配置', 2)">
流量策略配置
</el-button>
<el-button type="primary" icon="el-icon-Histogram" @click="liultjData">流量统计</el-button> -->
<!-- <el-button type="primary" icon="el-icon-Setting" @click="resect">重启前置程序</el-button> -->
</template> </template>
</TableHeader> </TableHeader>
<div :style="`height: calc(${tableStore.table.height} + 58px)`"> <div :style="`height: calc(${tableStore.table.height} + 58px)`">
<vxe-table v-loading="tableStore.table.loading" height="auto" auto-resize ref="tableRef" <vxe-table
v-bind="defaultAttribute" :data="treeData" show-overflow v-loading="tableStore.table.loading"
:tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }" :scroll-y="{ enabled: true }" height="auto"
:checkbox-config="{ labelField: 'name' }"> auto-resize
<vxe-column field="name" align="left" type="checkbox" title="电网拓扑" min-width="200" ref="tableRef"
tree-node></vxe-column> v-bind="defaultAttribute"
:data="treeData"
show-overflow
:tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
:scroll-y="{ enabled: true }"
:checkbox-config="{ labelField: 'name' }"
>
<vxe-column
field="name"
align="left"
type="checkbox"
title="电网拓扑"
min-width="200"
tree-node
></vxe-column>
<vxe-column field="devType" title="终端型号"></vxe-column> <vxe-column field="devType" title="终端型号"></vxe-column>
<vxe-column field="version" title="版本信息"></vxe-column> <vxe-column field="version" title="版本信息"></vxe-column>
<vxe-column field="ip" title="网络参数"></vxe-column>
<vxe-column field="devType" title="终端型号"></vxe-column>
<vxe-column field="baseFlowMeal" title="基础套餐(MB)"></vxe-column> <vxe-column field="baseFlowMeal" title="基础套餐(MB)"></vxe-column>
<vxe-column field="reamFlowMeal" title="扩展套餐(MB)"></vxe-column> <vxe-column field="reamFlowMeal" title="扩展套餐(MB)"></vxe-column>
<vxe-column title="剩余流量(MB)"> <vxe-column title="剩余流量(MB)">
@@ -68,88 +110,65 @@
</vxe-column> </vxe-column>
<vxe-column field="runFlag" title="终端状态"> <vxe-column field="runFlag" title="终端状态">
<template #default="{ row }"> <template #default="{ row }">
<el-tag v-if="row.runFlag === 0" style="color: #fff; background: #0099cc" size="small"> <el-tag v-if="row.runFlag === 0" type="success" size="small">投运</el-tag>
投运 <el-tag v-if="row.runFlag === 1" type="warning" size="small">热备用</el-tag>
</el-tag> <el-tag v-if="row.runFlag === 2" type="danger" size="small">停运</el-tag>
<el-tag v-if="row.runFlag === 1" style="color: #fff; background: #996600" size="small">
热备用
</el-tag>
<el-tag v-if="row.runFlag === 2" style="color: #fff; background: #cc0000" size="small">
停运
</el-tag>
</template> </template>
</vxe-column> </vxe-column>
<vxe-column field="comFlag" title="通讯状态"> <vxe-column field="comFlag" title="通讯状态">
<template #default="{ row }"> <template #default="{ row }">
<el-tag v-if="row.comFlag === 0" style="color: #fff; background: #cc0000" size="small"> <el-tag v-if="row.comFlag === 0" type="danger" size="small">中断</el-tag>
中断 <el-tag v-if="row.comFlag === 1" type="success" size="small">正常</el-tag>
</el-tag>
<el-tag v-if="row.comFlag === 1" style="color: #fff; background: #2e8b57" size="small">
正常
</el-tag>
</template> </template>
</vxe-column> </vxe-column>
<vxe-column title="操作" min-width="100"> <!-- <vxe-column title="操作" width="160">
<template #default="{ row }"> <template #default="{ row }">
<el-button v-if="row.level === 4" type="primary" size="small" link @click="uesdealia(row)" <el-button v-if="row.level === 4" type="primary" size="small" link @click="uesdealia(row)">
icon="el-icon-view">
终端详情 终端详情
</el-button> </el-button>
<el-button v-if="row.level === 4" :disabled="row.state == 1 ? true : false" type="primary" <el-button
size="small" link icon="el-icon-view" @click="queryview(row)"> v-if="row.level === 4"
:disabled="row.state == 1 ? true : false"
type="primary"
size="small"
link
@click="queryview(row)"
>
流量详情 流量详情
</el-button> </el-button>
</template> </template>
</vxe-column> </vxe-column> -->
</vxe-table> </vxe-table>
</div> </div>
<!-- 终端使用详情 --> <!-- 终端详情 -->
<el-dialog draggable v-model="dialogVisiblexq" v-if="dialogVisiblexq" title="终端使用详情" width="70%" <detail ref="detailRef" />
:before-close="handleClose"> <!-- 配置 -->
<MyEchart :options="echartsXq" style="width: 100%; height: 300px" /> <disposition ref="dispositionRef" @onSubmit="tableStore.index()" />
<vxe-table v-bind="defaultAttribute" height="400" :data="logtableData">
<vxe-colgroup title="cup使用率">
<vxe-column field="date" title="使用率"></vxe-column>
<vxe-column field="date" title="总量"></vxe-column>
<vxe-column field="date" title="使用量"></vxe-column>
<vxe-column field="date" title="未使用量"></vxe-column>
</vxe-colgroup>
<vxe-colgroup title="内存使用率">
<vxe-column field="date" title="使用率"></vxe-column>
<vxe-column field="date" title="总量"></vxe-column>
<vxe-column field="date" title="使用量"></vxe-column>
<vxe-column field="date" title="未使用量"></vxe-column>
</vxe-colgroup>
<vxe-colgroup title="磁盘使用率">
<vxe-column field="date" title="使用率"></vxe-column>
<vxe-column field="date" title="总量"></vxe-column>
<vxe-column field="date" title="使用量"></vxe-column>
<vxe-column field="date" title="未使用量"></vxe-column>
</vxe-colgroup>
</vxe-table>
</el-dialog>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue' import { ref, onMounted, provide, nextTick, reactive } from 'vue'
import TableStore from '@/utils/tableStore' import TableStore from '@/utils/tableStore'
import { defaultAttribute } from '@/components/table/defaultAttribute' import { defaultAttribute } from '@/components/table/defaultAttribute'
import TableHeader from '@/components/table/header/index.vue' import TableHeader from '@/components/table/header/index.vue'
import { mainHeight } from '@/utils/layout' import { ElMessage } from 'element-plus'
import { getTerminalUpLog } from '@/api/device-boot/Business.ts' import { getDevTypeList } from '@/api/device-boot/modelManage'
import XEUtils from 'xe-utils' import XEUtils from 'xe-utils'
import { debounce } from 'lodash-es' import { debounce } from 'lodash-es'
import disposition from './components/disposition.vue'
import detail from './components/detail.vue'
import { useDictData } from '@/stores/dictData' import { useDictData } from '@/stores/dictData'
import MyEchart from '@/components/echarts/MyEchart.vue'
defineOptions({ defineOptions({
name: 'BusinessAdministrator/TerminalManagement/TerminalManagement' name: 'BusinessAdministrator/TerminalManagement/TerminalManagement'
}) })
const dispositionRef = ref()
const pageHeight = mainHeight(83) const detailRef = ref()
const dictData = useDictData() const dictData = useDictData()
const teriminaloption: any = dictData.getBasicData('Dev_Type')
const teriminaloption: any = ref([])
const teriminalstatusoption = ref([ const teriminalstatusoption = ref([
{ name: '全部', id: '' }, { name: '全部', id: '' },
{ name: '投运', id: 0 }, { name: '投运', id: 0 },
@@ -161,33 +180,23 @@ const stateoption = ref([
{ name: '正常', id: 1 }, { name: '正常', id: 1 },
{ name: '中断', id: 0 } { name: '中断', id: 0 }
]) ])
const dialogVisiblexq = ref(false)
const dialogVisible = ref(false)
const prodialogVisible = ref(false)
const liudialogVisible = ref(false)
const condialogVisible = ref(false)
const tjdialogVisible = ref(false)
const protitle = ref('')
const treeData: any = ref([]) const treeData: any = ref([])
const treeDataCopy: any = ref([]) const treeDataCopy: any = ref([])
const echartsXq: any = ref([])
const logtableData: any = ref([])
const tableRef = ref() const tableRef = ref()
const status = ref('')
const tableStore = new TableStore({ const tableStore = new TableStore({
url: '/device-boot/maintain/getTerminalMainList', url: '/device-boot/maintain/getTerminalMainList',
method: 'POST', method: 'POST',
column: [], column: [],
loadCallback: () => { loadCallback: () => {
treeData.value = tree2List(tableStore.table.data, Math.random() * 1000) treeData.value = tree2List(tableStore.table.data, Math.random() * 1000)
treeDataCopy.value = JSON.parse(JSON.stringify(treeData.value)) treeDataCopy.value = JSON.parse(JSON.stringify(treeData.value))
setTimeout(() => { setTimeout(() => {
tableRef.value.setAllTreeExpand(true) tableRef.value.setAllTreeExpand(true)
}, 0) }, 0)
searchEvent()
} }
}) })
tableStore.table.params.devType = '' tableStore.table.params.devType = ''
@@ -201,7 +210,7 @@ const tree2List = (list: any, id: any) => {
// 遍历 tree 数组 // 遍历 tree 数组
list.forEach((item: any) => { list.forEach((item: any) => {
item.uPid = id item.uPid = id
item.uId = (Math.random() * 1000) item.uId = Math.random() * 1000
// 判断item是否存在children // 判断item是否存在children
if (!item.children) return arr.push(item) if (!item.children) return arr.push(item)
@@ -221,15 +230,35 @@ provide('tableStore', tableStore)
tableStore.table.params.searchValue = '' tableStore.table.params.searchValue = ''
tableStore.table.params.searchState = 0 tableStore.table.params.searchState = 0
onMounted(() => { onMounted(() => {
getDevTypeList().then(res => {
teriminaloption.value = res.data
})
tableStore.index() tableStore.index()
}) })
// 终端状态管理 // 终端状态管理
const deviceData = () => { } const manage = (name: string, key: number) => {
// 流量套餐配置 const $table = tableRef.value
const liuniangconfig = () => { } if ($table) {
// 流量策略配置 const selectRecords = $table
const configliul = () => { } .getCheckboxRecords()
.filter((item: any) => item.level == 4)
.map(item => item.id)
console.log('🚀 ~ deviceData ~ selectRecords:', selectRecords)
if (selectRecords.length == 0) {
return ElMessage({
message: '请至少选择一台装置',
type: 'warning'
})
}
dispositionRef.value.open({
title: name,
id: selectRecords,
key: key
})
}
}
// 流量统计 // 流量统计
const liultjData = () => {} const liultjData = () => {}
// 重启前置程序 // 重启前置程序
@@ -237,86 +266,13 @@ const resect = () => { }
// 终端详情 // 终端详情
const uesdealia = (row: any) => { const uesdealia = (row: any) => {
echartsXq.value = { detailRef.value.open(row)
title: {
text: row.name + '性能详情'
},
legend: {
data: ['cpu使用率', '内存使用率', '磁盘使用率'],
icon: 'path://M0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z'
},
xAxis: {
type: 'time',
name: '时间'
},
yAxis: {
max: '100',
name: '%'
},
options: {
series: [
{
name: 'cpu使用率',
type: 'line',
smooth: true,
data: [
['2022-02-01 12:12:11', 10],
['2022-02-01 12:12:12', 20],
['2022-02-01 12:12:13', 30],
['2022-02-01 12:12:14', 44],
['2022-02-01 12:12:15', 50],
['2022-02-01 12:12:16', 65],
['2022-02-01 12:12:17', 76]
]
},
{
name: '内存使用率',
type: 'line',
smooth: true,
data: [
['2022-02-01 12:12:11', 13],
['2022-02-01 12:12:12', 54],
['2022-02-01 12:12:13', 34],
['2022-02-01 12:12:14', 44],
['2022-02-01 12:12:15', 35],
['2022-02-01 12:12:16', 53]
]
},
{
name: '磁盘使用率',
type: 'line',
smooth: true,
data: [
['2022-02-01 12:12:11', 13],
['2022-02-01 12:12:12', 2],
['2022-02-01 12:12:13', 2],
['2022-02-01 12:12:14', 32],
['2022-02-01 12:12:15', 43],
['2022-02-01 12:12:16', 23],
['2022-02-01 12:12:17', 23]
]
}
]
}
}
dialogVisiblexq.value = true
} }
// 流量详情 // 流量详情
const queryview = (row: any) => {} const queryview = (row: any) => {}
// 关闭
const handleClose = () => {
dialogVisible.value = false
prodialogVisible.value = false
liudialogVisible.value = false
condialogVisible.value = false
tjdialogVisible.value = false
dialogVisiblexq.value = false
// this.getList()
}
// 表格过滤 // 表格过滤
const searchEvent = debounce(e => { const searchEvent = debounce(() => {
const filterVal = XEUtils.toValueString(tableStore.table.params.filterName).trim().toLowerCase() const filterVal = XEUtils.toValueString(tableStore.table.params.filterName).trim().toLowerCase()
if (filterVal) { if (filterVal) {
const options = { children: 'children' } const options = { children: 'children' }

View File

@@ -1632,6 +1632,7 @@
defineOptions({ defineOptions({
name: 'device-boot/deviceter' name: 'device-boot/deviceter'
}) })
import { getDevTypeList } from '@/api/device-boot/modelManage'
import 'splitpanes/dist/splitpanes.css' import 'splitpanes/dist/splitpanes.css'
import { Splitpanes, Pane } from 'splitpanes' import { Splitpanes, Pane } from 'splitpanes'
import { LocationInformation } from '@element-plus/icons-vue' import { LocationInformation } from '@element-plus/icons-vue'
@@ -1685,7 +1686,7 @@ const comTypeStatusArr = dictData.getBasicData('Front_Type')
const factoryArr = dictData.getBasicData('Dev_Manufacturers') const factoryArr = dictData.getBasicData('Dev_Manufacturers')
const voltageLevelArr = dictData.getBasicData('Dev_Voltage_Stand') const voltageLevelArr = dictData.getBasicData('Dev_Voltage_Stand')
const typeArr = dictData.getBasicData('Dev_Type') const typeArr = ref(dictData.getBasicData('Dev_Type'))
const industryTypeArr = dictData.getBasicData('Business_Type') const industryTypeArr = dictData.getBasicData('Business_Type')
const loadTypeArr = dictData.getBasicData('Interference_Source') const loadTypeArr = dictData.getBasicData('Interference_Source')
const optionarr = ref([ const optionarr = ref([
@@ -2120,7 +2121,7 @@ const add = () => {
} }
deviceBODetail.value.manufacturer = factoryArr[0].id deviceBODetail.value.manufacturer = factoryArr[0].id
deviceBODetail.value.devType = typeArr[0].value deviceBODetail.value.devType = typeArr.value[0].value
deviceBODetail.value.frontType = comTypeStatusArr[0].value deviceBODetail.value.frontType = comTypeStatusArr[0].value
deviceBODetail.value.nodeId = affiliatiedFrontArr.value[0].id deviceBODetail.value.nodeId = affiliatiedFrontArr.value[0].id
busBarDetail.value.scale = voltageLevelArr[0].id busBarDetail.value.scale = voltageLevelArr[0].id
@@ -2973,9 +2974,14 @@ onMounted(() => {
size.value = Math.round((180 / dom.offsetHeight) * 100) size.value = Math.round((180 / dom.offsetHeight) * 100)
} }
if (VITE_FLAG) { if (VITE_FLAG) {
getYwZtSubstation({ orgId: '' }).then(res => { getYwZtSubstation({ orgId: '' }).then(res => {
powerStationList.value = res.data powerStationList.value = res.data
}) })
}else{
getDevTypeList().then(res => {
typeArr.value = res.data
})
} }
category() category()
}) })

View File

@@ -157,9 +157,7 @@ tableStore.table.params.statisticalType = classificationData.filter(item => item
tableStore.table.params.monitorFlag = 2 tableStore.table.params.monitorFlag = 2
tableStore.table.params.powerFlag = 2 tableStore.table.params.powerFlag = 2
tableStore.table.params.serverName = 'harmonicBoot' tableStore.table.params.serverName = 'harmonicBoot'
provide('tableStore', tableStore) provide('tableStore', tableStore)
const tree2List = (list: any, id: any) => { const tree2List = (list: any, id: any) => {
//存储结果的数组 //存储结果的数组
let arr: any = [] let arr: any = []

View File

@@ -1,27 +1,9 @@
<template> <template>
<el-dialog draggable width="600px" v-model="dialogVisible" :title="title"> <el-dialog draggable width="400px" v-model="dialogVisible" :title="title">
<el-form :inline="false" :model="form" label-width="auto" class="form-one" :rules="rules" ref="formRef"> <el-form :inline="false" :model="form" label-width="auto" class="form-one" :rules="rules" ref="formRef">
<el-form-item label="文件名称" prop="name"> <el-form-item label="icd文件">
<el-input
v-model.trim="form.name"
clearable
maxlength="32"
show-word-limit
placeholder="请输入icd文件名称"
/>
</el-form-item>
<el-form-item label="存储的地址" prop="path">
<el-input
v-model.trim="form.path"
clearable
maxlength="32"
show-word-limit
placeholder="请输入icd文件名称"
/>
</el-form-item>
<el-form-item label="文件" prop="path">
<el-upload <el-upload
v-model:file-list="form.reportPath" v-model:file-list="reportPath"
ref="uploadRef" ref="uploadRef"
action="" action=""
accept="" accept=""
@@ -46,42 +28,44 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, inject, onMounted } from 'vue' import { ref, inject, onMounted } from 'vue'
import { uploadFile } from '@/api/system-boot/file'
import { reactive } from 'vue' import { reactive } from 'vue'
import { getActionClasses, addTimer, updateTimer } from '@/api/system-boot/csDictData'
import { UploadInstance, UploadProps, UploadRawFile, ElMessage, genFileId } from 'element-plus' import { UploadInstance, UploadProps, UploadRawFile, ElMessage, genFileId } from 'element-plus'
import { addIcdPath, updateIcdPath } from '@/api/device-boot/icd'
const emit = defineEmits(['submit']) const emit = defineEmits(['submit'])
const dialogVisible = ref(false) const dialogVisible = ref(false)
const title = ref('') const title = ref('')
// 注意不要和表单ref的命名冲突 // 注意不要和表单ref的命名冲突
const form = reactive<anyObj>({ const form = reactive<anyObj>({
cron: '', fileName: '',
path: '', filePath: '',
reportPath: [] id: ''
}) })
const reportPath: any = ref([])
const formRef = ref() const formRef = ref()
const rules = { const rules = {
path: [{ required: true, message: '请选择任务执行器', trigger: 'change' }], path: [{ required: true, message: '请选择任务执行器', trigger: 'change' }],
name: [{ required: true, message: '请输入任务名称', trigger: 'blur' }] fileName: [{ required: true, message: '请输入任务名称', trigger: 'blur' }]
} }
const open = (text: string, data?: anyObj) => { const open = (text: string, data?: any) => {
reportPath.value = []
title.value = text title.value = text
dialogVisible.value = true dialogVisible.value = true
if (data) { if (data?.path) {
// 表单赋值 reportPath.value = [
for (let key in form) { {
form[key] = data[key] name: data?.path.split('/icd/')[1]
}
} else {
// 在此处恢复默认表单
for (let key in form) {
key == 'sort' ? (form[key] = 100) : (form[key] = '')
} }
]
} }
form.fileName = data?.name
form.id = data?.id
form.filePath = data?.path
} }
// 上传报告 // 上传报告
const uploadRef = ref() const uploadRef = ref()
const handleExceed: UploadProps['onExceed'] = files => { const handleExceed: UploadProps['onExceed'] = files => {
uploadRef.value!.clearFiles() uploadRef.value!.clearFiles()
const file = files[0] as UploadRawFile const file = files[0] as UploadRawFile
@@ -91,30 +75,41 @@ const handleExceed: UploadProps['onExceed'] = files => {
//移除文件上传 //移除文件上传
const removeFile = (file: any, uploadFiles: any) => { const removeFile = (file: any, uploadFiles: any) => {
console.log(file, uploadFiles) form.filePath = ''
} }
onMounted(() => {})
const submit = () => {
console.log('🚀 ~ form:', form)
formRef.value.validate(async (valid: boolean) => { const submit = async () => {
if (valid) { console.log(123, reportPath.value[0]?.raw)
if (title.value == '新增定时任务') { if (reportPath.value.length == 0) {
// addTimer(form).then(res => { return ElMessage.warning('请上传icd文件')
// ElMessage.success('新增成功')
// dialogVisible.value = false
// emit('submit')
// })
} else {
// updateTimer(form).then(res => {
// ElMessage.success('新增成功')
// dialogVisible.value = false
// emit('submit')
// })
}
} }
if (reportPath.value[0]?.raw != undefined) {
await uploadFile(reportPath.value[0].raw, '/icd/').then(res => {
//治理工程验收报告
form.fileName = res.data.fileName.split('.')[0]
form.filePath = res.data.name
}) })
} }
if (title.value == '新增icd文件') {
await addIcdPath(form).then(res => {
ElMessage.success('新增成功!')
dialogVisible.value = false
emit('submit')
})
} else {
await updateIcdPath(form).then(res => {
ElMessage.success('编辑成功!')
dialogVisible.value = false
emit('submit')
})
}
}
defineExpose({ open }) defineExpose({ open })
</script> </script>
<style lang="scss" scoped>
:deep(.el-upload-list__item) {
width: 300px;
}
</style>

View File

@@ -20,7 +20,7 @@
<Table ref="tableRef" /> <Table ref="tableRef" />
</div> </div>
<!-- 新增 --> <!-- 新增 -->
<taskForm ref="taskFormRef" @submit="tableStore.index()" /> <taskForm ref="taskFormRef" v-if="taskFormFlag" @submit="tableStore.index()" />
<!-- 补招 --> <!-- 补招 -->
<el-dialog v-model="dialogVisible" title="选择补招时间" width="500"> <el-dialog v-model="dialogVisible" title="选择补招时间" width="500">
<el-date-picker <el-date-picker
@@ -42,9 +42,10 @@ import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue' import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue' import TableHeader from '@/components/table/header/index.vue'
import taskForm from './form.vue' import taskForm from './form.vue'
import { formatDate } from '@/utils/formatTime' import { getFileNameAndFilePath } from '@/api/system-boot/file'
import { ElMessage, ElMessageBox, ElDatePicker } from 'element-plus' import { ElMessage, ElMessageBox, ElDatePicker } from 'element-plus'
import { timerRun, runTimer, deleteTimer, stop, start } from '@/api/system-boot/csDictData' import { timerRun, runTimer, deleteTimer, stop, start } from '@/api/system-boot/csDictData'
import { delIcdPath } from '@/api/device-boot/icd'
defineOptions({ defineOptions({
name: 'icd' name: 'icd'
}) })
@@ -54,15 +55,25 @@ const formDate = ref({
}) })
const taskFormRef = ref() const taskFormRef = ref()
const dialogVisible = ref(false) const dialogVisible = ref(false)
const taskFormFlag = ref(false)
const tableStore: any = new TableStore({ const tableStore: any = new TableStore({
url: '/system-boot/timer/list', url: '/device-boot/icd/pageIcdList',
method: 'POST', method: 'POST',
isWebPaging: true, isWebPaging: true,
column: [ column: [
{ field: 'timerName', title: '文件名' }, {
{ field: 'actionClass', title: '存储地址' }, title: '序号',
{ field: 'cron', title: '更新时间' }, width: '80',
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'name', title: 'icd名称' },
{ field: 'path', title: 'icd路径', minWidth: 250 },
{ field: 'createBy', title: '创建人' },
{ field: 'createTime', title: '创建时间' },
{ field: 'updateBy', title: '修改人' },
{ field: 'updateTime', title: '修改时间' },
{ {
title: '操作', title: '操作',
width: '220', width: '220',
@@ -76,7 +87,27 @@ const tableStore: any = new TableStore({
render: 'basicButton', render: 'basicButton',
click: async row => { click: async row => {
taskFormFlag.value = true
setTimeout(() => {
taskFormRef.value.open('编辑icd文件', row) taskFormRef.value.open('编辑icd文件', row)
}, 10)
}
},
{
name: 'edit',
title: '下载',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: async row => {
getFileNameAndFilePath({ filePath: row.path }).then(res => {
const link = document.createElement('a')
link.href = res.data.url
link.download = res.data.name
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
})
} }
}, },
@@ -93,7 +124,7 @@ const tableStore: any = new TableStore({
title: '确定删除?' title: '确定删除?'
}, },
click: row => { click: row => {
deleteTimer([row.id]).then(res => { delIcdPath([row.id]).then(res => {
ElMessage.success('删除成功') ElMessage.success('删除成功')
tableStore.index() tableStore.index()
}) })
@@ -103,7 +134,9 @@ const tableStore: any = new TableStore({
} }
], ],
loadCallback: () => {} loadCallback: () => {
taskFormFlag.value = false
}
}) })
tableStore.table.params.searchValue = '' tableStore.table.params.searchValue = ''
tableStore.table.params.searchState = '' tableStore.table.params.searchState = ''
@@ -111,6 +144,7 @@ tableStore.table.params.searchState = ''
provide('tableStore', tableStore) provide('tableStore', tableStore)
const add = () => { const add = () => {
taskFormFlag.value = true
setTimeout(() => { setTimeout(() => {
taskFormRef.value.open('新增icd文件') taskFormRef.value.open('新增icd文件')
}, 10) }, 10)

View File

@@ -0,0 +1,81 @@
<template>
<el-dialog draggable width="400px" v-model="dialogVisible" :title="title">
<el-form :inline="false" :model="form" label-width="auto" class="form-one" :rules="rules" ref="formRef">
<el-form-item label="型号名称" prop="name">
<el-input
v-model.trim="form.name"
clearable
maxlength="32"
show-word-limit
placeholder="请输入型号名称"
/>
</el-form-item>
<el-form-item label="关联icd" prop="icdId">
<el-select v-model="form.icdId" placeholder="选择关联icd">
<el-option v-for="item in options" filterable :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="submit">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import { ref, inject, onMounted } from 'vue'
import { reactive } from 'vue'
import { getIcdList } from '@/api/device-boot/icd'
import { addDevType, updateDevType } from '@/api/device-boot/modelManage'
import { UploadInstance, UploadProps, UploadRawFile, ElMessage, genFileId } from 'element-plus'
const emit = defineEmits(['submit'])
const dialogVisible = ref(false)
const title = ref('')
const formRef = ref()
const form = reactive<anyObj>({
name: '',
icdId: '',
id:''
})
const options: any = ref([])
const rules = {
icdId: [{ required: true, message: '请选择关联icd', trigger: 'change' }],
name: [{ required: true, message: '请输入型号名称', trigger: 'blur' }]
}
const open = (text: string, data?: anyObj) => {
getIcdList().then(res => {
options.value = res.data
})
form.icdId = data?.icdId
form.name = data?.name
form.id = data?.id
title.value = text
dialogVisible.value = true
}
onMounted(() => {})
const submit = () => {
formRef.value.validate(async (valid: boolean) => {
if (valid) {
if (title.value == '新增终端型号') {
addDevType(form).then(res => {
ElMessage.success('新增成功')
dialogVisible.value = false
emit('submit')
})
} else {
updateDevType(form).then(res => {
ElMessage.success('新增成功')
dialogVisible.value = false
emit('submit')
})
}
}
})
}
defineExpose({ open })
</script>

View File

@@ -0,0 +1,155 @@
<template>
<div class="default-main">
<div>
<TableHeader ref="TableHeaderRef">
<template #select>
<el-form-item label="终端型号名称">
<el-input
v-model="tableStore.table.params.searchValue"
maxlength="32"
show-word-limit
clearable
placeholder="请输入任务名称"
/>
</el-form-item>
</template>
<template #operation>
<el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button>
</template>
</TableHeader>
<Table ref="tableRef" />
</div>
<!-- 新增 -->
<taskForm ref="taskFormRef" v-if="taskFormFlag" @submit="tableStore.index()" />
<!-- 补招 -->
<el-dialog v-model="dialogVisible" title="选择补招时间" width="500">
<el-date-picker
v-model="formDate.date"
type="date"
value-format="YYYY-MM-DD"
placeholder="选择日期"
></el-date-picker>
<template #footer>
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="okRun">确认</el-button>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import taskForm from './form.vue'
import { delDevType } from '@/api/device-boot/modelManage'
import { getIcdList } from '@/api/device-boot/icd'
import { ElMessage, ElMessageBox, ElDatePicker } from 'element-plus'
import { timerRun, runTimer, deleteTimer, stop, start } from '@/api/system-boot/csDictData'
defineOptions({
name: 'modelManage'
})
const formDate = ref({
date: '',
id: ''
})
const options = ref([])
const taskFormFlag = ref(false)
const taskFormRef = ref()
const dialogVisible = ref(false)
const tableStore: any = new TableStore({
url: '/device-boot/devType/pageDevTypeList',
method: 'POST',
isWebPaging: true,
column: [
{
title: '序号',
width: '80',
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'name', title: '型号名称' },
{
field: 'icdId',
title: '关联icd',
formatter: (row: any) => {
return options.value.find((item: any) => item.id === row.cellValue)?.name
}
},
{ field: 'createBy', title: '创建人' },
{ field: 'createTime', title: '创建时间' },
{ field: 'updateBy', title: '修改人' },
{ field: 'updateTime', title: '修改时间' },
{
title: '操作',
width: '220',
render: 'buttons',
buttons: [
{
name: 'edit',
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: async row => {
taskFormFlag.value = true
setTimeout(() => {
taskFormRef.value.open('编辑终端型号', row)
}, 10)
}
},
{
name: 'del',
text: '删除',
type: 'danger',
icon: 'el-icon-Delete',
render: 'confirmButton',
popconfirm: {
confirmButtonText: '确认',
cancelButtonText: '取消',
confirmButtonType: 'danger',
title: '确定删除?'
},
click: row => {
delDevType([row.id]).then(res => {
ElMessage.success('删除成功')
tableStore.index()
})
}
}
]
}
],
loadCallback: () => {
taskFormFlag.value = true
}
})
tableStore.table.params.searchValue = ''
tableStore.table.params.searchState = ''
provide('tableStore', tableStore)
const add = () => {
taskFormFlag.value = true
setTimeout(() => {
taskFormRef.value.open('新增终端型号')
}, 10)
}
const okRun = () => {
runTimer(formDate.value).then(res => {
ElMessage.success('操作成功')
dialogVisible.value = false
tableStore.index()
})
}
onMounted(() => {
getIcdList().then(res => {
options.value = res.data
})
tableStore.index()
})
</script>