修改现场反馈问题

This commit is contained in:
GGJ
2024-10-10 10:46:10 +08:00
parent 0877ae5df0
commit facd4f55c5
12 changed files with 198 additions and 313 deletions

View File

@@ -7,9 +7,9 @@ import { isNumber } from '@/utils/is'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import { useLocaleStore } from '@/stores/modules/locale' import { useLocaleStore } from '@/stores/modules/locale'
import { getAccessToken, getTenantId } from '@/utils/auth' import { getAccessToken, getTenantId } from '@/utils/auth'
import { useAdminInfo } from '@/stores/adminInfo'
defineOptions({ name: 'Editor' }) defineOptions({ name: 'Editor' })
const adminInfo = useAdminInfo()
type InsertFnType = (url: string, alt: string, href: string) => void type InsertFnType = (url: string, alt: string, href: string) => void
const localeStore = useLocaleStore() const localeStore = useLocaleStore()
@@ -104,8 +104,7 @@ const editorConfig = computed((): IEditorConfig => {
// 自定义增加 http header // 自定义增加 http header
headers: { headers: {
Accept: '*', Accept: '*',
Authorization: 'Bearer ' + getAccessToken(), Authorization: adminInfo.getToken(),
'tenant-id': getTenantId()
}, },
// 跨域是否传递 cookie ,默认为 false // 跨域是否传递 cookie ,默认为 false

View File

@@ -141,6 +141,7 @@ const handlerYAxis = () => {
nameTextStyle: { nameTextStyle: {
color: '#000' color: '#000'
}, },
splitNumber: 5,
minInterval: 1, minInterval: 1,
axisLine: { axisLine: {
show: true, show: true,

View File

@@ -1,5 +1,5 @@
<template> <template>
<div style="width: 600px"> <div style="width: 540px">
<el-select v-model="interval" style="min-width: 90px; width: 90px; margin-right: 10px" @change="timeChange"> <el-select v-model="interval" style="min-width: 90px; width: 90px; margin-right: 10px" @change="timeChange">
<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" /> <el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select> </el-select>
@@ -396,9 +396,13 @@ const next = () => {
} else { } else {
endTime = presentY + '-0' + presentM + '-' + presentD endTime = presentY + '-0' + presentM + '-' + presentD
} }
} else {
if (presentD < 10) {
endTime = presentY + '-' + presentM + '-0' + presentD
} else { } else {
endTime = presentY + '-' + presentM + '-' + presentD endTime = presentY + '-' + presentM + '-' + presentD
} }
}
} else { } else {
startTime = year + '-01-01' startTime = year + '-01-01'
endTime = year + '-12-31' endTime = year + '-12-31'

View File

@@ -28,7 +28,7 @@
<!-- tag --> <!-- tag -->
<div v-if="field.render == 'tag' && fieldValue !== ''"> <div v-if="field.render == 'tag' && fieldValue !== ''">
<el-tag :type="getTagType(fieldValue, field.custom) || 'primary'" :effect="field.effect || ''" size="small"> <el-tag :type="getTagType(fieldValue, field.custom) || 'primary'" size="small">
{{ field.replaceValue ? field.replaceValue[fieldValue] : fieldValue }} {{ field.replaceValue ? field.replaceValue[fieldValue] : fieldValue }}
</el-tag> </el-tag>
</div> </div>

View File

@@ -1,28 +1,20 @@
<template> <template>
<div style="border: 1px solid #e4e4e4; height: 100%"> <div style="border: 1px solid #e4e4e4; height: 100%">
<Toolbar <Toolbar style="border-bottom: 1px solid #e4e4e4; border-top: 1px solid #e4e4e4" :editor="editorRef"
style="border-bottom: 1px solid #e4e4e4; border-top: 1px solid #e4e4e4" :defaultConfig="toolbarConfig" mode="default" />
:editor="editorRef" <Editor v-bind="$attrs" :defaultConfig="editorConfig" mode="default" @onCreated="handleCreated"
:defaultConfig="toolbarConfig" style="height: calc(100% - 42px)" />
mode="default"
/>
<Editor
v-bind="$attrs"
:defaultConfig="editorConfig"
mode="default"
@onCreated="handleCreated"
style="height: calc(100% - 42px)"
/>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import '@wangeditor/editor/dist/css/style.css' // 引入 css import '@wangeditor/editor/dist/css/style.css' // 引入 css
import { getAccessToken, getTenantId } from '@/utils/auth'
import { onBeforeUnmount, ref, shallowRef, onMounted } from 'vue' import { onBeforeUnmount, ref, shallowRef, onMounted } from 'vue'
import { Editor, Toolbar } from '@wangeditor/editor-for-vue' import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
import { useAdminInfo } from '@/stores/adminInfo'
// 编辑器实例,必须用 shallowRef // 编辑器实例,必须用 shallowRef
const editorRef = shallowRef() const editorRef = shallowRef()
const adminInfo = useAdminInfo()
// 内容 HTML // 内容 HTML
const valueHtml = ref('<p>hello</p>') const valueHtml = ref('<p>hello</p>')
@@ -51,7 +43,12 @@ const editorConfig = {
compress: true, compress: true,
uploadFileName: 'file', uploadFileName: 'file',
withCredentials: true, withCredentials: true,
headers: {},
headers: {
Accept: '*',
Authorization: adminInfo.getToken(),
},
meta: { path: '/supervision/' }, meta: { path: '/supervision/' },
timeout: 0, timeout: 0,
customInsert(res: any, insertFn: InsertFnType) { customInsert(res: any, insertFn: InsertFnType) {

View File

@@ -64,7 +64,7 @@
v-bind="defaultAttribute" v-bind="defaultAttribute"
:data="treeData" :data="treeData"
show-overflow show-overflow
:tree-config="{ transform: true, parentField: 'pid' }" :tree-config="{ transform: true, parentField: 'uPid',rowField:'uId' }"
:scroll-y="{ enabled: true }" :scroll-y="{ enabled: true }"
> >
<vxe-column field="name" align="left" title="电网拓扑" min-width="200" tree-node></vxe-column> <vxe-column field="name" align="left" title="电网拓扑" min-width="200" tree-node></vxe-column>
@@ -237,12 +237,12 @@ const tableStore = new TableStore({
method: 'POST', method: 'POST',
column: [], column: [],
loadCallback: () => { loadCallback: () => {
tableStore.table.data.forEach((item: any) => { // tableStore.table.data.forEach((item: any) => {
if (item.children.length > 0) { // if (item.children.length > 0) {
item.id = item.children[0].pid // item.id = item.children[0].pid
} // }
}) // })
treeData.value = tree2List(tableStore.table.data) 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)
@@ -255,15 +255,21 @@ tableStore.table.params.program = ''
tableStore.table.params.searchEvent = '' tableStore.table.params.searchEvent = ''
tableStore.table.params.filterName = '' tableStore.table.params.filterName = ''
provide('tableStore', tableStore) provide('tableStore', tableStore)
const tree2List = (list: 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.uId = (Math.random() * 1000)
// 判断item是否存在children // 判断item是否存在children
if (!item.children) return arr.push(item) if (!item.children) return arr.push(item)
// 函数递归对children数组进行tree2List的转换 // 函数递归对children数组进行tree2List的转换
const children = tree2List(item.children) const children = tree2List(item.children, item.uId)
// 删除item的children属性 // 删除item的children属性
delete item.children delete item.children
// 把item和children数组添加至结果数组 // 把item和children数组添加至结果数组
@@ -274,6 +280,7 @@ const tree2List = (list: 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(() => {

View File

@@ -4,41 +4,25 @@
<template #select> <template #select>
<el-form-item label="终端型号"> <el-form-item label="终端型号">
<el-select v-model="tableStore.table.params.devType" clearable placeholder="请选择终端型号"> <el-select v-model="tableStore.table.params.devType" clearable placeholder="请选择终端型号">
<el-option <el-option v-for="item in teriminaloption" :key="item.id" :label="item.name"
v-for="item in teriminaloption" :value="item.id"></el-option>
: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 <el-option v-for="item in teriminalstatusoption" :key="item.id" :label="item.name"
v-for="item in teriminalstatusoption" :value="item.id"></el-option>
: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 <el-option v-for="item in stateoption" :key="item.id" :label="item.name"
v-for="item in stateoption" :value="item.id"></el-option>
: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 <el-input v-model="tableStore.table.params.filterName" @keyup="searchEvent" placeholder="输入关键字筛选" />
v-model="tableStore.table.params.filterName"
@keyup="searchEvent"
placeholder="输入关键字筛选"
/>
</el-form-item> </el-form-item>
</template> </template>
<template #operation> <template #operation>
@@ -52,26 +36,12 @@
</template> </template>
</TableHeader> </TableHeader>
<div :style="`height: calc(${tableStore.table.height} + 58px)`"> <div :style="`height: calc(${tableStore.table.height} + 58px)`">
<vxe-table <vxe-table v-loading="tableStore.table.loading" height="auto" auto-resize ref="tableRef"
v-loading="tableStore.table.loading" v-bind="defaultAttribute" :data="treeData" show-overflow
height="auto" :tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }" :scroll-y="{ enabled: true }"
auto-resize :checkbox-config="{ labelField: 'name' }">
ref="tableRef" <vxe-column field="name" align="left" type="checkbox" title="电网拓扑" min-width="200"
v-bind="defaultAttribute" tree-node></vxe-column>
:data="treeData"
show-overflow
:tree-config="{ transform: true, parentField: 'pid' }"
: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="baseFlowMeal" title="基础套餐(MB)"></vxe-column> <vxe-column field="baseFlowMeal" title="基础套餐(MB)"></vxe-column>
@@ -122,25 +92,12 @@
<vxe-column title="操作" min-width="100"> <vxe-column title="操作" min-width="100">
<template #default="{ row }"> <template #default="{ row }">
<el-button <el-button v-if="row.level === 4" type="primary" size="small" link @click="uesdealia(row)"
v-if="row.level === 4" icon="el-icon-view">
type="primary"
size="small"
link
@click="uesdealia(row)"
icon="el-icon-view"
>
终端详情 终端详情
</el-button> </el-button>
<el-button <el-button v-if="row.level === 4" :disabled="row.state == 1 ? true : false" type="primary"
v-if="row.level === 4" size="small" link icon="el-icon-view" @click="queryview(row)">
:disabled="row.state == 1 ? true : false"
type="primary"
size="small"
link
icon="el-icon-view"
@click="queryview(row)"
>
流量详情 流量详情
</el-button> </el-button>
</template> </template>
@@ -148,14 +105,8 @@
</vxe-table> </vxe-table>
</div> </div>
<!-- 终端使用详情 --> <!-- 终端使用详情 -->
<el-dialog <el-dialog draggable v-model="dialogVisiblexq" v-if="dialogVisiblexq" title="终端使用详情" width="70%"
draggable :before-close="handleClose">
v-model="dialogVisiblexq"
v-if="dialogVisiblexq"
title="终端使用详情"
width="70%"
:before-close="handleClose"
>
<MyEchart :options="echartsXq" style="width: 100%; height: 300px" /> <MyEchart :options="echartsXq" style="width: 100%; height: 300px" />
<vxe-table v-bind="defaultAttribute" height="400" :data="logtableData"> <vxe-table v-bind="defaultAttribute" height="400" :data="logtableData">
<vxe-colgroup title="cup使用率"> <vxe-colgroup title="cup使用率">
@@ -231,12 +182,8 @@ const tableStore = new TableStore({
method: 'POST', method: 'POST',
column: [], column: [],
loadCallback: () => { loadCallback: () => {
tableStore.table.data.forEach((item: any) => {
if (item.children.length > 0) { treeData.value = tree2List(tableStore.table.data, Math.random() * 1000)
item.id = item.children[0].pid
}
})
treeData.value = tree2List(tableStore.table.data)
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)
@@ -248,15 +195,18 @@ tableStore.table.params.runFlag = ''
tableStore.table.params.comFlag = '' tableStore.table.params.comFlag = ''
tableStore.table.params.filterName = '' tableStore.table.params.filterName = ''
// 处理大数据卡顿 // 处理大数据卡顿
const tree2List = (list: 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.uId = (Math.random() * 1000)
// 判断item是否存在children // 判断item是否存在children
if (!item.children) return arr.push(item) if (!item.children) return arr.push(item)
// 函数递归对children数组进行tree2List的转换 // 函数递归对children数组进行tree2List的转换
const children = tree2List(item.children) const children = tree2List(item.children, item.uId)
// 删除item的children属性 // 删除item的children属性
delete item.children delete item.children
// 把item和children数组添加至结果数组 // 把item和children数组添加至结果数组

View File

@@ -1,60 +1,38 @@
<template> <template>
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title" width="700px"> <el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title" width="1200px">
<el-scrollbar>
<el-form :inline="false" :model="form" label-width="auto" :rules="rules" ref="formRef"> <el-form :model="form" label-width="120px" class="form-two" :rules="rules" ref="formRef">
<el-form-item <el-form-item :label="title == '修改算法' ? '选择修改的数据' : '选择父级'" :prop="title == '修改算法' ? 'pid' : ''">
:label="title == '修改算法' ? '选择修改的数据' : '选择父级'" <el-tree-select v-model="form.pid" :data="dataTree" check-strictly clearable filterable
:prop="title == '修改算法' ? 'pid' : ''" @node-click="changeTree" default-expand-all :render-after-expand="false" :props="defaultProps"
> @clear="TreeList = {}" />
<el-tree-select
v-model="form.pid"
:data="dataTree"
check-strictly
clearable
filterable
@node-click="changeTree"
default-expand-all
:render-after-expand="false"
:props="defaultProps"
@clear="TreeList = {}"
/>
</el-form-item> </el-form-item>
<el-form-item <el-form-item label="名称" prop="name" v-if="title == '修改算法' ? TreeList.level != 4 : TreeList.level != 3">
label="名称"
prop="name"
v-if="title == '修改算法' ? TreeList.level != 4 : TreeList.level != 3"
>
<el-input v-model="form.name" placeholder="名称" clearable /> <el-input v-model="form.name" placeholder="名称" clearable />
</el-form-item> </el-form-item>
<div v-if="title == '修改算法' ? TreeList.level == 4 : TreeList.level == 3"> <!-- <div v-if="title == '修改算法' ? TreeList.level == 4 : TreeList.level == 3"> -->
<el-form-item label="算法名称" prop="name"> <el-form-item label="算法名称" prop="name" v-if="title == '修改算法' ? TreeList.level == 4 : TreeList.level == 3">
<el-input v-model="form.name" placeholder="请输入算法名称" clearable /> <el-input v-model="form.name" placeholder="请输入算法名称" clearable />
</el-form-item> </el-form-item>
<el-form-item label="计算周期" prop="period"> <el-form-item label="计算周期" prop="period" v-if="title == '修改算法' ? TreeList.level == 4 : TreeList.level == 3">
<el-select v-model="form.period" placeholder="请选择计算周期" clearable> <el-select v-model="form.period" placeholder="请选择计算周期" clearable>
<el-option <el-option v-for="item in cycle" :key="item.value" :label="item.label" :value="item.value" />
v-for="item in cycle"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="数据来源" prop="source"> <el-form-item label="数据来源" prop="source" v-if="title == '修改算法' ? TreeList.level == 4 : TreeList.level == 3">
<el-input v-model="form.source" placeholder="请输入数据来源" clearable /> <el-input v-model="form.source" placeholder="请输入数据来源" clearable />
</el-form-item> </el-form-item>
<el-form-item label="定义" prop="definition"> <!-- <el-form-item label="定义" prop="definition" style="width: 100%;" v-if="title == '修改算法' ? TreeList.level == 4 : TreeList.level == 3">
<el-input
v-model="form.definition" <editor v-model="form.definition" />
:rows="2" </el-form-item> -->
type="textarea" <!-- </div> -->
placeholder="请输入定义"
clearable
/>
</el-form-item>
</div>
</el-form> </el-form>
</el-scrollbar> <div style="display: flex" v-if="title == '修改算法' ? TreeList.level == 4 : TreeList.level == 3">
<div style="width: 120px;margin-right: 12px;text-align: end;">定义</div>
<editor v-model="form.definition" />
</div>
<template #footer> <template #footer>
<span class="dialog-footer"> <span class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button> <el-button @click="dialogVisible = false">取消</el-button>
@@ -68,7 +46,7 @@ import { ref, inject } from 'vue'
import { reactive } from 'vue' import { reactive } from 'vue'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import { queryAllAlgorithmLibrary, addAlgorithm, updateAlgorithmLibrary } from '@/api/supervision-boot/database/index' import { queryAllAlgorithmLibrary, addAlgorithm, updateAlgorithmLibrary } from '@/api/supervision-boot/database/index'
import editor from '@/components/wangEditor/index.vue'
const emit = defineEmits(['getTree']) const emit = defineEmits(['getTree'])
const dialogVisible = ref(false) const dialogVisible = ref(false)
const title = ref('') const title = ref('')

View File

@@ -28,7 +28,7 @@
<vxe-table height="auto" v-bind="defaultAttribute" :data="dotList?.childrens[radio]?.children"> <vxe-table height="auto" v-bind="defaultAttribute" :data="dotList?.childrens[radio]?.children">
<vxe-column field="name" title="算法名称"></vxe-column> <vxe-column field="name" title="算法名称"></vxe-column>
<vxe-column field="createTime" title="创建时间"></vxe-column> <vxe-column field="createTime" title="创建时间"></vxe-column>
<vxe-column field="definition" title="定义"></vxe-column>
<vxe-column field="period" title="计算周期"> <vxe-column field="period" title="计算周期">
<template #default="{ row }"> <template #default="{ row }">
{{ {{
@@ -53,6 +53,13 @@
</el-tag> </el-tag>
</template> </template>
</vxe-column> </vxe-column>
<vxe-column field="definition" title="定义">
<template #default="{ row }">
<el-button type="primary" link @click="view(row)">查看</el-button>
</template>
</vxe-column>
<!-- <vxe-column title="操作" width="150px"> <!-- <vxe-column title="操作" width="150px">
<template #default="{ row }"> <template #default="{ row }">
<el-button type="primary" link @click="edit(row)">修改</el-button> <el-button type="primary" link @click="edit(row)">修改</el-button>
@@ -73,6 +80,10 @@
<!-- 弹框 --> <!-- 弹框 -->
<PopupEdit ref="popupEditRef" v-if="popupEditFlag" <PopupEdit ref="popupEditRef" v-if="popupEditFlag"
@getTree="treeRef.loadData(dotList.id), (popupEditFlag = false)" /> @getTree="treeRef.loadData(dotList.id), (popupEditFlag = false)" />
<!-- 定义 -->
<el-dialog v-model="viewFlag" title="定义" width="60%">
<div v-html="summary" style="min-height: 300px;" />
</el-dialog>
<!-- 删除 --> <!-- 删除 -->
<el-dialog v-model="dialogVisible" title="请选择需要删除的数据" width="400"> <el-dialog v-model="dialogVisible" title="请选择需要删除的数据" width="400">
<el-tree-select v-model="TreeValue" :data="TreeData" filterable check-strictly :props="defaultProps" <el-tree-select v-model="TreeValue" :data="TreeData" filterable check-strictly :props="defaultProps"
@@ -111,8 +122,10 @@ const heightTab = mainHeight(82)
const size = ref(0) const size = ref(0)
const addTreeRef = ref() const addTreeRef = ref()
const dialogVisible = ref(false) const dialogVisible = ref(false)
const viewFlag = ref(false)
const popupEditFlag = ref(false) const popupEditFlag = ref(false)
const treeRef = ref() const treeRef = ref()
const summary = ref('')
const popupEditRef = ref() const popupEditRef = ref()
const TreeData = ref([]) const TreeData = ref([])
const TreeValue = ref([]) const TreeValue = ref([])
@@ -193,6 +206,10 @@ onMounted(() => {
// tableStore.index() // tableStore.index()
}) })
const view = (row: any) => {
viewFlag.value = true
summary.value = row.definition
}
const handleNodeClick = (data: any, node: any) => { const handleNodeClick = (data: any, node: any) => {
if (data.pid != '0') { if (data.pid != '0') {
dotList.value = data dotList.value = data

View File

@@ -20,7 +20,7 @@
<PopupEdit ref="popupEditRef" @onSubmit="tableStore.index()" /> <PopupEdit ref="popupEditRef" @onSubmit="tableStore.index()" />
<!-- 简介详情 --> <!-- 简介详情 -->
<el-dialog v-model="dialogVisible" title="事件简介" width="60%"> <el-dialog v-model="dialogVisible" title="事件简介" width="60%">
<span v-html="summary"></span> <div v-html="summary"></div>
</el-dialog> </el-dialog>
<!-- 抽屉 --> <!-- 抽屉 -->
<drawer ref="drawerRef" /> <drawer ref="drawerRef" />

View File

@@ -2,69 +2,31 @@
<TableHeader area datePicker ref="TableHeaderRef"> <TableHeader area datePicker ref="TableHeaderRef">
<template #select> <template #select>
<el-form-item label="统计类型:"> <el-form-item label="统计类型:">
<el-select <el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型">
v-model="tableStore.table.params.statisticalType" <el-option v-for="item in classificationData" :key="item.id" :label="item.name"
value-key="id" :value="item"></el-option>
placeholder="请选择统计类型"
>
<el-option
v-for="item in classificationData"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="电压等级:"> <el-form-item label="电压等级:">
<el-select <el-select v-model="tableStore.table.params.scale" multiple collapse-tags clearable value-key="id"
v-model="tableStore.table.params.scale" placeholder="请选择电压等级">
multiple <el-option v-for="item in voltageleveloption" :key="item.id" :label="item.name"
collapse-tags :value="item"></el-option>
clearable
value-key="id"
placeholder="请选择电压等级"
>
<el-option
v-for="item in voltageleveloption"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="终端厂家:"> <el-form-item label="终端厂家:">
<el-select <el-select v-model="tableStore.table.params.manufacturer" multiple collapse-tags clearable
v-model="tableStore.table.params.manufacturer" value-key="id" placeholder="请选择终端厂家">
multiple <el-option v-for="item in terminaloption" :key="item.id" :label="item.name"
collapse-tags :value="item"></el-option>
clearable
value-key="id"
placeholder="请选择终端厂家"
>
<el-option
v-for="item in terminaloption"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="干扰源类型:"> <el-form-item label="干扰源类型:">
<el-select <el-select v-model="tableStore.table.params.loadType" multiple collapse-tags clearable value-key="id"
v-model="tableStore.table.params.loadType" placeholder="请选择干扰源类型">
multiple <el-option v-for="item in interfereoption" :key="item.id" :label="item.name"
collapse-tags :value="item"></el-option>
clearable
value-key="id"
placeholder="请选择干扰源类型"
>
<el-option
v-for="item in interfereoption"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</template> </template>
@@ -73,16 +35,11 @@
<el-button icon="el-icon-Download" @click="exportEvent" type="primary">下载报告</el-button> <el-button icon="el-icon-Download" @click="exportEvent" type="primary">下载报告</el-button>
</template> </template>
</TableHeader> </TableHeader>
<Table <Table ref="tableRef" :radio-config="{
ref="tableRef"
:radio-config="{
labelField: 'name', labelField: 'name',
highlight: true, highlight: true,
visibleMethod: row => row.row.level == 6 visibleMethod: row => row.row.level == 6
}" }" :tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }" :scroll-y="{ enabled: true }" />
:tree-config="{ transform: true, parentField: 'pid' }"
:scroll-y="{ enabled: true }"
/>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue' import { ref, onMounted, provide, nextTick } from 'vue'
@@ -182,15 +139,15 @@ const tableStore = new TableStore({
}, },
loadCallback: () => { loadCallback: () => {
let treeData = [] let treeData = []
tableStore.table.data.forEach((item: any) => { // tableStore.table.data.forEach((item: any) => {
if (item.children.length > 0) { // if (item.children.length > 0) {
item.children.forEach((k: any) => { // item.children.forEach((k: any) => {
k.pid = item.id // k.pid = item.id
}) // })
} // }
}) // })
treeData = tree2List(tableStore.table.data) treeData = tree2List(tableStore.table.data, Math.random() * 1000)
tableStore.table.data = JSON.parse(JSON.stringify(treeData)) tableStore.table.data = JSON.parse(JSON.stringify(treeData))
setTimeout(() => { setTimeout(() => {
@@ -205,19 +162,19 @@ 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, pid?: string) => { 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.uId = (Math.random() * 1000)
item.comFlag = item.comFlag == null ? 3 : item.comFlag item.comFlag = item.comFlag == null ? 3 : item.comFlag
item.assess = item.integrityData == 3.14159 ? 0 : item.integrityData < 60 ? 1 : item.integrityData < 90 ? 2 : 3 item.assess = item.integrityData == 3.14159 ? 0 : item.integrityData < 60 ? 1 : item.integrityData < 90 ? 2 : 3
item.pid = pid
// 判断item是否存在children // 判断item是否存在children
if (!item.children) return arr.push(item) if (!item.children) return arr.push(item)
// 函数递归对children数组进行tree2List的转换 // 函数递归对children数组进行tree2List的转换
const children = tree2List(item.children, item.id) const children = tree2List(item.children, item.uId)
// 删除item的children属性 // 删除item的children属性
delete item.children delete item.children
// 把item和children数组添加至结果数组 // 把item和children数组添加至结果数组

View File

@@ -2,74 +2,36 @@
<TableHeader area datePicker ref="TableHeaderRef"> <TableHeader area datePicker ref="TableHeaderRef">
<template #select> <template #select>
<el-form-item label="统计类型:"> <el-form-item label="统计类型:">
<el-select <el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型">
v-model="tableStore.table.params.statisticalType" <el-option v-for="item in classificationData" :key="item.id" :label="item.name"
value-key="id" :value="item"></el-option>
placeholder="请选择统计类型"
>
<el-option
v-for="item in classificationData"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="电压等级:"> <el-form-item label="电压等级:">
<el-select <el-select v-model="tableStore.table.params.scale" multiple collapse-tags clearable value-key="id"
v-model="tableStore.table.params.scale" placeholder="请选择电压等级">
multiple <el-option v-for="item in voltageleveloption" :key="item.id" :label="item.name"
collapse-tags :value="item"></el-option>
clearable
value-key="id"
placeholder="请选择电压等级"
>
<el-option
v-for="item in voltageleveloption"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="终端厂家:"> <el-form-item label="终端厂家:">
<el-select <el-select v-model="tableStore.table.params.manufacturer" multiple collapse-tags clearable
v-model="tableStore.table.params.manufacturer" value-key="id" placeholder="请选择终端厂家">
multiple <el-option v-for="item in terminaloption" :key="item.id" :label="item.name"
collapse-tags :value="item"></el-option>
clearable
value-key="id"
placeholder="请选择终端厂家"
>
<el-option
v-for="item in terminaloption"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="干扰源类型:"> <el-form-item label="干扰源类型:">
<el-select <el-select v-model="tableStore.table.params.loadType" multiple collapse-tags clearable value-key="id"
v-model="tableStore.table.params.loadType" placeholder="请选择干扰源类型">
multiple <el-option v-for="item in interfereoption" :key="item.id" :label="item.name"
collapse-tags :value="item"></el-option>
clearable
value-key="id"
placeholder="请选择干扰源类型"
>
<el-option
v-for="item in interfereoption"
:key="item.id"
:label="item.name"
:value="item"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</template> </template>
</TableHeader> </TableHeader>
<Table ref="tableRef" :tree-config="{ transform: true, parentField: 'pid' }" :scroll-y="{ enabled: true }" /> <Table ref="tableRef" :tree-config="{ transform: true, parentField: 'uPid',rowField:'uId' }" :scroll-y="{ enabled: true }" />
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue' import { ref, onMounted, provide, nextTick } from 'vue'
@@ -169,14 +131,24 @@ const tableStore = new TableStore({
}, },
loadCallback: () => { loadCallback: () => {
let treeData = [] let treeData = []
tableStore.table.data.forEach((item: any) => { // tableStore.table.data.forEach((item: any, index: number) => {
if (item.children.length > 0) { // item.id = Math.floor(Math.random() * 1000)
item.children.forEach((k: any) => { // item.pid = index
k.pid = item.id // if (item.children.length > 0) {
}) // item.children.forEach((k: any) => {
} // k.id = Math.floor(Math.random() * 1000)
}) // k.pid = item.id
treeData = tree2List(tableStore.table.data) // // if (k.children.length > 0) {
// // k.children.forEach((v: any) => {
// // v.id = Math.floor(Math.random() * 1000)
// // v.pid = k.id
// // })
// // }
// })
// }
// })
treeData = tree2List(tableStore.table.data, Math.random() * 1000)
tableStore.table.data = JSON.parse(JSON.stringify(treeData)) tableStore.table.data = JSON.parse(JSON.stringify(treeData))
setTimeout(() => { setTimeout(() => {
@@ -191,17 +163,20 @@ 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) => {
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.uId = (Math.random() * 1000)
item.comFlag = item.comFlag == null ? 3 : item.comFlag item.comFlag = item.comFlag == null ? 3 : item.comFlag
item.assess = item.onlineRate == 3.14159 ? 0 : item.onlineRate < 60 ? 1 : item.onlineRate < 90 ? 2 : 3 item.assess = item.onlineRate == 3.14159 ? 0 : item.onlineRate < 60 ? 1 : item.onlineRate < 90 ? 2 : 3
// 判断item是否存在children // 判断item是否存在children
if (!item.children) return arr.push(item) if (!item.children) return arr.push(item)
// 函数递归对children数组进行tree2List的转换 // 函数递归对children数组进行tree2List的转换
const children = tree2List(item.children) const children = tree2List(item.children, item.uId)
// 删除item的children属性 // 删除item的children属性
delete item.children delete item.children
// 把item和children数组添加至结果数组 // 把item和children数组添加至结果数组