diff --git a/packages/mobile/src/components/BaseDatePicker.vue b/packages/mobile/src/components/BaseDatePicker.vue index 360cfd9..5cdaeaf 100644 --- a/packages/mobile/src/components/BaseDatePicker.vue +++ b/packages/mobile/src/components/BaseDatePicker.vue @@ -55,6 +55,7 @@ + diff --git a/packages/mobile/src/views/DisasterManagement/WaterDisaster/CubeCalculateDialog.vue b/packages/mobile/src/views/DisasterManagement/WaterDisaster/CubeCalculateDialog.vue deleted file mode 100644 index 234efcb..0000000 --- a/packages/mobile/src/views/DisasterManagement/WaterDisaster/CubeCalculateDialog.vue +++ /dev/null @@ -1,172 +0,0 @@ - - - diff --git a/packages/mobile/src/views/DisasterManagement/WaterDisaster/LossList.vue b/packages/mobile/src/views/DisasterManagement/WaterDisaster/LossList.vue index 85f0a7f..69aaaf8 100644 --- a/packages/mobile/src/views/DisasterManagement/WaterDisaster/LossList.vue +++ b/packages/mobile/src/views/DisasterManagement/WaterDisaster/LossList.vue @@ -1,24 +1,34 @@ + + \ No newline at end of file diff --git a/packages/screen/src/router/index.js b/packages/screen/src/router/index.js index 0066cac..1ea8b14 100644 --- a/packages/screen/src/router/index.js +++ b/packages/screen/src/router/index.js @@ -216,7 +216,7 @@ const routes = [ { path: '/disasterManagement', name: 'disasterManagement', - component: () => import('../views/DisasterManagement/DisasterManagement.vue'), + component: () => import('../views/DisasterManagement/DisasterManagementPC.vue'), meta: { title: '灾害巡检事件', breadcrumb: true @@ -225,7 +225,7 @@ const routes = [ { path: '/disasterReport', name: 'DisasterReport', - component: () => import('../views/DisasterManagement/DisasterReport/DisasterReport.vue'), + component: () => import('../views/DisasterManagement/DisasterReport/DisasterReportPC.vue'), meta: { title: '灾毁事件填报', breadcrumb: true @@ -234,7 +234,7 @@ const routes = [ { path: '/waterDisasterDetail', name: 'WaterDisasterDetail', - component: () => import('../views/DisasterManagement/DisasterDetail/WaterDisasterDetail.vue'), + component: () => import('../views/DisasterManagement/DisasterDetail/WaterDisasterDetailPC.vue'), meta: { title: '水毁事件详情', breadcrumb: true diff --git a/packages/screen/src/views/DisasterManagement/DisasterDetail/ContinueReport.vue b/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterContinueReportPC.vue similarity index 90% rename from packages/screen/src/views/DisasterManagement/DisasterDetail/ContinueReport.vue rename to packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterContinueReportPC.vue index 7158c2b..c98f449 100644 --- a/packages/screen/src/views/DisasterManagement/DisasterDetail/ContinueReport.vue +++ b/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterContinueReportPC.vue @@ -3,19 +3,19 @@
- 续保信息 + 续报信息
- - 半幅封闭 - 全副封闭 - 便道通行 - 正常通行 - + + + + + + @@ -138,7 +138,7 @@ import { ref, reactive, watch, computed } from 'vue' import { ElMessage } from 'element-plus' import { request } from '@shared/utils/request' -import LossList from '../DisasterReport/LossList.vue' +import LossList from '../DisasterReport/WaterDisasterLossListPC.vue' // Props 定义 const props = defineProps({ @@ -164,8 +164,6 @@ const formData = reactive({ contactPhone: '', damageCount: '', district: '', - endStakeLat: '', - endStakeLng: '', endStakeNo: '', estimatedRecoveryCost: '', inspectionMileage: '', @@ -173,8 +171,6 @@ const formData = reactive({ needsRecovery: '', repairProgress: '', reporterUnit: '', - startStakeLat: '', - startStakeLng: '', startStakeNo: '' }, report: { @@ -216,8 +212,8 @@ const blockedOptions = [ ] const repairProgressOptions = [ - { label: '未抢修', value: '未抢修' }, - { label: '抢修中', value: '抢修中' }, + { label: '未抢险', value: '未抢险' }, + { label: '抢险中', value: '抢险中' }, { label: '已完成', value: '已完成' } ] @@ -295,20 +291,6 @@ const calibrateTime = () => { ElMessage.success('时间已校准为当前时间') } -// 校准起点经纬度 -const calibrateStartCoord = () => { - formData.event.startStakeLng = '108.41763025' - formData.event.startStakeLat = '108.41763025' - ElMessage.success('起点经纬度已校准') -} - -// 校准止点经纬度 -const calibrateEndCoord = () => { - formData.event.endStakeLng = '108.41763025' - formData.event.endStakeLat = '108.41763025' - ElMessage.success('止点经纬度已校准') -} - // 表单验证 const validate = () => { if (!formData.occurTime) { @@ -341,8 +323,6 @@ const resetForm = () => { contactPhone: '', damageCount: '', district: '', - endStakeLat: '', - endStakeLng: '', endStakeNo: '', estimatedRecoveryCost: '', inspectionMileage: '', @@ -350,8 +330,6 @@ const resetForm = () => { needsRecovery: '', repairProgress: '', reporterUnit: '', - startStakeLat: '', - startStakeLng: '', startStakeNo: '' }, report: { @@ -426,8 +404,6 @@ defineExpose({ getFormData, resetForm, calibrateTime, - calibrateStartCoord, - calibrateEndCoord }) diff --git a/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterDetail.vue b/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterDetailPC.vue similarity index 69% rename from packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterDetail.vue rename to packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterDetailPC.vue index 3bb01cd..a37db99 100644 --- a/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterDetail.vue +++ b/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterDetailPC.vue @@ -47,16 +47,25 @@
- 抢修进度: + 抢险进度: {{ detailData.event?.repairProgress || '-' }}
+ +
+ 处理措施: + {{ getBaseDisposalMeasures() }} +
+
水毁处数: {{ detailData.event?.damageCount || 0 }}
+
+ +
阻断里程: @@ -66,66 +75,24 @@ - -
- 发生时间: - {{ detailData.occurTime || '-' }} -
-
- -
- 线路编号: - {{ detailData.routeNo || '-' }} -
-
地点路线: {{ detailData.occurLocation || '-' }}
-
- -
起点桩号: {{ detailData.event?.startStakeNo || '-' }}
- -
- 起点桩经度: - {{ detailData.event?.startStakeLng || '-' }} -
-
- -
- 起点桩纬度: - {{ detailData.event?.startStakeLat || '-' }} -
-
-
- -
止点桩号: {{ detailData.event?.endStakeNo || '-' }}
- -
- 止点桩经度: - {{ detailData.event?.endStakeLng || '-' }} -
-
- -
- 止点桩纬度: - {{ detailData.event?.endStakeLat || '-' }} -
-
@@ -141,55 +108,37 @@ {{ detailData.event?.blockedPointName || '-' }}
- -
- 上报区县: - {{ detailData.event?.district || '-' }} -
-
- 巡查里程: - {{ detailData.event?.inspectionMileage ? detailData.event.inspectionMileage + '公里' : '-' }} + 所属区县: + {{ detailData.event?.district || '-' }}
+ +
+ 发生时间: + {{ detailData.occurTime || '-' }} +
+
+
+ +
是否恢复重建: {{ detailData.event?.needsRecovery ? '是' : '否' }}
- +
恢复重建预估费用: {{ detailData.event?.estimatedRecoveryCost ? detailData.event.estimatedRecoveryCost + '万元' : '-' }}
- - - -
- 联系人: - {{ detailData.event?.contactPerson || '-' }} -
-
- -
- 联系电话: - {{ detailData.event?.contactPhone || '-' }} -
-
- -
- 填报单位: - {{ detailData.event?.reporterUnit || '-' }} -
-
-
@@ -204,52 +153,71 @@
{{ report?.title }} - {{ report.reporterName || '-' }} {{ report.reportTime || '-' }} + 时间:{{ report.reportTime || '-' }}
+
+
+
+
+ 现场描述: + {{ report.siteDescription || '-' }} +
+
+ 处置措施: + {{ report.disposalMeasures || '-' }} +
+
+ 实际恢复时间: + {{ report.actualRecoverTime || '-' }} +
+
+ 预计恢复时间: + {{ report.expectRecoverTime || '-' }} +
-
-
- 处置情况: - {{ formatDisposalMeasures(report.disposalMeasures) || '-' }} -
-
- 塌方及损失: - {{ getLossDescription(report) }} -
-
- 路产损失: - {{ report.totalLossAmount ? report.totalLossAmount + '万元' : '-' }} -
-
- 有无车辆滞留: - {{ getVehicleStrandedText(report) }} -
-
- 滞留车辆: - {{ report.strandedVehicleCount || 0 }}辆 -
-
- 预计恢复时间: - {{ report.expectRecoverTime || '-' }} -
-
- 实际恢复时间: - {{ report.actualRecoverTime || '-' }} -
-
- 现场描述: - {{ report.siteDescription || '-' }} -
+
+ 填报人: + {{ report.reporterName ? report.reporterName : '-' }} +
- -
- 附件: -
- - - {{ file.fileName }} - +
+ 联系电话: + {{ report.phone ? report.phone : '-' }} +
+
+ +
+
+ +
+ + + + {{ report.showDetail ? '点击关闭详情' : '点击查看详情' }} +
@@ -274,8 +242,10 @@ import { onMounted, ref, computed } from 'vue' import { useRouter, useRoute } from 'vue-router' import { ElMessage } from 'element-plus' import { ArrowLeft, Picture, VideoCamera } from '@element-plus/icons-vue' -import ContinueReport from './ContinueReport.vue' +import ContinueReport from './WaterDisasterContinueReportPC.vue' import { request } from '@shared/utils/request' +import LossListDetail from './WaterDisasterLossListDetailPC.vue' +import FileUpload from '@/component/FileUpload/FileUpload.vue' import mockData from '../DisasterReport/waterMockJson.json' const router = useRouter() @@ -307,10 +277,15 @@ const continueReport = ref(null) const allReports = computed(() => { const reports = detailData.value.report?.map((item, index) => { - item.title = index === 0 ? '首报' : '续报' + index + if (index === detailData.value.report.length - 1) { + item.title = '首报' + } else { + item.title = '续报' + (detailData.value.report.length - 1 - index) + } return item }) || [] - return reports.reverse() + return reports + // return reports.reverse() }) // 是否有填报数据 @@ -328,14 +303,20 @@ const getEventStatusType = () => { return eventStatus.value === 1 ? 'success' : 'danger' } +const getBaseDisposalMeasures = () => { + const firstItem = allReports.value[0] + if (!firstItem) return '-' + return formatDisposalMeasures(firstItem.disposalMeasures || '') || '-' +} + // 格式化处置措施 const formatDisposalMeasures = (measures) => { if (!measures) return '' const measureMap = { - halfClose: '半幅封闭', - fullClose: '全副封闭', - bypass: '便道通行', - normal: '正常通行' + 半幅封闭: '半幅封闭', + 全副封闭: '全副封闭', + 便道通行: '便道通行', + 正常通行: '正常通行' } return measures .split(',') @@ -381,6 +362,7 @@ const getDisasterDetail = async () => { if (result?.data) { const data = result.data + console.log('🚀 ~ getDisasterDetail ~ data:', data) detailData.value = { event: data.event || null, report: data.report || [], @@ -397,7 +379,7 @@ const getDisasterDetail = async () => { const newFormData = { ...data, lossList: null, - report: mockData.report, + report: route.query.mock ? mockData.report : {}, fileList: null } continueReport.value?.initFormData(newFormData) @@ -416,25 +398,6 @@ const handleClickBack = () => { router.push('/disasterManagement') } -// 续报 -const handleContinueReport = () => { - router.push({ - path: '/disasterReport', - query: { - id: route.query.id, - eventId: detailData.value.event?.id, - isContinue: 'true' - } - }) -} - -// 预览附件 -const previewFile = (file) => { - if (file.fileUrl) { - window.open(file.fileUrl, '_blank') - } -} - onMounted(() => { getDisasterDetail() }) @@ -502,8 +465,12 @@ onMounted(() => { align-items: flex-start; line-height: 1.5; + & + .info-item { + margin-top: 10px; + } + .info-label { - width: 120px; + white-space: nowrap; flex-shrink: 0; color: #909399; font-size: 14px; @@ -612,7 +579,26 @@ onMounted(() => { margin-right: 10px; } .right-panel { - width: 400px; + width: 300px; } +} +.content-wrapper { + display: flex; + flex-direction: column; +} +.basic-info-wrapper { + display: flex; +} +.detal-info-wrapper { + margin-top: 10px; + border-top: 1px solid #efefef; + padding-top: 10px; +} +.info-list { + flex: 1; + overflow: hidden; +} +.file-list { + } diff --git a/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterLossListDetailPC.vue b/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterLossListDetailPC.vue new file mode 100644 index 0000000..aad82ff --- /dev/null +++ b/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterLossListDetailPC.vue @@ -0,0 +1,179 @@ + + + + + diff --git a/packages/screen/src/views/DisasterManagement/DisasterManagement.vue b/packages/screen/src/views/DisasterManagement/DisasterManagementPC.vue similarity index 85% rename from packages/screen/src/views/DisasterManagement/DisasterManagement.vue rename to packages/screen/src/views/DisasterManagement/DisasterManagementPC.vue index 68edc96..700557d 100644 --- a/packages/screen/src/views/DisasterManagement/DisasterManagement.vue +++ b/packages/screen/src/views/DisasterManagement/DisasterManagementPC.vue @@ -22,9 +22,8 @@ - - - + + @@ -87,20 +86,25 @@ {{ scope.$index + 1 }} - + - - + + - + + + - + @@ -148,6 +152,9 @@ />
+ + +
@@ -156,6 +163,8 @@ import { ref, reactive, onMounted } from 'vue' import { ElMessage } from 'element-plus' import { useRouter } from 'vue-router' import { request } from '@/utils/request' +import { Picture, VideoPlay } from '@element-plus/icons-vue' +import VideoPreviewDialog from '@/component/VideoPreviewDialog.vue' const router = useRouter() @@ -171,6 +180,11 @@ const filterForm = reactive({ pushStatus: '' // 推送状态 }) +const showPreviewImage = ref(false) +const selectedRow = ref(null) + +const videoPreviewDialog = ref(null) + // 日期范围 const dateRange = ref(null) @@ -221,7 +235,7 @@ const fetchData = async () => { // 实际接口调用 const response = await request({ - url: '/snow-ops-platform/unified-disaster/list', + url: '/snow-ops-platform/unified-disaster/pc/list', method: 'get', params }) @@ -313,21 +327,16 @@ const toReport = () => { // 查看图片 const viewImages = (row) => { - if (row.images && row.images.length) { - // 打开图片预览 - ElMessage.info('图片预览功能开发中') - } else { - ElMessage.info('暂无图片') - } + selectedRow.value = row + showPreviewImage.value = true } // 查看视频 const viewVideos = (row) => { - if (row.videos && row.videos.length) { - ElMessage.info('视频播放功能开发中') - } else { - ElMessage.info('暂无视频') - } + videoPreviewDialog.value.show({ + url: row.videos[0], + title: row.eventName + }) } // 分页大小改变 @@ -400,4 +409,4 @@ onMounted(() => { border-top: 1px solid #ebeef5; } } - \ No newline at end of file + diff --git a/packages/screen/src/views/DisasterManagement/DisasterReport/DisasterReport.vue b/packages/screen/src/views/DisasterManagement/DisasterReport/DisasterReportPC.vue similarity index 97% rename from packages/screen/src/views/DisasterManagement/DisasterReport/DisasterReport.vue rename to packages/screen/src/views/DisasterManagement/DisasterReport/DisasterReportPC.vue index b4c9bfb..3bfa6d3 100644 --- a/packages/screen/src/views/DisasterManagement/DisasterReport/DisasterReport.vue +++ b/packages/screen/src/views/DisasterManagement/DisasterReport/DisasterReportPC.vue @@ -16,7 +16,7 @@ import { useRouter, useRoute } from 'vue-router' import { ElMessage, ElMessageBox } from 'element-plus' import { Plus, Upload } from '@element-plus/icons-vue' import { request } from '@/utils/request' -import WaterDisasterReport from './WaterDisasterReport.vue' +import WaterDisasterReport from './WaterDisasterReportPC.vue' const router = useRouter() const route = useRoute() diff --git a/packages/screen/src/views/DisasterManagement/DisasterReport/LossList.vue b/packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterLossListPC.vue similarity index 100% rename from packages/screen/src/views/DisasterManagement/DisasterReport/LossList.vue rename to packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterLossListPC.vue diff --git a/packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReport.vue b/packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReportPC.vue similarity index 98% rename from packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReport.vue rename to packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReportPC.vue index e5837d5..d37522d 100644 --- a/packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReport.vue +++ b/packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReportPC.vue @@ -77,8 +77,8 @@ - - + + @@ -371,7 +371,7 @@ import { ElMessage } from 'element-plus' import { Plus, Upload } from '@element-plus/icons-vue' import mockData from './waterMockJson.json' import { request } from '@/utils/request' -import LossList from './LossList.vue' +import LossList from './WaterDisasterLossListPC.vue' import BlockItem from '@/component/BlockItem.vue' import FileUpload from '@/component/FileUpload/FileUpload.vue' @@ -407,17 +407,13 @@ const formData = reactive({ contactPhone: null, // 联系电话 damageCount: null, // 水毁处数 district: null, // 上报区县 - endStakeLat: null, // 止点纬度 - endStakeLng: null, // 止点经度 endStakeNo: null, // 止点桩号 estimatedRecoveryCost: null, // 恢复重建预估费用 inspectionMileage: null, // 巡查里程 isBlocked: null, // 是否阻断 needsRecovery: null, // 是否需要恢复重建 - repairProgress: null, // 抢修进度 + repairProgress: null, // 抢险进度 reporterUnit: null, // 填报单位 - startStakeLat: null, // 起点纬度 - startStakeLng: null, // 起点经度 startStakeNo: null // 起点桩号 }, diff --git a/packages/screen/src/views/DisasterManagement/DisasterReport/waterMockJson.json b/packages/screen/src/views/DisasterManagement/DisasterReport/waterMockJson.json index ce32ea7..b4b555f 100644 --- a/packages/screen/src/views/DisasterManagement/DisasterReport/waterMockJson.json +++ b/packages/screen/src/views/DisasterManagement/DisasterReport/waterMockJson.json @@ -10,17 +10,13 @@ "contactPhone": "13812345678", "damageCount": 3, "district": "武侯区", - "endStakeLat": "30.658712", - "endStakeLng": "104.082356", "endStakeNo": "K2251+200", "estimatedRecoveryCost": 120.5, "inspectionMileage": 25.6, "isBlocked": true, "needsRecovery": true, - "repairProgress": "抢修中", + "repairProgress": "抢险中", "reporterUnit": "武侯区交通运输局", - "startStakeLat": "30.652145", - "startStakeLng": "104.075632", "startStakeNo": "K2250+300" }, "report": { @@ -28,7 +24,7 @@ "strandedPersonCount": 12, "deadCount": 0, "strandedVehicleCount": 12, - "disposalMeasures": "halfClose,bypass", + "disposalMeasures": "全幅封闭", "actualRecoverTime": "2024-07-17 12:00:00", "expectRecoverTime": "2024-07-18 18:00:00", "injuredCount": 1,