isoftstone/lc_frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

地区左下角对接

Browse Source
This commit is contained in:
chenlin
2025-12-15 21:38:30 +08:00
parent 0ec7c06775
commit e318f4519c
4 changed files with 78 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/views/screen/components/RiskStatisticsPanel.vue
View File

@@ -22,7 +22,7 @@
</div> </div>
<div class="legend"> <div class="legend">
<div class="legend-label-row"> <div class="legend-label-row">
<ElTooltip v-for="status in statusList" :key="status.key" :content="status.label" effect="dark" placement="right"> <div v-for="status in statusList" :key="status.key" :content="status.label" effect="dark" placement="right">
<div class="legend-item"> <div class="legend-item">
<span class="legend-dot" :style="{ background: status.color }"></span> <span class="legend-dot" :style="{ background: status.color }"></span>
<span class="legend-label">{{ status.label }}</span> <span class="legend-label">{{ status.label }}</span>
@@ -30,7 +30,7 @@
{{ item.status[status.key] }} {{ item.status[status.key] }}
</div> </div>
</div> </div>
</ElTooltip> </div>
</div> </div>
<!-- <div class="legend-value-row"> <!-- <div class="legend-value-row">
<div class="legend-value" v-for="status in statusList" :key="`${status.key}-value`"> <div class="legend-value" v-for="status in statusList" :key="`${status.key}-value`">
@@ -215,9 +215,6 @@ const handleTabClick = (tab: TabType) => {
.chart-wrapper { .chart-wrapper {
position: relative; position: relative;
flex: 0 0 90px;
width: 90px;
height: 90px;
} }
.donut-chart { .donut-chart {
@@ -260,7 +257,7 @@ const handleTabClick = (tab: TabType) => {
.legend-item { .legend-item {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 6px; gap: 2px;
white-space: nowrap; white-space: nowrap;
} }
@@ -307,12 +304,6 @@ const handleTabClick = (tab: TabType) => {
font-size: 12px; font-size: 12px;
} }
.chart-wrapper {
flex: 0 0 80px;
width: 80px;
height: 80px;
}
.legend-label-row { .legend-label-row {
font-size: 11px; font-size: 11px;
} }
@@ -334,12 +325,6 @@ const handleTabClick = (tab: TabType) => {
font-size: 11px; font-size: 11px;
} }
.chart-wrapper {
flex: 0 0 72px;
width: 72px;
height: 72px;
}
.legend-label-row { .legend-label-row {
font-size: 10px; font-size: 10px;
} }
@@ -361,12 +346,6 @@ const handleTabClick = (tab: TabType) => {
font-size: 10px; font-size: 10px;
} }
.chart-wrapper {
flex: 0 0 64px;
width: 64px;
height: 64px;
}
.legend-label-row { .legend-label-row {
font-size: 9px; font-size: 9px;
} }
@@ -392,7 +371,7 @@ const handleTabClick = (tab: TabType) => {
.left-bottom .legend-item { .left-bottom .legend-item {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
gap: 6px; gap: 2px;
white-space: nowrap; white-space: nowrap;
} }

4
src/views/screen/mainScreen.vue
View File

@@ -578,11 +578,11 @@ const handleRiskTabChange = async (tab: TabType) => {
// 同时获取维保任务和巡检任务的数据 // 同时获取维保任务和巡检任务的数据
const [maintenanceResponse, inspectionResponse] = await Promise.all([ const [maintenanceResponse, inspectionResponse] = await Promise.all([
getWorkOrderStatistics(workOrderType, '维保任务').catch(error => { getWorkOrderStatistics({workOrderType, taskType: '维保任务'}).catch(error => {
console.error('获取维保任务数据失败:', error) console.error('获取维保任务数据失败:', error)
return { records: [] } return { records: [] }
}), }),
getWorkOrderStatistics(workOrderType, '巡检任务').catch(error => { getWorkOrderStatistics({workOrderType, taskType: '巡检任务'}).catch(error => {
console.error('获取巡检任务数据失败:', error) console.error('获取巡检任务数据失败:', error)
return { records: [] } return { records: [] }
}) })

145
src/views/screen/regionScreen.vue
View File

@@ -49,7 +49,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {getTableList, getTableData} from './report' import {getTableList, getTableData, getWorkOrderStatistics} from './report'
import {ref, onMounted, watch, onUnmounted} from 'vue' import {ref, onMounted, watch, onUnmounted} from 'vue'
import {useRoute, useRouter} from 'vue-router' import {useRoute, useRouter} from 'vue-router'
import RegionSelector from './components/RegionSelector.vue' import RegionSelector from './components/RegionSelector.vue'
@@ -73,7 +73,7 @@ interface RegionItem {
code: string code: string
} }
type TabType = '危险作业' | '安全考核' | '安全、保密培训' type TabType = '安全类' | '工程类'
// 响应式数据 // 响应式数据
const currentDateTime = ref<string>('') const currentDateTime = ref<string>('')
@@ -569,93 +569,84 @@ const handleHiddenDangerPannelData = (query) => {
// 处理风险统计tab切换 // 处理风险统计tab切换
const handleRiskTabChange = async (tab: TabType) => { const handleRiskTabChange = async (tab: TabType) => {
console.log('Tab changed to:', tab) console.log('Tab changed to:', tab)
try { try {
let code = '' let workOrderType = ''
switch (tab) { switch (tab) {
case '危险作业': case '安全类':
code = 'hazardous_operations' workOrderType = '安全生产'
break break
case '安全考核': case '工程类':
code = 'safety_assessment' workOrderType = '物业服务-工程'
break
case '安全、保密培训':
code = 'security_training'
break break
default: default:
code = 'hazardous_operations' workOrderType = '安全生产'
} }
if (code == 'hazardous_operations') {
// 根据不同的tab请求不同的接口 // 同时获取维保任务和巡检任务的数据
getTableList( const [maintenanceResponse, inspectionResponse] = await Promise.all([
code, getWorkOrderStatistics({workOrderType, taskType: '维保任务', campus_id: query.campus_id}).catch(error => {
{...query, activeTab: tab} console.error('获取维保任务数据失败:', error)
).then(response => { return { records: [] }
// 更新风险统计数据 - 传递完整的数组数据用于饼图显示 }),
if (response.records && response.records.length > 0) { getWorkOrderStatistics({workOrderType, taskType: '巡检任务', campus_id: query.campus_id}).catch(error => {
dangerDetail.value = response.records console.error('获取巡检任务数据失败:', error)
return { records: [] }
})
])
// 周期映射
const cycleMap: Record<string, string> = {
'day': '每日',
'month': '每月',
'year': '每年'
} }
}).catch(error => {
console.error('获取风险统计数据失败:', error) // 将API数据转换为图表数据格式
if (isFirstLoad.value) { const convertToChartData = (records: any[], taskTypeName: string): any[] => {
// dangerDetail.value = [ const charts: any[] = []
// {
// description: '2025-08-10 上午8:00 武汉园区隐患内容管理 状态 处理', // 按周期分组
// alarm_level_code: 'general', const cycleGroups: Record<string, any> = {}
// alarm_status: '已关闭', records.forEach((record: any) => {
// alarm_biz_id: '20250827164305283937' const cycle = record.cycle || 'day'
// }, if (!cycleGroups[cycle]) {
// { cycleGroups[cycle] = record
// description: '2025-08-10 上午8:00 武汉园区隐患内容管理 状态 处理',
// alarm_level_code: 'general',
// alarm_status: '已关闭',
// alarm_biz_id: '20250827164305283937'
// }, {
// description: '2025-08-10 上午8:00 武汉园区隐患内容管理 状态 处理',
// alarm_level_code: 'general',
// alarm_status: '已关闭',
// alarm_biz_id: '20250827164305283937'
// }, {
// description: '2025-08-10 上午8:00 武汉园区隐患内容管理 状态 处理',
// alarm_level_code: 'general',
// alarm_status: '已关闭',
// alarm_biz_id: '20250827164305283937'
// }, {
// description: '2025-08-10 上午8:00 武汉园区隐患内容管理 状态 处理',
// alarm_level_code: 'general',
// alarm_status: '已关闭',
// alarm_biz_id: '20250827164305283937'
// }, {
// description: '2025-08-10 上午8:00 武汉园区隐患内容管理 状态 处理',
// alarm_level_code: 'general',
// alarm_status: '已关闭',
// alarm_biz_id: '20250827164305283937'
// }
// ]
} }
}) })
} else {
// 根据不同的tab请求不同的接口 // 创建6个图表（3个周期 x 2个任务类型，但这里只处理一种任务类型）
getTableList( const cycles = ['day', 'month', 'year']
code, cycles.forEach((cycle) => {
{...query, activeTab: tab} const data = cycleGroups[cycle] || {}
).then(response => { const title = `${cycleMap[cycle]}检查(${taskTypeName})`
// 更新风险统计数据 - 传递完整的数组数据用于饼图显示
if (response.records && response.records.length > 0) { charts.push({
riskStatistics.value = response.records title,
} else { total: Number(data.total) || 0,
// 如果没有数据，设置默认值 status: {
riskStatistics.value = [ notStarted: Number(data.pending) || 0,
{ inProgress: Number(data.processing) || 0,
csmpus_name: "雄安新区总部", done: Number(data.processed) || 0,
finishCount: "0", voided: Number(data.closed) || 0
participateCount: "0"
} }
]
}
}).catch(error => {
console.error('获取风险统计数据失败:', error)
}) })
})
return charts
} }
// 转换维保和巡检数据
const maintenanceCharts = convertToChartData(maintenanceResponse.records || [], '维保类')
const inspectionCharts = convertToChartData(inspectionResponse.records || [], '巡检类')
// 合并为6个图表：先维保（3个），后巡检（3个）
const allCharts = [...maintenanceCharts, ...inspectionCharts]
// 更新riskStatistics
riskStatistics.value[tab] = allCharts
console.log('更新后的riskStatistics:', riskStatistics.value)
} catch (error) { } catch (error) {
console.error('获取风险统计数据失败:', error) console.error('获取风险统计数据失败:', error)
} }

4
src/views/screen/report/index.ts
View File

@@ -135,8 +135,8 @@ export const batchGetTableList = (reportCodes: string, data?) => {
// 参数：workOrderType：'物业服务-工程'，taskType：'巡检任务' // 参数：workOrderType：'物业服务-工程'，taskType：'巡检任务'
// 统计周期 cycle: day，month，year 对应月日年 // 统计周期 cycle: day，month，year 对应月日年
export const getWorkOrderStatistics = (workOrderType: string, taskType: string) => { export const getWorkOrderStatistics = (data: {workOrderType: string, taskType: string, campus_id?: string}) => {
return request.post({ url: '/jeelowcode/report-data/list/report_work_order_statistics', data: {workOrderType, taskType, page: 1, paseSize: 1} }) return request.post({ url: '/jeelowcode/report-data/list/report_work_order_statistics', data: {...data, page: 1, paseSize: 1} })
} }