监测点台账信息
This commit is contained in:
@@ -13,6 +13,7 @@ export default defineComponent({
|
||||
},
|
||||
setup(props, { slots }) {
|
||||
const attr = reactive(props.attr)
|
||||
attr['align'] = attr['align'] ? attr['align'] : 'center'
|
||||
attr['column-key'] = attr['column-key'] ? attr['column-key'] : attr.prop || uuid()
|
||||
return () => {
|
||||
return createVNode(Column, attr, slots.default)
|
||||
|
||||
@@ -31,7 +31,7 @@
|
||||
|
||||
<!-- datetime -->
|
||||
<div v-if="field.render == 'datetime'">
|
||||
{{ !fieldValue ? '-' : timeFormat(fieldValue, field.timeFormat ?? undefined) }}
|
||||
{{ !fieldValue ? '/' : timeFormat(fieldValue, field.timeFormat ?? undefined) }}
|
||||
</div>
|
||||
|
||||
<!-- color -->
|
||||
|
||||
@@ -1,62 +1,88 @@
|
||||
<template>
|
||||
<vxe-table
|
||||
ref="tableRef"
|
||||
class="ba-data-table w100"
|
||||
header-cell-class-name="table-header-cell"
|
||||
:data="tableStore.table.data"
|
||||
:border="true"
|
||||
v-loading="tableStore.table.loading"
|
||||
ref='tableRef'
|
||||
class='ba-data-table w100'
|
||||
header-cell-class-name='table-header-cell'
|
||||
:data='tableStore.table.data'
|
||||
:border='true'
|
||||
v-loading='tableStore.table.loading'
|
||||
stripe
|
||||
size="small"
|
||||
@checkbox-change="onSelectionChange"
|
||||
v-bind="$attrs"
|
||||
:column-config="{resizable: true}"
|
||||
:tree-config="{}"
|
||||
:row-config="{isCurrent: true, isHover: true}"
|
||||
size='small'
|
||||
@checkbox-change='onSelectionChange'
|
||||
v-bind='$attrs'
|
||||
:column-config='{resizable: true}'
|
||||
:tree-config='{}'
|
||||
:row-config='{isCurrent: true, isHover: true}'
|
||||
>
|
||||
<!-- Column 组件内部是 el-table-column -->
|
||||
<template v-if='isGroup'>
|
||||
<vxe-table-colgroup
|
||||
v-if='isGroup'
|
||||
v-for='(item, index) in tableStore.table.column'
|
||||
:field='item.field'
|
||||
:title='item.title'
|
||||
:key='index'
|
||||
:min-width='item.width'
|
||||
show-overflow
|
||||
align='center'
|
||||
>
|
||||
<Column
|
||||
:attr="item"
|
||||
:attr='child'
|
||||
:key="key + '-column'"
|
||||
v-for="(item, key) in tableStore.table.column"
|
||||
:tree-node='item.treeNode'
|
||||
v-for='(child, key) in item.children'
|
||||
:tree-node='child.treeNode'
|
||||
>
|
||||
<!-- tableStore 预设的列 render 方案 -->
|
||||
<template v-if="item.render" #default="scope">
|
||||
<template v-if='child.render' #default='scope'>
|
||||
<FieldRender
|
||||
:field="item"
|
||||
:row="scope.row"
|
||||
:column="scope.column"
|
||||
:index="scope.rowIndex"
|
||||
:key="
|
||||
key +
|
||||
'-' +
|
||||
scope.rowIndex +
|
||||
'-' +
|
||||
item.render +
|
||||
'-' +
|
||||
(item.field ? '-' + item.field + '-' + scope.row[item.field] : '')
|
||||
"
|
||||
:field='child'
|
||||
:row='scope.row'
|
||||
:column='scope.column'
|
||||
:index='scope.rowIndex'
|
||||
:key='child.field+scope.rowIndex'
|
||||
/>
|
||||
</template>
|
||||
</Column>
|
||||
</vxe-table>
|
||||
<div v-if="props.pagination" class="table-pagination">
|
||||
<el-pagination
|
||||
:currentPage="tableStore.table.params!.pageNum"
|
||||
:page-size="tableStore.table.params!.pageSize"
|
||||
:page-sizes="pageSizes"
|
||||
background
|
||||
:layout="config.layout.shrink ? 'prev, next, jumper' : 'sizes,total, ->, prev, pager, next, jumper'"
|
||||
:total="tableStore.table.total"
|
||||
@size-change="onTableSizeChange"
|
||||
@current-change="onTableCurrentChange"
|
||||
></el-pagination>
|
||||
</div>
|
||||
<slot name="footer"></slot>
|
||||
</vxe-table-colgroup>
|
||||
</template>
|
||||
<template v-else>
|
||||
<Column
|
||||
:attr='item'
|
||||
:key="key + '-column'"
|
||||
v-for='(item, key) in tableStore.table.column'
|
||||
:tree-node='item.treeNode'
|
||||
>
|
||||
<!-- tableStore 预设的列 render 方案 -->
|
||||
<template v-if='item.render' #default='scope'>
|
||||
<FieldRender
|
||||
:field='item'
|
||||
:row='scope.row'
|
||||
:column='scope.column'
|
||||
:index='scope.rowIndex'
|
||||
:key='item.field+scope.rowIndex'
|
||||
/>
|
||||
</template>
|
||||
</Column>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
</vxe-table>
|
||||
<div v-if='props.pagination' class='table-pagination'>
|
||||
<el-pagination
|
||||
:currentPage='tableStore.table.params!.pageNum'
|
||||
:page-size='tableStore.table.params!.pageSize'
|
||||
:page-sizes='pageSizes'
|
||||
background
|
||||
:layout="config.layout.shrink ? 'prev, next, jumper' : 'sizes,total, ->, prev, pager, next, jumper'"
|
||||
:total='tableStore.table.total'
|
||||
@size-change='onTableSizeChange'
|
||||
@current-change='onTableCurrentChange'
|
||||
></el-pagination>
|
||||
</div>
|
||||
<slot name='footer'></slot>
|
||||
</template>
|
||||
|
||||
<script setup lang='ts'>
|
||||
import { ref, nextTick, inject, computed } from 'vue'
|
||||
import type { ElTable, TableInstance } from 'element-plus'
|
||||
import FieldRender from '@/components/table/fieldRender/index.vue'
|
||||
@@ -70,9 +96,12 @@ const tableStore = inject('tableStore') as TableStoreClass
|
||||
|
||||
interface Props extends /* @vue-ignore */ Partial<InstanceType<typeof ElTable>> {
|
||||
pagination?: boolean
|
||||
isGroup?: boolean
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
pagination: true
|
||||
pagination: true,
|
||||
isGroup: false
|
||||
})
|
||||
|
||||
const onTableSizeChange = (val: number) => {
|
||||
@@ -110,16 +139,18 @@ defineExpose({
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
<style scoped lang='scss'>
|
||||
.ba-data-table :deep(.el-button + .el-button) {
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.ba-data-table :deep(.table-header-cell) .cell {
|
||||
color: var(--el-text-color-primary);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.table-pagination {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
|
||||
@@ -6,20 +6,23 @@
|
||||
<Area v-model='tableStore.table.params.deptIndex' />
|
||||
</el-form-item>
|
||||
<el-form-item label='终端状态'>
|
||||
<el-select v-model='form.runFlag' placeholder='请选择' @change='onRunFlagChange'>
|
||||
<el-select multiple clearable collapse-tags v-model='tableStore.table.params.runFlag'
|
||||
placeholder='请选择'>
|
||||
<el-option label='投运' value='0' />
|
||||
<el-option label='热备用' value='1' />
|
||||
<el-option label='停运' value='2' />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='通讯状态'>
|
||||
<el-select v-model='form.comFlag' placeholder='请选择' @change='onComFlagChange'>
|
||||
<el-select multiple clearable collapse-tags v-model='tableStore.table.params.comFlag'
|
||||
placeholder='请选择'>
|
||||
<el-option label='正常' value='1' />
|
||||
<el-option label='中断' value='0' />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='厂家'>
|
||||
<el-select v-model='form.manufacturer' placeholder='请选择' @change='onManufacturerChange'>
|
||||
<el-select multiple clearable collapse-tags v-model='manufacturerForm' placeholder='请选择'
|
||||
@change='onManufacturerChange'>
|
||||
<el-option
|
||||
v-for='item in manufacturer'
|
||||
:key='item.id'
|
||||
@@ -50,6 +53,7 @@ defineOptions({
|
||||
})
|
||||
const dictData = useDictData()
|
||||
const manufacturer = dictData.getBasicData('Dev_Manufacturers')
|
||||
const manufacturerForm = ref<string[]>([])
|
||||
const tableStore = new TableStore({
|
||||
isWebPaging: true,
|
||||
url: '/device-boot/runManage/getRuntimeData',
|
||||
@@ -100,16 +104,9 @@ const tableStore = new TableStore({
|
||||
}
|
||||
],
|
||||
resetCallback: () => {
|
||||
form.runFlag = ''
|
||||
form.comFlag = ''
|
||||
form.manufacturer = ''
|
||||
manufacturerForm.value = []
|
||||
}
|
||||
})
|
||||
const form = reactive({
|
||||
runFlag: '',
|
||||
comFlag: '',
|
||||
manufacturer: ''
|
||||
})
|
||||
tableStore.table.params.deptIndex = dictData.state.area[0].id
|
||||
tableStore.table.params.runFlag = []
|
||||
tableStore.table.params.comFlag = []
|
||||
@@ -123,19 +120,15 @@ onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
|
||||
const onRunFlagChange = (val: any) => {
|
||||
tableStore.table.params.runFlag = [val]
|
||||
const onManufacturerChange = () => {
|
||||
tableStore.table.params.manufacturer = manufacturer.filter(item => {
|
||||
return manufacturerForm.value.includes(item.id)
|
||||
}).map(item => {
|
||||
return {
|
||||
...item,
|
||||
label: item.name,
|
||||
value: item.id
|
||||
}
|
||||
const onComFlagChange = (val: any) => {
|
||||
tableStore.table.params.comFlag = [val]
|
||||
}
|
||||
const onManufacturerChange = (val: any) => {
|
||||
let obj = manufacturer.find(item => item.id === val) as any
|
||||
obj.label = obj.name
|
||||
obj.value = obj.id
|
||||
tableStore.table.params.manufacturer = [obj]
|
||||
}
|
||||
|
||||
const addMenu = () => {
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -5,36 +5,43 @@
|
||||
<el-form-item label='区域'>
|
||||
<Area v-model='tableStore.table.params.deptIndex' />
|
||||
</el-form-item>
|
||||
<el-form-item label='终端状态'>
|
||||
<el-select v-model='form.runFlag' placeholder='请选择' @change='onRunFlagChange'>
|
||||
<el-option label='投运' value='0' />
|
||||
<el-option label='热备用' value='1' />
|
||||
<el-option label='停运' value='2' />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='通讯状态'>
|
||||
<el-select v-model='form.comFlag' placeholder='请选择' @change='onComFlagChange'>
|
||||
<el-option label='正常' value='1' />
|
||||
<el-option label='中断' value='0' />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='厂家'>
|
||||
<el-select v-model='form.manufacturer' placeholder='请选择' @change='onManufacturerChange'>
|
||||
<el-form-item label='干扰源类型'>
|
||||
<el-select multiple clearable collapse-tags v-model='interferenceSourceForm' placeholder='请选择'
|
||||
@change='onLoadTypeChange'>
|
||||
<el-option
|
||||
v-for='item in manufacturer'
|
||||
v-for='item in interferenceSource'
|
||||
:key='item.id'
|
||||
:label='item.name'
|
||||
:value='item.id'
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='电压等级'>
|
||||
<el-select multiple clearable collapse-tags v-model='scaleForm' placeholder='请选择'
|
||||
@change='onScaleChange'
|
||||
>
|
||||
<el-option
|
||||
v-for='item in level'
|
||||
:key='item.id'
|
||||
:label='item.name'
|
||||
:value='item.id'
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='通讯状态'>
|
||||
<el-select multiple clearable collapse-tags v-model='tableStore.table.params.comFlag'
|
||||
placeholder='请选择'>
|
||||
<el-option label='正常' value='1' />
|
||||
<el-option label='中断' value='0' />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='筛选数据'>
|
||||
<el-input v-model='tableStore.table.params.searchValue'
|
||||
placeholder='根据变电站,终端编号,型号或网络参数查询' style='width:300px' />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<Table ref='tableRef' />
|
||||
<Table isGroup ref='tableRef' />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang='tsx'>
|
||||
@@ -49,71 +56,148 @@ defineOptions({
|
||||
name: 'comptroller/list'
|
||||
})
|
||||
const dictData = useDictData()
|
||||
const manufacturer = dictData.getBasicData('Dev_Manufacturers')
|
||||
const interferenceSource = dictData.getBasicData('Interference_Source')
|
||||
const level = dictData.getBasicData('Dev_Voltage_Stand')
|
||||
const interferenceSourceForm = ref<string[]>([])
|
||||
const scaleForm = ref<string[]>([])
|
||||
const tableStore = new TableStore({
|
||||
isWebPaging: true,
|
||||
url: '/device-boot/runManage/getRuntimeData',
|
||||
url: '/device-boot/runManage/getLineLedger',
|
||||
method: 'POST',
|
||||
column: [
|
||||
{ title: '序号', type: 'seq', align: 'center', width: 60 },
|
||||
{ title: '区域', field: 'areaName', align: 'center', width: 120 },
|
||||
{ title: '供电公司', field: 'gdName', align: 'center', width: 120 },
|
||||
{ title: '变电站', field: 'bdName', align: 'center', showOverflow: true, minWidth: 100 },
|
||||
{ title: '终端编号', field: 'devName', align: 'center', width: 160 },
|
||||
{ title: '投运时间', field: 'loginTime', align: 'center', width: 200 },
|
||||
{ title: '厂家', field: 'manufacturer', align: 'center', width: 160 },
|
||||
{ title: '型号', field: 'devType', align: 'center', width: 200 },
|
||||
{ title: '网络参数', field: 'ip', align: 'center', width: 200 },
|
||||
{ title: '端口', field: 'port', align: 'center', width: 100 },
|
||||
{ title: '终端状态', field: 'runFlag', align: 'center', width: 100 },
|
||||
{ title: '通讯状态', field: 'comFlag', align: 'center', width: 100 },
|
||||
{ title: '最新数据', field: 'updateTime', align: 'center', width: 200 },
|
||||
{ field: 'areaName', title: '省公司', width: 120 },
|
||||
{ field: 'gdName', title: '市公司', width: 120 },
|
||||
{ field: 'scale', title: '监测点电压等级', width: 150 },
|
||||
{ field: 'lineName', title: '监测点名称', width: 120 },
|
||||
{ field: 'bdName', title: '所属变电站', width: 120 },
|
||||
{ field: 'loadType', title: '干扰源类型', width: 120 },
|
||||
{ field: 'objName', title: '监测对象名称', width: 180 },
|
||||
{
|
||||
title: '评价',
|
||||
field: 'onlineEvaluate',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
render: 'customRender',
|
||||
customRender: props => {
|
||||
if (props.renderValue == null) {
|
||||
return <span></span>
|
||||
} else if (props.renderValue * 100 > 90) {
|
||||
return (
|
||||
<el-tag effect='dark' type='success'>
|
||||
优
|
||||
</el-tag>
|
||||
)
|
||||
} else if (props.renderValue * 100 > 60) {
|
||||
return (
|
||||
<el-tag effect='dark' type='warning'>
|
||||
良
|
||||
</el-tag>
|
||||
)
|
||||
} else {
|
||||
return (
|
||||
<el-tag effect='dark' type='danger'>
|
||||
差
|
||||
</el-tag>
|
||||
)
|
||||
field: 'shortCapacity', title: '最小短路容量(MVA)', width: 190
|
||||
},
|
||||
{
|
||||
field: 'devCapacity', title: '供电设备容量(MVA )', width: 190
|
||||
},
|
||||
{
|
||||
field: 'dealCapacity', title: '用户协议容量(MVA)', width: 190
|
||||
},
|
||||
{ field: 'comFlag', title: '通讯状态 ', width: 120 },
|
||||
{ field: 'id', title: '监测点序号', width: 120 },
|
||||
{ field: 'devName', title: '监测终端编号 ', width: 140 },
|
||||
{ field: 'ptType', title: '监测终端接线方式', width: 160 },
|
||||
{
|
||||
field: 'voltageDev', title: '电压偏差上限(%)', width: 160
|
||||
},
|
||||
{
|
||||
field: 'uvoltageDev', title: '电压偏差下限(%)', width: 160
|
||||
},
|
||||
{
|
||||
field: 'limitValue',
|
||||
title: '限值',
|
||||
children: [{ field: 'freqDev', title: '频率(Hz)', width: 120 }, {
|
||||
field: 'ubalance',
|
||||
title: '三相电压不平衡度(%)',
|
||||
width: 190
|
||||
|
||||
}, { field: 'ineg', title: '负序电流(A)', width: 120 }, {
|
||||
field: 'flicker',
|
||||
title: '长时间闪变',
|
||||
width: 120
|
||||
|
||||
}, {
|
||||
field: 'uaberrance', title: '电压总谐波畸变率(%)', width: 190
|
||||
|
||||
},
|
||||
{
|
||||
field: 'oddHarm',
|
||||
title: '奇数次谐波电压(%)',
|
||||
width: 180
|
||||
|
||||
},
|
||||
{
|
||||
field: 'evenHarm',
|
||||
title: '偶数次谐波电压(%)',
|
||||
width: 180
|
||||
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
field: 'evaluate',
|
||||
title: '电流限值',
|
||||
children: [
|
||||
{ field: 'iharm2', title: '2次谐波(A)', width: 120 },
|
||||
{ field: 'iharm3', title: '3次谐波(A)', width: 120 },
|
||||
{ field: 'iharm4', title: '4次谐波(A)', width: 120 },
|
||||
{ field: 'iharm5', title: '5次谐波(A)', width: 120 },
|
||||
{ field: 'iharm6', title: '6次谐波(A)', width: 120 },
|
||||
{ field: 'iharm7', title: '7次谐波(A)', width: 120 },
|
||||
{ field: 'iharm8', title: '8次谐波(A)', width: 120 },
|
||||
{ field: 'iharm9', title: '9次谐波(A)', width: 120 },
|
||||
{ field: 'iharm10', title: '10次谐波(A)', width: 140 },
|
||||
{
|
||||
field: 'iharm11', title: '11次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm12', title: '12次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm13', title: '13次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm14', title: '14次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm15', title: '15次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm16', title: '16次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm17', title: '17次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm18', title: '18次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm19', title: '19次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm10', title: '20次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm21', title: '21次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm22', title: '22次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm23', title: '23次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm24', title: '24次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'iharm25', title: '25次谐波(A)', width: 140
|
||||
},
|
||||
{
|
||||
field: 'inUharm', title: '0.5-1.5次间谐波(A)', width: 180
|
||||
},
|
||||
{
|
||||
field: 'inUharm16', title: '2.5-15.5次间谐波(A)', width: 190
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
resetCallback: () => {
|
||||
form.runFlag = ''
|
||||
form.comFlag = ''
|
||||
form.manufacturer = ''
|
||||
interferenceSourceForm.value = []
|
||||
scaleForm.value = []
|
||||
}
|
||||
})
|
||||
const form = reactive({
|
||||
runFlag: '',
|
||||
comFlag: '',
|
||||
manufacturer: ''
|
||||
})
|
||||
tableStore.table.params.deptIndex = dictData.state.area[0].id
|
||||
tableStore.table.params.runFlag = []
|
||||
tableStore.table.params.scale = []
|
||||
tableStore.table.params.comFlag = []
|
||||
tableStore.table.params.manufacturer = []
|
||||
tableStore.table.params.loadType = []
|
||||
tableStore.table.params.statisticalType = {}
|
||||
tableStore.table.params.serverName = 'event-boot'
|
||||
tableStore.table.params.searchValue = ''
|
||||
@@ -123,19 +207,26 @@ onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
|
||||
const onRunFlagChange = (val: any) => {
|
||||
tableStore.table.params.runFlag = [val]
|
||||
const onLoadTypeChange = () => {
|
||||
tableStore.table.params.loadType = interferenceSource.filter(item => {
|
||||
return interferenceSourceForm.value.includes(item.id)
|
||||
}).map(item => {
|
||||
return {
|
||||
...item,
|
||||
label: item.name,
|
||||
value: item.id
|
||||
}
|
||||
const onComFlagChange = (val: any) => {
|
||||
tableStore.table.params.comFlag = [val]
|
||||
})
|
||||
}
|
||||
const onManufacturerChange = (val: any) => {
|
||||
let obj = manufacturer.find(item => item.id === val) as any
|
||||
obj.label = obj.name
|
||||
obj.value = obj.id
|
||||
tableStore.table.params.manufacturer = [obj]
|
||||
const onScaleChange = () => {
|
||||
tableStore.table.params.scale = level.filter(item => {
|
||||
return scaleForm.value.includes(item.id)
|
||||
}).map(item => {
|
||||
return {
|
||||
...item,
|
||||
label: item.name,
|
||||
value: item.id
|
||||
}
|
||||
|
||||
const addMenu = () => {
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
1
types/table.d.ts
vendored
1
types/table.d.ts
vendored
@@ -67,6 +67,7 @@ declare global {
|
||||
column: VxeColumnProps,
|
||||
index: number
|
||||
) => string
|
||||
children?: TableColumn[]
|
||||
}
|
||||
|
||||
/* 表格右侧操作按钮 */
|
||||
|
||||
Reference in New Issue
Block a user