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 20:55:27 +08:00
parent caad49998c
commit 2569fa16e5
4 changed files with 1004 additions and 617 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -15,52 +15,46 @@
</div>
</div>
<!-- 天气预报 -->
<WeatherWarning/>
<WeatherWarning />
<!-- 主内容区 -->
<div class="content-container">
<div class="left-wrapper">
<OverviewPanel
:totalCount="dashboardData?.totalCount || 0"
<OverviewPanel :totalCount="dashboardData?.totalCount || 0"
:formalEmployeeCount="dashboardData?.formalEmployeeCount || 0"
:externalStaffCount="dashboardData?.externalStaffCount || 0"
:visitorCount="dashboardData?.visitorCount || 0"
:parkStatistics="dashboardData?.parkStatistics"/>
<RiskStatisticsPanel
:riskStatistics="riskStatistics" :dangerDetail="dangerDetail"
@tab-change="handleRiskTabChange" :campus_id="query.campus_id"/>
:externalStaffCount="dashboardData?.externalStaffCount || 0" :visitorCount="dashboardData?.visitorCount || 0"
:parkStatistics="dashboardData?.parkStatistics" />
<RiskStatisticsPanel :riskStatistics="riskStatistics" :dangerDetail="dangerDetail"
@tab-change="handleRiskTabChange" :campus_id="query.campus_id" />
</div>
<div class="right-wrapper">
<HighRiskAlertPanel
:alertData="dashboardData?.alertData" :alertDetails="dashboardData?.alertData.details"
:sourceIndex="sourceIndex"/>
<TimeoutWorkOrderPanel
:timeoutWorkOrders="dashboardData?.timeoutWorkOrders"
:alertDetails="dashboardData?.timeoutWorkOrders.details" :sourceIndex="sourceIndex"/>
<HighRiskAlertPanel :alertData="dashboardData?.alertData" :alertDetails="dashboardData?.alertData.details"
:sourceIndex="sourceIndex" />
<TimeoutWorkOrderPanel :timeoutWorkOrders="dashboardData?.timeoutWorkOrders"
:alertDetails="dashboardData?.timeoutWorkOrders.details" :sourceIndex="sourceIndex" />
</div>
<HiddenDangerPanel :hiddenDangerData="dashboardData?.hiddenDangerData"/>
<HiddenDangerPanel :hiddenDangerData="dashboardData?.hiddenDangerData" />
</div>
</div>
<!-- 区域选择弹窗 -->
<RegionSelector
v-model="regionSelectorVisible" :modelSelected="selectedRegion" :regions="regionOption"
@change="onRegionChange"/>
<RegionSelector v-model="regionSelectorVisible" :modelSelected="selectedRegion" :regions="regionOption"
@change="onRegionChange" />
</template>
<script setup lang="ts">
import {getTableList, getTableData} from './report'
import {ref, onMounted, watch, onUnmounted} from 'vue'
import {useRouter} from 'vue-router'
import { getTableList, getTableData, getWorkOrderStatistics } from './report'
import { ref, onMounted, watch, onUnmounted } from 'vue'
import { useRouter } from 'vue-router'
import RegionSelector from './components/RegionSelector.vue'
import WeatherWarning from './components/WeatherWarning.vue'
import {getDashboardData, getAlertDetails, type DashboardData} from '@/api/dashboard'
import { getDashboardData, getAlertDetails, type DashboardData } from '@/api/dashboard'
import OverviewPanel from './components/OverviewPanel.vue'
import RiskStatisticsPanel from './components/RiskStatisticsPanel.vue'
import HighRiskAlertPanel from './components/HighRiskAlertPanel.vue'
import TimeoutWorkOrderPanel from './components/TimeoutWorkOrderPanel.vue'
import HiddenDangerPanel from './components/HiddenDangerPanel.vue'
import {error} from "echarts/types/src/util/log";
import { error } from "echarts/types/src/util/log";
// 类型定义
interface AlertItem {
@@ -73,7 +67,7 @@ interface RegionItem {
code: string
}
type TabType = '高危作业' | '安全培训考试' | '安全培训考试'
type TabType = '安全类' | '工程类'
// 响应式数据
const currentDateTime = ref<string>('')
@@ -95,7 +89,10 @@ const visitorCount = ref<number>(0)
// 总体概览-各园区统计
const parkStatistics = ref<any>()
// 高危作业/安全培训考试/安全培训考试
const riskStatistics = ref<any>()
const riskStatistics = ref<any>({
安全类: [],
工程类: []
})
const dangerDetail = ref<any>()
// 动画相关的状态
@@ -220,7 +217,7 @@ onMounted(async () => {
timeUpdateTimerId.value = setInterval(updateTime, 1000)
//
try {
let {records} = await getTableList(
let { records } = await getTableList(
'park_info_list'
)
// records = [
@@ -395,7 +392,7 @@ const loadDashboardData = async (): Promise<void> => {
} catch (error) {
console.error('获取超期工单数据失败:', error)
}
handleRiskTabChange('高危作业')
handleRiskTabChange('安全类')
handleHiddenDangerPannelData(query)
console.log('dashboardData.value>>>>>>>>>>', dashboardData.value);
}
@@ -567,93 +564,82 @@ const handleHiddenDangerPannelData = (query) => {
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'
// }
// ]
}
})
} 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)
// 同时获取维保任务和巡检任务的数据
const [maintenanceResponse, inspectionResponse] = await Promise.all([
getWorkOrderStatistics(workOrderType, '维保任务').catch(error => {
console.error('获取维保任务数据失败:', error)
return { records: [] }
}),
getWorkOrderStatistics(workOrderType, '巡检任务').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
}
})
// 创建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)
}
@@ -664,7 +650,7 @@ const onRegionChange = (item: RegionItem): void => {
selectedRegion.value = item.name
router.push({
path: '/screen/region',
query: {region: item.name, regionCode: item.code}
query: { region: item.name, regionCode: item.code }
})
}
@@ -1231,19 +1217,19 @@ const timeOut1 = (): void => {
.left-top {
padding: 0 5px;
background-image: url('@/assets/images/screen/left_top_img.png'),
url('@/assets/images/screen/left_center_img.png'),
url('@/assets/images/screen/left_bottom_img.png');
url('@/assets/images/screen/left_center_img.png'),
url('@/assets/images/screen/left_bottom_img.png');
background-position: top center,
left center,
bottom center;
left center,
bottom center;
/* 设置大小，注意中间的背景图应该覆盖整个容器 */
background-repeat: no-repeat, no-repeat, no-repeat;
/* 设置位置 */
background-size: 100% 90px,
cover,
100% 68px;
cover,
100% 68px;
flex: 1;
/* 设置重复方式 */
@@ -1405,19 +1391,19 @@ const timeOut1 = (): void => {
.left-bottom {
background-image: url('@/assets/images/screen/left_top_2_img.png'),
url('@/assets/images/screen/left_center_img.png'),
url('@/assets/images/screen/left_bottom_img.png');
url('@/assets/images/screen/left_center_img.png'),
url('@/assets/images/screen/left_bottom_img.png');
background-position: top center,
left center,
bottom center;
left center,
bottom center;
/* 设置大小，注意中间的背景图应该覆盖整个容器 */
background-repeat: no-repeat, no-repeat, no-repeat;
/* 设置位置 */
background-size: 100% 90px,
cover,
100% 68px;
cover,
100% 68px;
flex: 1;
/* 设置重复方式 */