<template>
|
<BaseMap></BaseMap>
|
<el-row class="overlay-container" v-if="true">
|
<el-col :span="7" class="page-right">
|
<el-scrollbar height="var(--fy-body-height)" class="p-events-auto" style="width: 450px">
|
<TaskStats></TaskStats>
|
<TaskSummary></TaskSummary>
|
</el-scrollbar>
|
</el-col>
|
<el-col :span="10">
|
<el-row justify="end">
|
<SubtaskVisual class="subtask-visual"></SubtaskVisual>
|
</el-row>
|
<!-- <el-scrollbar class="page-left-top"> -->
|
<!-- <VisualizationView></VisualizationView> -->
|
<!-- </el-scrollbar> -->
|
<!-- <el-scrollbar class="page-left-bottom p-events-auto">
|
<InspectionView></InspectionView>
|
</el-scrollbar> -->
|
</el-col>
|
<el-col :span="7" class="page-right">
|
<el-scrollbar height="var(--fy-body-height)" class="p-events-auto">
|
<ManagementView></ManagementView>
|
</el-scrollbar>
|
</el-col>
|
</el-row>
|
<SupervisionVisual class="supervision-view"></SupervisionVisual>
|
|
<WorkStream class="work-stream"></WorkStream>
|
<!-- <ProblemTrack class="problem-track"></ProblemTrack> -->
|
</template>
|
|
<script setup>
|
import { provide, ref, unref } from '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'
|
|
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 ProblemTrack from '@/views/inspection/problem/ProblemTrack.vue'
|
import SupervisionVisual from '@/views/visualization/SupervisionVisual.vue'
|
import WorkStream from '@/views/inspection/WorkStream.vue'
|
import TaskStats from '@/views/management/TaskStats.vue'
|
import TaskSummary from '@/views/management/TaskSummary.vue'
|
import SubtaskVisual from '@/views/visualization/SubtaskVisual.vue'
|
|
// provide('mapHeight', 'calc(var(--fy-body-height) / 4 * 3)')
|
provide('mapHeight', 'calc(var(--fy-body-height))')
|
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: '310104',
|
dName: '徐汇区'
|
})
|
areaStore.setSceneType({ label: '全部场景', value: null })
|
|
// 获取本月的所有巡查统计信息
|
subtaskStore.fetchTopTaskProgress(areaStore.area)
|
// subtaskStore.subtaskLoading = true
|
// taskApi.fetchTopTaskProgress(areaStore.area).then((res) => {
|
// if (res.data.length == 0) return
|
// const data = res.data[0]
|
// // 存储为全局数据
|
// subtaskStore.setSummary(data)
|
// subtaskStore.subtaskLoading = false
|
// // 绘制地图标记
|
// marks.createLabelMarks(scene_1, unref(data.subTaskSummary), (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; */
|
}
|
|
.overlay-container {
|
/* background: aliceblue; */
|
position: absolute;
|
width: 100%;
|
/* height: 100vh; */
|
top: 0;
|
left: 0;
|
/* padding: 4px; */
|
pointer-events: none;
|
}
|
|
.work-stream {
|
position: absolute;
|
bottom: 0;
|
left: 0;
|
}
|
|
.task-stats {
|
position: absolute;
|
top: 0;
|
left: 0;
|
}
|
|
.supervision-view {
|
position: absolute;
|
top: 0;
|
left: 0;
|
right: 0;
|
}
|
.problem-track {
|
}
|
|
.subtask-visual {
|
margin-top: 50px;
|
/* min-width: 450px;
|
max-width: 600px; */
|
}
|
</style>
|
