<template>
|
<el-row>
|
<el-col :span="7" class="page-right">
|
<el-scrollbar height="var(--fy-body-height)">
|
<ManagementView></ManagementView>
|
</el-scrollbar>
|
</el-col>
|
<el-col :span="17">
|
<el-scrollbar class="page-left-top">
|
<VisualizationView></VisualizationView>
|
</el-scrollbar>
|
<el-scrollbar class="page-left-bottom">
|
<InspectionView></InspectionView>
|
</el-scrollbar>
|
</el-col>
|
<!-- <el-col :span="7" class="page-right">
|
<el-scrollbar height="var(--fy-body-height)">
|
<StatisticView></StatisticView>
|
</el-scrollbar>
|
</el-col> -->
|
</el-row>
|
</template>
|
|
<script setup>
|
import { provide, ref, unref } from 'vue'
|
import InspectionView from '@/views/inspection/InspectionView.vue'
|
import ManagementView from '@/views/management/ManagementView.vue'
|
import StatisticView from '@/views/management/StatisticView.vue'
|
import VisualizationView from '@/views/visualization/VisualizationView.vue'
|
import { useAreaStore } from '@/stores/area.js'
|
import { useSubtaskStore } from '@/stores/subtask.js'
|
import { useMapStore } from '@/stores/map.js'
|
import taskApi from '@/api/fysp/taskApi.js'
|
import marks from '@/utils/map/marks.js'
|
import mapUtil from '@/utils/map/util.js'
|
import scene_1 from '@/assets/icon/scene_1.png'
|
|
provide('mapHeight', 'calc(var(--fy-body-height) / 4 * 3)')
|
provide('excludeMapHeight', 'calc(var(--fy-body-height) / 4 * 1)')
|
const windowHeight = ref(window.innerHeight)
|
|
const areaStore = useAreaStore()
|
const subtaskStore = useSubtaskStore()
|
const mapStore = useMapStore()
|
|
// 初始化查询范围
|
areaStore.setTimeOneMonth()
|
areaStore.setLocation({
|
pCode: '31',
|
pName: '上海市',
|
cCode: '3100',
|
cName: '上海市',
|
dCode: '310106',
|
dName: '静安区'
|
})
|
areaStore.setSceneType('1')
|
|
// 获取本月的所有巡查统计信息
|
subtaskStore.subtaskLoading = true
|
taskApi.fetchSubtaskSummaryByArea(areaStore.area).then((res) => {
|
// 存储为全局数据
|
subtaskStore.setSummary(res.data)
|
subtaskStore.subtaskLoading = false
|
// 绘制地图标记
|
marks.createLabelMarks(scene_1, unref(res.data), (v) => {
|
mapStore.focusMarker = v
|
})
|
mapUtil.setFitView()
|
})
|
</script>
|
|
<style scoped>
|
.page-left-top {
|
height: calc(var(--fy-body-height) / 4 * 3);
|
/* background-color: aquamarine; */
|
}
|
.page-left-bottom {
|
height: calc(var(--fy-body-height) / 4 * 1);
|
/* background-color: bisque; */
|
}
|
|
.page-right {
|
/* background-color: aliceblue; */
|
}
|
</style>
|
