地区左下角对接
This commit is contained in:
@@ -22,7 +22,7 @@
|
||||
</div>
|
||||
<div class="legend">
|
||||
<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">
|
||||
<span class="legend-dot" :style="{ background: status.color }"></span>
|
||||
<span class="legend-label">{{ status.label }}</span>
|
||||
@@ -30,7 +30,7 @@
|
||||
{{ item.status[status.key] }}
|
||||
</div>
|
||||
</div>
|
||||
</ElTooltip>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="legend-value-row">
|
||||
<div class="legend-value" v-for="status in statusList" :key="`${status.key}-value`">
|
||||
@@ -215,9 +215,6 @@ const handleTabClick = (tab: TabType) => {
|
||||
|
||||
.chart-wrapper {
|
||||
position: relative;
|
||||
flex: 0 0 90px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
}
|
||||
|
||||
.donut-chart {
|
||||
@@ -260,7 +257,7 @@ const handleTabClick = (tab: TabType) => {
|
||||
.legend-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
gap: 2px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@@ -307,12 +304,6 @@ const handleTabClick = (tab: TabType) => {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.chart-wrapper {
|
||||
flex: 0 0 80px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.legend-label-row {
|
||||
font-size: 11px;
|
||||
}
|
||||
@@ -334,12 +325,6 @@ const handleTabClick = (tab: TabType) => {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.chart-wrapper {
|
||||
flex: 0 0 72px;
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
}
|
||||
|
||||
.legend-label-row {
|
||||
font-size: 10px;
|
||||
}
|
||||
@@ -361,12 +346,6 @@ const handleTabClick = (tab: TabType) => {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.chart-wrapper {
|
||||
flex: 0 0 64px;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
}
|
||||
|
||||
.legend-label-row {
|
||||
font-size: 9px;
|
||||
}
|
||||
@@ -392,7 +371,7 @@ const handleTabClick = (tab: TabType) => {
|
||||
.left-bottom .legend-item {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
gap: 2px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
||||
@@ -578,11 +578,11 @@ const handleRiskTabChange = async (tab: TabType) => {
|
||||
|
||||
// 同时获取维保任务和巡检任务的数据
|
||||
const [maintenanceResponse, inspectionResponse] = await Promise.all([
|
||||
getWorkOrderStatistics(workOrderType, '维保任务').catch(error => {
|
||||
getWorkOrderStatistics({workOrderType, taskType: '维保任务'}).catch(error => {
|
||||
console.error('获取维保任务数据失败:', error)
|
||||
return { records: [] }
|
||||
}),
|
||||
getWorkOrderStatistics(workOrderType, '巡检任务').catch(error => {
|
||||
getWorkOrderStatistics({workOrderType, taskType: '巡检任务'}).catch(error => {
|
||||
console.error('获取巡检任务数据失败:', error)
|
||||
return { records: [] }
|
||||
})
|
||||
|
||||
@@ -49,7 +49,7 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {getTableList, getTableData} from './report'
|
||||
import {getTableList, getTableData, getWorkOrderStatistics} from './report'
|
||||
import {ref, onMounted, watch, onUnmounted} from 'vue'
|
||||
import {useRoute, useRouter} from 'vue-router'
|
||||
import RegionSelector from './components/RegionSelector.vue'
|
||||
@@ -73,7 +73,7 @@ interface RegionItem {
|
||||
code: string
|
||||
}
|
||||
|
||||
type TabType = '危险作业' | '安全考核' | '安全、保密培训'
|
||||
type TabType = '安全类' | '工程类'
|
||||
|
||||
// 响应式数据
|
||||
const currentDateTime = ref<string>('')
|
||||
@@ -569,93 +569,84 @@ const handleHiddenDangerPannelData = (query) => {
|
||||
// 处理风险统计tab切换
|
||||
const handleRiskTabChange = async (tab: TabType) => {
|
||||
console.log('Tab changed to:', tab)
|
||||
|
||||
try {
|
||||
let code = ''
|
||||
let workOrderType = ''
|
||||
switch (tab) {
|
||||
case '危险作业':
|
||||
code = 'hazardous_operations'
|
||||
case '安全类':
|
||||
workOrderType = '安全生产'
|
||||
break
|
||||
case '安全考核':
|
||||
code = 'safety_assessment'
|
||||
break
|
||||
case '安全、保密培训':
|
||||
code = 'security_training'
|
||||
case '工程类':
|
||||
workOrderType = '物业服务-工程'
|
||||
break
|
||||
default:
|
||||
code = 'hazardous_operations'
|
||||
workOrderType = '安全生产'
|
||||
}
|
||||
if (code == 'hazardous_operations') {
|
||||
// 根据不同的tab请求不同的接口
|
||||
getTableList(
|
||||
code,
|
||||
{...query, activeTab: tab}
|
||||
).then(response => {
|
||||
// 更新风险统计数据 - 传递完整的数组数据用于饼图显示
|
||||
if (response.records && response.records.length > 0) {
|
||||
dangerDetail.value = response.records
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取风险统计数据失败:', error)
|
||||
if (isFirstLoad.value) {
|
||||
// dangerDetail.value = [
|
||||
// {
|
||||
// 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'
|
||||
// }, {
|
||||
// description: '2025-08-10 上午8:00 武汉园区隐患内容管理 状态 处理',
|
||||
// alarm_level_code: 'general',
|
||||
// alarm_status: '已关闭',
|
||||
// alarm_biz_id: '20250827164305283937'
|
||||
// }
|
||||
// ]
|
||||
|
||||
// 同时获取维保任务和巡检任务的数据
|
||||
const [maintenanceResponse, inspectionResponse] = await Promise.all([
|
||||
getWorkOrderStatistics({workOrderType, taskType: '维保任务', campus_id: query.campus_id}).catch(error => {
|
||||
console.error('获取维保任务数据失败:', error)
|
||||
return { records: [] }
|
||||
}),
|
||||
getWorkOrderStatistics({workOrderType, taskType: '巡检任务', campus_id: query.campus_id}).catch(error => {
|
||||
console.error('获取巡检任务数据失败:', error)
|
||||
return { records: [] }
|
||||
})
|
||||
])
|
||||
|
||||
// 周期映射
|
||||
const cycleMap: Record<string, string> = {
|
||||
'day': '每日',
|
||||
'month': '每月',
|
||||
'year': '每年'
|
||||
}
|
||||
|
||||
// 将API数据转换为图表数据格式
|
||||
const convertToChartData = (records: any[], taskTypeName: string): any[] => {
|
||||
const charts: any[] = []
|
||||
|
||||
// 按周期分组
|
||||
const cycleGroups: Record<string, any> = {}
|
||||
records.forEach((record: any) => {
|
||||
const cycle = record.cycle || 'day'
|
||||
if (!cycleGroups[cycle]) {
|
||||
cycleGroups[cycle] = record
|
||||
}
|
||||
})
|
||||
} else {
|
||||
// 根据不同的tab请求不同的接口
|
||||
getTableList(
|
||||
code,
|
||||
{...query, activeTab: tab}
|
||||
).then(response => {
|
||||
// 更新风险统计数据 - 传递完整的数组数据用于饼图显示
|
||||
if (response.records && response.records.length > 0) {
|
||||
riskStatistics.value = response.records
|
||||
} else {
|
||||
// 如果没有数据,设置默认值
|
||||
riskStatistics.value = [
|
||||
{
|
||||
csmpus_name: "雄安新区总部",
|
||||
finishCount: "0",
|
||||
participateCount: "0"
|
||||
}
|
||||
]
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取风险统计数据失败:', error)
|
||||
|
||||
// 创建6个图表(3个周期 x 2个任务类型,但这里只处理一种任务类型)
|
||||
const cycles = ['day', 'month', 'year']
|
||||
cycles.forEach((cycle) => {
|
||||
const data = cycleGroups[cycle] || {}
|
||||
const title = `${cycleMap[cycle]}检查(${taskTypeName})`
|
||||
|
||||
charts.push({
|
||||
title,
|
||||
total: Number(data.total) || 0,
|
||||
status: {
|
||||
notStarted: Number(data.pending) || 0,
|
||||
inProgress: Number(data.processing) || 0,
|
||||
done: Number(data.processed) || 0,
|
||||
voided: Number(data.closed) || 0
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
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) {
|
||||
console.error('获取风险统计数据失败:', error)
|
||||
}
|
||||
|
||||
@@ -135,8 +135,8 @@ export const batchGetTableList = (reportCodes: string, data?) => {
|
||||
// 参数:workOrderType:'物业服务-工程',taskType:'巡检任务'
|
||||
// 统计周期 cycle: day,month,year 对应月日年
|
||||
|
||||
export const getWorkOrderStatistics = (workOrderType: string, taskType: string) => {
|
||||
return request.post({ url: '/jeelowcode/report-data/list/report_work_order_statistics', data: {workOrderType, taskType, page: 1, paseSize: 1} })
|
||||
export const getWorkOrderStatistics = (data: {workOrderType: string, taskType: string, campus_id?: string}) => {
|
||||
return request.post({ url: '/jeelowcode/report-data/list/report_work_order_statistics', data: {...data, page: 1, paseSize: 1} })
|
||||
}
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user