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

修改冀北现场问题

Browse Source
This commit is contained in:
GGJ
2025-12-14 12:47:53 +08:00
parent ff2b9db7b8
commit 0b61c4b7ba
55 changed files with 2679 additions and 951 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/api/device-boot/panorama.ts
View File

@@ -172,5 +172,13 @@ export function getAreaPollution(data: any) {
}
//场站级评估
export function downPollutionSubCalc(data: any) {
return request({ url: 'harmonic-boot/PollutionSubstation/downPollutionSubCalc', method: 'post', data })
return request({ url: '/harmonic-boot/PollutionSubstation/downPollutionSubCalc', method: 'post', data })
}
//监测点评价
export function limitTableDetail(data: any) {
return request({ url: '/device-boot/dataVerify/limitTableDetail', method: 'post', data })
}
//重要及敏感用户详情
export function downPollutionSensitiveUser(data: any) {
return request({ url: '/harmonic-boot/PollutionSubstation/downPollutionSensitiveUser', method: 'post', data })
}

121
src/assets/font/demo_index.html
View File

@@ -54,6 +54,36 @@
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe782;</span>
<div class="name">253_ipower</div>
<div class="code-name">&amp;#xe782;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe665;</span>
<div class="name">电压</div>
<div class="code-name">&amp;#xe665;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe758;</span>
<div class="name">三相电压幅值不平衡</div>
<div class="code-name">&amp;#xe758;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe61e;</span>
<div class="name">电压总谐波畸变率</div>
<div class="code-name">&amp;#xe61e;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe612;</span>
<div class="name">闪变</div>
<div class="code-name">&amp;#xe612;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe65d;</span>
<div class="name">停运事件管理</div>
@@ -252,9 +282,9 @@
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1764826411334') format('woff2'),
url('iconfont.woff?t=1764826411334') format('woff'),
url('iconfont.ttf?t=1764826411334') format('truetype');
src: url('iconfont.woff2?t=1765612648830') format('woff2'),
url('iconfont.woff?t=1765612648830') format('woff'),
url('iconfont.ttf?t=1765612648830') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -280,6 +310,51 @@
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-a-253_ipower"></span>
<div class="name">
253_ipower
</div>
<div class="code-name">.icon-a-253_ipower
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-dianya"></span>
<div class="name">
电压
</div>
<div class="code-name">.icon-dianya
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-sanxiangdianyafuzhibupingheng"></span>
<div class="name">
三相电压幅值不平衡
</div>
<div class="code-name">.icon-sanxiangdianyafuzhibupingheng
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-dianyazongxiebojibianshuai"></span>
<div class="name">
电压总谐波畸变率
</div>
<div class="code-name">.icon-dianyazongxiebojibianshuai
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shanbian"></span>
<div class="name">
闪变
</div>
<div class="code-name">.icon-shanbian
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tingyunshijianguanli"></span>
<div class="name">
@@ -577,6 +652,46 @@
<div class="content symbol">
<ul class="icon_lists dib-box">
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-253_ipower"></use>
</svg>
<div class="name">253_ipower</div>
<div class="code-name">#icon-a-253_ipower</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-dianya"></use>
</svg>
<div class="name">电压</div>
<div class="code-name">#icon-dianya</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-sanxiangdianyafuzhibupingheng"></use>
</svg>
<div class="name">三相电压幅值不平衡</div>
<div class="code-name">#icon-sanxiangdianyafuzhibupingheng</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-dianyazongxiebojibianshuai"></use>
</svg>
<div class="name">电压总谐波畸变率</div>
<div class="code-name">#icon-dianyazongxiebojibianshuai</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shanbian"></use>
</svg>
<div class="name">闪变</div>
<div class="code-name">#icon-shanbian</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tingyunshijianguanli"></use>

29
src/assets/font/iconfont.css
View File

@@ -1,9 +1,10 @@
@font-face {
font-family: 'iconfont';
src: url('/src/assets/font/iconfont.woff2?t=1764826411334') format('woff2'),
url('/src/assets/font/iconfont.woff?t=1764826411334') format('woff'),
url('/src/assets/font/iconfont.ttf?t=1764826411334') format('truetype');
font-family: "iconfont"; /* Project id 3482754 */
src: url('iconfont.woff2?t=1765612648830') format('woff2'),
url('iconfont.woff?t=1765612648830') format('woff'),
url('iconfont.ttf?t=1765612648830') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
@@ -12,6 +13,26 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-a-253_ipower:before {
content: "\e782";
}
.icon-dianya:before {
content: "\e665";
}
.icon-sanxiangdianyafuzhibupingheng:before {
content: "\e758";
}
.icon-dianyazongxiebojibianshuai:before {
content: "\e61e";
}
.icon-shanbian:before {
content: "\e612";
}
.icon-tingyunshijianguanli:before {
content: "\e65d";
}

2
src/assets/font/iconfont.js
View File

File diff suppressed because one or more lines are too long

35
src/assets/font/iconfont.json
View File

@@ -5,6 +5,41 @@
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "33424624",
"name": "253_ipower",
"font_class": "a-253_ipower",
"unicode": "e782",
"unicode_decimal": 59266
},
{
"icon_id": "12331657",
"name": "电压",
"font_class": "dianya",
"unicode": "e665",
"unicode_decimal": 58981
},
{
"icon_id": "33073330",
"name": "三相电压幅值不平衡",
"font_class": "sanxiangdianyafuzhibupingheng",
"unicode": "e758",
"unicode_decimal": 59224
},
{
"icon_id": "37400988",
"name": "电压总谐波畸变率",
"font_class": "dianyazongxiebojibianshuai",
"unicode": "e61e",
"unicode_decimal": 58910
},
{
"icon_id": "43700638",
"name": "闪变",
"font_class": "shanbian",
"unicode": "e612",
"unicode_decimal": 58898
},
{
"icon_id": "25458995",
"name": "停运事件管理",

BIN
src/assets/font/iconfont.ttf
View File

Binary file not shown.

BIN
src/assets/font/iconfont.woff
View File

Binary file not shown.

BIN
src/assets/font/iconfont.woff2
View File

Binary file not shown.

BIN
src/assets/img/inlogo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

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

@@ -15,7 +15,7 @@ import { color, gradeColor3 } from './color'
import { useConfig } from '@/stores/config'
const config = useConfig()
// import { nextTick } from 'process'
const emit = defineEmits(['triggerPoint', 'group'])
const emit = defineEmits(['triggerPoint', 'group', 'echartClick'])
color[0] = config.layout.elementUiPrimary[0]
const chartRef = ref<HTMLDivElement>()
@@ -153,6 +153,9 @@ const initChart = () => {
chart.on('click', function (params) {
if (params.seriesName == '暂态触发点') {
emit('triggerPoint', params.data)
} else {
emit('echartClick', params)
}
})

7
src/components/table/defaultAttribute.ts
View File

@@ -4,7 +4,7 @@ export const defaultAttribute: VxeTableProps = {
align: 'center',
headerCellClassName: 'table-header-cell',
border: true,
stripe: true,
size: 'small',
columnConfig: { resizable: true },
rowConfig: { isCurrent: true, isHover: true },
@@ -13,6 +13,7 @@ export const defaultAttribute: VxeTableProps = {
treeConfig: {
reserve: true
},
showOverflow: true
showOverflow: true,
showFooter:true
}

3
src/main.ts
View File

@@ -16,12 +16,14 @@ import '@/assets/font/iconfont.css'
import { ElDialog } from 'element-plus'
import BaiduMap from 'vue-baidu-map-3x'
import BaiduMapOffline from 'vue-baidu-map-offline'
import ExcelJS from 'exceljs'
import VXETablePluginExportXLSX from 'vxe-table-plugin-export-xlsx'
// 方式1：NPM 安装，注入 ExcelJS 对象
VXETable.use(VXETablePluginExportXLSX, {
ExcelJS
})
// 全局注册 tooltip 组件
window.XEUtils = XEUtils
// 初始化多语言
@@ -61,6 +63,7 @@ const setupAll = async () => {
app.use(pinia)
app.use(ElementPlus)
app.use(VXETable)
;(app._context.components.ElDialog as typeof ElDialog).props.closeOnClickModal.default = false
registerIcons(app) // icons

19
src/styles/vxeTable.scss
View File

@@ -63,7 +63,10 @@
.vxe-table--render-default .vxe-cell--radio:not(.is--disabled):hover .vxe-radio--icon {
color: var(--el-color-primary-light-5);
}
.vxe-table--render-default .vxe-body--row.row--current,
.vxe-table--render-default .vxe-body--row.row--current:hover {
background-color: var(--el-color-primary-light-8);
}
// .vxe-table--render-default .is--disabled.vxe-cell--checkbox .vxe-checkbox--icon{
// color: #fff0;
// }
@@ -77,14 +80,14 @@
.vxe-modal--wrapper {
z-index: 5000 !important;
}
.vxe-table--body .vxe-body--row:nth-child(even) {
background-color: #f9f9f9;
// background-color: var(--el-color-primary-light-9);
}
// .vxe-table--body .vxe-body--row:nth-child(even) {
// background-color: #f9f9f9;
// // background-color: var(--el-color-primary-light-9);
// }
.vxe-table--body .vxe-body--row:nth-child(odd) {
background-color: #ffffff;
}
// .vxe-table--body .vxe-body--row:nth-child(odd) {
// background-color: #ffffff;
// }
.default-theme.splitpanes--vertical > .splitpanes__splitter,
.default-theme .splitpanes--vertical > .splitpanes__splitter {
width: 10px !important;

520
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/SubstationTab.vue
View File

@@ -1,520 +0,0 @@
<template>
<div class="tab-content">
<TableHeader datePicker ref="tableHeaderRef" @selectChange="handleSelectChange">
<template #select>
<el-form-item label="区域">
<el-cascader
v-bind="$attrs"
:options="areOptions"
:props="cascaderProps"
v-model="selectedArea"
@change="handleFilterChange"
/>
</el-form-item>
<el-form-item label="统计类型">
<el-select
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
@change="handleStatisticalTypeChange"
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</el-form-item>
<el-form-item label="电网标志">
<el-select
v-model="tableStore.table.params.powerFlag"
placeholder="请选择电网标志"
@change="handleFilterChange"
>
<el-option label="全部" value="0"></el-option>
<el-option label="电网侧" value="1"></el-option>
<el-option label="非电网侧" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="筛选数据">
<el-input
v-model="searchKeyword"
placeholder="请输入变电站"
clearable
@input="handleFilterChange"
:show-word-limit=true
:maxlength="32"
/>
</el-form-item>
</template>
<template #operation>
<el-button icon="el-icon-Download" type="primary" @click="exportEvent">导出</el-button>
</template>
</TableHeader>
<div v-loading="tableStore.table.loading" class="main-container">
<vxe-table
class="full-height-table"
ref="tableRef"
auto-resize
:data="tableStore.table.data"
v-bind="defaultAttribute"
:height="tableHeight"
resizable
show-overflow
>
<vxe-column title="序号" width="80" type="seq" align="center"></vxe-column>
<vxe-column field="gdName" title="供电公司" align="center" min-width="120" ></vxe-column>
<vxe-column field="subStationName" :show-overflow="true" title="变电站" align="center" min-width="150"></vxe-column>
<vxe-column field="subVStationValue" :title="harmonicValueTitle" align="center" min-width="150"></vxe-column>
<vxe-column field="subVoltage" title="变电站电压等级" align="center" min-width="150"></vxe-column>
<vxe-column title="操作" width="150" align="center">
<template #default="{ row }">
<el-button size="small" type="primary" @click="showDetailDialog(row)">监测点详情</el-button>
</template>
</vxe-column>
</vxe-table>
</div>
<div class="pagination-container">
<el-pagination
:current-page="tableStore.table.params.pageNum"
:page-size="tableStore.table.params.pageSize"
:page-sizes="[10, 20, 50, 100]"
background
layout="sizes, total, prev, pager, next, jumper"
:total="tableStore.table.total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
class="custom-pagination"/>
</div>
<!-- 添加弹窗 -->
<el-dialog draggable
v-model="detailDialogVisible"
:title="detailDialogTitle"
width="1000px"
>
<div v-loading="detailLoading">
<div style="margin-bottom: 10px; text-align: right;">
<el-button icon="el-icon-Download" type="primary" @click="exportDetailEvent">导出</el-button>
</div>
<vxe-table
ref="detailTableRef"
:data="detailData"
auto-resize
v-bind="defaultAttribute"
resizable
show-overflow
height="400px"
>
<vxe-column title="序号" width="60" type="seq" align="center"></vxe-column>
<vxe-column field="lineName" title="监测点名称" align="center" min-width="120"></vxe-column>
<vxe-column field="devName" title="终端名称" align="center" min-width="120"></vxe-column>
<vxe-column field="devType" title="终端型号" align="center" min-width="100"></vxe-column>
<vxe-column field="manufacturer" title="终端厂家" align="center" min-width="120"></vxe-column>
<vxe-column field="loginTime" title="投运时间" align="center" min-width="120"></vxe-column>
<vxe-column field="interval" title="统计间隔" align="center" min-width="100"></vxe-column>
<vxe-column field="powerFlag" title="监测位置" align="center" min-width="100"></vxe-column>
<vxe-column field="vharmonicValue" title="监测点污染值" align="center" min-width="120"></vxe-column>
</vxe-table>
</div>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, onBeforeUnmount, computed, watch } from 'vue'
import TableStore from '@/utils/tableStore'
import TableHeader from '@/components/table/header/index.vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { useDictData } from '@/stores/dictData'
import { debounce } from 'lodash-es'
const props = defineProps({
active: {
type: Boolean,
default: false
}
})
const emit = defineEmits(['initialized'])
const dictData = useDictData()
const options = dictData.getBasicData('Pollution_Calc')
const tableHeight = ref(500)
const tableRef = ref()
const tableHeaderRef = ref()
const detailTableRef = ref()
const selectedArea = ref()
const areOptions: any = dictData.state.area
const allData = ref<PollutionItem[]>([])
const searchKeyword = ref('')
const harmonicValueTitle = ref('电站谐波电压污染值')
const detailDialogVisible = ref(false)
const detailDialogTitle = ref('')
const detailLoading = ref(false)
const detailData = ref<PollutionItem[]>([])
const originalTableData = ref<any[]>([])
// 方法
const showDetailDialog = (row) => {
detailDialogTitle.value = `${row.subStationName} - 监测点详情`
loadDetailData(row)
detailDialogVisible.value = true
}
const loadDetailData = async (row) => {
detailLoading.value = true
try {
// 从原始数据中查找该变电站的详细信息
const originalItem = originalTableData.value.find(
item => item.subStationName === row.subStationName
)
if (originalItem && originalItem.powerFlagPollutionList) {
const detailList: PollutionItem[] = []
originalItem.powerFlagPollutionList.forEach((point: any) => {
detailList.push({
lineName: processNullValue(point.lineName),
devName: processNullValue(point.devName),
devType: processNullValue(point.devType),
manufacturer: processNullValue(point.manufacturer),
loginTime: processNullValue(point.loginTime),
interval: processNullValue(point.interval),
powerFlag: processNullValue(point.powerFlag),
vharmonicValue: processNullValue(point.vharmonicValue)
})
})
detailData.value = detailList
} else {
detailData.value = []
}
} catch (error) {
console.error('加载详情数据失败:', error)
detailData.value = []
} finally {
detailLoading.value = false
}
}
const cascaderProps = {
label: 'name',
value: 'id',
checkStrictly: true,
emitPath: false
}
interface PollutionItem {
gdName?: string
subStationName?: string
subVStationValue?: string
subVoltage?: string
devName?: string
lineName?: string
powerFlag?: string
devType?: string
manufacturer?: string
loginTime?: string
interval?: string
vharmonicValue?: string
}
const handleSelectChange = (isExpanded: boolean) => {
if (isExpanded) {
tableHeight.value = tableHeight.value - 55
} else {
tableHeight.value = tableHeight.value + 55
}
}
const calculateTableHeight = () => {
const windowHeight = window.innerHeight
const headerHeight = 160
const paginationHeight = 120
const padding = 30
const calculatedHeight = windowHeight - headerHeight - paginationHeight - padding
tableHeight.value = Math.max(calculatedHeight, 300)
}
const debouncedCalculateTableHeight = debounce(() => {
calculateTableHeight()
}, 300)
const filteredData = computed(() => {
let result = [...allData.value]
if (selectedArea.value) {
let areaName = ''
let areaLevel = -1
const findAreaName = (areas: any[]) => {
for (const area of areas) {
if (area.id === selectedArea.value) {
areaName = area.name
areaLevel = area.level !== undefined ? area.level : -1
break
}
if (area.children && area.children.length > 0) {
findAreaName(area.children)
}
}
}
findAreaName(areOptions)
if (areaName && areaLevel > 1) {
result = result.filter(item => item.gdName && item.gdName.includes(areaName))
}
}
if (tableStore.table.params.powerFlag === '1') {
result = result.filter(item => item.powerFlag && !item.powerFlag.includes('非'))
} else if (tableStore.table.params.powerFlag === '2') {
result = result.filter(item => item.powerFlag && item.powerFlag.includes('非'))
}
if (searchKeyword.value) {
const keyword = searchKeyword.value.toLowerCase()
result = result.filter(item =>
(item.subStationName && item.subStationName.toLowerCase().includes(keyword)) ||
(item.devName && item.devName.toLowerCase().includes(keyword)) ||
(item.lineName && item.lineName.toLowerCase().includes(keyword))
)
}
return result
})
const currentPageData = computed(() => {
const pageSize = tableStore.table.params.pageSize
const pageNum = tableStore.table.params.pageNum
const start = (pageNum - 1) * pageSize
const end = start + pageSize
return filteredData.value.slice(start, end)
})
const updateTotal = computed(() => {
return filteredData.value.length
})
const processNullValue = (value: any) => {
return value === null || value === undefined || value === '' || value === 'null'? '/' : value
}
const tableStore = new TableStore({
url: '/harmonic-boot/PollutionSubstation/downPollutionSubCalc',
method: 'POST',
column: [],
beforeSearchFun: () => {
delete tableStore.table.params.deptIndex
delete tableStore.table.params.interval
delete tableStore.table.params.searchEndTime
delete tableStore.table.params.searchBeginTime
delete tableStore.table.params.timeFlag
},
loadCallback: () => {
// 保存原始数据以便后续查询
originalTableData.value = [...(tableStore.table.data || [])]
const expandedData: PollutionItem[] = [];
(tableStore.table.data || []).forEach((item: any) => {
expandedData.push({
gdName: processNullValue(item.gdName),
subStationName: processNullValue(item.subStationName),
subVStationValue: processNullValue(item.subVStationValue),
subVoltage: processNullValue(item.subVoltage)
});
});
allData.value = expandedData;
tableStore.table.total = updateTotal.value;
tableStore.table.data = currentPageData.value;
},
resetCallback: () => {
clearQueryParams()
}
})
provide('tableStore', tableStore)
watch(
() => areOptions,
(newOptions) => {
if (newOptions && newOptions.length > 0) {
selectedArea.value = newOptions[0].id
tableStore.table.params.id = newOptions[0].id
}
},
{ immediate: true }
)
watch(
() => options,
(newOptions) => {
if (newOptions && newOptions.length > 0) {
if (!tableStore.table.params.statisticalType) {
tableStore.table.params.statisticalType = newOptions[0]
tableStore.table.params.ids = [newOptions[0].id]
}
}
},
{ immediate: true }
)
tableStore.table.params.powerFlag = "0"
tableStore.table.params.isUpToGrid = 0
tableStore.table.params.type = 1
const handleStatisticalTypeChange = (newVal: { id: any }) => {
if (newVal) {
tableStore.table.params.statisticalType = newVal
tableStore.table.params.ids = [newVal.id]
if (newVal.name) {
harmonicValueTitle.value = '电站' + newVal.name + '污染值'
}
}
// 重新调用接口
tableStore.index()
}
const handleFilterChange = () => {
tableStore.table.params.pageNum = 1
tableStore.table.data = currentPageData.value
tableStore.table.total = updateTotal.value
}
const handleSizeChange = (val: number) => {
tableStore.table.params.pageSize = val
tableStore.table.params.pageNum = 1
tableStore.table.data = currentPageData.value
tableStore.table.total = updateTotal.value
}
const handleCurrentChange = (val: number) => {
tableStore.table.params.pageNum = val
tableStore.table.data = currentPageData.value
tableStore.table.total = updateTotal.value
}
const exportEvent = () => {
const allFilteredData = filteredData.value
tableRef.value.exportData({
filename: '场站级评估-污染值报告',
sheetName: 'Sheet1',
type: 'xlsx',
useStyle: true,
data: allFilteredData,
columnFilterMethod: function (column: any) {
return !(
column.column.title === '操作'
)
}
})
}
// 导出详情数据的方法
const exportDetailEvent = () => {
detailTableRef.value.exportData({
filename: detailDialogTitle.value,
sheetName: 'Sheet1',
type: 'xlsx',
useStyle: true,
data: detailData.value,
columnFilterMethod({ column }) {
// 导出所有列，包括隐藏列
return true;
}
})
}
onMounted(() => {
if (props.active) {
tableStore.index()
emit('initialized', 'pollutionReport')
}
calculateTableHeight()
window.addEventListener('resize', debouncedCalculateTableHeight)
})
onBeforeUnmount(() => {
window.removeEventListener('resize', debouncedCalculateTableHeight)
})
const clearQueryParams = () => {
// 将区域恢复成第一层
if (areOptions && areOptions.length > 0) {
selectedArea.value = areOptions[0].id
tableStore.table.params.id = areOptions[0].id
}
// 清空搜索关键词
searchKeyword.value = ''
}
defineExpose({
refresh: () => {
clearQueryParams()
tableHeaderRef.value.setTheDate(3)
tableStore.index()
}
})
</script>
<style scoped>
.pagination-container {
border: 1px solid #ebeef5;
border-top: none;
padding: 10px;
margin: 0 0 5px 0;
background-color: #fff;
}
:deep(.custom-pagination) {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
:deep(.custom-pagination .el-pagination__sizes) {
margin-right: 10px;
}
:deep(.custom-pagination .el-pagination__total) {
margin-right: auto;
}
:deep(.custom-pagination .el-pagination__jump) {
margin-left: 20px;
}
/* 响应式处理 */
@media screen and (max-width: 768px) {
:deep(.custom-pagination) {
flex-direction: column;
align-items: stretch;
}
:deep(.custom-pagination .el-pagination__total) {
margin-right: 0;
order: 1;
margin-top: 10px;
}
:deep(.custom-pagination .el-pagination__sizes) {
order: 2;
}
:deep(.custom-pagination .btn-prev),
:deep(.custom-pagination .el-pager),
:deep(.custom-pagination .btn-next),
:deep(.custom-pagination .el-pagination__jump) {
order: 3;
justify-content: center;
margin-top: 10px;
}
}
</style>

3
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/MonitoringPointTab.vue → src/views/pqs/harmonicMonitoring/detailed/pollutionReport/components/MonitoringPointTab.vue
View File

@@ -85,7 +85,7 @@
<el-pagination
:current-page="tableStore.table.params.pageNum"
:page-size="tableStore.table.params.pageSize"
:page-sizes="[10, 20, 50, 100]"
:page-sizes="[10, 20, 50, 100,200]"
background
layout="sizes, total, prev, pager, next, jumper"
:total="tableStore.table.total"
@@ -272,6 +272,7 @@ tableStore.table.params.isUpToGrid = 0
tableStore.table.params.type = 1
const handleStatisticalTypeChange = (newVal: { id: any }) => {
console.log("🚀 ~ handleStatisticalTypeChange ~ newVal:", newVal)
if (newVal) {
tableStore.table.params.statisticalType = newVal
tableStore.table.params.ids = [newVal.id]

510
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/components/SubstationTab.vue Normal file
View File

@@ -0,0 +1,510 @@
<template>
<div class="tab-content">
<TableHeader datePicker ref="tableHeaderRef" @selectChange="handleSelectChange">
<template #select>
<el-form-item label="区域">
<el-cascader
v-bind="$attrs"
:options="areOptions"
:props="cascaderProps"
v-model="selectedArea"
@change="handleFilterChange"
/>
</el-form-item>
<el-form-item label="统计类型">
<el-select
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</el-form-item>
<!-- <el-form-item label="电网标志">
<el-select
v-model="tableStore.table.params.powerFlag"
placeholder="请选择电网标志"
@change="handleFilterChange"
>
<el-option label="全部" value="0"></el-option>
<el-option label="电网侧" value="1"></el-option>
<el-option label="非电网侧" value="2"></el-option>
</el-select>
</el-form-item> -->
<el-form-item label="筛选数据">
<el-input
v-model="searchKeyword"
placeholder="请输入变电站"
clearable
@input="handleFilterChange"
:show-word-limit="true"
:maxlength="32"
/>
</el-form-item>
</template>
<template #operation>
<el-button icon="el-icon-Download" type="primary" @click="exportEvent">导出</el-button>
</template>
</TableHeader>
<div v-loading="tableStore.table.loading" class="main-container">
<vxe-table
class="full-height-table"
ref="tableRef"
auto-resize
:data="tableStore.table.data"
v-bind="defaultAttribute"
:height="tableHeight"
resizable
show-overflow
>
<vxe-column title="序号" width="80" type="seq" align="center"></vxe-column>
<vxe-column field="gdName" title="供电公司" align="center" min-width="120"></vxe-column>
<vxe-column
field="subStationName"
:show-overflow="true"
title="变电站"
align="center"
min-width="150"
></vxe-column>
<vxe-column
field="subVStationValue"
:title="harmonicValueTitle"
align="center"
min-width="150"
></vxe-column>
<vxe-column field="subVoltage" title="变电站电压等级" align="center" min-width="150"></vxe-column>
<vxe-column title="操作" width="150" align="center">
<template #default="{ row }">
<el-button size="small" type="primary" link @click="showDetailDialog(row)">
监测点污染详情
</el-button>
</template>
</vxe-column>
</vxe-table>
</div>
<div class="pagination-container">
<el-pagination
:current-page="tableStore.table.params.pageNum"
:page-size="tableStore.table.params.pageSize"
:page-sizes="[10, 20, 50, 100, 200]"
background
layout="sizes, total, prev, pager, next, jumper"
:total="tableStore.table.total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
class="custom-pagination"
/>
</div>
<!-- 添加弹窗 -->
<el-dialog draggable v-model="detailDialogVisible" :title="detailDialogTitle" width="1000px">
<div v-loading="detailLoading">
<div style="margin-bottom: 10px; text-align: right">
<el-button icon="el-icon-Download" type="primary" @click="exportDetailEvent">导出</el-button>
</div>
<vxe-table
ref="detailTableRef"
:data="detailData"
auto-resize
v-bind="defaultAttribute"
resizable
show-overflow
height="400px"
>
<vxe-column title="序号" width="60" type="seq" align="center"></vxe-column>
<vxe-column title="序号" width="60" type="seq" align="center"></vxe-column>
<vxe-column field="subName" title="变电站名称" align="center" min-width="120"></vxe-column>
<vxe-column field="lineName" title="监测点名称" align="center" min-width="120"></vxe-column>
<vxe-column field="objName" title="监测对象名称" align="center" min-width="120"></vxe-column>
<vxe-column field="loadType" title="干扰源类型" align="center" min-width="120"></vxe-column>
<vxe-column field="powerFlag" title="监测位置" align="center" min-width="100"></vxe-column>
<vxe-column field="vharmonicValue" title="监测点污染值" align="center" min-width="120"></vxe-column>
</vxe-table>
</div>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, onBeforeUnmount, computed, watch } from 'vue'
import TableStore from '@/utils/tableStore'
import TableHeader from '@/components/table/header/index.vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { useDictData } from '@/stores/dictData'
import { debounce } from 'lodash-es'
const props = defineProps({
active: {
type: Boolean,
default: false
}
})
const emit = defineEmits(['initialized'])
const dictData = useDictData()
const options = dictData.getBasicData('Pollution_Calc')
const tableHeight = ref(500)
const tableRef = ref()
const tableHeaderRef = ref()
const detailTableRef = ref()
const selectedArea = ref()
const areOptions: any = dictData.state.area
const allData = ref<PollutionItem[]>([])
const searchKeyword = ref('')
const harmonicValueTitle = ref('电站谐波电压污染值')
const detailDialogVisible = ref(false)
const detailDialogTitle = ref('')
const detailLoading = ref(false)
const detailData = ref<PollutionItem[]>([])
const originalTableData = ref<any[]>([])
// 方法
const showDetailDialog = row => {
detailDialogTitle.value = `${row.subStationName} - 监测点污染详情`
loadDetailData(row)
detailDialogVisible.value = true
}
const loadDetailData = async row => {
detailLoading.value = true
try {
// 从原始数据中查找该变电站的详细信息
const originalItem = originalTableData.value.find(item => item.subStationName === row.subStationName)
if (originalItem && originalItem.powerFlagPollutionList) {
const detailList: PollutionItem[] = []
// originalItem.powerFlagPollutionList.forEach((point: any) => {
// detailList.push({
// lineName: processNullValue(point.lineName),
// devName: processNullValue(point.devName),
// devType: processNullValue(point.devType),
// manufacturer: processNullValue(point.manufacturer),
// loginTime: processNullValue(point.loginTime),
// interval: processNullValue(point.interval),
// powerFlag: processNullValue(point.powerFlag),
// vharmonicValue: processNullValue(point.vharmonicValue)
// })
// })
detailData.value = originalItem.powerFlagPollutionList //detailList
} else {
detailData.value = []
}
} catch (error) {
console.error('加载详情数据失败:', error)
detailData.value = []
} finally {
detailLoading.value = false
}
}
const cascaderProps = {
label: 'name',
value: 'id',
checkStrictly: true,
emitPath: false
}
interface PollutionItem {
gdName?: string
subStationName?: string
subVStationValue?: string
subVoltage?: string
devName?: string
lineName?: string
powerFlag?: string
devType?: string
manufacturer?: string
loginTime?: string
interval?: string
vharmonicValue?: string
}
const handleSelectChange = (isExpanded: boolean) => {
if (isExpanded) {
tableHeight.value = tableHeight.value - 55
} else {
tableHeight.value = tableHeight.value + 55
}
}
const calculateTableHeight = () => {
const windowHeight = window.innerHeight
const headerHeight = 160
const paginationHeight = 120
const padding = 30
const calculatedHeight = windowHeight - headerHeight - paginationHeight - padding
tableHeight.value = Math.max(calculatedHeight, 300)
}
const debouncedCalculateTableHeight = debounce(() => {
calculateTableHeight()
}, 300)
const filteredData = computed(() => {
let result = [...allData.value]
if (selectedArea.value) {
let areaName = ''
let areaLevel = -1
const findAreaName = (areas: any[]) => {
for (const area of areas) {
if (area.id === selectedArea.value) {
areaName = area.name
areaLevel = area.level !== undefined ? area.level : -1
break
}
if (area.children && area.children.length > 0) {
findAreaName(area.children)
}
}
}
findAreaName(areOptions)
if (areaName && areaLevel > 1) {
result = result.filter(item => item.gdName && item.gdName.includes(areaName))
}
}
if (tableStore.table.params.powerFlag === '1') {
result = result.filter(item => item.powerFlag && !item.powerFlag.includes('非'))
} else if (tableStore.table.params.powerFlag === '2') {
result = result.filter(item => item.powerFlag && item.powerFlag.includes('非'))
}
if (searchKeyword.value) {
const keyword = searchKeyword.value.toLowerCase()
result = result.filter(
item =>
(item.subStationName && item.subStationName.toLowerCase().includes(keyword)) ||
(item.devName && item.devName.toLowerCase().includes(keyword)) ||
(item.lineName && item.lineName.toLowerCase().includes(keyword))
)
}
return result
})
const currentPageData = computed(() => {
const pageSize = tableStore.table.params.pageSize
const pageNum = tableStore.table.params.pageNum
const start = (pageNum - 1) * pageSize
const end = start + pageSize
return filteredData.value.slice(start, end)
})
const updateTotal = computed(() => {
return filteredData.value.length
})
const processNullValue = (value: any) => {
return value === null || value === undefined || value === '' || value === 'null' ? '/' : value
}
const tableStore = new TableStore({
url: '/harmonic-boot/PollutionSubstation/downPollutionSubCalc',
method: 'POST',
column: [],
beforeSearchFun: () => {
delete tableStore.table.params.deptIndex
delete tableStore.table.params.interval
delete tableStore.table.params.searchEndTime
delete tableStore.table.params.searchBeginTime
delete tableStore.table.params.timeFlag
tableStore.table.params.ids = [tableStore.table.params.statisticalType.id]
},
loadCallback: () => {
// 保存原始数据以便后续查询
originalTableData.value = [...(tableStore.table.data || [])]
const expandedData: PollutionItem[] = []
;(tableStore.table.data || []).forEach((item: any) => {
expandedData.push({
gdName: processNullValue(item.gdName),
subStationName: processNullValue(item.subStationName),
subVStationValue: processNullValue(item.subVStationValue),
subVoltage: processNullValue(item.subVoltage)
})
})
harmonicValueTitle.value = tableStore.table.params.statisticalType.name + '污染值'
allData.value = expandedData
tableStore.table.total = updateTotal.value
tableStore.table.data = currentPageData.value
},
resetCallback: () => {
clearQueryParams()
}
})
provide('tableStore', tableStore)
watch(
() => areOptions,
newOptions => {
if (newOptions && newOptions.length > 0) {
selectedArea.value = newOptions[0].id
tableStore.table.params.id = newOptions[0].id
}
},
{ immediate: true }
)
watch(
() => options,
newOptions => {
if (newOptions && newOptions.length > 0) {
if (!tableStore.table.params.statisticalType) {
tableStore.table.params.statisticalType = newOptions[0]
}
}
},
{ immediate: true }
)
tableStore.table.params.powerFlag = '0'
tableStore.table.params.isUpToGrid = 0
tableStore.table.params.type = 1
const handleFilterChange = () => {
tableStore.table.params.pageNum = 1
tableStore.table.data = currentPageData.value
tableStore.table.total = updateTotal.value
}
const handleSizeChange = (val: number) => {
tableStore.table.params.pageSize = val
tableStore.table.params.pageNum = 1
tableStore.table.data = currentPageData.value
tableStore.table.total = updateTotal.value
}
const handleCurrentChange = (val: number) => {
tableStore.table.params.pageNum = val
tableStore.table.data = currentPageData.value
tableStore.table.total = updateTotal.value
}
const exportEvent = () => {
const allFilteredData = filteredData.value
tableRef.value.exportData({
filename: '场站级评估-污染值报告',
sheetName: 'Sheet1',
type: 'xlsx',
useStyle: true,
data: allFilteredData,
columnFilterMethod: function (column: any) {
return !(column.column.title === '操作')
}
})
}
// 导出详情数据的方法
const exportDetailEvent = () => {
detailTableRef.value.exportData({
filename: detailDialogTitle.value,
sheetName: 'Sheet1',
type: 'xlsx',
useStyle: true,
data: detailData.value,
columnFilterMethod({ column }) {
// 导出所有列，包括隐藏列
return true
}
})
}
onMounted(() => {
if (props.active) {
tableStore.index()
emit('initialized', 'pollutionReport')
}
calculateTableHeight()
window.addEventListener('resize', debouncedCalculateTableHeight)
})
onBeforeUnmount(() => {
window.removeEventListener('resize', debouncedCalculateTableHeight)
})
const clearQueryParams = () => {
// 将区域恢复成第一层
if (areOptions && areOptions.length > 0) {
selectedArea.value = areOptions[0].id
tableStore.table.params.id = areOptions[0].id
}
// 清空搜索关键词
searchKeyword.value = ''
}
defineExpose({
refresh: (statisticalType?: string) => {
tableStore.table.params.statisticalType = options.filter(item => item.id === statisticalType)[0] || ''
clearQueryParams()
tableHeaderRef.value.setTheDate(3)
tableStore.index()
}
})
</script>
<style scoped>
.pagination-container {
border: 1px solid #ebeef5;
border-top: none;
padding: 10px;
margin: 0 0 5px 0;
background-color: #fff;
}
:deep(.custom-pagination) {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
:deep(.custom-pagination .el-pagination__sizes) {
margin-right: 10px;
}
:deep(.custom-pagination .el-pagination__total) {
margin-right: auto;
}
:deep(.custom-pagination .el-pagination__jump) {
margin-left: 20px;
}
/* 响应式处理 */
@media screen and (max-width: 768px) {
:deep(.custom-pagination) {
flex-direction: column;
align-items: stretch;
}
:deep(.custom-pagination .el-pagination__total) {
margin-right: 0;
order: 1;
margin-top: 10px;
}
:deep(.custom-pagination .el-pagination__sizes) {
order: 2;
}
:deep(.custom-pagination .btn-prev),
:deep(.custom-pagination .el-pager),
:deep(.custom-pagination .btn-next),
:deep(.custom-pagination .el-pagination__jump) {
order: 3;
justify-content: center;
margin-top: 10px;
}
}
</style>

173
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/components/regionalAssessment.vue Normal file
View File

@@ -0,0 +1,173 @@
<template>
<div>
<TableHeader datePicker area ref="TableHeaderRef" showExport>
<template #select>
<el-form-item label="统计类型">
<el-select
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</el-form-item>
<!-- <el-form-item label="电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志">
<el-option label="全部" :value="0"></el-option>
<el-option label="电网侧" :value="1"></el-option>
<el-option label="非电网侧" :value="2"></el-option>
</el-select>
</el-form-item> -->
<el-form-item label="筛选数据">
<el-input
v-model="tableStore.table.params.searchValue"
placeholder="请输入变电站/终端/监测点"
clearable
:show-word-limit="true"
:maxlength="32"
/>
</el-form-item>
</template>
<template #operation>
<!-- <el-button icon="el-icon-Download" type="primary">导出</el-button> -->
</template>
</TableHeader>
<Table ref="tableRef" />
<!-- 添加弹窗 -->
<el-dialog draggable v-model="detailDialogVisible" :title="detailDialogTitle" width="1000px">
<div v-loading="detailLoading">
<div style="margin-bottom: 10px; text-align: right">
<el-button icon="el-icon-Download" type="primary" @click="exportDetailEvent">导出</el-button>
</div>
<vxe-table
ref="detailTableRef"
:data="detailData"
auto-resize
v-bind="defaultAttribute"
resizable
show-overflow
height="400px"
>
<vxe-column title="序号" width="60" type="seq" align="center"></vxe-column>
<vxe-column field="subName" title="变电站名称" align="center" min-width="120"></vxe-column>
<vxe-column field="lineName" title="监测点名称" align="center" min-width="120"></vxe-column>
<vxe-column field="objName" title="监测对象名称" align="center" min-width="120"></vxe-column>
<vxe-column field="loadType" title="干扰源类型" align="center" min-width="120"></vxe-column>
<vxe-column field="powerFlag" title="监测位置" align="center" min-width="100"></vxe-column>
<vxe-column field="vharmonicValue" title="监测点污染值" align="center" min-width="120"></vxe-column>
</vxe-table>
</div>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick, watch } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { mainHeight } from '@/utils/layout'
import { useDictData } from '@/stores/dictData'
import { addUse, updateUse, removeUse } from '@/api/advance-boot/bearingCapacity'
//
const detailDialogVisible = ref(false)
const detailLoading = ref(false)
const detailDialogTitle = ref('')
const detailData = ref([])
const dictData = useDictData()
const detailTableRef = ref()
const lineList = dictData.getBasicData('Line_Type')
const options = dictData.getBasicData('Pollution_Calc')
const tableStore = new TableStore({
url: '/harmonic-boot/PollutionSubstation/getAreaPollution',
publicHeight: 65,
isWebPaging: true,
method: 'POST',
filename: '监测点台账',
column: [
{
title: '序号',
width: 80,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{
field: 'deptName',
title: '区域',
minWidth: 100
},
{
field: 'score',
title: '污染值',
minWidth: 150
},
{
title: '操作',
width: '180',
fixed: 'right',
render: 'buttons',
buttons: [
{
name: 'edit',
title: '监测点污染详情',
type: 'primary',
icon: 'el-icon-Open',
render: 'basicButton',
click: row => {
detailDialogTitle.value = row.deptName + '监测点污染详情'
detailLoading.value = true
detailData.value = row.powerFlagPollutionList
detailDialogVisible.value = true
detailLoading.value = false
}
}
]
}
],
beforeSearchFun: () => {
tableStore.table.params.id = tableStore.table.params.deptIndex
tableStore.table.params.ids = [tableStore.table.params.statisticalType?.id]
},
loadCallback: () => {
tableStore.table.column[2].title = tableStore.table.params.statisticalType.name + '污染值'
}
})
tableStore.table.params.searchValue = ''
tableStore.table.params.statisticalType = options[0]
tableStore.table.params.searchState = '0'
tableStore.table.params.lineRunFlag = 0
// 导出详情数据的方法
const exportDetailEvent = () => {
detailTableRef.value.exportData({
filename: detailDialogTitle.value,
sheetName: 'Sheet1',
type: 'xlsx',
useStyle: true,
data: detailData.value,
columnFilterMethod: function (column: any) {
return !(column.$columnIndex === 0)
}
})
}
provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
const setSearchValue = (val: string) => {
tableStore.table.params.searchValue = val
tableStore.index()
}
defineExpose({
setSearchValue
})
</script>

175
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/components/userEvaluation.vue Normal file
View File

@@ -0,0 +1,175 @@
<template>
<div>
<TableHeader datePicker area ref="TableHeaderRef" showExport>
<template #select>
<el-form-item label="统计类型">
<el-select
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</el-form-item>
<el-form-item label="筛选数据">
<el-input
v-model="tableStore.table.params.searchValue"
placeholder="请输入项目名称"
clearable
:show-word-limit="true"
:maxlength="32"
/>
</el-form-item>
</template>
<template #operation>
<!-- <el-button icon="el-icon-Download" type="primary">导出</el-button> -->
</template>
</TableHeader>
<Table ref="tableRef" />
<!-- 添加弹窗 -->
<el-dialog draggable v-model="detailDialogVisible" :title="detailDialogTitle" width="1000px">
<div v-loading="detailLoading">
<div style="margin-bottom: 10px; text-align: right">
<el-button icon="el-icon-Download" type="primary" @click="exportDetailEvent">导出</el-button>
</div>
<vxe-table
ref="detailTableRef"
:data="detailData"
auto-resize
v-bind="defaultAttribute"
resizable
show-overflow
height="400px"
>
<vxe-column title="序号" width="60" type="seq" align="center"></vxe-column>
<vxe-column field="subName" title="变电站名称" align="center" min-width="120"></vxe-column>
<vxe-column field="lineName" title="监测点名称" align="center" min-width="120"></vxe-column>
<vxe-column field="objName" title="监测对象名称" align="center" min-width="120"></vxe-column>
<vxe-column field="loadType" title="干扰源类型" align="center" min-width="120"></vxe-column>
<vxe-column field="powerFlag" title="监测位置" align="center" min-width="100"></vxe-column>
<vxe-column field="vharmonicValue" title="监测点污染值" align="center" min-width="120"></vxe-column>
</vxe-table>
</div>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick, watch } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { mainHeight } from '@/utils/layout'
import { useDictData } from '@/stores/dictData'
import { addUse, updateUse, removeUse } from '@/api/advance-boot/bearingCapacity'
//
const detailDialogVisible = ref(false)
const detailLoading = ref(false)
const detailDialogTitle = ref('')
const detailData = ref([])
const dictData = useDictData()
const detailTableRef = ref()
const lineList = dictData.getBasicData('Line_Type')
const options = dictData.getBasicData('Pollution_Calc')
const tableStore = new TableStore({
url: '/harmonic-boot/PollutionSubstation/downPollutionSensitiveUser',
publicHeight: 65,
isWebPaging: true,
method: 'POST',
filename: '监测点台账',
column: [
{
title: '序号',
width: 80,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{
field: 'gdName',
title: '供电公司',
minWidth: 100
},
{ field: 'subStationName', title: '变电站', minWidth: 150 },
{ field: 'projectName', title: '项目名称', minWidth: 150 },
{ field: 'subStationName', title: '变电站名称', minWidth: 150 },
{
field: 'subValue',
title: '污染值',
width: 150,
formatter: (row: any) => {
return row.cellValue == null ? '暂未安装监测点' : row.cellValue
}
},
{
title: '操作',
width: '180',
fixed: 'right',
render: 'buttons',
buttons: [
{
name: 'edit',
title: '监测点污染详情',
type: 'primary',
icon: 'el-icon-Open',
render: 'basicButton',
disabled: row => {
return row.subValue == null
},
click: row => {
detailDialogTitle.value = '监测点污染详情'
console.log('🚀 ~ row:', row)
detailLoading.value = true
detailData.value = row.powerFlagPollutionList
detailDialogVisible.value = true
detailLoading.value = false
}
}
]
}
],
beforeSearchFun: () => {
tableStore.table.params.deptId = tableStore.table.params.deptIndex
tableStore.table.params.ids = [tableStore.table.params.statisticalType?.id]
},
loadCallback: () => {
tableStore.table.column[5].title = tableStore.table.params.statisticalType.name + '污染值'
}
})
tableStore.table.params.searchValue = ''
tableStore.table.params.statisticalType = options[0]
tableStore.table.params.powerFlag = 0
tableStore.table.params.isUpToGrid = 0
// 导出详情数据的方法
const exportDetailEvent = () => {
detailTableRef.value.exportData({
filename: detailDialogTitle.value,
sheetName: 'Sheet1',
type: 'xlsx',
useStyle: true,
data: detailData.value,
columnFilterMethod: function (column: any) {
return !(column.$columnIndex === 0)
}
})
}
provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
const setSearchValue = (val: string) => {
tableStore.table.params.searchValue = val
tableStore.index()
}
defineExpose({
setSearchValue
})
</script>

49
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/index.vue
View File

@@ -2,19 +2,17 @@
<div class="default-main">
<el-tabs v-model="activeTab" type="border-card" @tab-change="handleTabChange">
<el-tab-pane label="监测点评估" name="pollutionReport">
<MonitoringPointTab
ref="monitoringPointTabRef"
:active="activeTab === 'pollutionReport'"
/>
<MonitoringPointTab ref="monitoringPointTabRef" :active="activeTab === 'pollutionReport'" />
</el-tab-pane>
<el-tab-pane label="场站级评估" name="anotherReport">
<SubstationTab
ref="substationTabRef"
:active="activeTab === 'anotherReport'"
/>
<SubstationTab ref="substationTabRef" :active="activeTab === 'anotherReport'" />
</el-tab-pane>
<el-tab-pane label="区域级评估" name="3">
<regionalAssessment v-if="activeTab == '3'" />
</el-tab-pane>
<el-tab-pane label="敏感及重要用户评估" name="4">
<userEvaluation v-if="activeTab == '4'" />
</el-tab-pane>
</el-tabs>
</div>
@@ -22,9 +20,12 @@
<script setup lang="ts">
import { ref } from 'vue'
import MonitoringPointTab from './MonitoringPointTab.vue'
import SubstationTab from './SubstationTab.vue'
import MonitoringPointTab from './components/MonitoringPointTab.vue'
import SubstationTab from './components/SubstationTab.vue'
import regionalAssessment from './components/regionalAssessment.vue'
import userEvaluation from './components/userEvaluation.vue'
import { useRoute } from 'vue-router'
const route = useRoute()
defineOptions({
name: 'harmonic-boot/qydetailedAnalysis/pollutionReport'
})
@@ -33,17 +34,27 @@ const activeTab = ref('pollutionReport')
const monitoringPointTabRef = ref()
const substationTabRef = ref()
const handleTabChange = (tabName: string) => {
if (tabName === 'pollutionReport' && monitoringPointTabRef.value) {
monitoringPointTabRef.value.refresh()
} else if (tabName === 'anotherReport' && substationTabRef.value) {
substationTabRef.value.refresh()
}
}
watch(
() => route.query.t,
async (newValue, oldValue) => {
if (route.fullPath.includes('harmonic-boot/qydetailedAnalysis/pollutionReport')) {
let type = (route.query.type as string) || 'null'
if (type == 'null') {
} else if (type == '2') {
activeTab.value = 'anotherReport'
substationTabRef.value.refresh((route.query.statisticalType as string) || 'null')
} else if (type == '4') {
activeTab.value = '4'
}
}
},
{ deep: true, immediate: true }
)
</script>

28
src/views/pqs/harmonicMonitoring/embed/lntegruty/index_JB.vue
View File

@@ -154,11 +154,7 @@
<vxe-column type="seq" title="序号" width="80px">
<template #default="{ rowIndex }">
<span>
{{
(tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize +
rowIndex +
1
}}
{{ (pageNum - 1) * pageSize + rowIndex + 1 }}
</span>
</template>
</vxe-column>
@@ -216,7 +212,7 @@
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { onMounted, provide, ref } from 'vue'
import { onMounted, provide, ref, watch } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { useDictData } from '@/stores/dictData'
import { mainHeight } from '@/utils/layout'
@@ -225,7 +221,8 @@ import { getMonitorVerifyDay } from '@/api/device-boot/dataVerify'
defineOptions({
name: 'harmonic-boot/harmonic/getIntegrityData'
})
import { useRoute } from 'vue-router'
const route = useRoute()
const dictData = useDictData()
//字典获取监督对象类型
const pageHeight = mainHeight(97)
@@ -490,6 +487,23 @@ onMounted(() => {
tableStore.index()
})
watch(
() => route.query.t,
async (newValue, oldValue) => {
if (route.fullPath.includes('harmonic-boot/harmonic/getIntegrityData')) {
let type = (route.query.type as string) || 'null'
if (type == 'null') {
} else if (type == '1') {
nextTick(() => {
tableStore.table.params.searchValue = (route.query.name as string) || ''
tableStore.index()
})
}
}
},
{ deep: true, immediate: true }
)
tableStore.table.params.name = ''
provide('tableStore', tableStore)
</script>

21
src/views/pqs/harmonicMonitoring/embed/onlinerate/index_JB.vue
View File

@@ -153,7 +153,7 @@
<template #default="{ rowIndex }">
<span>
{{
(tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize +
(pageNum - 1) * pageSize +
rowIndex +
1
}}
@@ -217,7 +217,8 @@ import { getMonitorVerifyDay } from '@/api/device-boot/dataVerify'
defineOptions({
name: 'harmonic-boot/harmonic/getIntegrityData'
})
import { useRoute } from 'vue-router'
const route = useRoute()
const dictData = useDictData()
//字典获取监督对象类型
const pageHeight = mainHeight(97)
@@ -480,6 +481,22 @@ onMounted(() => {
tableStore.index()
})
watch(
() => route.query.t,
async (newValue, oldValue) => {
if (route.fullPath.includes('harmonic-boot/area/OnlineRate')) {
let type = (route.query.type as string) || 'null'
if (type == 'null') {
} else if (type == '1') {
nextTick(() => {
tableStore.table.params.searchValue = (route.query.name as string) || ''
tableStore.index()
})
}
}
},
{ deep: true, immediate: true }
)
tableStore.table.params.name = ''
provide('tableStore', tableStore)

74
src/views/pqs/harmonicMonitoring/monitoringPoint/online/gaojingshujutongji/index_JB.vue Normal file
View File

@@ -0,0 +1,74 @@
<template>
<div>
<TableHeader datePicker ref="TableHeaderRef">
<template v-slot:select>
<el-form-item label="超标指标">
<el-select
v-model="tableStore.table.params.targetId"
clearable
collapse-tags
collapse-tags-tooltip
placeholder="请选择超标指标"
>
<el-option v-for="item in exceeded" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
</template>
</TableHeader>
<Table ref="tableRef" />
</div>
</template>
<script setup lang="ts">
import { nextTick, onMounted, reactive, ref } from 'vue'
import DatePicker from '@/components/form/datePicker/index.vue'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { useMonitoringPoint } from '@/stores/monitoringPoint'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import TableStore from '@/utils/tableStore'
import { useDictData } from '@/stores/dictData'
const dictData = useDictData()
const exceeded = dictData.getBasicData('Steady_Statis')
const monitoringPoint = useMonitoringPoint()
const tableStore = new TableStore({
url: '/supervision-boot/onlineMonitor/overLimitDetail',
publicHeight: 80,
isWebPaging: true,
method: 'POST',
filename: '监测点台账',
column: [
{
title: '序号',
width: 70,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{
field: 'time',
title: '日期',
width: '140px'
},
{
field: 'overLimitInfo',
title: '越限详情'
}
],
beforeSearchFun: () => {
tableStore.table.params.lineId = monitoringPoint.state.lineId
}
})
tableStore.table.params.targetId = exceeded.filter(item => item.code == 'Total_Indicator')[0].id
? exceeded.filter(item => item.code == 'Total_Indicator')[0].id
: ''
onMounted(() => {
tableStore.index()
})
provide('tableStore', tableStore)
</script>
<style></style>

31
src/views/pqs/harmonicMonitoring/monitoringPoint/online/index.vue
View File

@@ -35,7 +35,7 @@
<el-tab-pane label="谐波频谱" name="4" lazy v-if="!isReload">
<Xiebopingpu v-if="activeName == '4'" />
</el-tab-pane>
<el-tab-pane label="告警数据统计" name="5" lazy v-if="!isReload && VITE_FLAG">
<el-tab-pane label="告警数据统计" name="5" lazy v-if="!isReload ">
<Gaojingshujutongji v-if="activeName == '5'" />
</el-tab-pane>
<el-tab-pane label="监测点运行状态" name="6" lazy v-if="!isReload">
@@ -70,9 +70,10 @@ import Wentaizonghepinggu from './wentaizonghepinggu/index.vue'
import Wentaizhibiaohegelv from './wentaizhibiaohegelv/index.vue'
import Wentaishujufenxi from './wentaishujufenxi/index.vue'
import Xiebopingpu from './xiebopingpu/index.vue'
import Gaojingshujutongji from './gaojingshujutongji/index.vue'
import Gaojingshujutongji from './gaojingshujutongji/index_JB.vue'
import Yunxingzhuangtai from './yunxingzhuangtai/index.vue'
import Shishishuju from './shishishuju/index.vue'
import { useRoute } from 'vue-router'
import StatisticalReport from './statisticalReport/index.vue'
const VITE_FLAG = import.meta.env.VITE_NAME == 'jibei'
import router from '@/router'
@@ -80,7 +81,7 @@ import router from '@/router'
defineOptions({
name: 'harmonic-boot/monitor/online'
})
const route = useRoute()
const monitoringPoint = useMonitoringPoint()
const pointTree = ref()
const size = ref(23)
@@ -121,7 +122,9 @@ watch(
{ immediate: true }
)
watch(
() => monitoringPoint.state.lineId,
() => {
return monitoringPoint.state.lineId
},
() => {
// 刷新页面
isReload.value = true
@@ -130,6 +133,26 @@ watch(
})
}
)
watch(
() => route.query.t,
async (newValue, oldValue) => {
if (route.fullPath.includes('harmonic-boot/monitor/online')) {
let type = (route.query.type as string) || 'null'
let lineId = (route.query.id as string) || 'null'
console.log('🚀 ~ type:', type)
if (type == 'null') {
} else {
setTimeout(() => {
monitoringPoint.setValue('lineId', lineId)
activeName.value = type
}, 1000)
}
}
},
{ deep: true, immediate: true }
)
const changeTab = (e: string) => {
activeName.value = e
}

2
src/views/pqs/panorama/components/details/stand.vue
View File

@@ -85,7 +85,7 @@ const options: any = dictData.getBasicData('Pollution_Statis').filter(item => {
return item
}
})
const contaminate = ref(options[0].id)
const contaminate = ref(options[0]?.id)
const rowList: any = ref({})
const trendEChart: any = ref({})
const tableData: any = ref([])

26
src/views/pqs/qualityInspeection/panorama/components/city/exceeded.vue
View File

@@ -10,15 +10,19 @@
<div class="boxSteps">
<el-steps>
<template v-for="(item, i) in Voltage">
<el-step :class="active == i ? 'highlight' : ''" :title="item.name"
@click="handleClick(i)"></el-step>
<el-step
:class="active == i ? 'highlight' : ''"
:title="item.name"
@click="handleClick(i)"
></el-step>
</template>
</el-steps>
</div>
<div v-for="(item, i) in evaluationData" class="evaluationData">
<el-row style="width: 100%">
<el-col :span="12" style="display: flex">
<img :src="url[i]" />
<!-- <img :src="url[i]" /> -->
<span :class="`iconfont ${url[i]} icoColor`"></span>
<span>{{ item.targetName }}</span>
</el-col>
<el-col :span="12" style="display: flex">
@@ -66,11 +70,11 @@ const Voltage: any = dictData.getBasicData('Dev_Voltage_Stand').filter(item => {
const chartRef = ref<HTMLDivElement>()
const url: any = [
new URL(`@/assets/img/PLPC.png`, import.meta.url),
new URL(`@/assets/img/DYPC.png`, import.meta.url),
new URL(`@/assets/img/JBL.png`, import.meta.url),
new URL(`@/assets/img/SXDY.png`, import.meta.url),
new URL(`@/assets/img/SB.png`, import.meta.url)
'icon-frequency',
'icon-dianya',
'icon-dianyazongxiebojibianshuai',
'icon-sanxiangdianyafuzhibupingheng',
'icon-a-253_ipower'
]
const tableData: any = ref([])
@@ -199,6 +203,7 @@ const handleClick = (i: any) => {
defineExpose({ open })
</script>
<style lang="scss" scoped>
@import '@/assets/font/iconfont.css';
:deep(.el-select) {
min-width: 80px;
}
@@ -283,4 +288,9 @@ defineExpose({ open })
// color: var(--el-color-primary) !important;
// }
}
.icoColor {
color: var(--el-color-primary);
margin: 0 20px;
font-size: 20px;
}
</style>

67
src/views/pqs/qualityInspeection/panorama/components/cityMapL.vue
View File

@@ -61,20 +61,20 @@
</div>
</div>
</div>
<!-- 监测点指标统计 -->
<!-- 资产性质 -->
<div :style="`height:calc(${boxHeight.height} + 50px)`">
<div class="title">
<span>监测点指标统计</span>
<span>资产性质</span>
</div>
<div style="display: flex" class="mt2">
<img src="@/assets/img/FGX.png" />
</div>
<div :style="`height:calc(${boxHeight.height} + 20px);overflow-y: auto;`">
<div v-for="item in countList">
<!-- <div class="title mt5" style="font-weight: 500">
<img src="@/assets/img/TJ.png" />
{{ item.title }}
</div> -->
<div class="title mt5" style="font-weight: 500">
<!-- <img src="@/assets/img/TJ.png" />
{{ item.title }} -->
</div>
<div
class="card-Box mt10"
:style="`height:calc((${boxHeight.height} - 20px )/ 2);`"
@@ -95,33 +95,44 @@
</div>
<div>
数据完整性:
<span style="color: #2b7fd3; cursor: text">{{ val.integrityRate }}%</span>
<span style="color: #2b7fd3; cursor: text">{{ val.integrityRate || 0 }}%</span>
</div>
<div>
在线率:
<span style="color: #2b7fd3; cursor: text">{{ val.integrityRate }}%</span>
<span style="color: #2dcd28; cursor: text">{{ val.onLineRate || 0 }}%</span>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 监测点指标统计 -->
<!-- 资产性质 -->
<div :style="`height:calc(${boxHeight.height} - 55px)`">
<div class="title">
<span>监测运行统计</span>
<div class="titleNum">
( 合格:
<span class="mr10" style="color: #2dcd28" @click="LookMap(linList[0].lineListOne, [], 0)">
{{ linList[0].lineNumOne || 0 }}
</span>
告警:
<span style="color: #a52a2a" @click="LookMap(linList[0].lineListOne, [], 0)">
{{ linList[0].lineNumTwo || 0 }}
</span>
)
</div>
</div>
<div style="display: flex" class="mt2">
<img src="@/assets/img/FGX.png" />
</div>
<div :style="`height:calc(${boxHeight.height} - 100px);overflow-y: auto;`" class="BoxA mt10">
<div class="card-Box" v-for="item in linList">
<div>
<div class="card-Box" v-for="item in linList.slice(1)">
<div class="num num2">
<div style="text-align: left">
<span class="line"></span>
<span class="vol">{{ item.title[0] }}</span>
<i class="vol">{{ item.title[0] }}</i>
</div>
<div class="num">
<div>
{{ item.title[1] }}:
<span style="color: #2dcd28" @click="LookMap(item.lineListOne, [], 0)">
@@ -297,9 +308,10 @@ const countList: any = ref([
title: '电网侧监测点',
num: 0,
onLineNum: 0,
integrityRate: 0
integrityRate: 0,
onLineRate: 0
},
{ title: '非电网侧监测点', num: 0, onLineNum: 0, integrityRate: 0 }
{ title: '非电网侧监测点', num: 0, onLineNum: 0, integrityRate: 0, onLineRate: 0 }
]
}
// {
@@ -379,7 +391,7 @@ const info = async (row: any) => {
numOneList: []
})
})
// 监测点指标统计
// 资产性质
getGridDiagramStatistics(form).then(res => {
countList.value[0].children[0] = { title: '电网侧监测点', ...res.data.data[0] }
countList.value[0].children[1] = { title: '非电网侧监测点', ...res.data.data[1] }
@@ -519,13 +531,13 @@ defineExpose({ info, show })
// grid-template-rows: 1fr 1fr;
display: flex;
flex-direction: column;
justify-content: space-evenly;
justify-content: space-around;
// align-items: center;
margin: 0 5px 5px;
padding: 10px;
background-color: #edededc0;
border-radius: 10px;
min-height: 60px;
min-height: 40px;
max-height: 120px;
.line {
@@ -554,7 +566,7 @@ defineExpose({ info, show })
.num1 {
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
gap: 8px;
gap: 15px;
div {
display: flex;
padding-left: 20px;
@@ -563,12 +575,16 @@ defineExpose({ info, show })
}
}
}
.num2 {
display: grid;
grid-template-columns: 1fr 1fr 1fr !important;
}
}
.BoxA {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-template-columns: 1fr;
grid-template-rows: 1fr 1fr 1fr;
// grid-template-rows: 80px;
.num {
@@ -619,4 +635,13 @@ defineExpose({ info, show })
:deep(.el-dialog__body) {
max-height: none !important;
}
.titleNum {
font-size: 13px;
font-weight: normal;
margin-left: 5px;
span {
font-weight: 600;
cursor: pointer;
}
}
</style>

48
src/views/pqs/qualityInspeection/panorama/components/details/evaluate.vue
View File

@@ -1,13 +1,13 @@
<template>
<!-- 综合评估详情 -->
<el-dialog draggable title="区域污染值统计" v-model="dialogVisible" width="1400px">
<el-dialog draggable title="区域污染水平评估" v-model="dialogVisible" width="1400px">
<div style="display: flex">
<div style="width: 400px">
<vxe-table
v-bind="defaultAttribute"
ref="tableRef"
@current-change="currentChangeEvent"
height="240px"
height="250px"
:row-config="{ isCurrent: true, isHover: true }"
:data="tableData"
>
@@ -26,14 +26,14 @@
</vxe-table>
</div>
<div class="ml10" style="width: 990px">
<vxe-table v-bind="defaultAttribute" v-loading="loadingTab" ref="vxeRef" height="240px" :data="subdata">
<vxe-column type="seq" width="70"></vxe-column>
<vxe-column field="devName" title="终端名称"></vxe-column>
<vxe-column field="lineName" title="监测点名称" />
<vxe-column field="powerFlag" title="电网标志" />
<vxe-column field="devType" title="终端型号"></vxe-column>
<vxe-column field="manufacturer" title="终端厂家"></vxe-column>
<vxe-column field="vharmonicValue" title="污染值" sortable>
<vxe-table v-bind="defaultAttribute" v-loading="loadingTab" ref="vxeRef" height="250px" :data="subdata">
<vxe-column type="seq" width="70" title="序号"></vxe-column>
<vxe-column field="subName" title="变电站名称" min-width="120"></vxe-column>
<vxe-column field="lineName" title="监测点名称" align="center" min-width="120"></vxe-column>
<vxe-column field="objName" title="监测对象名称" align="center" min-width="100"></vxe-column>
<vxe-column field="loadType" title="干扰源类型" align="center" min-width="100"></vxe-column>
<vxe-column field="powerFlag" title="监测位置" align="center" min-width="100"></vxe-column>
<vxe-column field="vharmonicValue" title="污染值" sortable min-width="80">
<template #default="scope">
<span
:style="{
@@ -59,7 +59,7 @@
</el-radio-group>
</div> -->
<MyEChart style="height: 300px" :options="picEChart" />
<MyEChart style="height: 300px" :options="picEChart" @echartClick="echartClick"/>
</div>
</el-dialog>
</template>
@@ -68,7 +68,9 @@ import { ref, nextTick } from 'vue'
import MyEChart from '@/components/echarts/MyEchart.vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { useDictData } from '@/stores/dictData'
import { getAssessDetail, getAssessTrend, downPollutionSubCalc } from '@/api/device-boot/panorama'
import { getAssessDetail, getAssessTrend, downPollutionSensitiveUser } from '@/api/device-boot/panorama'
import { useRoute } from 'vue-router'
const router = useRouter()
const dictData = useDictData()
const dialogVisible: any = ref(false)
const rowList: any = ref({})
@@ -108,19 +110,18 @@ const currentChangeEvent = async () => {
const analysis = () => {
loading.value = true
let time = rowList.value.searchBeginTime.slice(0, 4) + `-01-01`
downPollutionSubCalc({ ...rowList.value, ids: [PollutionList[0].id] }).then(res => {
downPollutionSensitiveUser({ ...rowList.value, ids: [PollutionList[0].id], deptId: rowList.value.id }).then(res => {
const first10Items = res.data.slice(0, 10)
picEChart.value = {
title: {
text: '污染值排名前十变电站'
text: '污染值排名前十敏感及重要用户'
},
xAxis: {
name: '',
data: first10Items.map((item: any) => item.subStationName),
data: first10Items.map((item: any) => item.projectName.split('(')[0].trim()),
axisLabel: {
rotate: 30, // 核心：倾斜 45 度（推荐 30/45/60，角度太大易读性差）
rotate: 30 // 核心：倾斜 45 度（推荐 30/45/60，角度太大易读性差）
}
},
grid: {
@@ -139,7 +140,7 @@ const analysis = () => {
// name: time[i],
name: '污染值',
type: 'bar',
data: first10Items.map((item: any) => item.subVStationValue),
data: first10Items.map((item: any) => item.subValue),
itemStyle: {
color: function (params) {
// params.value 是当前柱子的数值
@@ -170,6 +171,17 @@ const setColor = val => {
? '#00B07D'
: ''
}
const echartClick = (res:any) => {
router.push({
name: 'harmonic-boot/qydetailedAnalysis/pollutionReport',
query: {
type: '4',
t: Date.now()
}
})
console.log("🚀 ~ echartClick ~ res:", res)
}
defineExpose({ open })
</script>
<style lang="scss" scoped>

111
src/views/pqs/qualityInspeection/panorama/components/details/point.vue
View File

@@ -19,17 +19,33 @@
<el-col :span="12">
<div class="title">
<span>分布统计</span>
<el-select
<el-radio-group v-model="statisticalType" size="small" @change="getGridDiagramDev">
<el-radio-button v-for="item in options" :label="item.code" @change="statiStics">
{{ item.name }}
</el-radio-button>
</el-radio-group>
<!-- <el-select
v-model="statisticalType"
value-key="id"
style="width: 120px; margin-right: 80px"
@change="statiStics"
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</el-select> -->
</div>
<div class="pie">
<MyEChart style="height: 260px" :options="picEChart" />
<!-- <MyEChart style="height: 260px" :options="picEChart" /> -->
<MyEChart style="height: 260px; width: 50%" :options="picEChart" />
<el-table size="small" height="260px" style="width: 50%" :data="picList">
<el-table-column prop="orgName" width="90px" align="center">
<template #default="scope">
{{ scope.row.orgName.split('(')[0].trim() }}
</template>
</el-table-column>
<el-table-column prop="integrityRate" label="完整性(%)" align="center"></el-table-column>
<el-table-column prop="onLineRate" label="在线率(%)" align="center" />
<el-table-column prop="outOfStandardRate" label="超标占比(%)" align="center" />
</el-table>
</div>
</el-col>
</el-row>
@@ -55,12 +71,12 @@ import { useDictData } from '@/stores/dictData'
import { getGridDiagramLineTendency, getGridDiagramLineData, getHalfReport } from '@/api/device-boot/panorama'
const dictData = useDictData()
const dialogVisible: any = ref(false)
const picList: any = ref([])
const Voltage = dictData.getBasicData('Dev_Voltage_Stand')
const tableData: any = ref([])
const options = dictData.getBasicData('Statistical_Type', ['Report_Type', 'Power_Network'])
const options = dictData.getBasicData('Statistical_Type', ['Report_Type', 'Power_Network', 'JB_Power_Flag'])
const time = ref('1')
const statisticalType = ref(options[0])
const statisticalType = ref('Load_Type')
const loadTypeArr = dictData.getBasicData('Interference_Source')
const rowList: any = ref({})
@@ -141,52 +157,65 @@ const analysis = (e: any) => {
}
// 统计
const statiStics = () => {
getGridDiagramLineData({ ...rowList.value, statisticalType: statisticalType.value }).then(res => {
getGridDiagramLineData({
...rowList.value,
statisticalType: options.filter((item: any) => item.code == statisticalType.value)[0]
}).then(res => {
picList.value = res.data
let picData: any = []
const total = res.data.reduce((sum, item) => {
const num = (item.orgName.match(/\((\d+)\)/) || [])[1] || 0
return sum + Number(num)
}, 0)
res.data.forEach((item: any) => {
let value = (item.orgName.match(/\((\d+)\)/) || [])[1] || 0
picData.push({
value: value,
name: item.orgName,
proportion: (value / total).toFixed(2)
})
})
picEChart.value = {
title: {
text: ''
tooltip: {
trigger: 'item',
formatter: '{b}: 占比 {d}% '
},
legend: {
show: false
},
xAxis: {
data: res.data.map((item: any) => item.orgName)
show: false
},
yAxis: {
name: '%',
min: 0,
max: 100
show: false
},
options: {
dataZoom: null,
series: [
{
name: '数据完整性',
type: 'bar',
type: 'pie',
startAngle: 360,
center: ['50%', '55%'],
radius: ['40%', '60%'],
endAngle: 0,
labelLine: {
length: 8,
length2: 30,
show: true
},
label: {
padding: [0, -30],
formatter: '{b}\n\n'
},
itemStyle: {
borderColor: '#fff',
borderWidth: 1
},
data: res.data.map((item: any) => item.integrityRate),
label: {
show: true,
position: 'top',
fontSize: 12
}
},
{
name: '在线率',
type: 'bar',
data: res.data.map((item: any) => item.onLineRate),
label: {
show: true,
position: 'top',
fontSize: 12
}
},
{
name: '超标监测点占比',
type: 'bar',
data: res.data.map((item: any) => item.outOfStandardRate),
label: {
show: true,
position: 'top',
fontSize: 12
}
data: picData.sort((a, b) => b.value - a.value)
}
]
}

140
src/views/pqs/qualityInspeection/panorama/components/details/propInfo.vue Normal file
View File

@@ -0,0 +1,140 @@
<template>
<div class="propInfo" v-if="show">
<div class="top">
<el-form :inline="false" label-width="auto">
<el-form-item label=" 筛选:">
<el-input v-model="value" size="small" clearable placeholder="请输入关键字进行筛选"></el-input>
</el-form-item>
</el-form>
<Close class="ico" @click="show = false" />
</div>
<vxe-table
height="200px"
:data="filterDataByKeyword(dataList, value)"
size="mini"
border
ref="tableRef"
align="center"
showOverflow
v-loading="loading"
:row-config="{ isCurrent: true, isHover: true }"
:columnConfig="{ resizable: true }"
@current-change="currentChangeEvent"
style="z-index: 0;"
>
<vxe-column type="seq" title="序号" width="70px"></vxe-column>
<vxe-column field="gdName" title="供电公司"></vxe-column>
<vxe-column field="subName" title="变电站名称"></vxe-column>
<!-- <vxe-column field="deviceName" title="终端名称"></vxe-column> -->
<!-- <vxe-column field="ip" title="IP"></vxe-column> -->
<vxe-column field="lineName" title="监测点名称"></vxe-column>
<!-- <vxe-column field="loadType" title="干扰源"></vxe-column> -->
<vxe-column field="loadType" title="干扰源类型"></vxe-column>
<vxe-column field="objName" title="监测对象"></vxe-column>
</vxe-table>
</div>
</template>
<script setup lang="ts">
import { onMounted, nextTick, ref, provide } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { Close } from '@element-plus/icons-vue'
const emit = defineEmits(['flyTo'])
const value = ref('')
const tableRef=ref()
const dataList = ref([])
const loading = ref(false)
const open = (data: any) => {
dataList.value = []
loading.value = true
show.value = true
setTimeout(() => {
dataList.value = data
loading.value = false
}, 1000)
}
/**
* 根据关键字过滤数据，匹配gdName/subName/deviceName字段
* @param {Array} data - 原始数据数组
* @param {string} keyword - 过滤关键字（支持多关键字空格分隔，忽略大小写）
* @returns {Array} 过滤后的结果数组
*/
function filterDataByKeyword(data, keyword) {
// 空关键字直接返回全部数据
if (!keyword || keyword.trim() === '') {
return [...data] // 返回新数组，避免修改原数据
}
// 处理关键字：转小写、去除首尾空格、拆分多关键字（空格分隔）
const keywords = keyword
.trim()
.toLowerCase()
.split(/\s+/)
.filter(k => k)
// 无有效关键字时返回全部
if (keywords.length === 0) {
return [...data]
}
// 过滤逻辑
return data.filter(item => {
// 提取需要匹配的三个字段，统一转小写（忽略大小写）
const gdName = (item.gdName || '').toLowerCase()
const subName = (item.subName || '').toLowerCase()
const deviceName = (item.deviceName || '').toLowerCase()
const ip = (item.ip || '').toLowerCase()
const lineName = (item.lineName || '').toLowerCase()
// 多关键字需全部匹配（逻辑与）
return keywords.every(key => {
// 只要有一个字段包含关键字，就匹配成功
return (
gdName.includes(key) ||
subName.includes(key) ||
deviceName.includes(key) ||
ip.includes(key) ||
lineName.includes(key)
)
})
})
}
const currentChangeEvent=()=>{
// tableRef.value.getCurrentRecord()
console.log("🚀 ~ currentChangeEvent ~ tableRef.value.getCurrentRecord():", tableRef.value.getCurrentRecord())
let data=tableRef.value.getCurrentRecord()
emit('flyTo',{ coordinate: [data.lng, data.lat] }, 16)
}
const show = ref(false)
defineExpose({ open, show })
</script>
<style lang="scss" scoped>
.propInfo {
position: absolute;
width: 48%;
bottom: 10px;
left: 26%;
background-color: #fff;
padding: 10px;
// z-index: 1;
}
.vxe-table--render-default.size--mini .vxe-body--column:not(.col--ellipsis),
.vxe-table--render-default.size--mini .vxe-footer--column:not(.col--ellipsis),
.vxe-table--render-default.size--mini .vxe-header--column:not(.col--ellipsis) {
padding: 5px;
}
.top {
width: 100%;
height: 40px;
background-color: #fff;
display: flex;
justify-content: space-between;
.ico {
height: 20px;
cursor: pointer;
margin-top: 8px;
}
}
</style>

44
src/views/pqs/qualityInspeection/panorama/components/details/stand.vue
View File

@@ -18,14 +18,14 @@
</el-col>
<el-col :span="12">
<div class="title">
<span>
<span class="text-style" @click="jump">
污染告警
<el-popover placement="right" :width="190" trigger="hover">
<template #reference>
<WarningFilled class="WarningFilled" />
</template>
<div class="text">
<span style="color: #00B07D">无污染：0</span>
<span style="color: #00b07d">无污染：0</span>
<br />
<span style="color: #3399ff">轻微污染：(0 , 100]</span>
<br />
@@ -33,7 +33,7 @@
<br />
<span style="color: #ff9900">中度污染：(1000 , 10000]</span>
<br />
<span style="color: #A52a2a">重度污染：(10000</span>
<span style="color: #a52a2a">重度污染：(10000</span>
</div>
</el-popover>
</span>
@@ -51,12 +51,7 @@
</div>
<!-- :style="i == 3 ? `margin-left: 20%;` : ``" -->
<div class="pie">
<MyEChart
v-for="(item, i) in picEChart"
class="MyEChart"
:options="item"
/>
<MyEChart v-for="(item, i) in picEChart" @click="echartClick" class="MyEChart" :options="item" />
</div>
</el-col>
</el-row>
@@ -72,7 +67,7 @@
<vxe-column field="num3" sortable title="轻度污染数量" :formatter="formatter" />
<vxe-column field="num4" sortable title="中度污染数量" :formatter="formatter" />
<vxe-column field="num5" sortable title="重度污染数量" :formatter="formatter" />
<vxe-column field="num6" sortable title="暂无数据数量" :formatter="formatter" />
<!-- <vxe-column field="num6" sortable title="暂无数据数量" :formatter="formatter" /> -->
</vxe-table>
</div>
</el-dialog>
@@ -82,9 +77,10 @@ import { ref } from 'vue'
import MyEChart from '@/components/echarts/MyEchart.vue'
import { useDictData } from '@/stores/dictData'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { WarningFilled } from '@element-plus/icons-vue'
import { getPollutionAlarmList, getPollutionAlarmData, getGridDiagramSubTendency } from '@/api/device-boot/panorama'
import { useRouter } from 'vue-router'
const router = useRouter()
const dictData = useDictData()
const dialogVisible: any = ref(false)
const time = ref('1')
@@ -95,7 +91,7 @@ const options: any = dictData.getBasicData('Pollution_Calc')
// return item
// }
// })
const contaminate = ref(options[0].id)
const contaminate = ref(options[0]?.id)
const rowList: any = ref({})
const trendEChart: any = ref({})
const tableData: any = ref([])
@@ -290,8 +286,7 @@ const contaminateC = () => {
let a3 = tableData.value.reduce((t, item) => t + (item.num3 - 0 || 0), 0)
let a4 = tableData.value.reduce((t, item) => t + (item.num4 - 0 || 0), 0)
let a5 = tableData.value.reduce((t, item) => t + (item.num5 - 0 || 0), 0)
let a6 = tableData.value.reduce((t, item) => t + (item.num6 - 0 || 0), 0)
let total = a1 + a2 + a3 + a4 + a5 + a6
let total = a1 + a2 + a3 + a4 + a5
// if (rowList.value.isUpToGrid == 0) {
// data = res.data.info
// } else {
@@ -331,11 +326,7 @@ const contaminateC = () => {
{
value: ((a5 / total || 0) * 100).toFixed(2),
name: `重度污染：${a5}座`
},
{
value: ((a6 / total || 0) * 100).toFixed(2),
name: `暂无数据：${a6}座`
},
}
]
const color = ['#00B07D', '#3399ff', '#ffcc33', '#ff9900', '#A52a2a', '#ccc']
@@ -500,6 +491,17 @@ const handleClose = () => {
dialogVisible.value = false
}
const jump = () => {
router.push({
name: 'harmonic-boot/qydetailedAnalysis/pollutionReport',
query: {
type: '2',
statisticalType:contaminate.value,
t: Date.now()
}
})
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
@@ -531,4 +533,8 @@ defineExpose({ open })
:deep(.el-dialog__body) {
max-height: none !important;
}
.text-style {
cursor: pointer;
text-decoration: underline;
}
</style>

37
src/views/pqs/qualityInspeection/panorama/components/details/steadyState.vue
View File

@@ -10,15 +10,19 @@
<div class="boxSteps">
<el-steps>
<template v-for="(item, i) in Voltage">
<el-step :class="active == i ? 'highlight' : ''" :title="item.name"
@click="handleClick(i)"></el-step>
<el-step
:class="active == i ? 'highlight' : ''"
:title="item.name"
@click="handleClick(i)"
></el-step>
</template>
</el-steps>
</div>
<div v-for="(item, i) in evaluationData" class="evaluationData">
<el-row style="width: 100%">
<el-col :span="12" style="display: flex">
<img :src="url[i]" />
<span :class="`iconfont ${url[i]} icoColor`"></span>
<!-- <img :src="url[i]" /> -->
<span>{{ item.targetName }}</span>
</el-col>
<el-col :span="12" style="display: flex">
@@ -90,11 +94,16 @@ const Voltage: any = dictData.getBasicData('Dev_Voltage_Stand').filter(item => {
const chartRef = ref<HTMLDivElement>()
const url: any = [
new URL(`@/assets/img/PLPC.png`, import.meta.url),
new URL(`@/assets/img/DYPC.png`, import.meta.url),
new URL(`@/assets/img/JBL.png`, import.meta.url),
new URL(`@/assets/img/SXDY.png`, import.meta.url),
new URL(`@/assets/img/SB.png`, import.meta.url)
'icon-frequency',
'icon-dianya',
'icon-dianyazongxiebojibianshuai',
'icon-sanxiangdianyafuzhibupingheng',
'icon-a-253_ipower'
// new URL(`@/assets/img/PLPC.png`, import.meta.url),
// new URL(`@/assets/img/DYPC.png`, import.meta.url),
// new URL(`@/assets/img/JBL.png`, import.meta.url),
// new URL(`@/assets/img/SXDY.png`, import.meta.url),
// new URL(`@/assets/img/SB.png`, import.meta.url)
]
const tableData: any = ref([])
const title = ['频率偏差(超标)', '电压偏差(超标)', '电压总谐波畸变率(超标)', '闪变(超标)', '三相电压不平衡度(超标)']
@@ -108,7 +117,8 @@ const echart = (row: any) => {
let chart = echarts.init(chartRef.value as HTMLDivElement)
let dataname = ['频率偏差(Hz)',
let dataname = [
'频率偏差(Hz)',
'电压偏差(%)',
'电压总谐波畸变率(%)',
'三相电压不平衡度(%)',
@@ -116,7 +126,8 @@ const echart = (row: any) => {
'谐波电压(%)',
'谐波电流(%)',
'间谐波电压(%)',
'负序电流(A)']
'负序电流(A)'
]
// let datamax = [100, 100, 100, 100, 100, 100]
let indicator = []
for (let i = 0; i < dataname.length; i++) {
@@ -247,6 +258,7 @@ const handleClick = (i: any) => {
defineExpose({ open })
</script>
<style lang="scss" scoped>
@import '@/assets/font/iconfont.css';
:deep(.el-select) {
min-width: 80px;
}
@@ -335,4 +347,9 @@ defineExpose({ open })
:deep(.el-dialog__body) {
max-height: none !important;
}
.icoColor{
color: var(--el-color-primary);
margin: 0 20px;
font-size: 20px;
}
</style>

44
src/views/pqs/qualityInspeection/panorama/components/details/temporaryState.vue
View File

@@ -5,10 +5,27 @@
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="360px" :data="tableData">
<vxe-column field="name" title="区域" />
<vxe-column sortable field="sagTimes" title="暂降次数" />
<vxe-column sortable field="swellTimes" title="暂升次数" />
<vxe-column sortable field="interruptTimes" title="短时中断次数" />
<vxe-column sortable field="sagTimes" title="暂降次数">
<template #default="{ row }">
<span class="text-style" @click="transientOpen(row.sagTimesIds, row.name, '暂降')">
{{ row.sagTimes }}
</span>
</template>
</vxe-column>
<vxe-column sortable field="swellTimes" title="暂升次数">
<template #default="{ row }">
<span class="text-style" @click="transientOpen(row.swellTimesIds, row.name, '暂升')">
{{ row.swellTimes }}
</span>
</template>
</vxe-column>
<vxe-column sortable field="interruptTimes" title="短时中断次数">
<template #default="{ row }">
<span class="text-style" @click="transientOpen(row.interruptTimesIds, row.name, '短时中断')">
{{ row.interruptTimes }}
</span>
</template>
</vxe-column>
<vxe-colgroup title="暂态严重度占比">
<vxe-column sortable field="rate90" title="SARFI-90" />
<vxe-column sortable field="rate50" title="SARFI-50" />
@@ -39,19 +56,21 @@
</div>
</div>
</el-dialog>
<!-- 暂态详情 -->
<transientDetails ref="transientRef" />
</template>
<script setup lang="ts">
import { ref } from 'vue'
import MyEChart from '@/components/echarts/MyEchart.vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { getEventReason, getEventDetailByList } from '@/api/device-boot/panorama'
import transientDetails from './transientDetails.vue'
import { ElMessage } from 'element-plus'
const dialogVisible: any = ref(false)
const transientRef = ref()
const tableData: any = ref([])
const descentData = ref([])
const resembleData = ref([])
const picEChart = ref({})
const picEChart1 = ref({})
const open = async (row: any) => {
@@ -130,6 +149,13 @@ const open = async (row: any) => {
})
dialogVisible.value = true
}
// 查看详情
const transientOpen = (row: any, name: string, type: string) => {
if (row == null || row?.length == 0) {
return ElMessage.info('暂无详情')
}
transientRef.value.open(row, name, type)
}
defineExpose({ open })
</script>
@@ -150,4 +176,8 @@ defineExpose({ open })
:deep(.el-dialog__body) {
max-height: none !important;
}
.text-style {
cursor: pointer;
text-decoration: underline;
}
</style>

78
src/views/pqs/qualityInspeection/panorama/components/details/terminal.vue
View File

@@ -19,6 +19,10 @@
<el-col :span="12">
<div class="title">
<span>分布统计</span>
<el-radio-group v-model="type" size="small" @change="getGridDiagramDev">
<el-radio-button label="1">区域</el-radio-button>
<el-radio-button label="3">终端厂家</el-radio-button>
</el-radio-group>
</div>
<div class="pie">
<MyEChart style="height: 260px; width: 50%" :options="picEChart" />
@@ -77,11 +81,12 @@ const dialogVisible: any = ref(false)
const time = ref('1')
const rowList: any = ref({})
const tableData: any = ref()
const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Type', 'Voltage_Level', 'Load_Type'])
const picList = ref([])
const type = ref('1')
const trendEChart: any = ref({})
const loadingTab = ref(false)
const picEChart = ref()
const open = async (row: any) => {
time.value = '1'
@@ -97,13 +102,49 @@ const open = async (row: any) => {
analysis(1)
dialogVisible.value = true
//分布统计
getGridDiagramDevData(rowList.value).then(res => {
picList.value = res.data
getGridDiagramDev()
// 列表
getGridDiagramDevDataList({
deviceInfoParam: {
...row,
serverName: 'pqs-common',
ids: [row.id],
runFlag: [],
comFlag: [],
manufacturer: dictData.getBasicData('Dev_Manufacturers'),
statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0]
},
...row,
serverName: 'pqs-common',
ids: [row.id],
runFlag: [],
comFlag: [],
manufacturer: dictData.getBasicData('Dev_Manufacturers'),
statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0]
}).then((res: any) => {
tableData.value = res.data
})
}
const getGridDiagramDev = async () => {
loadingTab.value = true
let data = JSON.parse(JSON.stringify(rowList.value))
data.deviceInfoParam.statisticalType = type.value == '1' ? classificationData[0] : classificationData[1]
data.statisticalType = type.value == '1' ? classificationData[0] : classificationData[1]
await getGridDiagramDevData(data).then((res: any) => {
const total = res.data.reduce((sum, item) => {
return sum + item.devCount
}, 0)
picList.value = type.value == '1' ? res.data : res.data.filter((item: any) => item.devCount != 0)
let picData: any = []
res.data.forEach((item: any) => {
picList.value = picList.value.sort((a, b) => b.devCount - a.devCount)
picList.value.forEach((item: any) => {
picData.push({
value: item.devCount,
name: `${item.orgName}`,
name: `${item.orgName}(${item.devCount})`,
proportion: (item.devCount / total).toFixed(2),
itemStyle: {
color: item.onlineEvaluate < 60 ? 'red' : item.onlineEvaluate < 90 ? 'orange' : 'green'
}
@@ -113,7 +154,7 @@ const open = async (row: any) => {
picEChart.value = {
tooltip: {
trigger: 'item',
formatter: '{b} :在运终端数 {c} 台'
formatter: '{b}: 占比 {d}% '
},
legend: {
show: false
@@ -153,29 +194,8 @@ const open = async (row: any) => {
}
}
})
// 列表
getGridDiagramDevDataList({
deviceInfoParam: {
...row,
serverName: 'pqs-common',
ids: [row.id],
runFlag: [],
comFlag: [],
manufacturer: dictData.getBasicData('Dev_Manufacturers'),
statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0]
},
...row,
serverName: 'pqs-common',
ids: [row.id],
runFlag: [],
comFlag: [],
manufacturer: dictData.getBasicData('Dev_Manufacturers'),
statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0]
}).then((res: any) => {
tableData.value = res.data
})
loadingTab.value = false
}
const analysis = (e: any) => {
let time = rowList.value.searchBeginTime.slice(0, 4) + `-01-01`

58
src/views/pqs/qualityInspeection/panorama/components/details/transientDetails.vue Normal file
View File

@@ -0,0 +1,58 @@
<!-- 暂态 -->
<template>
<el-dialog draggable :title="title" v-model="dialogVisible" width="800px">
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="360px" :data="tableData">
<vxe-column title="序号" width="70" type="seq"></vxe-column>
<vxe-column field="lineName" title="监测点名称" />
<vxe-column field="subName" title="变电站名称"></vxe-column>
<vxe-column field="devName" title="终端名称"></vxe-column>
<vxe-column sortable field="count" :title="types + '次数'"></vxe-column>
</vxe-table>
</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import MyEChart from '@/components/echarts/MyEchart.vue'
import { useDictData } from '@/stores/dictData'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { getEventDetailByList } from '@/api/device-boot/panorama'
const dictData = useDictData()
const dialogVisible: any = ref(false)
const list = dictData.getBasicData('Event_Statis')
const tableData: any = ref([])
const title = ref('详情')
const types = ref('')
// Event_Statis
const open = async (row: any, name: string, type: string) => {
types.value = type
title.value = name + type + '详情'
tableData.value = row
dialogVisible.value = true
}
// 查看详情
defineExpose({ open })
</script>
<style lang="scss" scoped>
.statistics-main {
// height: 300px;
display: grid;
width: 100%;
grid-template-columns: 1fr 1fr;
.statistics-box {
// height: 300px;
// display: flex;
display: grid;
grid-template-columns: 2fr 1fr;
}
}
:deep(.el-dialog__body) {
max-height: none !important;
}
.text-style {
cursor: pointer;
text-decoration: underline;
}
</style>

238
src/views/pqs/qualityInspeection/panorama/components/line/info.vue
View File

@@ -3,8 +3,8 @@
<DatePicker ref="datePickerRef" style="display: none" theCurrentTime />
<el-page-header :icon="ArrowLeft" @back="emit('back')">
<template #content>
<span style="font-size: 16px">{{ dropList.lineName }}详情　</span>
<span style="font-weight: 500">最新数据时间：</span>
<span style="">{{ dropList.gdName }}_{{ dropList.bdName }}_{{ dropList.lineName }}</span>
<span style="font-weight: 500" class="ml20">最新数据时间：</span>
<span style="color: var(--color-primary-default)">{{ dropList.updateTime }}</span>
<span style="font-weight: 500" class="ml20">统计日期：</span>
<span style="color: var(--color-primary-default)">
@@ -14,21 +14,27 @@
</el-page-header>
<el-row :gutter="20" class="mt10" :style="`height:${rowHeight}`">
<el-col :span="8">
<h3 class="mb10 iconBox">
<h3 class="mb10 iconBox text-style" @click="clickLinName">
<span></span>
台账信息
</h3>
<el-descriptions title="" border :column="2">
<el-descriptions-item label="监测点名称" width="140px">
<el-descriptions title="" label-width="100px" border :column="2" size="small">
<el-descriptions-item label="变电站名称">
{{ dropList.bdName }}
</el-descriptions-item>
<el-descriptions-item label="监测点名称">
{{ dropList.lineName }}
</el-descriptions-item>
<el-descriptions-item label="监测对象名称">
{{ dropList.objName }}
</el-descriptions-item>
<el-descriptions-item label="所属厂家">{{ dropList.manufacturer }}</el-descriptions-item>
<el-descriptions-item label="电压等级">{{ dropList.scale }}</el-descriptions-item>
<el-descriptions-item label="投运日期">{{ dropList.loginTime }}</el-descriptions-item>
<el-descriptions-item label="PT">{{ dropList.pt }}</el-descriptions-item>
<el-descriptions-item label="CT">{{ dropList.ct }}</el-descriptions-item>
<!-- <el-descriptions-item label="PT">{{ dropList.pt }}</el-descriptions-item>
<el-descriptions-item label="CT">{{ dropList.ct }}</el-descriptions-item> -->
<el-descriptions-item label="干扰源类型">{{ dropList.loadType }}</el-descriptions-item>
<el-descriptions-item label="通讯状态" width="140px">
<el-descriptions-item label="通讯状态">
<el-tag size="small" :type="dropList.comFlag == '正常' ? 'success' : 'danger'" effect="dark">
{{ dropList.comFlag }}
</el-tag>
@@ -36,9 +42,12 @@
</el-descriptions>
</el-col>
<el-col :span="8">
<h3 class="mb10 iconBox">
<h3
class="mb10 iconBox text-style"
@click="TargetData.info == 1 ? clickAlarm(5) : TargetData.info == 2 ? Integrity() : ''"
>
<span></span>
告警明细 (天)
告警天数
</h3>
<el-descriptions title="" border :column="2" size="small">
<el-descriptions-item width="140px" label="告警原因">
@@ -78,6 +87,42 @@
</el-descriptions-item>
</el-descriptions>
</el-col>
<el-col :span="8">
<h3 class="mb10 iconBox text-style" @click="clickAlarm(8)" >
<span></span>
告警明细
</h3>
<!-- <vxe-table
height="200px"
:data="evaluationData"
size="mini"
border
align="center"
showOverflow
:columnConfig="{ resizable: true }"
>
<vxe-column field="targetName" title="供电公司"></vxe-column>
<vxe-column field="avg" title="幅值"></vxe-column>
<vxe-column field="xz" title="最大限值"></vxe-column>
</vxe-table> -->
<el-table :data="evaluationData" size="small" border>
<el-table-column prop="targetName" align="center" label="指标名称" />
<el-table-column prop="avg" align="center" label="最大幅值">
<template #default="{ row }">
{{ row.avg == 3.14159 ? '/' : Math.floor(row.avg * 100) / 100 }}
</template>
</el-table-column>
<el-table-column prop="xz" align="center" label="限值">
<template #default="{ row }">
{{ row.xz == 3.14159 ? '/' : row.xz }}
</template>
</el-table-column>
</el-table>
</el-col>
</el-row>
<el-row :gutter="20" class="mt10" :style="`height:${rowHeight}`">
<el-col :span="8">
<h3 class="mb10 iconBox">
<span></span>
@@ -92,75 +137,16 @@
/>
</div>
</el-col>
</el-row>
<el-row :gutter="20" class="mt10" :style="`height:${rowHeight}`">
<el-col :span="8">
<h3 class="mb10 iconBox">
<span></span>
监测点总体评价结论
</h3>
<div class="evaluationData">
<el-row style="width: 96%" class="row pb5">
<el-col :span="12" style="display: flex">
<span>{{ dropList.lineName }}</span>
</el-col>
<el-col :span="12" style="display: flex">
<div>
综合评估得分:
<span
class="conclusion"
:class="
dropList.assessData == '特质'
? 'background1'
: dropList.assessData == '较差'
? 'background2'
: dropList.assessData == '极差'
? 'background3'
: ''
"
>
{{ dropList.assessData }}
</span>
</div>
</el-col>
</el-row>
<el-row style="width: 96%" v-for="(item, i) in evaluationData" class="row pb4 pt3">
<el-col :span="14" style="display: flex; align-items: center">
<img :src="url[i]" />
<span style="line-height: 20px">{{ item.targetName }}</span>
</el-col>
<el-col :span="10" style="display: flex; align-items: center">
<div style="width: 100%">
评估得分：
<span
class="conclusion"
:class="
item.avg == '特质'
? 'background1'
: item.avg == '较差'
? 'background2'
: item.avg == '极差'
? 'background3'
: ''
"
>
{{ item.avg }}
</span>
</div>
</el-col>
</el-row>
</div>
</el-col>
<el-col :span="8">
<h3 class="mb10 iconBox">
<h3 class="mb10 iconBox text-style" @click="clickAlarm(2)">
<span></span>
稳态指标合格率
</h3>
<div :style="`height: calc(${rowHeight} - 31px)`" ref="chartRef"></div>
<div :style="`height: calc(${rowHeight} - 31px); `" ref="chartRef"></div>
</el-col>
<el-col :span="8">
<h3 class="mb10 iconBox">
<h3 class="mb10 iconBox text-style" @click="clickTransient()">
<span></span>
暂态事件统计
</h3>
@@ -199,10 +185,12 @@ import {
lineQualifiedDetail,
getLineAssess,
getEventDetailByLineId,
getGridDiagramTargetData
getGridDiagramTargetData,
limitTableDetail
} from '@/api/device-boot/panorama'
import { formatter } from 'element-plus'
const emit = defineEmits(['back'])
const dropList: any = ref({})
const TargetData: any = ref({})
@@ -388,37 +376,41 @@ const open = async (id: string) => {
})
// 监测点总体评价结论
getLineAssess({
limitTableDetail({
lineId: id,
startTime: datePickerRef.value.timeValue[0],
endTime: datePickerRef.value.timeValue[1]
monitorIds: [id],
searchBeginTime: datePickerRef.value.timeValue[0],
searchEndTime: datePickerRef.value.timeValue[1],
searchState: 0,
lineRunFlag: 0,
}).then((res: any) => {
dropList.value.assessData = res.data.assessLevel
// dropList.value.assessData = res.data.assessLevel
evaluationData.value = [
{
targetName: '频率偏差(Hz)',
avg: res.data.freqAssessLevel,
sd: res.data.freqQualifyData
targetName: '频率偏差',
avg: res.data.freqData,
xz: res.data.freqLimit
},
{
targetName: '电压偏差(%)',
avg: res.data.vdevAssessLevel,
sd: res.data.vdevQualifyData
targetName: '电压偏差',
avg: res.data.vdevData,
xz: res.data.vdevLimit
},
{
targetName: '电压总谐波畸变率(%)',
avg: res.data.harmAssessLevel,
sd: res.data.harmQualifyData
targetName: '电压总谐波畸变率',
avg: res.data.udevData,
xz: res.data.uaberranceLimit
},
{
targetName: '三相电压不平衡度(%)',
avg: res.data.unbalanceAssessLevel,
sd: res.data.unbalanceQualifyData
targetName: '三相电压不平衡度',
avg: res.data.unbalanceData,
xz: res.data.unbalanceLimit
},
{
targetName: '闪变',
avg: res.data.flickerAssessLevel,
sd: res.data.flickerQualifyData
avg: res.data.flickerData,
xz: res.data.flickerLimit
}
]
})
@@ -687,15 +679,58 @@ const echart = (row: any) => {
// 跳转
const Integrity = () => {
router.push({
name: 'harmonic-boot/harmonic/getIntegrityData'
})
name: 'harmonic-boot/harmonic/getIntegrityData',
query: {
type: '1',
name: dropList.value.lineName,
t: Date.now()
}
const OnlineRate = () => {
router.push({
name: 'harmonic-boot/area/OnlineRate'
})
}
const OnlineRate = () => {
router.push({
name: 'harmonic-boot/area/OnlineRate',
query: {
type: '1',
name: dropList.value.devName,
t: Date.now()
}
})
}
// 跳转在线监测点
const clickAlarm = (value: any) => {
router.push({
name: 'harmonic-boot/monitor/online',
query: {
type: value,
id: lineId.value,
t: Date.now()
}
})
}
// 跳转暂态列表
const clickTransient = () => {
router.push({
name: 'Descentsystem/transientList',
query: {
type: '1',
name: dropList.value.lineName,
t: Date.now()
}
})
}
// 跳转台账信息
const clickLinName = () => {
router.push({
name: 'Supervision/Terminaldetection',
query: {
type: '5',
name: dropList.value.lineName,
t: Date.now()
}
})
}
onMounted(() => {
// open('4c87b7dff2281254fc55c25a4da31506')
})
@@ -735,7 +770,7 @@ defineExpose({ open })
.iconBox {
display: flex;
align-items: center;
span {
display: inline-block;
width: 3px;
@@ -767,4 +802,11 @@ defineExpose({ open })
background-color: #a52a2a;
color: #fff;
}
:deep(.el-table--small .el-table__cell) {
padding: 2px 0 !important;
}
.text-style {
cursor: pointer;
text-decoration: underline;
}
</style>

80
src/views/pqs/qualityInspeection/panorama/components/map.vue
View File

@@ -19,6 +19,12 @@
</template>
</el-input>
</div>
<div>
<!-- <el-button @click="showPsrmap" class="psrmapBut">电网图层</el-button> -->
<el-checkbox-group v-model="group" @change="showPsrmap" size="small" class="psrmapBut">
<el-checkbox-button value="1" label="电网图层"></el-checkbox-button>
</el-checkbox-group>
</div>
<!-- 搜索内容展示 -->
<div class="query-box-wrap collapse" v-show="showWrap">
<div v-if="QueryList.length == 0" class="collapse_none">查询无结果</div>
@@ -50,6 +56,8 @@
展开搜索结果
</div>
</div>
<!-- 点击弹框 -->
<propInfo ref="propInfoRef" @flyTo="flyTo"/>
</template>
<script setup lang="ts">
@@ -63,7 +71,8 @@ import { getGridDiagramAreaData } from '@/api/device-boot/panorama'
import { Search } from '@element-plus/icons-vue'
import '@/assets/panorama/narimap.css'
import '@/assets/panorama/nrgisCommon.css'
const emit = defineEmits(['changeValue', 'drop', 'show'])
import propInfo from '@/views/pqs/qualityInspeection/panorama/components/details/propInfo.vue'
const emit = defineEmits(['changeValue', 'drop', 'show', 'setLine'])
const prop = defineProps({
lineInfo: {
type: Boolean
@@ -77,6 +86,7 @@ const datePickerRef = ref()
const form: any = ref({})
const colorKey = ref('')
const PopKey = ref(2)
const propInfoRef = ref()
const assessList: any = ref([])
const linList: any = ref([])
const QueryList: any = ref([])
@@ -144,7 +154,7 @@ narimap.Require(
// ['PSRMap', 'Components.Query', 'Marker'],
() => {
if (narimap.Config.examples.notlogin) {
initMap(narimap.Config.styles.sjRaster)
initMap(narimap.Config.styles.sjDark)
} else {
//电网GIS地图服务登录
narimap.SGAuth.login()
@@ -156,7 +166,7 @@ narimap.Require(
}
//默认打开电网GIS影像图
initMap(narimap.Config.styles.sjRaster)
initMap(narimap.Config.styles.sjDark)
})
.catch((err: any) => {
console.log('错误', err)
@@ -278,7 +288,6 @@ const addSource = async () => {
// }
// }
// ]
console.log('🚀 ~ sourceList:', sourceList.value)
if (map.value.getSource('themeData')) {
map.value.getSource('themeData').setData({
@@ -353,30 +362,52 @@ const addSource = async () => {
*/
'heatmap-opacity': 1
},
maxzoom: 12
maxzoom: 12,
layout: {
visibility: 'none'
}
})
}
}
const changeHeat = e => {
map.value.setLayoutProperty('earthquakes-paint', 'visibility', e ? 'visible' : 'none')
}
const psrmap = ref(null)
// 添加变电站线路
const addLine = () => {
//添加电网图层
let psrmap = new narimap.PSRMap(map.value, {
psrmap.value = new narimap.PSRMap(map.value, {
orgId: orgId.value == '1100F3DE20806FADE050007F01006CBE' ? '' : orgId.value
// disableFilterByUserAuth:new narimap.Config.examples.disableFilterByUserAuth
})
psrmap.addPSR()
psrmap.value.addPSR()
initDeviceCard()
setTimeout(() => {
psrmap.filterByDomain(1)
// psrmap.filterByDomain(1)
}, 0)
psrmap.value.on('load', () => {
// 显示电网图层
// psrmap.value.hide()
})
//添加电网要素点击事件
psrmap.on('click', (features: any) => {
psrmap.value.on('click', (features: any) => {
console.log(features)
showCollapse.value = false
if (inputQuery.value.length == 0) showWrap.value = false
})
}
const group = ref(['1'])
const showPsrmap = e => {
if (e.length > 0) {
psrmap.value.show()
} else {
psrmap.value.hide()
}
}
const propInfoShow=ref(false)
// 添加变电站弹框
const initDeviceCard = () => {
deviceCard.value && deviceCard.value.close()
@@ -401,10 +432,13 @@ const initDeviceCard = () => {
deviceCard.value.on('click', (res: any) => {
if (res.button.id == 'nariPopupViewDetail') {
emit('show', true)
propInfoShow.value=propInfoRef.value.show
propInfoRef.value.show=false
}
setTimeout(() => {
document.querySelectorAll('.nari-tabs__close')[0].onclick = function (v: any) {
emit('show', false)
propInfoRef.value.show=propInfoShow.value
}
}, 10)
})
@@ -726,6 +760,7 @@ const addLayer = () => {
const PollutionList = dictData.getBasicData('Pollution_Calc').filter(item => item.name == '谐波电压')
//添加多个监测点
const lineData = ref([])
const addMarkers = async (row?: any, key?: any, num?: any) => {
if (map.value == null) return
let params = {
@@ -740,7 +775,7 @@ const addMarkers = async (row?: any, key?: any, num?: any) => {
statisticalType: {},
...row
}
lineData.value = []
let { data } = await getAreaLineInfo(params)
let r = 0.0035
@@ -756,6 +791,7 @@ const addMarkers = async (row?: any, key?: any, num?: any) => {
}
item.children.forEach((val: any, i: number) => {
lineData.value.push(val)
val.lng = item.lng + r * Math.cos((2 * Math.PI * i) / item.children.length)
val.lat = item.lat + r * Math.sin((2 * Math.PI * i) / item.children.length)
val.imageUrl =
@@ -796,18 +832,6 @@ const addMarkers = async (row?: any, key?: any, num?: any) => {
break
}
}
let num = 20
if (val.vharmonicValue > 10000) {
num = 100
} else if (val.vharmonicValue > 1000) {
num = 80
} else if (val.vharmonicValue > 100) {
num = 60
} else if (val.vharmonicValue > 0) {
num = 40
} else {
num = 20
}
sourceList.value.push({
type: 'Feature',
@@ -817,12 +841,16 @@ const addMarkers = async (row?: any, key?: any, num?: any) => {
},
properties: {
value: val.vharmonicValue || 0
// value: num //10 //val.vharmonicValue || 0
// value: 0
}
})
})
})
console.log('🚀 ~ addMarkers ~ num:', key)
if (key != undefined) {
propInfoRef.value.open(lineData.value)
// emit('setLine', lineData.value)
}
if (flag.value) {
linList.value = [...tempFeatureZ, ...tempFeatureT]
@@ -1150,7 +1178,7 @@ const createMapSelectorComponent = () => {
)
}
defineExpose({ locatePositions, addMarkers, grids, DeviceQ, radiusPop, flyTo })
defineExpose({ locatePositions, addMarkers, grids, DeviceQ, radiusPop, flyTo, changeHeat })
const height = mainHeight(20)
</script>

68
src/views/pqs/qualityInspeection/panorama/components/mapL.vue
View File

@@ -61,10 +61,10 @@
</div>
</div>
</div>
<!-- 监测点指标统计 -->
<!-- 资产性质 -->
<div :style="`height:calc(${boxHeight.height} + 50px)`">
<div class="title">
<span>监测点指标统计</span>
<span>资产性质</span>
</div>
<div style="display: flex" class="mt2">
<img src="@/assets/img/FGX.png" />
@@ -97,33 +97,48 @@
<div>
数据完整性:
<span style="color: #2b7fd3; cursor: text">{{ val.integrityRate }}%</span>
<span style="color: #2b7fd3; cursor: text">{{ val.integrityRate || 0 }}%</span>
</div>
<div>
在线率:
<span style="color: #2b7fd3; cursor: text">{{ val.integrityRate }}%</span>
<span style="color: #2dcd28; cursor: text">{{ val.onLineRate || 0 }}%</span>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 监测点指标统计 -->
<!-- 资产性质 -->
<div :style="`height:calc(${boxHeight.height} - 55px)`">
<div class="title">
<span>监测运行统计</span>
<div class="titleNum">
( 合格:
<span class="mr10" style="color: #2dcd28" @click="LookMap(linList[0].lineListOne, [], 0)">
{{ linList[0].lineNumOne || 0 }}
</span>
告警:
<span style="color: #a52a2a" @click="LookMap(linList[0].lineListOne, [], 0)">
{{ linList[0].lineNumTwo || 0 }}
</span>
)
</div>
</div>
<div style="display: flex" class="mt2">
<img src="@/assets/img/FGX.png" />
</div>
<div :style="`height:calc(${boxHeight.height} - 100px);overflow-y: auto;`" class="BoxA mt10">
<div class="card-Box" v-for="item in linList">
<div>
<div class="card-Box" v-for="item in linList.slice(1)">
<!-- <div>
<span class="line"></span>
<span class="vol">{{ item.title[0] }}</span>
</div> -->
<div class="num num2">
<div style="text-align: left">
<span class="line"></span>
<i class="vol">{{ item.title[0] }}</i>
</div>
<div class="num">
<div>
{{ item.title[1] }}:
<span style="color: #2dcd28" @click="LookMap(item.lineListOne, [], 0)">
@@ -148,12 +163,12 @@
@click="show = !show"
src="@/assets/img/QH.png"
/>
<div class="legeng">
<!-- <div class="legeng">
<div v-for="item in legengList">
<span :style="`background-color: ${item.color};`"></span>
<span>{{ item.title }}</span>
</div>
</div>
</div> -->
<!-- 变电站详情 -->
<stand ref="standRef" />
@@ -305,9 +320,10 @@ const countList: any = ref([
title: '电网侧监测点',
num: 0,
onLineNum: 0,
integrityRate: 0
integrityRate: 0,
onLineRate: 0
},
{ title: '非电网侧监测点', num: 0, onLineNum: 0, integrityRate: 0 }
{ title: '非电网侧监测点', num: 0, onLineNum: 0, integrityRate: 0, onLineRate: 0 }
]
}
// {
@@ -409,7 +425,7 @@ const info = async (row: any) => {
numOneList: []
})
})
// 监测点指标统计
// 资产性质
getGridDiagramStatistics(form).then(res => {
countList.value[0].children[0] = { title: '电网侧监测点', ...res.data.data[0] }
countList.value[0].children[1] = { title: '非电网侧监测点', ...res.data.data[1] }
@@ -549,13 +565,13 @@ defineExpose({ info, show })
// grid-template-rows: 1fr 1fr;
display: flex;
flex-direction: column;
justify-content: space-evenly;
justify-content: space-around;
// align-items: center;
margin: 0 5px 5px;
padding: 10px;
background-color: #edededc0;
border-radius: 10px;
min-height: 60px;
min-height: 40px;
// max-height: 120px;
.line {
@@ -581,10 +597,11 @@ defineExpose({ info, show })
font-weight: 550;
}
}
.num1 {
grid-template-columns: 1fr 1fr; /* 核心：改为2列，均分宽度 */
grid-template-rows: auto auto;
gap: 8px; /* 可选：子元素间距，提升美观度 */
gap: 15px; /* 可选：子元素间距，提升美观度 */
div {
display: flex;
padding-left: 20px;
@@ -594,12 +611,16 @@ defineExpose({ info, show })
}
}
}
.num2 {
display: grid;
grid-template-columns: 1fr 1fr 1fr !important;
}
}
.BoxA {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-template-columns: 1fr;
grid-template-rows: 1fr 1fr 1fr;
// grid-template-rows: 80px;
.num {
@@ -655,7 +676,7 @@ defineExpose({ info, show })
position: absolute;
padding: 5px;
bottom: 0;
right: -75px;
right: -78px;
width: 70px;
font-size: 12px;
height: 120px;
@@ -679,4 +700,13 @@ defineExpose({ info, show })
}
}
}
.titleNum {
font-size: 13px;
font-weight: normal;
margin-left: 5px;
span {
font-weight: 600;
cursor: pointer;
}
}
</style>

20
src/views/pqs/qualityInspeection/panorama/components/mapR.vue
View File

@@ -5,7 +5,7 @@
<div style="height: 110px">
<div class="title">
<span>
稳态综合评估
区域污染水平评估
<el-popover placement="right" :width="190" trigger="hover">
<template #reference>
<WarningFilled class="WarningFilled" />
@@ -22,6 +22,15 @@
<span style="color: #a52a2a">重度污染：(10000</span>
</div>
</el-popover>
<el-switch
v-model="heat"
class="ml5"
@change="changeHeat"
size="small"
inline-prompt
active-text="热力图"
inactive-text="热力图"
/>
</span>
<span class="info" @click="open(0)">
详情
@@ -256,6 +265,7 @@ import {
getEventLevelEvaluation,
getSupervisionData
} from '@/api/device-boot/panorama'
const emit = defineEmits(['changeHeat'])
const dictData = useDictData()
const show = ref(false)
const height = mainHeight(30)
@@ -309,6 +319,7 @@ const options = ref([
value: '9'
}
])
const heat = ref(false)
const technology: any = ref({})
const harmonicType = ref('6')
const transientNum = ref([0, 0])
@@ -375,7 +386,10 @@ const open = (e: number) => {
techniqueRef.value.open(formRow.value)
}
}
const setColor = val => {
const changeHeat = (e:any) => {
emit('changeHeat', e)
}
const setColor = (val:any) => {
return val == 3.14159
? ''
: val > 10000
@@ -390,7 +404,7 @@ const setColor = val => {
? '#00B07D'
: ''
}
const setVal = val => {
const setVal = (val:any) => {
return val == 3.14159
? '/'
: val > 10000

17
src/views/pqs/qualityInspeection/panorama/components/style/map.scss
View File

@@ -7,7 +7,12 @@
.Icon {
width: 30px;
height: 30px;
background-image: url('@/assets/icons/网公司.svg');
background-color: var(--el-color-primary);
border-radius: 5px;
background-image: url('@/assets/img/inlogo.png');
background-size: 25px;
background-repeat: no-repeat;
background-position: center;
}
.el-input__icon {
font-size: 20px;
@@ -200,3 +205,13 @@
width: 450px;
z-index: 0;
}
.psrmapBut{
position: absolute;
bottom: 103px;
right: 60px;
// z-index: 0.1;
}
#nrDeviceCard{
z-index: 1;
}

37
src/views/pqs/qualityInspeection/panorama/index.vue
View File

@@ -4,14 +4,19 @@
<DatePicker ref="datePickerRef" style="display: none" theCurrentTime />
<el-form :inline="true" :model="form" class="demo-form-inline">
<el-form-item>
<Area ref="areaRef" :show-all-levels="false" v-model="form.orgNo" style="width: 100px"
@changeValue="changeValue" />
<Area
ref="areaRef"
:show-all-levels="false"
v-model="form.orgNo"
style="width: 100px"
@changeValue="changeValue"
/>
</el-form-item>
<el-form-item>
<!-- <el-form-item>
<el-select v-model="form.isUpToGrid" style="width: 100px" @change="info">
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
</el-form-item> -->
<el-form-item>
<div class="Icon" @click="reset">
<Icon name="fa fa-refresh" />
@@ -21,13 +26,19 @@
</div>
<!-- 地图 -->
<Map v-if="VITE_FLAG" ref="mapRef" @changeValue="changeValue" :lineInfo="lineInfo" @drop="drop"
@show="infoShow" />
<Map
v-if="VITE_FLAG"
ref="mapRef"
@changeValue="changeValue"
:lineInfo="lineInfo"
@drop="drop"
@show="infoShow"
/>
<div v-show="lineInfo">
<!-- 省级 -->
<div v-show="control == 1">
<mapL ref="mapLRef" class="mapL" @LookMap="LookMap" @GridDiagram="GridDiagram" />
<mapR ref="mapRRef" class="mapR" />
<mapR ref="mapRRef" class="mapR" @changeHeat="changeHeat" />
</div>
<!-- 市级 -->
<!-- <div v-show="control == 4"> -->
@@ -102,6 +113,15 @@ const changeValue = (e: any) => {
info()
}
// 热力图开关
const changeHeat = (e: boolean) => {
console.log("🚀 ~ changeHeat ~ e:", e)
mapRef.value.changeHeat(e)
if(e){
mapRef.value.flyTo({ coordinate: [116.84428600000001, 40.57707185292256] }, 6.409267680647425)
}
}
//点击监测点详情
const drop = (id: string) => {
lineInfo.value = false
@@ -178,6 +198,7 @@ const info = () => {
form.value.type = datePickerRef.value.interval
VITE_FLAG ? mapRef.value.grids(form.value) : ''
VITE_FLAG ? mapRef.value.addMarkers() : ''
if (control.value == 1) {
mapLRef.value.info(form.value)
mapRRef.value.info(form.value)
@@ -254,7 +275,7 @@ onMounted(() => {
.mapR {
position: absolute;
top: 10px;
// z-index: 1;
z-index: 1;
right: 10px;
}

2
src/views/pqs/runManage/runEvaluate/index_JB.vue
View File

@@ -131,7 +131,7 @@
<template #default="{ rowIndex }">
<span>
{{
(tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize +
(pageNum - 1) * pageSize +
rowIndex +
1
}}

2
src/views/pqs/supervise/electricalEnergy/components1/form/detail.vue
View File

@@ -2,7 +2,7 @@
<el-dialog draggable v-model="dialogVisible" :title="title" width="80%" :before-close="handleClose">
<div style="height: 45vh" v-loading="loading">
<vxe-table show-overflow v-bind="defaultAttribute" :data="List">
<vxe-column field="time" title="日期" width="230px"></vxe-column>
<vxe-column field="time" title="日期" width="140px"></vxe-column>
<vxe-column field="overLimitInfo" title="越限详情"></vxe-column>
</vxe-table>
</div>

17
src/views/pqs/supervise/electricalEnergy/components1/online.vue
View File

@@ -6,6 +6,9 @@
<el-form-item label="区域">
<Area ref="areaRef" v-model="tableStore.table.params.deptId" @changeValue="changeArea" />
</el-form-item>
<el-form-item label="筛选数据">
<el-input v-model="tableStore.table.params.searchValue" clearable maxlength="32" show-word-limit placeholder="请输入监测点名称" />
</el-form-item>
<el-form-item label="监测点性质">
<el-select v-model="tableStore.table.params.lineType" clearable placeholder="请选择监测点性质">
<el-option label="电网侧" value="0" />
@@ -34,8 +37,7 @@
inactive-text="无数据"
/>
</el-form-item>
<el-form-item label="预警阈值">
<!-- <el-input v-model="tableStore.table.params.alertThreshold" placeholder="请输入预警阈值" clearable></el-input> -->
<!-- <el-form-item label="预警阈值">
<el-input-number
v-model="tableStore.table.params.alertThreshold"
:min="0"
@@ -52,7 +54,7 @@
step-strictly
@change="changeAlarm"
/>
</el-form-item>
</el-form-item> -->
<!-- <el-form-item label="搜索">
<el-input
v-model="tableStore.table.params.searchValue"
@@ -89,7 +91,9 @@ import detail from './form/detail.vue'
const VITE_FLAG = import.meta.env.VITE_NAME == 'jibei'
const dictData = useDictData()
import { useRouter } from 'vue-router'
defineOptions({
name: 'supervision/electricitymanagement'
})
const router = useRouter() // 路由对象
//字典获取超标指标
const exceeded = dictData.getBasicData('Steady_Statis')
@@ -319,8 +323,9 @@ const tableStore = new TableStore({
// ]
}
})
tableStore.table.params.alertThreshold = 5
tableStore.table.params.alarmThreshold = 5
tableStore.table.params.alertThreshold = 1
tableStore.table.params.alarmThreshold = 1
tableStore.table.params.searchValue = ''
tableStore.table.params.targetList = exceeded.filter(item => item.code == 'Total_Indicator')[0].id
? [exceeded.filter(item => item.code == 'Total_Indicator')[0].id]
: []

5
src/views/pqs/supervise/electricalEnergy/index.vue
View File

@@ -1,13 +1,13 @@
<template>
<div class="default-main">
<el-tabs v-model="activeName" type="border-card">
<el-tab-pane label="在线监测问题" name="1" v-if="tabList.includes('1')">
<el-tab-pane :label="VITE_FLAG ? '在线监测评估' : '在线监测问题'" name="1" v-if="tabList.includes('1')">
<online v-if="activeName == '1'" />
</el-tab-pane>
<el-tab-pane label="用户投诉问题" name="2" v-if="tabList.includes('2')">
<complaints v-if="activeName == '2'" />
</el-tab-pane>
<el-tab-pane label="计划实施问题" name="3" v-if="tabList.includes('3')">
<el-tab-pane :label="VITE_FLAG ? '现场测试' : '计划实施问题'" name="3" v-if="tabList.includes('3')">
<testQuestions v-if="activeName == '3'" />
</el-tab-pane>
<el-tab-pane label="试运行评估" name="4" v-if="tabList.includes('4')">
@@ -33,6 +33,7 @@ import testRun from './components1/testRun.vue'
const VITE_FLAG = import.meta.env.VITE_NAME == 'jibei'
// import maintenance from './components/maintenance.vue'
// import audit from './components/audit.vue'
import { mainHeight } from '@/utils/layout'
defineOptions({
name: 'supervision/electricitymanagement'

2
src/views/pqs/supervise/harmonicSurvey/index.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="default-main">
<el-tabs v-model="activeName" type="border-card">
<el-tab-pane :label="VITE_FLAG ? '工作计划指定' : '技术监督计划管理'" name="1" v-if="tabList.includes('1')">
<el-tab-pane :label="VITE_FLAG ? '工作计划制定' : '技术监督计划管理'" name="1" v-if="tabList.includes('1')">
<plan-manage :id="id" v-if="activeName == '1'" />
</el-tab-pane>
<el-tab-pane :label="VITE_FLAG ? '工作计划实施' : '技术监督测试管理'" name="2" v-if="tabList.includes('2')">

2
src/views/pqs/supervise/terminal/components/deviceLedgerTable.vue
View File

@@ -122,7 +122,7 @@ const tableStore = new TableStore({
}
})
tableStore.table.params.runF=null
tableStore.table.params.runF=0
tableStore.table.params.runFlag=[]
tableStore.table.params.searchValue=''

63
src/views/pqs/supervise/terminal/components/monitorLedgerTable.vue
View File

@@ -2,7 +2,7 @@
<div>
<TableHeader area ref="TableHeaderRef" showExport>
<template #select>
<el-form-item label='运行状态'>
<el-form-item label="运行状态">
<el-select v-model="tableStore.table.params.runF" clearable placeholder="请选择运行状态">
<el-option
v-for="item in runFlagList"
@@ -13,9 +13,13 @@
</el-select>
</el-form-item>
<el-form-item label="信息查询">
<el-input style="width:240px;" placeholder="电站名称，终端编号，监测点名称" v-model="tableStore.table.params.searchValue" clearable></el-input>
<el-input
style="width: 240px"
placeholder="电站名称，终端编号，监测点名称"
v-model="tableStore.table.params.searchValue"
clearable
></el-input>
</el-form-item>
</template>
<template #operation>
@@ -26,7 +30,7 @@
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue'
import { ref, onMounted, provide, nextTick, watch } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
@@ -40,6 +44,7 @@ const interferenceType = dictData.getBasicData('Interference_Source')
const istatusList = dictData.getBasicData('On-network_Status')
const TableHeaderRef = ref()
const areaOptionList = dictData.getBasicData('jibei_area')
const tableStore = new TableStore({
url: '/device-boot/runManage/getLineLedger',
publicHeight: 65,
@@ -47,9 +52,13 @@ const tableStore = new TableStore({
method: 'POST',
filename: '监测点台账',
column: [
{ title: '序号', width: 80,formatter: (row: any) => {
{
title: '序号',
width: 80,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
} },
}
},
{
field: 'areaName',
@@ -67,9 +76,12 @@ const tableStore = new TableStore({
{ field: 'scale', title: '监测点电压等级', minWidth: 120 },
{ field: 'loadType', title: '干扰源类型', minWidth: 120 },
{ field: 'objName', title: '监测对象名称', minWidth: 180 ,
{
field: 'objName',
title: '监测对象名称',
minWidth: 180,
formatter: (row: any) => {
return row.objName ? row.objName : '/'
return row.cellValue ? row.cellValue : '/'
}
},
{
@@ -95,13 +107,12 @@ const tableStore = new TableStore({
minWidth: 80,
render: 'tag',
custom: {
'投运': 'success',
'停运': 'danger',
'检修': 'warning',
'调试': 'warning',
'退运': 'danger',
},
投运: 'success',
停运: 'danger',
检修: 'warning',
调试: 'warning',
退运: 'danger'
}
},
{ field: 'devName', title: '监测终端编号 ', minWidth: 140 },
{ field: 'ptType', title: '监测终端接线方式', minWidth: 140 },
@@ -114,8 +125,7 @@ const tableStore = new TableStore({
field: 'uvoltageDev',
title: '电压偏差下限(%)',
minWidth: 140
},
}
/* {
title: '操作',
@@ -152,15 +162,28 @@ const tableStore = new TableStore({
}
})
tableStore.table.params.runF=null
tableStore.table.params.runF = 0
tableStore.table.params.runFlag = []
tableStore.table.params.searchValue = ''
const runFlagList = [{id:0,name:'运行'},{id:1,name:'检修'},{id:2,name:'停运'},{id:3,name:'调试'},{id:4,name:'退运'}]
const runFlagList = [
{ id: 0, name: '运行' },
{ id: 1, name: '检修' },
{ id: 2, name: '停运' },
{ id: 3, name: '调试' },
{ id: 4, name: '退运' }
]
provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
const setSearchValue = (val:string) => {
tableStore.table.params.searchValue = val
tableStore.index()
}
defineExpose({
setSearchValue
})
</script>

176
src/views/pqs/supervise/terminal/components/transformerStationLedger.vue Normal file
View File

@@ -0,0 +1,176 @@
<template>
<div>
<TableHeader area ref="TableHeaderRef" showExport>
<template #select>
<el-form-item label="数据类型">
<el-select v-model="tableStore.table.params.dataType" clearable placeholder="请选择运行状态">
<el-option label="主网" value="0"></el-option>
<el-option label="配网" value="1"></el-option>
</el-select>
</el-form-item>
<el-form-item label="监测点类别">
<el-select v-model="tableStore.table.params.lineType" clearable placeholder="请选择运行状态">
<el-option
v-for="item in lineList"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="筛选数据">
<el-input
style="width: 240px"
placeholder=""
v-model="tableStore.table.params.searchValue"
clearable
></el-input>
</el-form-item>
</template>
<template #operation>
<!-- <el-button icon="el-icon-Download" type="primary">导出</el-button> -->
</template>
</TableHeader>
<Table ref="tableRef" />
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick, watch } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { mainHeight } from '@/utils/layout'
import { useDictData } from '@/stores/dictData'
import { addUse, updateUse, removeUse } from '@/api/advance-boot/bearingCapacity'
const dictData = useDictData()
const lineList = dictData.getBasicData('Line_Type')
const tableStore = new TableStore({
url: '/device-boot/distributionArea/getPowerDistributionAreaList',
publicHeight: 65,
isWebPaging: true,
method: 'POST',
filename: '监测点台账',
column: [
{
title: '序号',
width: 80,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{
field: 'areaName',
title: '省公司',
minWidth: 100
},
{ field: 'gdName', title: '市公司', minWidth: 150 },
{
field: 'bdName',
title: '所属变电站',
minWidth: 150
},
{ field: 'lineName', title: '监测点名称', minWidth: 130 },
{ field: 'scale', title: '监测点电压等级', minWidth: 120 },
{ field: 'loadType', title: '干扰源类型', minWidth: 120 },
{
field: 'objName',
title: '监测对象名称',
minWidth: 180,
formatter: (row: any) => {
return row.cellValue ? row.cellValue : '/'
}
},
{
field: 'shortCapacity',
title: '最小短路容量(MVA)',
minWidth: 150
},
{
field: 'devCapacity',
title: '供电终端容量(MVA )',
minWidth: 160
},
{
field: 'dealCapacity',
title: '用户协议容量(MVA)',
minWidth: 150
},
/* { field: 'comFlag', title: '通讯状态 ', minWidth: 120 },*/
{ field: 'id', title: '监测点序号', minWidth: 90 },
{
field: 'runFlag',
title: '运行状态',
minWidth: 80,
render: 'tag',
custom: {
投运: 'success',
停运: 'danger',
检修: 'warning',
调试: 'warning',
退运: 'danger'
}
},
{ field: 'devName', title: '监测终端编号 ', minWidth: 140 },
{ field: 'ptType', title: '监测终端接线方式', minWidth: 140 },
{
field: 'voltageDev',
title: '电压偏差上限(%)',
minWidth: 140
},
{
field: 'uvoltageDev',
title: '电压偏差下限(%)',
minWidth: 140
}
/* {
title: '操作',
minWidth: 150,
fixed: 'right',
render: 'buttons',
buttons: [
{
name: 'productSetting',
title: '流程详情',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
}
}
]
}*/
],
beforeSearchFun: () => {
tableStore.table.params.orgId = tableStore.table.params.deptIndex
}
})
tableStore.table.params.searchValue = ''
tableStore.table.params.dataType = ''
tableStore.table.params.lineType = ''
provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
const setSearchValue = (val: string) => {
tableStore.table.params.searchValue = val
tableStore.index()
}
defineExpose({
setSearchValue
})
</script>

156
src/views/pqs/supervise/terminal/components/userLedger.vue Normal file
View File

@@ -0,0 +1,156 @@
<template>
<div>
<TableHeader ref="TableHeaderRef" showExport>
<template #select>
<el-form-item label="筛选数据">
<el-input
style="width: 240px"
placeholder="请输入用户名称"
v-model="tableStore.table.params.searchValue"
clearable
></el-input>
</el-form-item>
</template>
<template #operation>
<!-- <el-button icon="el-icon-Download" type="primary">导出</el-button> -->
</template>
</TableHeader>
<Table ref="tableRef" />
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick, watch } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { mainHeight } from '@/utils/layout'
import { useDictData } from '@/stores/dictData'
import { addUse, updateUse, removeUse } from '@/api/advance-boot/bearingCapacity'
const dictData = useDictData()
const lineList = dictData.getBasicData('Line_Type')
const tableStore = new TableStore({
url: '/device-boot/generationUser/getPowerGenerationUserPageList',
publicHeight: 65,
isWebPaging: true,
method: 'POST',
filename: '监测点台账',
column: [
{
title: '序号',
width: 80,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{
field: 'areaName',
title: '省公司',
minWidth: 100
},
{ field: 'gdName', title: '市公司', minWidth: 150 },
{
field: 'bdName',
title: '所属变电站',
minWidth: 150
},
{ field: 'lineName', title: '监测点名称', minWidth: 130 },
{ field: 'scale', title: '监测点电压等级', minWidth: 120 },
{ field: 'loadType', title: '干扰源类型', minWidth: 120 },
{
field: 'objName',
title: '监测对象名称',
minWidth: 180,
formatter: (row: any) => {
return row.cellValue ? row.cellValue : '/'
}
},
{
field: 'shortCapacity',
title: '最小短路容量(MVA)',
minWidth: 150
},
{
field: 'devCapacity',
title: '供电终端容量(MVA )',
minWidth: 160
},
{
field: 'dealCapacity',
title: '用户协议容量(MVA)',
minWidth: 150
},
/* { field: 'comFlag', title: '通讯状态 ', minWidth: 120 },*/
{ field: 'id', title: '监测点序号', minWidth: 90 },
{
field: 'runFlag',
title: '运行状态',
minWidth: 80,
render: 'tag',
custom: {
投运: 'success',
停运: 'danger',
检修: 'warning',
调试: 'warning',
退运: 'danger'
}
},
{ field: 'devName', title: '监测终端编号 ', minWidth: 140 },
{ field: 'ptType', title: '监测终端接线方式', minWidth: 140 },
{
field: 'voltageDev',
title: '电压偏差上限(%)',
minWidth: 140
},
{
field: 'uvoltageDev',
title: '电压偏差下限(%)',
minWidth: 140
}
/* {
title: '操作',
minWidth: 150,
fixed: 'right',
render: 'buttons',
buttons: [
{
name: 'productSetting',
title: '流程详情',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
}
}
]
}*/
],
beforeSearchFun: () => {
tableStore.table.params.orgId = tableStore.table.params.deptIndex
}
})
tableStore.table.params.searchValue = ''
provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
const setSearchValue = (val: string) => {
tableStore.table.params.searchValue = val
tableStore.index()
}
defineExpose({
setSearchValue
})
</script>

24
src/views/pqs/supervise/terminal/index.vue
View File

@@ -14,19 +14,27 @@
<deviceLedgerTable v-if="activeName == '4'" />
</el-tab-pane>
<el-tab-pane label="监测点台账" name="5" v-if="tabList.includes('5')">
<monitorLedgerTable v-if="activeName == '5'" />
<monitorLedgerTable ref="monitorLedgerRef" v-if="activeName == '5'" />
</el-tab-pane>
<!-- <el-tab-pane label="布式光伏台区台账" name="6" v-if="tabList.includes('6')">
<transformerStationLedger ref="monitorLedgerRef" v-if="activeName == '6'" />
</el-tab-pane>
<el-tab-pane label="布式光伏用户台账" name="7" v-if="tabList.includes('7')">
<userLedger ref="monitorLedgerRef" v-if="activeName == '7'" />
</el-tab-pane> -->
</el-tabs>
</div>
</template>
<script setup lang="ts">
import { onMounted, reactive, ref, provide } from 'vue'
import { onMounted, reactive, ref, provide, nextTick } from 'vue'
import interferenceUserTable from './components/interferenceUserTable.vue'
import sensitiveUserTable from './components/sensitiveUserTable.vue'
import substationLedger from './components/substationLedger.vue'
import deviceLedgerTable from './components/deviceLedgerTable.vue'
import monitorLedgerTable from './components/monitorLedgerTable.vue'
import transformerStationLedger from './components/transformerStationLedger.vue'
import userLedger from './components/userLedger.vue'
import { mainHeight } from '@/utils/layout'
import { useRoute } from 'vue-router'
const route = useRoute()
@@ -35,9 +43,10 @@ const id = ref('')
defineOptions({
name: 'Supervision/Terminaldetection'
})
const activeName = ref('1')
const tabList = ref(['1', '2', '3', '4', '5'])
const activeName = ref('1')
const tabList = ref(['1', '2', '3', '4', '5', '6', '7'])
const monitorLedgerRef = ref()
onMounted(() => {
let key = window.location.href.split('?')[0].slice(-1)
const isNumber = /^\d$/.test(key)
@@ -54,8 +63,13 @@ watch(
if (type == 'null') {
} else if (type == '1') {
activeName.value = '1'
} else if (type == '5') {
activeName.value = '5'
setTimeout(() => {
monitorLedgerRef.value.setSearchValue((route.query.name as string) || '')
}, 500)
}
id.value = (route.query.id as string) || 'null'
id.value = (route.query.name as string) || ''
id.value = id.value + '@' + route.query.t
}
},

4
src/views/pqs/supervise/testRun/index.vue
View File

@@ -23,6 +23,9 @@
</TableHeader>
<Table ref="tableRef" :checkbox-config="checkboxConfig" />
</el-tab-pane>
<el-tab-pane label="试运行评估问题" name="2">
<testRun v-if="activeName == '2'" />
</el-tab-pane>
</el-tabs>
<!-- <el-dialog
@@ -61,6 +64,7 @@ import { ElMessage, ElMessageBox } from 'element-plus'
import { addRunTest, update, cancel } from '@/api/supervision-boot/lineRunTest'
import { formatDate } from '@/utils/formatTime'
import { VxeTablePropTypes } from 'vxe-table'
import testRun from '@/views/pqs/supervise/electricalEnergy/components1/testRun.vue';
import { useAdminInfo } from '@/stores/adminInfo'
import { getFileNameAndFilePath } from '@/api/system-boot/file'
import { deleteTempLineRunTestReport } from '@/api/supervision-boot/delete/index'

2
src/views/pqs/supervise_hn/electricalEnergy/components1/form/detail.vue
View File

@@ -2,7 +2,7 @@
<el-dialog draggable v-model="dialogVisible" v-loading="loading" :title="title" width="80%" :before-close="handleClose">
<div style="height: 45vh">
<vxe-table show-overflow v-bind="defaultAttribute" :data="List">
<vxe-column field="time" title="日期" width="230px"></vxe-column>
<vxe-column field="time" title="日期" width="140px"></vxe-column>
<vxe-column field="overLimitInfo" title="越限详情"></vxe-column>
</vxe-table>
</div>

2
src/views/pqs/supervise_hn/terminal/components/deviceLedgerTable.vue
View File

@@ -123,7 +123,7 @@ const tableStore = new TableStore({
}
})
tableStore.table.params.runF=null
tableStore.table.params.runF=0
tableStore.table.params.runFlag=[]
tableStore.table.params.searchValue=''

2
src/views/pqs/supervise_hn/terminal/components/monitorLedgerTable.vue
View File

@@ -147,7 +147,7 @@ const tableStore = new TableStore({
}
})
tableStore.table.params.runF = null
tableStore.table.params.runF = 0
tableStore.table.params.runFlag = []
tableStore.table.params.searchValue = ''

185
src/views/pqs/voltageSags/monitoringPoint/transientList/index.vue Normal file
View File

@@ -0,0 +1,185 @@
<template>
<div class="default-main">
<div v-show="view">
<TableHeader datePicker ref="TableHeaderRef" showExport>
<template #select>
<el-form-item label="筛选数据:">
<el-input
v-model="tableStore.table.params.searchValue"
clearable
placeholder="请输入监测点名称"
/>
</el-form-item>
<el-form-item label="暂降类型">
<el-select v-model.trim="tableStore.table.params.dicData" placeholder="请选择" clearable>
<el-option
v-for="item in triggerType"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</template>
<template #operation></template>
</TableHeader>
<Table ref="tableRef" />
</div>
<div :style="{ height: pageHeight.height }" style="padding: 10px; overflow: hidden" v-if="!view">
<waveForm ref="waveFormRef" senior :boxoList="boxoList" :wp="wp" @backbxlb="backbxlb" />
</div>
</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 { useDictData } from '@/stores/dictData'
import { mainHeight } from '@/utils/layout'
import waveForm from '@/components/echarts/waveForm.vue'
import { ElMessage, ElMessageBox, ElDatePicker } from 'element-plus'
import { cableList, batchDel } from '@/api/advance-boot/assess'
import { useRouter } from 'vue-router'
const pageHeight = mainHeight(20)
defineOptions({
name: 'Descentsystem/transientList'
})
const { push } = useRouter()
const dictData = useDictData()
const view = ref(true)
const boxoList = ref({})
const wp = ref({})
const view2 = ref(false)
const linetypeList = ref([])
const waveFormRef = ref()
//字典获取电压等级
const triggerType = dictData.getBasicData('Event_Statis')
const reasonList = dictData.getBasicData('Event_Reason')
const tableStore: any = new TableStore({
url: '/event-boot/rmpEventDetail/getEventByLineIdsCount',
method: 'POST',
column: [
// { width: '60', type: 'checkbox' },
{
field: 'index',
title: '序号',
width: '60',
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'startTime', title: '暂降发生时刻', minWidth: '180' },
{ field: 'lineName', title: '监测点名称', minWidth: '180' },
{ field: 'gdName', title: '供电公司', minWidth: '120' },
{ field: 'subName', title: '变电站', minWidth: '150' },
{ field: 'loadType', title: '干扰源', minWidth: '150' },
{ field: 'objName', title: '监测对象', minWidth: '170' },
// {
// field: 'advanceType',
// title: '暂降类型',
// minWidth: '90',
// formatter: (row: any) => {
// return row.cellValue || '其他'
// }
// },
{
field: 'advanceReason',
title: '暂降原因',
minWidth: '90',
formatter: (row: any) => {
return reasonList.filter(item => item.id === row.cellValue)[0]?.name
}
},
{
field: 'eventType',
title: '暂态统计类型',
minWidth: '120',
formatter: (row: any) => {
return triggerType.filter(item => item.id === row.cellValue)[0]?.name
}
},
// {
// field: 'severity', title: '严重度', minWidth: "80", formatter: (row: any) => {
// return row.cellValue.toFixed(2)
// }
// },
{
field: 'featureAmplitude',
title: '暂降幅值(%)',
minWidth: '110',
formatter: (row: any) => {
return Math.round(row.cellValue * 10000) / 100
}
},
{ field: 'duration', title: '持续时间(s)', minWidth: '100' },
{
title: '操作',
width: '120',
render: 'buttons',
buttons: [
{
name: 'edit',
title: '波形分析',
type: 'primary',
disabled: row => {
return row.fileFlag == 0
},
icon: 'el-icon-Plus',
render: 'basicButton',
click: async row => {
view.value = false
setTimeout(() => {
waveFormRef.value.open(row)
}, 100)
}
},
{
name: 'edit',
title: '暂无波形',
type: '',
disabled: row => {
return row.fileFlag != 0
},
icon: 'el-icon-Plus',
render: 'basicButton'
}
]
}
],
beforeSearchFun: () => {},
loadCallback: () => {}
})
tableStore.table.params.dicData = ''
tableStore.table.params.searchValue = ''
provide('tableStore', tableStore)
const route = useRoute()
watch(
() => route.query.t,
async (newValue, oldValue) => {
if (route.fullPath.includes('Descentsystem/transientList')) {
let type = (route.query.type as string) || 'null'
if (type == 'null') {
} else if (type == '1') {
setTimeout(() => {
tableStore.table.params.searchValue = (route.query.name as string) || ''
tableStore.index()
},500)
}
}
},
{ deep: true, immediate: true }
)
const backbxlb = () => {
view.value = true
view2.value = false
}
onMounted(() => {
tableStore.index()
})
</script>