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

监测点列表联调

Browse Source
This commit is contained in:
stt
2025-11-21 10:42:20 +08:00
parent da7cb2cb90
commit 3827490cd1
3 changed files with 271 additions and 238 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
src/api/harmonic-boot/cockpit/cockpit.ts
View File

@@ -116,4 +116,58 @@ export function limitProbabilityData(data: any) {
}
// 电网侧指标越限统计列表
export function gridSideLimitStatisticsList(data: any) {
return request({
url: '/harmonic-boot/gridSideLimitStatistics/list',
method: 'post',
data: data
})
}
// 电网侧指标越限统计数据
export function gridSideLimitStatisticsData(data: any) {
return request({
url: '/harmonic-boot/gridSideLimitStatistics/data',
method: 'post',
data: data
})
}
// 敏感负荷用户监测点列表
export function governLineList(data: any) {
return request({
url: '/cs-device-boot/csline/getSensitiveUserLineList',
method: 'post',
data: data
})
}
// 根据id集合获取敏感负荷用户列表
export function getListByIds(data: any) {
return request({
url: '/cs-harmonic-boot/pqSensitiveUser/getListByIds',
method: 'post',
data: data
})
}
// 上传治理报告
export function uploadReport(data: any) {
return request({
url: '/cs-device-boot/csline/uploadReport',
method: 'post',
data: data
})
}
// 获取治理报告链接
export function getReportUrl(data: any) {
return request({
url: '/cs-device-boot/csline/getReportUrl',
method: 'post',
params: data
})
}

133
src/components/cockpit/indicatorDistribution/index.vue
View File

@@ -77,139 +77,6 @@ const fullscreen = computed(() => {
}
})
// const echartList = ref({
// options: {
// xAxis: null,
// yAxis: null,
// dataZoom: null,
// backgroundColor: '#fff',
// tooltip: {
// // trigger: 'axis'
// textStyle: {
// color: '#fff',
// fontStyle: 'normal',
// opacity: 0.35,
// fontSize: 14
// },
// backgroundColor: 'rgba(0,0,0,0.55)',
// borderWidth: 0,
// formatter: function (params: any) {
// console.log(params)
// var tips = ''
// for (var i = 0; i < params.length; i++) {
// tips += params[i].name + '</br/>'
// tips += '监测点数' + ':' + '&nbsp' + '&nbsp' + params[i].value + '</br/>'
// }
// return tips
// }
// },
// title: {
// text: '指标越限概率分布',
// x: 'center'
// },
// visualMap: {
// max: 20,
// show: false,
// inRange: {
// color: ['#313695', '#00BB00', '#ff8000', '#a50026']
// }
// },
// xAxis3D: {
// type: 'category',
// name: '指标越限',
// data: ['0-10', '10-20', '20-30', '30-40', '40-50'],
// axisLine: {
// lineStyle: {
// color: '#111'
// }
// },
// axisLabel: {
// color: '#111'
// }
// },
// yAxis3D: {
// type: 'category',
// name: '指标类型',
// data: ['闪变', '谐波电压', '谐波电流', '电压偏差', '三相不平衡'],
// nameTextStyle: {
// color: '#111'
// },
// axisLine: {
// show: true,
// lineStyle: {
// color: '#111'
// }
// },
// axisLabel: {
// color: '#111'
// },
// splitLine: {
// lineStyle: {
// // 使用深浅的间隔色
// color: ['#111'],
// type: 'dashed',
// opacity: 0.5
// }
// }
// },
// zAxis3D: {
// type: 'value',
// splitNumber: 10,
// minInterval: 10,
// name: '越限占比'
// },
// grid3D: {
// viewControl: {
// projection: 'perspective',
// distance: 250
// },
// boxWidth: 200,
// boxDepth: 80,
// light: {
// main: {
// intensity: 1.2
// },
// ambient: {
// intensity: 0.3
// }
// }
// },
// series: [
// {
// type: 'bar3D',
// data: [
// [0, 0, 1],
// [0, 1, 1],
// [0.2, 1]
// ],
// shading: 'realistic',
// label: {
// show: false,
// textStyle: {
// fontSize: 16,
// borderWidth: 1
// }
// },
// itemStyle: {
// opacity: 1
// },
// emphasis: {
// label: {
// textStyle: {
// fontSize: 20,
// color: '#900'
// }
// },
// itemStyle: {
// color: '#900'
// }
// }
// }
// ]
// }
// })
const echartList = ref()

322
src/components/cockpit/monitoringPointList/index.vue
View File

@@ -1,37 +1,68 @@
<template>
<div>
<!--监测点列表 -->
<!-- 监测点列表 -->
<TableHeader :showReset="false" @selectChange="selectChange" datePicker v-if="fullscreen"></TableHeader>
<Table ref="tableRef" @cell-click="cellClickEvent" :height="`calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px )`"></Table>
<Table
ref="tableRef"
@cell-click="cellClickEvent"
:height="`calc(${prop.height} - ${headerHeight}px + ${fullscreen ? -58 : 56}px )`"
></Table>
<!-- 指标越限详情 -->
<OverLimitDetails ref="OverLimitDetailsRef" />
<!-- 上传对话框 -->
<el-dialog v-model="uploadDialogVisible" title="上传报告" width="500px" @closed="handleDialogClosed">
<el-upload
ref="uploadRef"
class="upload-demo"
:auto-upload="true"
:on-change="handleChange"
:before-upload="beforeUpload"
:http-request="handleUpload"
:limit="1"
:on-exceed="handleExceed"
:file-list="fileList"
>
<el-button type="primary">点击上传</el-button>
<template #tip>
<div class="el-upload__tip">只能上传Word或PDF文件，且不超过10MB</div>
</template>
</el-upload>
<template #footer>
<span class="dialog-footer">
<el-button @click="uploadDialogVisible = false">取消</el-button>
<el-button type="primary" @click="uploadDialogVisible = false">确定</el-button>
</span>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, reactive, watch, h } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { getTimeOfTheMonth } from '@/utils/formatTime'
import { ElTag } from 'element-plus'
import OverLimitDetails from '@/components/cockpit/monitoringPointList/components/overLimitDetails.vue'
import TableHeader from '@/components/table/header/index.vue'
import { useRoute } from 'vue-router'
import { useTimeCacheStore } from '@/stores/timeCache'
import { uploadReport, getReportUrl } from '@/api/harmonic-boot/cockpit/cockpit'
const prop = defineProps({
w: { type: [String, Number]},
h: { type: [String, Number]},
width: { type: [String, Number]},
height: { type: [String, Number]},
timeKey: { type: [String, Number]},
w: { type: [String, Number] },
h: { type: [String, Number] },
width: { type: [String, Number] },
height: { type: [String, Number] },
timeKey: { type: [String, Number] },
timeValue: { type: Object }
})
const headerHeight = ref(57)
const route = useRoute()
const timeCacheStore = useTimeCacheStore()
// 上传相关
const uploadDialogVisible = ref(false)
const currentUploadRow = ref<any>(null)
const uploadRef = ref()
const fileList = ref([])
const selectChange = (showSelect: any, height: any, datePickerValue?: any) => {
headerHeight.value = height
@@ -57,11 +88,10 @@ const fullscreen = computed(() => {
const OverLimitDetailsRef = ref()
const tableStore: any = new TableStore({
url: '/user-boot/role/selectRoleDetail?id=0',
url: '/cs-device-boot/csline/getSensitiveUserLineList',
method: 'POST',
showPage: false,
exportName: '主要监测点列表',
showPage: fullscreen.value ? true : false,
exportName: '监测点列表',
column: [
{
field: 'index',
@@ -72,107 +102,215 @@ const tableStore: any = new TableStore({
}
},
{
title: '治理对象名称',
field: 'name',
title: '治理对象',
field: 'sensitiveUser',
minWidth: '80'
},
{
title: '电压等级',
field: 'type',
field: 'volGrade',
minWidth: '70'
},
{
title: '治理设备详情',
field: 'type1',
title: '是否治理',
field: 'govern',
minWidth: '70'
},
// {
// title: '治理前报告',
// field: 'reportFileName',
// minWidth: '80',
// render: 'customTemplate',
// customTemplate: (row: any) => {
// return `<span style='cursor: pointer;text-decoration: underline;'>${row.reportFileName}</span>`
// }
// },
{
title: '治理前报告',
field: 'type2',
minWidth: '80',
title: '监测点名称',
field: 'lineName',
minWidth: '70',
render: 'customTemplate',
customTemplate: (row: any) => {
return `<span style='cursor: pointer;text-decoration: underline;' onclick="handleReportClick('${row.name}')">${row.type2}</span>`
return `<span style='cursor: pointer;text-decoration: underline;'>${row.lineName}</span>`
}
},
{ title: '监测点名称', field: 'type3', minWidth: '70' },
{ title: '监测类型', field: 'type4', minWidth: '60' },
{ title: '监测类型', field: 'position', minWidth: '60' },
{
title: '监测点状态',
field: 'type5',
field: 'runStatus',
minWidth: '60',
render: 'customTemplate',
customTemplate: (row: any) => {
return `<span style='color: ${row.type5 === '中断' ? '#FF0000' : ''}'>${row.type5}</span>`
return `<span style='color: ${row.runStatus === '中断' ? '#FF0000' : ''}'>${row.runStatus}</span>`
}
},
{ title: '最新数据时间', field: 'type6', minWidth: '140' }
{
title: '最新数据时间',
field: 'latestTime',
minWidth: '140',
render: 'customTemplate',
customTemplate: (row: any) => {
if (row.latestTime) {
return `<span>${row.latestTime}</span>`
} else {
return `<span>/</span>`
}
}
},
{
title: '操作',
minWidth: 120,
// fixed: 'right',
render: 'buttons',
buttons: [
{
name: 'productSetting',
title: '上传报告',
type: 'primary',
icon: 'el-icon-upload',
render: 'basicButton',
click: row => {
uploadReportRow(row)
},
disabled: row => {
return row.reportFilePath
}
},
{
name: 'productSetting',
title: '下载报告',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
downloadTheReport(row.lineId)
},
disabled: row => {
return row.reportFilePath == null || row.reportFilePath.length == 0
}
},
{
name: 'productSetting',
title: '重新上传',
type: 'primary',
icon: 'el-icon-upload',
render: 'basicButton',
click: row => {
uploadReportRow(row)
},
disabled: row => {
return row.reportFilePath == null || row.reportFilePath.length == 0
}
}
]
}
],
beforeSearchFun: () => {
tableStore.table.params.searchBeginTime = tableStore.table.params.searchBeginTime || prop.timeValue?.[0]
tableStore.table.params.searchEndTime = tableStore.table.params.searchEndTime || prop.timeValue?.[1]
},
loadCallback: () => {
tableStore.table.data = [
{
name: '1#变压器',
type: '0.38kV',
type1: '250A APF',
type2: '报告.doc',
type3: '1#变压器 电网侧',
type4: '电网侧',
type5: '运行',
type6: '2025-04-11 18:16:00'
},
{
name: '1#变压器',
type: '0.38kV',
type1: '250A APF',
type2: '报告.doc',
type3: '1#变压器 负载侧',
type4: '负载侧',
type5: '运行',
type6: '2025-04-11 18:16:00'
},
{
name: '2#变压器',
type: '0.38kV',
type1: '100A SVG',
type2: '/',
type3: '1#变压器 电网侧',
type4: '电网侧',
type5: '运行',
type6: '2025-04-11 18:16:00'
},
{
name: '2#变压器',
type: '0.38kV',
type1: '100A SVG',
type2: '/',
type3: '1#变压器 负载侧',
type4: '负载侧',
type5: '中断',
type6: '2025-04-11 18:16:00'
}
]
tableStore.table.height = `calc(${prop.height} - 80px)`
}
})
const tableRef = ref()
provide('tableRef', tableRef)
tableStore.table.params.type = ''
tableStore.table.params.searchValue = ''
tableStore.table.params.keywords = ''
provide('tableStore', tableStore)
// 点击行
const cellClickEvent = ({ row, column }: any) => {
if (column.field == 'name') {
console.log(row)
OverLimitDetailsRef.value.open(row)
if (column.field == 'lineName') {
OverLimitDetailsRef.value.open(
row,
tableStore.table.params.searchBeginTime || prop.timeValue?.[0],
tableStore.table.params.searchEndTime || prop.timeValue?.[1]
)
}
}
// 下载报告
const downloadTheReport = (lineId: string) => {
getReportUrl({ lineId: lineId }).then((res: any) => {
const link = document.createElement('a')
link.href = res.data
link.download = '治理报告'
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
})
}
// 上传报告
const uploadReportRow = (row: any) => {
currentUploadRow.value = row
// 打开弹窗前清空文件列表
fileList.value = []
uploadDialogVisible.value = true
}
// 处理弹窗关闭事件
const handleDialogClosed = () => {
// 清空文件列表
fileList.value = []
}
// 处理文件超出限制
const handleExceed = (files: any, fileList: any) => {
ElMessage.warning('只能上传一个文件，请先删除已选择的文件')
}
// 文件变更处理函数
const handleChange = (file: any, fileList: any) => {
// 在这里直接处理文件上传逻辑
beforeUpload(file.raw) // 注意使用 file.raw 获取原始文件对象
}
// 处理上传前检查
const beforeUpload = (file: any) => {
const isWord =
file.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' ||
file.type === 'application/msword' ||
file.name.endsWith('.doc') ||
file.name.endsWith('.docx')
const isPDF = file.type === 'application/pdf' || file.name.endsWith('.pdf')
const isValidType = isWord || isPDF
const isLt10M = file.size / 1024 / 1024 < 10
if (!isValidType) {
ElMessage.error('上传文件只能是 Word 文档(.doc/.docx) 或 PDF 文件(.pdf)!')
return false
}
if (!isLt10M) {
ElMessage.error('上传文件大小不能超过 10MB!')
return false
}
// 校验通过后允许上传，交由 http-request 处理
return true
}
const handleUpload = async (options: any) => {
const { file } = options
const formData = new FormData()
formData.append('file', file)
formData.append('lineId', currentUploadRow.value?.lineId || currentUploadRow.value?.id || '')
try {
const result = await uploadReport(formData)
ElMessage.success('上传成功')
uploadDialogVisible.value = false
tableStore.index()
return Promise.resolve(result)
} catch (error: any) {
ElMessage.error('上传失败: ' + (error.message || '未知错误'))
return Promise.reject(error)
}
}
@@ -199,31 +337,5 @@ watch(
deep: true
}
)
const handleReportClick = (id: string) => {
const row = tableStore.table.data.find((item: any) => item.id === id)
if (row && row.type2 !== '/') {
// 示例：触发下载逻辑（根据你注释掉的代码）
// getFileZip({ eventId: id }).then(res => {
// let blob = new Blob([res], { type: 'application/zip' })
// const url = window.URL.createObjectURL(blob)
// const link = document.createElement('a')
// link.href = url
// link.download = row.wavePath?.split('/')[2] || '报告文件.zip'
// link.click()
// })
console.log('点击了报告:', row.type2)
} else {
ElMessage.warning('暂无报告可下载')
}
}
// 挂载到 window 供 HTML 调用
window.handleReportClick = handleReportClick
// 组件销毁时清理全局方法
onBeforeUnmount(() => {
delete window.handleReportClick
})
</script>
<style lang="scss" scoped></style>