From ec7ef87340eacf94647a2621daead5e65ba79dc5 Mon Sep 17 00:00:00 2001 From: chenlin Date: Tue, 16 Dec 2025 15:03:01 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A5=BC=E5=9B=BEbug=E4=BF=AE=E5=A4=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../screen/components/HiddenDangerPanel.vue | 32 ++++++++++-- src/views/screen/mainScreen.vue | 49 +++++++++++++------ src/views/screen/regionScreen.vue | 28 +++++++++-- 3 files changed, 86 insertions(+), 23 deletions(-) diff --git a/src/views/screen/components/HiddenDangerPanel.vue b/src/views/screen/components/HiddenDangerPanel.vue index b79a644..bffaf47 100644 --- a/src/views/screen/components/HiddenDangerPanel.vue +++ b/src/views/screen/components/HiddenDangerPanel.vue @@ -96,6 +96,12 @@ const props = defineProps() // 图表引用 const progressChartOption = ref({ + backgroundColor: 'transparent', + tooltip: { + show: true, + trigger: 'item', + formatter: '{a}
{b}: {c}% ({d}%)' + }, series: [ { type: 'pie' as const, @@ -106,6 +112,7 @@ const progressChartOption = ref({ bottom: 0, data: [], label: { + show: true, alignTo: 'edge' as const, formatter: '{time|{c} %}\n', minMargin: 5, @@ -119,6 +126,7 @@ const progressChartOption = ref({ } }, labelLine: { + show: true, length: 5, length2: 0, maxSurfaceAngle: 10 @@ -194,8 +202,9 @@ const handleMajorClick = () => { } watch(() => props.hiddenDangerData?.progress, (newVal) => { + console.log('HiddenDangerPanel watch 触发，progress 数据:', newVal) refreshProcessCharts(newVal) -}, { deep: true }) +}, { deep: true, immediate: true }) // 辅助函数：安全地将值转换为数字，处理 NaN 和字符串 "NaN" 的情况 const safeNumber = (val: any): number => { @@ -212,14 +221,23 @@ const refreshProcessCharts = (process): void => { console.warn('process is undefined or null') return } + + const overdue = safeNumber(process.overdue) + const processed = safeNumber(process.processed) + const processing = safeNumber(process.processing) + + console.log('refreshProcessCharts 数据:', { overdue, processed, processing }) + const option = { ...progressChartOption.value } // 确保所有 value 都是有效的数字，将字符串 "NaN" 或真正的 NaN 转换为 0 option.series[0].data = [ - { value: safeNumber(process.overdue), name: '已逾期', itemStyle: { color: '#ef4444' } }, - { value: safeNumber(process.processed), name: '已处理', itemStyle: { color: '#10b981' } }, + { value: overdue, name: '已逾期', itemStyle: { color: '#ef4444' } }, + { value: processed, name: '已处理', itemStyle: { color: '#10b981' } }, // { value: safeNumber(process.pending), name: '待排查', itemStyle: { color: '#eab308' } }, - { value: safeNumber(process.processing), name: '处理中', itemStyle: { color: '#3b82f6' } } + { value: processing, name: '处理中', itemStyle: { color: '#3b82f6' } } ] + + console.log('更新后的图表数据:', option.series[0].data) progressChartOption.value = option } @@ -250,7 +268,11 @@ const refreshTop3TypesCharts = (top3Types): void => { } onMounted(() => { - + // 组件挂载时，如果已有数据，立即更新图表 + if (props.hiddenDangerData?.progress) { + console.log('onMounted: 初始化图表数据', props.hiddenDangerData.progress) + refreshProcessCharts(props.hiddenDangerData.progress) + } }) diff --git a/src/views/screen/mainScreen.vue b/src/views/screen/mainScreen.vue index 58695c0..45ab3df 100644 --- a/src/views/screen/mainScreen.vue +++ b/src/views/screen/mainScreen.vue @@ -431,12 +431,17 @@ const handleHiddenDangerPannelData = (query) => { // 获取隐患排查治理数据 getTableList('risk_status_count', query).then(res => { if (res.records && res.records.length > 0) { - _data.overdue = _data.overdue + Number(res.records[0].overdueCnt) - _data.processed = _data.processed + Number(res.records[0].processedCnt) - _data.processing = _data.processing + Number(res.records[0].processingCnt) - _data.pending = _data.pending + // 接口返回的已经是百分比，直接使用 + const record = res.records[0] + _data.overdue = Number(record.overdueCnt) || 0 + _data.processed = Number(record.processedCnt) || 0 + _data.processing = Number(record.processingCnt) || 0 + _data.pending = 0 // 接口没有返回pending，设为0 _data.flag = true + console.log('risk_status_count 接口返回数据:', record) + console.log('处理后的 _data:', _data) + if (_data2.flag) { // 合并数据 console.log("请求系统和第三方成功，合并数据", _data, _data2); @@ -445,30 +450,44 @@ const handleHiddenDangerPannelData = (query) => { dashboardData.value.hiddenDangerData.general = generalCnt dashboardData.value.hiddenDangerData.major = majorCnt - let totalCnt = generalCnt + majorCnt - let overdueCnt = ((_data.overdue + _data2.overdue) / totalCnt * 100).toFixed(2) - let processedCnt = ((_data.processed + _data2.processed) / totalCnt * 100).toFixed(2) - let processingCnt = ((_data.processing + _data2.processing) / totalCnt * 100).toFixed(2) - let pendingCnt = ((_data.pending + _data2.pending) / totalCnt * 100).toFixed(2) + // 如果第三方数据也是百分比，需要合并；否则使用系统数据 + // 这里假设系统数据是百分比，第三方数据可能是数量或百分比 + let overdueCnt, processedCnt, processingCnt, pendingCnt + if (_data2.overdue > 1 || _data2.processed > 1 || _data2.processing > 1) { + // 第三方数据可能是百分比，直接使用系统数据（因为系统数据更准确） + overdueCnt = _data.overdue.toFixed(2) + processedCnt = _data.processed.toFixed(2) + processingCnt = _data.processing.toFixed(2) + pendingCnt = _data.pending.toFixed(2) + } else { + // 第三方数据可能是数量，需要计算百分比 + let totalCnt = generalCnt + majorCnt + overdueCnt = totalCnt > 0 ? ((_data.overdue + _data2.overdue) / totalCnt * 100).toFixed(2) : '0.00' + processedCnt = totalCnt > 0 ? ((_data.processed + _data2.processed) / totalCnt * 100).toFixed(2) : '0.00' + processingCnt = totalCnt > 0 ? ((_data.processing + _data2.processing) / totalCnt * 100).toFixed(2) : '0.00' + pendingCnt = totalCnt > 0 ? ((_data.pending + _data2.pending) / totalCnt * 100).toFixed(2) : '0.00' + } + dashboardData.value.hiddenDangerData.progress = { overdue: overdueCnt, processed: processedCnt, processing: processingCnt, pending: pendingCnt, } + console.log('合并后的 progress:', dashboardData.value.hiddenDangerData.progress) } else { console.log("请求系统成功，展示数据", _data, _data2); dashboardData.value.hiddenDangerData.general = _data.general dashboardData.value.hiddenDangerData.major = _data.major - let totalCnt = _data.general + _data.major - // 显示系统数据 + // 接口返回的已经是百分比，直接使用 dashboardData.value.hiddenDangerData.progress = { - overdue: (_data.overdue / totalCnt * 100).toFixed(2), - processed: (_data.processed / totalCnt * 100).toFixed(2), - processing: (_data.processing / totalCnt * 100).toFixed(2), - pending: (_data.pending / totalCnt * 100).toFixed(2), + overdue: _data.overdue.toFixed(2), + processed: _data.processed.toFixed(2), + processing: _data.processing.toFixed(2), + pending: _data.pending.toFixed(2), } + console.log('系统数据 progress:', dashboardData.value.hiddenDangerData.progress) } } }) diff --git a/src/views/screen/regionScreen.vue b/src/views/screen/regionScreen.vue index dded1f6..ea16010 100644 --- a/src/views/screen/regionScreen.vue +++ b/src/views/screen/regionScreen.vue @@ -95,7 +95,10 @@ const visitorCount = ref(0) // 总体概览-各园区统计 const parkStatistics = ref() // 危险作业/安全考核/安全、保密培训 -const riskStatistics = ref() +const riskStatistics = ref>({ + 安全类: [], + 工程类: [] +}) const dangerDetail = ref() // 动画相关的状态 const isAnimating = ref(false) @@ -595,6 +598,24 @@ const handleRiskTabChange = async (tab: TabType) => { }) ]) + // 处理接口返回的数据结构：可能是数组或对象 + const getRecords = (response: any): any[] => { + if (Array.isArray(response)) { + return response + } else if (response && Array.isArray(response.records)) { + return response.records + } else if (response && response.data && Array.isArray(response.data)) { + return response.data + } + return [] + } + + const maintenanceRecords = getRecords(maintenanceResponse) + const inspectionRecords = getRecords(inspectionResponse) + + console.log('维保任务数据:', maintenanceResponse, '提取的records:', maintenanceRecords) + console.log('巡检任务数据:', inspectionResponse, '提取的records:', inspectionRecords) + // 周期映射 const cycleMap: Record = { 'day': '每日', @@ -637,8 +658,8 @@ const handleRiskTabChange = async (tab: TabType) => { } // 转换维保和巡检数据 - const maintenanceCharts = convertToChartData(maintenanceResponse.records || [], '维保类') - const inspectionCharts = convertToChartData(inspectionResponse.records || [], '巡检类') + const maintenanceCharts = convertToChartData(maintenanceRecords, '维保类') + const inspectionCharts = convertToChartData(inspectionRecords, '巡检类') // 合并为6个图表：先维保（3个），后巡检（3个） const allCharts = [...maintenanceCharts, ...inspectionCharts] @@ -647,6 +668,7 @@ const handleRiskTabChange = async (tab: TabType) => { riskStatistics.value[tab] = allCharts console.log('更新后的riskStatistics:', riskStatistics.value) + console.log('当前tab的图表数据:', allCharts) } catch (error) { console.error('获取风险统计数据失败:', error) }