diff --git a/packages/mobile/src/views/DisasterManagement/DisasterDetail.vue b/packages/mobile/src/views/DisasterManagement/DisasterDetail.vue
index f4fd7d3..a164499 100644
--- a/packages/mobile/src/views/DisasterManagement/DisasterDetail.vue
+++ b/packages/mobile/src/views/DisasterManagement/DisasterDetail.vue
@@ -6,7 +6,6 @@
     <!-- 基本信息 -->
     <PanelItem title="基本信息">
       <template #headerExtra>
-        <!-- 状态标签（需要从续报中判断是否已解除，或接口增加 eventStatus 字段） -->
         <div class="status-wrapper">
           <van-tag :type="getEventStatusType()" size="medium" plain>
             {{ getEventStatusText() }}
@@ -38,11 +37,10 @@
         <span class="info-value">{{ detailData.event?.repairProgress || '-' }}</span>
       </div>
 
-      <!-- 处理措施（从首报中获取） -->
-      <div class="info-row">
+      <!-- <div class="info-row">
         <span class="info-label">处理措施：</span>
-        <span class="info-value">{{ formatDisposalMeasures(firstReport?.disposalMeasures) || '-' }}</span>
-      </div>
+        <span class="info-value">{{ formatDisposalMeasures(detailData.event?.disposalMeasures) || '-' }}</span>
+      </div> -->
 
       <!-- 水毁处数 -->
       <div class="info-row">
@@ -159,63 +157,10 @@
 
     <!-- 填报信息 -->
     <PanelItem title="填报信息">
-      <!-- 首报信息 -->
-      <div class="report-section" v-if="firstReport">
+      <!-- 遍历所有填报记录（首报 + 续报） -->
+      <div v-for="(report, index) in allReports" :key="index" class="report-section">
         <div class="report-header">
-          <span class="report-title">首报</span>
-          <span class="report-meta">{{ firstReport.reporterName || '-' }} {{ firstReport.reportTime || '-' }}</span>
-        </div>
-        <div class="report-content">
-          <div class="info-row">
-            <span class="info-label">处置情况：</span>
-            <span class="info-value">{{ formatDisposalMeasures(firstReport.disposalMeasures) || '-' }}</span>
-          </div>
-          <div class="info-row">
-            <span class="info-label">塌方及损失：</span>
-            <span class="info-value">{{ getLossDescription(firstReport) }}</span>
-          </div>
-          <div class="info-row">
-            <span class="info-label">路产损失：</span>
-            <span class="info-value">{{ firstReport.totalLossAmount ? firstReport.totalLossAmount + '万元' : '-' }}</span>
-          </div>
-          <div class="info-row">
-            <span class="info-label">有无车辆滞留：</span>
-            <span class="info-value">{{ getVehicleStrandedText(firstReport) }}</span>
-          </div>
-          <div class="info-row">
-            <span class="info-label">滞留车辆：</span>
-            <span class="info-value">{{ firstReport.strandedVehicleCount || 0 }}辆</span>
-          </div>
-          <div class="info-row">
-            <span class="info-label">预计恢复时间：</span>
-            <span class="info-value">{{ firstReport.expectRecoverTime || '-' }}</span>
-          </div>
-          <div class="info-row">
-            <span class="info-label">实际恢复时间：</span>
-            <span class="info-value">{{ firstReport.actualRecoverTime || '-' }}</span>
-          </div>
-          <div class="info-row">
-            <span class="info-label">现场描述：</span>
-            <span class="info-value">{{ firstReport.siteDescription || '-' }}</span>
-          </div>
-          <!-- 附件 -->
-          <div class="info-row" v-if="firstReport.fileList && firstReport.fileList.length > 0">
-            <span class="info-label">附件：</span>
-            <div class="attachment-list">
-              <div v-for="(file, index) in firstReport.fileList" :key="index" class="attachment-item">
-                <van-icon :name="file.fileType === 1 ? 'photo-o' : 'video-o'" />
-                <span class="file-name">{{ file.fileName }}</span>
-                <van-button size="mini" type="primary" plain @click="previewFile(file)">预览</van-button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <!-- 续报列表 -->
-      <div v-for="(report, index) in continueReports" :key="index" class="report-section">
-        <div class="report-header">
-          <span class="report-title">续报{{ index + 1 }}</span>
+          <span class="report-title">{{ report?.title }}</span>
           <span class="report-meta">{{ report.reporterName || '-' }} {{ report.reportTime || '-' }}</span>
         </div>
         <div class="report-content">
@@ -270,8 +215,8 @@
     </PanelItem>
 
     <!-- 底部按钮：未解除状态显示续报按钮 -->
-    <div class="footer-buttons" v-if="!isEventResolved">
-      <van-button type="primary" class="footer-btn" @click="handleContinueReport">续报</van-button>
+    <div class="footer-buttons">
+      <van-button type="primary" class="footer-btn"  @click="handleContinueReport">续报</van-button>
     </div>
   </PageContainer>
 </template>
@@ -292,8 +237,7 @@ const route = useRoute()
 // 详情数据（对应 Data 接口）
 const detailData = ref({
   event: null,           // Event 对象
-  report: null,          // Report 对象（首报）
-  reportList: [],        // 续报列表（可选，如果接口返回）
+  reportList: [],        // 填报列表（包含首报和续报）
   fileList: [],          // 附件列表
   lossList: [],          // 损失列表
   occurLocation: '',
@@ -302,42 +246,28 @@ const detailData = ref({
   routeNo: ''
 })
 
-// 首报（优先使用 report，如果没有则从 reportList 中找 reportType === 1）
-const firstReport = computed(() => {
-  if (detailData.value.report) {
-    return detailData.value.report
-  }
-  return detailData.value.reportList?.find(r => r.reportType === 1)
-})
-
-// 续报列表（reportType === 2）
-const continueReports = computed(() => {
-  return detailData.value.reportList?.filter(r => r.reportType === 2) || []
+const allReports = computed(() => {
+  const reports = detailData.value.reportList?.map((item, index)=>{
+    item.title = index == 0 ? '首报' : ('续报' + index)
+    return item
+  }) || []
+  return reports.reverse()
 })
 
 // 是否有填报数据
 const hasReportData = computed(() => {
-  return firstReport.value || continueReports.value.length > 0
+  return allReports.value.length > 0
 })
 
-// 判断事件是否已解除（根据实际恢复时间或续报状态判断）
-const isEventResolved = computed(() => {
-  // 如果首报有实际恢复时间且不为空，则认为已解除
-  // if (firstReport.value?.actualRecoverTime) {
-  //   return true
-  // }
-  // // 检查续报中是否有实际恢复时间
-  // return continueReports.value.some(r => r.actualRecoverTime)
-})
 
 // 获取事件状态文本
 const getEventStatusText = () => {
-  return isEventResolved.value ? '已解除' : '未解除'
+  return detailData.eventStatus === 1 ? '已解除' : '未解除'
 }
 
 // 获取事件状态类型
 const getEventStatusType = () => {
-  return isEventResolved.value ? 'success' : 'danger'
+  return detailData.eventStatus === 1 ? 'success' : 'danger'
 }
 
 // 格式化处置措施（逗号分隔转中文）
@@ -396,8 +326,7 @@ const getDisasterDetail = async () => {
       const data = result.data
       detailData.value = {
         event: data.event || null,
-        report: data.report || null,
-        reportList: data.reportList || [],
+        reportList: data.report || [],  // 直接使用 reportList，包含首报和续报
         fileList: data.fileList || [],
         lossList: data.lossList || [],
         occurLocation: data.occurLocation || '',
diff --git a/packages/mobile/src/views/DisasterManagement/WaterDisaster/WaterDisaster.vue b/packages/mobile/src/views/DisasterManagement/WaterDisaster/WaterDisaster.vue
index 8f51399..cf3e45c 100644
--- a/packages/mobile/src/views/DisasterManagement/WaterDisaster/WaterDisaster.vue
+++ b/packages/mobile/src/views/DisasterManagement/WaterDisaster/WaterDisaster.vue
@@ -58,7 +58,7 @@
           <span>校准经纬度</span>
         </div>
 
-        <!-- 路况位置 (event.endStakeNo) -->
+        <!-- 路况位置 (occurLocation) -->
         <van-field v-model="formData.occurLocation" label="路况位置" placeholder="请填写" />
 
         <!-- 阻断点小地名 (event.blockedPointName) -->
@@ -71,12 +71,13 @@
       <div class="disposal-measures">
         <span class="measures-label">处置措施</span>
         <div class="measures-options">
-          <van-checkbox-group v-model="disposalMeasuresArray" direction="horizontal">
-            <van-checkbox name="halfClose">半幅封闭</van-checkbox>
-            <van-checkbox name="fullClose">全副封闭</van-checkbox>
-            <van-checkbox name="bypass">便道通行</van-checkbox>
-            <van-checkbox name="normal">正常通行</van-checkbox>
-          </van-checkbox-group>
+          <!-- 改为单选，使用 van-radio-group -->
+          <van-radio-group v-model="disposalMeasureValue" direction="horizontal">
+            <van-radio name="halfClose">半幅封闭</van-radio>
+            <van-radio name="fullClose">全副封闭</van-radio>
+            <van-radio name="bypass">便道通行</van-radio>
+            <van-radio name="normal">正常通行</van-radio>
+          </van-radio-group>
         </div>
       </div>
 
@@ -198,8 +199,8 @@ const route = useRoute()
 // 是否为续报
 const isContinue = computed(() => route.query.isContinue)
 
-// 处置措施数组（用于多选框组，需要转换为逗号分隔的字符串）
-const disposalMeasuresArray = ref([])
+// 处置措施单选值（用于单选组件）
+const disposalMeasureValue = ref('')
 
 // 附件列表
 const imageFileList = ref([])
@@ -240,7 +241,7 @@ const formData = reactive({
     actualRecoverTime: '', // 实际恢复时间
     damagedVehicleCount: '', // 损坏车辆
     deadCount: '', // 死亡人员
-    disposalMeasures: '', // 处置措施（逗号分隔）
+    disposalMeasures: '', // 处置措施（单个值，不再用逗号分隔）
     expectRecoverTime: '', // 预计恢复时间
     injuredCount: '', // 受伤人员
     investedFunds: '', // 已投资金
@@ -260,14 +261,10 @@ const formData = reactive({
   fileList: []
 })
 
-// 监听处置措施数组变化，转换为逗号分隔的字符串存到 report.disposalMeasures
-watch(
-  disposalMeasuresArray,
-  (newVal) => {
-    formData.report.disposalMeasures = newVal.join(',')
-  },
-  { deep: true }
-)
+// 监听处置措施单选值变化，直接赋值给 report.disposalMeasures
+watch(disposalMeasureValue, (newVal) => {
+  formData.report.disposalMeasures = newVal
+})
 
 // 监听附件变化，同步到 fileList
 watch(
@@ -313,12 +310,12 @@ watch(
   { deep: true }
 )
 
-// 从 report.disposalMeasures 初始化处置措施数组
+// 从 report.disposalMeasures 初始化处置措施单选值
 watch(
   () => formData.report.disposalMeasures,
   (newVal) => {
     if (newVal && typeof newVal === 'string') {
-      disposalMeasuresArray.value = newVal.split(',').filter(Boolean)
+      disposalMeasureValue.value = newVal
     }
   },
   { immediate: true }
@@ -368,9 +365,9 @@ const initFormData = (newVal) => {
       fileList: newVal.fileList || []
     })
 
-    // 初始化处置措施数组
+    // 初始化处置措施单选值（直接赋值，不再需要 split）
     if (newVal.report?.disposalMeasures) {
-      disposalMeasuresArray.value = newVal.report.disposalMeasures.split(',').filter(Boolean)
+      disposalMeasureValue.value = newVal.report.disposalMeasures
     }
   }
 }
@@ -480,12 +477,12 @@ defineExpose({
       margin-bottom: 8px;
     }
     .measures-options {
-      :deep(.van-checkbox-group) {
+      :deep(.van-radio-group) {
         display: flex;
         flex-wrap: wrap;
         gap: 16px;
       }
-      :deep(.van-checkbox) {
+      :deep(.van-radio) {
         margin-right: 0;
       }
     }
@@ -526,4 +523,4 @@ defineExpose({
     width: 110px;
   }
 }
-</style>
+</style>
\ No newline at end of file
diff --git a/packages/screen/src/assets/MaMap_img/蓝色@2x (1).png b/packages/screen/src/assets/MaMap_img/桥梁icon@2x.png
similarity index 100%
rename from packages/screen/src/assets/MaMap_img/蓝色@2x (1).png
rename to packages/screen/src/assets/MaMap_img/桥梁icon@2x.png
diff --git a/packages/screen/src/assets/MaMap_img/线路icon定位@2x.png b/packages/screen/src/assets/MaMap_img/线路icon定位@2x.png
new file mode 100644
index 0000000..17adfbe
Binary files /dev/null and b/packages/screen/src/assets/MaMap_img/线路icon定位@2x.png differ
diff --git a/packages/screen/src/assets/MaMap_img/队伍icon定位@2x.png b/packages/screen/src/assets/MaMap_img/队伍icon@2x.png
similarity index 100%
rename from packages/screen/src/assets/MaMap_img/队伍icon定位@2x.png
rename to packages/screen/src/assets/MaMap_img/队伍icon@2x.png
diff --git a/packages/screen/src/assets/MaMap_img/隧洞icon定位@2x.png b/packages/screen/src/assets/MaMap_img/隧洞icon@2x.png
similarity index 100%
rename from packages/screen/src/assets/MaMap_img/隧洞icon定位@2x.png
rename to packages/screen/src/assets/MaMap_img/隧洞icon@2x.png
diff --git a/packages/screen/src/router/index.js b/packages/screen/src/router/index.js
index c471ae7..6207d7e 100644
--- a/packages/screen/src/router/index.js
+++ b/packages/screen/src/router/index.js
@@ -163,7 +163,16 @@ const routes = [
     name: 'DisasterReport',
     component: () => import('../views/DisasterManagement/DisasterReport/DisasterReport.vue'),
     meta: {
-      title: '水毁事件填报',
+      title: '灾毁事件填报',
+      breadcrumb: true
+    }
+  },
+    {
+    path: '/waterDisasterDetail',
+    name: 'WaterDisasterDetail',
+    component: () => import('../views/DisasterManagement/DisasterDetail/WaterDisasterDetail.vue'),
+    meta: {
+      title: '水毁事件详情',
       breadcrumb: true
     }
   }
diff --git a/packages/screen/src/views/DisasterManagement/DisasterDetail/ContinueReport.vue b/packages/screen/src/views/DisasterManagement/DisasterDetail/ContinueReport.vue
new file mode 100644
index 0000000..77eb5bd
--- /dev/null
+++ b/packages/screen/src/views/DisasterManagement/DisasterDetail/ContinueReport.vue
@@ -0,0 +1,475 @@
+<template>
+  <div class="water-disaster-pc">
+    <!-- 合并后的单个卡片 -->
+    <el-card class="form-card" shadow="never">
+      <div slot="header" class="card-header">
+        <span>续保信息</span>
+      </div>
+
+      <!-- 所有表单项合并到一个区域，每行一个 -->
+      <el-form :model="formData" label-width="120px" size="small">
+        <!-- 处置措施 -->
+        <el-form-item label="处置措施">
+          <el-radio-group v-model="disposalMeasureValue">
+            <el-radio label="halfClose">半幅封闭</el-radio>
+            <el-radio label="fullClose">全副封闭</el-radio>
+            <el-radio label="bypass">便道通行</el-radio>
+            <el-radio label="normal">正常通行</el-radio>
+          </el-radio-group>
+        </el-form-item>
+
+        <!-- 预计恢复时间 -->
+        <el-form-item label="预计恢复时间">
+          <el-date-picker
+            v-model="formData.report.expectRecoverTime"
+            type="datetime"
+            placeholder="请选择时间"
+            value-format="yyyy-MM-dd HH:mm"
+            :picker-options="pickerOptions"
+            style="width: 100%"
+          />
+        </el-form-item>
+
+        <!-- 实际恢复时间 -->
+        <el-form-item label="实际恢复时间">
+          <el-date-picker
+            v-model="formData.report.actualRecoverTime"
+            type="datetime"
+            placeholder="请选择时间"
+            value-format="yyyy-MM-dd HH:mm"
+            :picker-options="pickerOptions"
+            style="width: 100%"
+          />
+        </el-form-item>
+
+        <!-- 受伤人员 -->
+        <el-form-item label="受伤人员">
+          <el-input-number v-model="formData.report.injuredCount" :min="0" :controls="false" placeholder="请填写" style="width: 300px">
+            <template slot="append">人</template>
+          </el-input-number>
+        </el-form-item>
+
+        <!-- 死亡人员 -->
+        <el-form-item label="死亡人员">
+          <el-input-number v-model="formData.report.deadCount" :min="0" :controls="false" placeholder="请填写" style="width: 300px">
+            <template slot="append">人</template>
+          </el-input-number>
+        </el-form-item>
+
+        <!-- 滞留人员 -->
+        <el-form-item label="滞留人员">
+          <el-input-number v-model="formData.report.strandedPersonCount" :min="0" :controls="false" placeholder="请填写" style="width: 300px">
+            <template slot="append">人</template>
+          </el-input-number>
+        </el-form-item>
+
+        <!-- 损坏车辆 -->
+        <el-form-item label="损坏车辆">
+          <el-input-number v-model="formData.report.damagedVehicleCount" :min="0" :controls="false" placeholder="请填写" style="width: 300px">
+            <template slot="append">辆</template>
+          </el-input-number>
+        </el-form-item>
+
+        <!-- 滞留车辆 -->
+        <el-form-item label="滞留车辆">
+          <el-input-number v-model="formData.report.strandedVehicleCount" :min="0" :controls="false" placeholder="请填写" style="width: 300px">
+            <template slot="append">辆</template>
+          </el-input-number>
+        </el-form-item>
+
+        <!-- 损失列表组件 -->
+        <el-form-item label="灾毁损失">
+          <loss-list v-model="formData.lossList" />
+        </el-form-item>
+
+        <!-- 处理情况 -->
+        <el-form-item label="处理情况">
+          <el-input v-model="formData.report.remark" type="textarea" :rows="2" placeholder="请填写（选填）" style="width: 60%" />
+        </el-form-item>
+
+        <!-- 损失总金额 -->
+        <el-form-item label="损失总金额">
+          <el-input v-model="formData.report.totalLossAmount" placeholder="请填写（选填）" style="width: 300px">
+            <template slot="append">万元</template>
+          </el-input>
+        </el-form-item>
+
+        <!-- 已投机械 -->
+        <el-form-item label="已投机械">
+          <el-input v-model="formData.report.investedMachinery" placeholder="请填写" style="width: 300px">
+            <template slot="append">台/班</template>
+          </el-input>
+        </el-form-item>
+
+        <!-- 已投入力 -->
+        <el-form-item label="已投入力">
+          <el-input-number v-model="formData.report.investedManpower" :min="0" :controls="false" placeholder="请填写" style="width: 300px">
+            <template slot="append">人次</template>
+          </el-input-number>
+        </el-form-item>
+
+        <!-- 已投资金 -->
+        <el-form-item label="已投资金">
+          <el-input v-model="formData.report.investedFunds" placeholder="请填写" style="width: 300px">
+            <template slot="append">万元</template>
+          </el-input>
+        </el-form-item>
+
+        <!-- 现场描述 -->
+        <el-form-item label="现场描述">
+          <el-input v-model="formData.report.siteDescription" type="textarea" :rows="2" placeholder="请填写" style="width: 60%" />
+        </el-form-item>
+
+        <!-- 是否需要恢复重建 -->
+        <el-form-item label="是否需要恢复重建">
+          <el-radio-group v-model="formData.event.needsRecovery">
+            <el-radio :label="true">是</el-radio>
+            <el-radio :label="false">否</el-radio>
+          </el-radio-group>
+        </el-form-item>
+
+        <el-form-item>
+          <el-button type="primary" @click="handleSubmit">追加记录</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, watch, computed } from 'vue'
+import { ElMessage } from 'element-plus'
+import { request } from '@shared/utils/request'
+// import LossList from './LossList.vue'
+
+// Props 定义
+const props = defineProps({
+  value: {
+    type: Object,
+    default: () => ({})
+  }
+})
+
+// Emits 定义
+const emit = defineEmits(['input', 'change', 'submit'])
+
+// 表单数据
+const formData = reactive({
+  occurLocation: '',
+  occurTime: '',
+  roadConditionType: '',
+  routeNo: '',
+  event: {
+    blockedMileage: '',
+    blockedPointName: '',
+    contactPerson: '',
+    contactPhone: '',
+    damageCount: '',
+    district: '',
+    endStakeLat: '',
+    endStakeLng: '',
+    endStakeNo: '',
+    estimatedRecoveryCost: '',
+    inspectionMileage: '',
+    isBlocked: '',
+    needsRecovery: '',
+    repairProgress: '',
+    reporterUnit: '',
+    startStakeLat: '',
+    startStakeLng: '',
+    startStakeNo: ''
+  },
+  report: {
+    actualRecoverTime: '',
+    damagedVehicleCount: '',
+    deadCount: '',
+    disposalMeasures: '',
+    expectRecoverTime: '',
+    injuredCount: '',
+    investedFunds: '',
+    investedMachinery: '',
+    investedManpower: '',
+    remark: '',
+    siteDescription: '',
+    strandedPersonCount: '',
+    strandedVehicleCount: '',
+    totalLossAmount: ''
+  },
+  lossList: [],
+  fileList: []
+})
+
+// 处置措施单选值
+const disposalMeasureValue = ref('')
+
+// 下拉选项
+const roadConditionOptions = [
+  { label: '高速公路', value: '高速公路' },
+  { label: '国道', value: '国道' },
+  { label: '省道', value: '省道' },
+  { label: '县道', value: '县道' },
+  { label: '乡道', value: '乡道' },
+  { label: '村道', value: '村道' }
+]
+
+const blockedOptions = [
+  { label: '是', value: true },
+  { label: '否', value: false }
+]
+
+const repairProgressOptions = [
+  { label: '未抢修', value: '未抢修' },
+  { label: '抢修中', value: '抢修中' },
+  { label: '已完成', value: '已完成' }
+]
+
+// 日期选择器配置
+const pickerOptions = {
+  disabledDate(time) {
+    return time.getTime() < new Date(2020, 0, 1) || time.getTime() > new Date(2030, 11, 31)
+  }
+}
+
+// 监听处置措施单选值变化
+watch(disposalMeasureValue, (newVal) => {
+  formData.report.disposalMeasures = newVal
+})
+
+// 监听外部传入的值
+watch(
+  () => props.value,
+  (newVal) => {
+    if (newVal && Object.keys(newVal).length > 0) {
+      initFormData(newVal)
+    }
+  },
+  { immediate: true, deep: true }
+)
+
+// 监听表单数据变化，向外传递
+watch(
+  () => formData,
+  (newVal) => {
+    emit('input', newVal)
+    emit('change', newVal)
+  },
+  { deep: true }
+)
+
+// 从 report.disposalMeasures 初始化处置措施单选值
+watch(
+  () => formData.report.disposalMeasures,
+  (newVal) => {
+    if (newVal && typeof newVal === 'string') {
+      disposalMeasureValue.value = newVal
+    }
+  },
+  { immediate: true }
+)
+
+// 初始化表单数据
+const initFormData = (data) => {
+  Object.assign(formData, {
+    occurLocation: data.occurLocation || '',
+    occurTime: data.occurTime || '',
+    roadConditionType: data.roadConditionType || '',
+    routeNo: data.routeNo || '',
+    event: { ...formData.event, ...(data.event || {}) },
+    report: { ...formData.report, ...(data.report || {}) },
+    lossList: data.lossList || [],
+    fileList: data.fileList || []
+  })
+
+  if (data.report?.disposalMeasures) {
+    disposalMeasureValue.value = data.report.disposalMeasures
+  }
+}
+
+// 校准时间
+const calibrateTime = () => {
+  const now = new Date()
+  const year = now.getFullYear()
+  const month = String(now.getMonth() + 1).padStart(2, '0')
+  const day = String(now.getDate()).padStart(2, '0')
+  const hours = String(now.getHours()).padStart(2, '0')
+  const minutes = String(now.getMinutes()).padStart(2, '0')
+  formData.occurTime = `${year}-${month}-${day} ${hours}:${minutes}`
+  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) {
+    ElMessage.warning('请填写发生时间')
+    return false
+  }
+  if (!formData.routeNo) {
+    ElMessage.warning('请填写线路编号')
+    return false
+  }
+  return true
+}
+
+// 获取表单数据
+const getFormData = () => {
+  return { ...formData }
+}
+
+// 重置表单
+const resetForm = () => {
+  Object.assign(formData, {
+    occurLocation: '',
+    occurTime: '',
+    roadConditionType: '',
+    routeNo: '',
+    event: {
+      blockedMileage: '',
+      blockedPointName: '',
+      contactPerson: '',
+      contactPhone: '',
+      damageCount: '',
+      district: '',
+      endStakeLat: '',
+      endStakeLng: '',
+      endStakeNo: '',
+      estimatedRecoveryCost: '',
+      inspectionMileage: '',
+      isBlocked: '',
+      needsRecovery: '',
+      repairProgress: '',
+      reporterUnit: '',
+      startStakeLat: '',
+      startStakeLng: '',
+      startStakeNo: ''
+    },
+    report: {
+      actualRecoverTime: '',
+      damagedVehicleCount: '',
+      deadCount: '',
+      disposalMeasures: '',
+      expectRecoverTime: '',
+      injuredCount: '',
+      investedFunds: '',
+      investedMachinery: '',
+      investedManpower: '',
+      remark: '',
+      siteDescription: '',
+      strandedPersonCount: '',
+      strandedVehicleCount: '',
+      totalLossAmount: ''
+    },
+    lossList: [],
+    fileList: []
+  })
+  disposalMeasureValue.value = ''
+}
+
+// 提交方法
+const submit = () => {
+  if (validate()) {
+    emit('submit', getFormData())
+  }
+}
+
+const handleSubmit = async () => {
+  // 验证表单
+  if (!validate()) {
+    return
+  }
+
+  try {
+    // 获取表单数据
+
+    // 添加事件类型和站点信息
+    const submitData = {
+      ...formData
+      // 可以在这里添加站点信息等其他数据
+    }
+
+    const res = await request({
+      url: '/snow-ops-platform/water-damage/addOrUpdate',
+      method: 'post',
+      data: submitData
+    })
+
+    if (res?.code === '00000') {
+      ElMessage.success('提交成功')
+
+      emit("refresh")
+    } else {
+      ElMessage.error(res.message)
+    }
+  } catch (error) {
+    ElMessage.error('提交失败，请重试')
+    console.error('提交失败:', error)
+  } finally {
+
+  }
+}
+
+// 暴露方法给父组件
+defineExpose({
+  validate,
+  initFormData,
+  getFormData,
+  resetForm,
+  calibrateTime,
+  calibrateStartCoord,
+  calibrateEndCoord
+})
+</script>
+
+<style lang="scss" scoped>
+.water-disaster-pc {
+  background-color: #f5f7fa;
+  height: 100%;
+
+  .form-card {
+    border-radius: 8px;
+
+    .card-header {
+      font-size: 16px;
+      font-weight: 600;
+      color: #303133;
+      border-left: 4px solid #409eff;
+      padding-left: 12px;
+    }
+  }
+
+  ::v-deep .el-form-item {
+    margin-bottom: 22px;
+  }
+
+  ::v-deep .el-input-group__append {
+    padding: 0 10px;
+  }
+
+  ::v-deep .el-input-number {
+    width: 300px;
+
+    .el-input-group__append {
+      padding: 0 10px;
+    }
+  }
+
+  ::v-deep .el-radio-group {
+    .el-radio {
+      margin-right: 20px;
+    }
+  }
+}
+</style>
diff --git a/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterDetail.vue b/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterDetail.vue
new file mode 100644
index 0000000..3bb01cd
--- /dev/null
+++ b/packages/screen/src/views/DisasterManagement/DisasterDetail/WaterDisasterDetail.vue
@@ -0,0 +1,618 @@
+<template>
+  <div class="web-detail-container">
+    <!-- 页面头部 -->
+    <div class="page-header">
+      <div class="header-left">
+        <el-button :icon="ArrowLeft" @click="handleClickBack">返回</el-button>
+        <h2 class="page-title">灾毁详情</h2>
+      </div>
+      <div class="header-right">
+        <el-tag :type="getEventStatusType()" size="large">
+          {{ getEventStatusText() }}
+        </el-tag>
+      </div>
+    </div>
+
+    <div class="content-container">
+      <div class="left-panel">
+        <!-- 基本信息卡片 -->
+        <el-card class="info-card" shadow="never">
+          <template #header>
+            <div class="card-header">
+              <span class="card-title">基本信息</span>
+            </div>
+          </template>
+
+          <el-row :gutter="20" class="info-row">
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">事件类型：</span>
+                <span class="info-value">水毁事件</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">路况类别：</span>
+                <span class="info-value">{{ detailData.roadConditionType || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">是否阻断：</span>
+                <span class="info-value">{{ detailData.event?.isBlocked ? '是' : '否' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+
+          <el-row :gutter="20" class="info-row">
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">抢修进度：</span>
+                <span class="info-value">{{ detailData.event?.repairProgress || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">水毁处数：</span>
+                <span class="info-value">{{ detailData.event?.damageCount || 0 }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">阻断里程：</span>
+                <span class="info-value">{{ detailData.event?.blockedMileage ? detailData.event.blockedMileage + '公里' : '-' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+
+          <el-row :gutter="20" class="info-row">
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">发生时间：</span>
+                <span class="info-value">{{ detailData.occurTime || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">线路编号：</span>
+                <span class="info-value">{{ detailData.routeNo || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">地点路线：</span>
+                <span class="info-value">{{ detailData.occurLocation || '-' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+
+          <el-row :gutter="20" class="info-row">
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">起点桩号：</span>
+                <span class="info-value">{{ detailData.event?.startStakeNo || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">起点桩经度：</span>
+                <span class="info-value">{{ detailData.event?.startStakeLng || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">起点桩纬度：</span>
+                <span class="info-value">{{ detailData.event?.startStakeLat || '-' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+
+          <el-row :gutter="20" class="info-row">
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">止点桩号：</span>
+                <span class="info-value">{{ detailData.event?.endStakeNo || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">止点桩经度：</span>
+                <span class="info-value">{{ detailData.event?.endStakeLng || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">止点桩纬度：</span>
+                <span class="info-value">{{ detailData.event?.endStakeLat || '-' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+
+          <el-row :gutter="20" class="info-row">
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">路况位置：</span>
+                <span class="info-value">{{ detailData.event?.blockedPointName || detailData.occurLocation || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">阻断点小地名：</span>
+                <span class="info-value">{{ detailData.event?.blockedPointName || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">上报区县：</span>
+                <span class="info-value">{{ detailData.event?.district || '-' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+
+          <el-row :gutter="20" class="info-row">
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">巡查里程：</span>
+                <span class="info-value">{{ detailData.event?.inspectionMileage ? detailData.event.inspectionMileage + '公里' : '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">是否恢复重建：</span>
+                <span class="info-value">{{ detailData.event?.needsRecovery ? '是' : '否' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">恢复重建预估费用：</span>
+                <span class="info-value">{{ detailData.event?.estimatedRecoveryCost ? detailData.event.estimatedRecoveryCost + '万元' : '-' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+
+          <el-row :gutter="20" class="info-row">
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">联系人：</span>
+                <span class="info-value">{{ detailData.event?.contactPerson || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">联系电话：</span>
+                <span class="info-value">{{ detailData.event?.contactPhone || '-' }}</span>
+              </div>
+            </el-col>
+            <el-col :span="8">
+              <div class="info-item">
+                <span class="info-label">填报单位：</span>
+                <span class="info-value">{{ detailData.event?.reporterUnit || '-' }}</span>
+              </div>
+            </el-col>
+          </el-row>
+        </el-card>
+
+        <!-- 填报信息卡片 -->
+        <el-card class="info-card" shadow="never">
+          <template #header>
+            <div class="card-header">
+              <span class="card-title">填报信息</span>
+            </div>
+          </template>
+
+          <div v-if="hasReportData">
+            <div v-for="(report, index) in allReports" :key="index" class="report-section">
+              <div class="report-header">
+                <span class="report-title">{{ report?.title }}</span>
+                <span class="report-meta">{{ report.reporterName || '-' }} {{ report.reportTime || '-' }}</span>
+              </div>
+
+              <div class="info-list">
+                <div class="info-item">
+                  <span class="info-label">处置情况：</span>
+                  <span class="info-value">{{ formatDisposalMeasures(report.disposalMeasures) || '-' }}</span>
+                </div>
+                <div class="info-item">
+                  <span class="info-label">塌方及损失：</span>
+                  <span class="info-value">{{ getLossDescription(report) }}</span>
+                </div>
+                <div class="info-item">
+                  <span class="info-label">路产损失：</span>
+                  <span class="info-value">{{ report.totalLossAmount ? report.totalLossAmount + '万元' : '-' }}</span>
+                </div>
+                <div class="info-item">
+                  <span class="info-label">有无车辆滞留：</span>
+                  <span class="info-value">{{ getVehicleStrandedText(report) }}</span>
+                </div>
+                <div class="info-item">
+                  <span class="info-label">滞留车辆：</span>
+                  <span class="info-value">{{ report.strandedVehicleCount || 0 }}辆</span>
+                </div>
+                <div class="info-item">
+                  <span class="info-label">预计恢复时间：</span>
+                  <span class="info-value">{{ report.expectRecoverTime || '-' }}</span>
+                </div>
+                <div class="info-item">
+                  <span class="info-label">实际恢复时间：</span>
+                  <span class="info-value">{{ report.actualRecoverTime || '-' }}</span>
+                </div>
+                <div class="info-item">
+                  <span class="info-label">现场描述：</span>
+                  <span class="info-value">{{ report.siteDescription || '-' }}</span>
+                </div>
+
+                <!-- 附件 -->
+                <div v-if="report.fileList && report.fileList.length > 0" class="info-item attachment-item">
+                  <span class="info-label">附件：</span>
+                  <div class="attachment-list">
+                    <el-link v-for="(file, fileIndex) in report.fileList" :key="fileIndex" :underline="false" @click="previewFile(file)" class="attachment-link">
+                      <el-icon><Picture v-if="file.fileType === 1" /><VideoCamera v-else /></el-icon>
+                      <span class="file-name">{{ file.fileName }}</span>
+                    </el-link>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <el-empty v-else description="暂无填报信息" :image-size="100" />
+        </el-card>
+
+        <!-- 底部按钮 -->
+        <!-- <div class="footer-buttons">
+          <el-button type="primary" size="large" @click="handleContinueReport" class="footer-btn"> 续报 </el-button>
+        </div> -->
+      </div>
+      <div class="right-panel" v-if="isEdit">
+        <ContinueReport ref="continueReport" @refresh="getDisasterDetail" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+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 { request } from '@shared/utils/request'
+import mockData from '../DisasterReport/waterMockJson.json'
+
+const router = useRouter()
+const route = useRoute()
+
+// 详情数据
+const detailData = ref({
+  event: null,
+  report: [],
+  fileList: [],
+  lossList: [],
+  occurLocation: '',
+  occurTime: '',
+  roadConditionType: '',
+  routeNo: ''
+})
+
+// 事件状态
+const eventStatus = ref(0)
+
+// 是否为编辑
+const isEdit = computed(() => {
+  return route.query.mode === 'edit'
+})
+
+const continueReport = ref(null)
+
+// 所有填报记录（首报 + 续报）
+const allReports = computed(() => {
+  const reports =
+    detailData.value.report?.map((item, index) => {
+      item.title = index === 0 ? '首报' : '续报' + index
+      return item
+    }) || []
+  return reports.reverse()
+})
+
+// 是否有填报数据
+const hasReportData = computed(() => {
+  return allReports.value.length > 0
+})
+
+// 获取事件状态文本
+const getEventStatusText = () => {
+  return eventStatus.value === 1 ? '已解除' : '未解除'
+}
+
+// 获取事件状态类型
+const getEventStatusType = () => {
+  return eventStatus.value === 1 ? 'success' : 'danger'
+}
+
+// 格式化处置措施
+const formatDisposalMeasures = (measures) => {
+  if (!measures) return ''
+  const measureMap = {
+    halfClose: '半幅封闭',
+    fullClose: '全副封闭',
+    bypass: '便道通行',
+    normal: '正常通行'
+  }
+  return measures
+    .split(',')
+    .map((m) => measureMap[m.trim()] || m.trim())
+    .join('、')
+}
+
+// 获取损失描述
+const getLossDescription = (report) => {
+  const lossList = report?.lossList
+  if (!lossList || lossList.length === 0) return '-'
+
+  const totalVolume = lossList.reduce((sum, loss) => {
+    const volume = (loss.length || 0) * (loss.width || 0) * (loss.height || 0)
+    return sum + volume
+  }, 0)
+
+  const totalAmount = lossList.reduce((sum, loss) => sum + (loss.totalAmount || 0), 0)
+
+  return `${totalVolume}方，共损失${totalAmount}万元`
+}
+
+// 获取车辆滞留文本
+const getVehicleStrandedText = (report) => {
+  const count = report?.strandedVehicleCount || 0
+  return count > 0 ? `有车滞留，共${count}辆` : '无车滞留'
+}
+
+// 获取灾毁详情
+const getDisasterDetail = async () => {
+  const id = route.query.id
+  if (!id) {
+    ElMessage.warning('缺少灾毁ID')
+    return
+  }
+
+  try {
+    const result = await request({
+      url: `/snow-ops-platform/water-damage/getById`,
+      method: 'get',
+      params: { id }
+    })
+
+    if (result?.data) {
+      const data = result.data
+      detailData.value = {
+        event: data.event || null,
+        report: data.report || [],
+        fileList: data.fileList || [],
+        lossList: data.lossList || [],
+        occurLocation: data.occurLocation || '',
+        occurTime: data.occurTime || '',
+        roadConditionType: data.roadConditionType || '',
+        routeNo: data.routeNo || ''
+      }
+      eventStatus.value = data.eventStatus || 0
+
+      if (isEdit.value) {
+        const newFormData = {
+          ...data,
+          lossList: null,
+          report: mockData.report,
+          fileList: null
+        }
+        continueReport.value?.initFormData(newFormData)
+      }
+    } else {
+      ElMessage.warning(result.message || '获取详情失败')
+    }
+  } catch (error) {
+    console.error('获取灾毁详情失败:', error)
+    ElMessage.error('获取详情失败，请稍后重试')
+  }
+}
+
+// 点击返回
+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()
+})
+</script>
+
+<style scoped lang="scss">
+.web-detail-container {
+  padding: 20px;
+  background: #f5f7fa;
+  height: 100%;
+  overflow: auto;
+  padding-bottom: 100px;
+}
+
+.page-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 20px;
+  padding: 0 20px;
+
+  .header-left {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+
+    .page-title {
+      margin: 0;
+      font-size: 20px;
+      font-weight: 600;
+      color: #303133;
+    }
+  }
+}
+
+.info-card {
+  margin-bottom: 20px;
+  border-radius: 8px;
+
+  :deep(.el-card__header) {
+    padding: 16px 20px;
+    border-bottom: 1px solid #ebeef5;
+    background: #fafafa;
+  }
+
+  .card-header {
+    .card-title {
+      font-size: 16px;
+      font-weight: 600;
+      color: #303133;
+    }
+  }
+}
+
+.info-row {
+  margin-bottom: 16px;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.info-item {
+  display: flex;
+  align-items: flex-start;
+  line-height: 1.5;
+
+  .info-label {
+    width: 120px;
+    flex-shrink: 0;
+    color: #909399;
+    font-size: 14px;
+  }
+
+  .info-value {
+    flex: 1;
+    color: #606266;
+    font-size: 14px;
+    word-break: break-all;
+  }
+}
+
+.report-section {
+  margin-bottom: 32px;
+  padding-bottom: 24px;
+  border-bottom: 1px solid #ebeef5;
+
+  &:last-child {
+    border-bottom: none;
+    margin-bottom: 0;
+    padding-bottom: 0;
+  }
+}
+
+.report-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: baseline;
+  margin-bottom: 20px;
+  padding-bottom: 12px;
+  border-bottom: 1px dashed #dcdfe6;
+
+  .report-title {
+    font-size: 16px;
+    font-weight: 600;
+    color: #409eff;
+  }
+
+  .report-meta {
+    font-size: 13px;
+    color: #909399;
+  }
+}
+
+.attachment-wrapper {
+  margin-top: 12px;
+  padding-top: 8px;
+  border-top: 1px dashed #ebeef5;
+
+  .attachment-item {
+    .attachment-list {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 16px;
+
+      .attachment-link {
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        padding: 6px 12px;
+        background: #f5f7fa;
+        border-radius: 4px;
+        cursor: pointer;
+
+        &:hover {
+          background: #ecf5ff;
+          color: #409eff;
+        }
+
+        .file-name {
+          font-size: 13px;
+          max-width: 200px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+      }
+    }
+  }
+}
+
+.footer-buttons {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  justify-content: center;
+  padding: 16px 24px;
+  background: #fff;
+  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.08);
+  z-index: 100;
+
+  .footer-btn {
+    width: 200px;
+    height: 44px;
+    font-size: 16px;
+    border-radius: 22px;
+  }
+}
+.content-container {
+  display: flex;
+  .left-panel {
+    flex: 1;
+    margin-right: 10px;
+  }
+  .right-panel {
+    width: 400px;
+  }
+}
+</style>
diff --git a/packages/screen/src/views/DisasterManagement/DisasterManagement.vue b/packages/screen/src/views/DisasterManagement/DisasterManagement.vue
index c42d1e0..e9d0185 100644
--- a/packages/screen/src/views/DisasterManagement/DisasterManagement.vue
+++ b/packages/screen/src/views/DisasterManagement/DisasterManagement.vue
@@ -298,12 +298,12 @@ const resetFilters = () => {
 
 // 查看详情
 const handleDetail = (row) => {
-  router.push({ path: '/disasterDetail', query: { id: row.id } })
+  router.push({ path: '/waterDisasterDetail', query: { id: row.id } })
 }
 
 // 编辑
 const handleEdit = (row) => {
-  router.push({ path: '/disasterReport', query: { id: row.id, mode: 'edit' } })
+  router.push({ path: '/waterDisasterDetail', query: { id: row.id, mode: 'edit' } })
 }
 
 // 新增跳转
diff --git a/packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReport.vue b/packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReport.vue
index 32eab0c..c0ac06a 100644
--- a/packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReport.vue
+++ b/packages/screen/src/views/DisasterManagement/DisasterReport/WaterDisasterReport.vue
@@ -1,116 +1,112 @@
 <template>
   <div class="disaster-form-page">
     <el-form ref="formRef" :model="formData" :rules="formRules" label-width="140px" class="disaster-form" @submit.prevent>
-      <!-- 基础信息区块 -->
+      <!-- 基本信息区块 -->
       <el-card class="form-section" shadow="never">
         <template #header>
           <div class="section-header">
-            <span class="section-title">基础信息</span>
+            <span class="section-title">基本信息</span>
           </div>
         </template>
 
         <el-row :gutter="24">
-          <!-- 填报人员信息 -->
-          <el-col :span="24">
-            <div class="sub-section-title">填报人员信息</div>
-          </el-col>
+          <!-- 路况类别 -->
           <el-col :span="8">
-            <el-form-item label="填报单位" prop="reportUnit">
-              <el-input v-model="formData.reportUnit" placeholder="请输入填报单位" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="联系人" prop="contactPerson">
-              <el-input v-model="formData.contactPerson" placeholder="请输入联系人" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="联系电话" prop="contactPhone">
-              <el-input v-model="formData.contactPhone" placeholder="请输入联系电话" />
-            </el-form-item>
-          </el-col>
-
-          <!-- 路况事件信息 -->
-          <el-col :span="24">
-            <div class="sub-section-title">路况事件信息</div>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="事件类型" prop="eventType">
-              <el-select v-model="formData.eventType" placeholder="请选择" style="width: 100%">
-                <el-option label="水毁灾害" value="水毁灾害" />
-                <el-option label="冰雪灾害" value="冰雪灾害" />
+            <el-form-item label="路况类别" prop="roadConditionType">
+              <el-select v-model="formData.roadConditionType" placeholder="请选择" style="width: 100%">
+                <el-option label="高速公路" value="高速公路" />
+                <el-option label="国道" value="国道" />
+                <el-option label="省道" value="省道" />
+                <el-option label="县道" value="县道" />
+                <el-option label="乡道" value="乡道" />
+                <el-option label="村道" value="村道" />
               </el-select>
             </el-form-item>
           </el-col>
 
+          <!-- 是否阻断 -->
           <el-col :span="8">
-            <el-form-item label="路况类别" prop="blockedMileage">
-              <el-input-number v-model="formData.blockedMileage" :min="0" :precision="3" style="width: 100%" placeholder="请填写" />
+            <el-form-item label="是否阻断" prop="event.isBlocked">
+              <el-select v-model="formData.event.isBlocked" placeholder="请选择" style="width: 100%">
+                <el-option label="是" :value="true" />
+                <el-option label="否" :value="false" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <!-- 抢修进度 -->
+          <el-col :span="8">
+            <el-form-item label="抢修进度" prop="event.repairProgress">
+              <el-select v-model="formData.event.repairProgress" placeholder="请选择" style="width: 100%">
+                <el-option label="未抢修" value="未抢修" />
+                <el-option label="抢修中" value="抢修中" />
+                <el-option label="已完成" value="已完成" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <!-- 水毁处数 -->
+          <el-col :span="8">
+            <el-form-item label="水毁处数" prop="event.damageCount">
+              <el-input-number v-model="formData.event.damageCount" :min="0" :step="1" style="width: 100%" placeholder="请填写" />
+              <span class="unit-suffix">处</span>
+            </el-form-item>
+          </el-col>
+
+          <!-- 阻断里程 -->
+          <el-col :span="8">
+            <el-form-item label="阻断里程" prop="event.blockedMileage">
+              <el-input-number v-model="formData.event.blockedMileage" :min="0" :precision="3" style="width: 100%" placeholder="请填写" />
               <span class="unit-suffix">公里</span>
             </el-form-item>
           </el-col>
 
+          <!-- 发生时间 -->
           <el-col :span="8">
-            <el-form-item label="是否阻断" prop="isBlocked">
-              <el-select v-model="formData.isBlocked" placeholder="请选择" style="width: 100%">
-                <el-option label="是" value="是" />
-                <el-option label="否" value="否" />
+            <el-form-item label="发生时间" prop="occurTime">
+              <el-date-picker v-model="formData.occurTime" type="datetime" placeholder="请选择时间" style="width: 100%" value-format="YYYY-MM-DD HH:mm:ss" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 线路编号 -->
+          <el-col :span="8">
+            <el-form-item label="线路编号" prop="routeNo">
+              <el-input v-model="formData.routeNo" placeholder="请填写" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 填报单位（新增字段） -->
+          <el-col :span="8">
+            <el-form-item label="填报单位" prop="event.reporterUnit">
+              <el-input v-model="formData.event.reporterUnit" placeholder="请填写" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 联系人 -->
+          <el-col :span="8">
+            <el-form-item label="联系人" prop="event.contactPerson">
+              <el-input v-model="formData.event.contactPerson" placeholder="请填写" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 联系电话 -->
+          <el-col :span="8">
+            <el-form-item label="联系电话" prop="event.contactPhone">
+              <el-input v-model="formData.event.contactPhone" placeholder="请填写" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 所属区县 -->
+          <el-col :span="8">
+            <el-form-item label="所属区县" prop="event.district">
+              <el-select v-model="formData.event.district" placeholder="请选择" style="width: 100%">
+                <el-option label="万州区" value="万州区" />
+                <el-option label="开州区" value="开州区" />
+                <el-option label="黔江区" value="黔江区" />
+                <el-option label="涪陵区" value="涪陵区" />
               </el-select>
             </el-form-item>
           </el-col>
-
-          <el-col :span="8">
-            <el-form-item label="抢险进度" prop="isBlocked">
-              <el-select v-model="formData.isBlocked" placeholder="请选择" style="width: 100%">
-                <el-option label="是" value="是" />
-                <el-option label="否" value="否" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="8">
-            <el-form-item label="处理措施" prop="measure">
-              <el-select v-model="formData.measure" placeholder="请选择" style="width: 100%">
-                <el-option label="正常通行" value="正常通行" />
-                <el-option label="交通管制" value="交通管制" />
-                <el-option label="封闭施工" value="封闭施工" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="8">
-            <el-form-item label="水毁处数" prop="waterDamageCount">
-              <el-input-number v-model="formData.waterDamageCount" :min="0" :step="1" style="width: 100%" placeholder="请填写" />
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="24">
-            <el-row>
-              <el-col :span="8">
-                <el-form-item label="阻断里程" prop="blockedMileage">
-                  <el-input-number v-model="formData.blockedMileage" :min="0" :precision="3" style="width: 100%" placeholder="请填写" />
-                  <span class="unit-suffix">公里</span>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-col>
-
-          <el-col :span="8">
-            <el-form-item label="发现时间" prop="discoverTime">
-              <el-date-picker v-model="formData.discoverTime" type="datetime" placeholder="请选择日期时间" style="width: 100%" value-format="YYYY-MM-DD HH:mm:ss" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="预计恢复" prop="predictRecoverTime">
-              <el-date-picker v-model="formData.predictRecoverTime" type="datetime" placeholder="请选择日期时间" style="width: 100%" value-format="YYYY-MM-DD HH:mm:ss" />
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="24">
-            <el-form-item label="现场描述" prop="siteDescription">
-              <el-input v-model="formData.siteDescription" type="textarea" :rows="3" placeholder="请输入现场描述及续行方案" />
-            </el-form-item>
-          </el-col>
         </el-row>
       </el-card>
 
@@ -123,65 +119,220 @@
         </template>
 
         <el-row :gutter="24">
+          <!-- 起点桩号 -->
           <el-col :span="8">
-            <el-form-item label="路线类型" prop="routeType">
-              <el-select v-model="formData.routeType" placeholder="请选择" style="width: 100%">
-                <el-option label="国省道" value="国省道" />
-                <el-option label="县乡道" value="县乡道" />
-                <el-option label="高速" value="高速" />
-              </el-select>
+            <el-form-item label="起点桩号(K)" prop="event.startStakeNo">
+              <el-input v-model="formData.event.startStakeNo" placeholder="请填写" />
             </el-form-item>
           </el-col>
+
+          <!-- 起点经度 -->
           <el-col :span="8">
-            <el-form-item label="所属区县" prop="district">
-              <el-select v-model="formData.district" placeholder="请选择" style="width: 100%">
-                <el-option label="万州区" value="万州区" />
-                <el-option label="开州区" value="开州区" />
-                <el-option label="黔江区" value="黔江区" />
-                <el-option label="涪陵区" value="涪陵区" />
-              </el-select>
+            <el-form-item label="起点经度" prop="event.startStakeLng">
+              <el-input v-model="formData.event.startStakeLng" placeholder="经度" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 起点纬度 -->
+          <el-col :span="8">
+            <el-form-item label="起点纬度" prop="event.startStakeLat">
+              <el-input v-model="formData.event.startStakeLat" placeholder="纬度" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 止点桩号 -->
+          <el-col :span="8">
+            <el-form-item label="止点桩号(K)" prop="event.endStakeNo">
+              <el-input v-model="formData.event.endStakeNo" placeholder="请填写" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 止点经度 -->
+          <el-col :span="8">
+            <el-form-item label="止点经度" prop="event.endStakeLng">
+              <el-input v-model="formData.event.endStakeLng" placeholder="经度" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 止点纬度 -->
+          <el-col :span="8">
+            <el-form-item label="止点纬度" prop="event.endStakeLat">
+              <el-input v-model="formData.event.endStakeLat" placeholder="纬度" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 路况位置 -->
+          <el-col :span="8">
+            <el-form-item label="路况位置" prop="occurLocation">
+              <el-input v-model="formData.occurLocation" placeholder="请填写" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 阻断点小地名 -->
+          <el-col :span="8">
+            <el-form-item label="阻断点小地名" prop="event.blockedPointName">
+              <el-input v-model="formData.event.blockedPointName" placeholder="请填写" />
             </el-form-item>
           </el-col>
         </el-row>
+      </el-card>
+
+      <!-- 处置情况区块 -->
+      <el-card class="form-section" shadow="never">
+        <template #header>
+          <div class="section-header">
+            <span class="section-title">处置情况</span>
+          </div>
+        </template>
 
         <el-row :gutter="24">
-          <el-col :span="8">
-            <el-form-item label="地点路线" prop="routeCode">
-              <el-input v-model="formData.routeCode" placeholder="请输入地点路线" />
+          <!-- 处置措施（多选） -->
+          <el-col :span="24">
+            <el-form-item label="处置措施" prop="report.disposalMeasures">
+              <el-checkbox-group v-model="disposalMeasuresArray">
+                <el-checkbox label="halfClose">半幅封闭</el-checkbox>
+                <el-checkbox label="fullClose">全副封闭</el-checkbox>
+                <el-checkbox label="bypass">便道通行</el-checkbox>
+                <el-checkbox label="normal">正常通行</el-checkbox>
+              </el-checkbox-group>
             </el-form-item>
           </el-col>
 
+          <!-- 预计恢复时间 -->
           <el-col :span="8">
-            <el-form-item label="起点桩号" prop="startPile">
-              <el-input v-model="formData.startPile" placeholder="K_请填写" />
+            <el-form-item label="预计恢复时间" prop="report.expectRecoverTime">
+              <el-date-picker v-model="formData.report.expectRecoverTime" type="datetime" placeholder="请选择时间" style="width: 100%" value-format="YYYY-MM-DD HH:mm:ss" />
             </el-form-item>
           </el-col>
+
+          <!-- 实际恢复时间 -->
           <el-col :span="8">
-            <el-form-item label="止点桩号" prop="endPile">
-              <el-input v-model="formData.endPile" placeholder="K_请填写" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="路况位置" prop="locationPath">
-              <el-cascader v-model="formData.locationPath" :options="locationOptions" placeholder="请选择" style="width: 100%" clearable />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="阻断点小地名" prop="smallPlaceName">
-              <el-input v-model="formData.smallPlaceName" placeholder="请填写" />
+            <el-form-item label="实际恢复时间" prop="report.actualRecoverTime">
+              <el-date-picker v-model="formData.report.actualRecoverTime" type="datetime" placeholder="请选择时间" style="width: 100%" value-format="YYYY-MM-DD HH:mm:ss" />
             </el-form-item>
           </el-col>
         </el-row>
+      </el-card>
+
+      <!-- 人员车辆区块 -->
+      <el-card class="form-section" shadow="never">
+        <template #header>
+          <div class="section-header">
+            <span class="section-title">人员车辆</span>
+          </div>
+        </template>
 
         <el-row :gutter="24">
+          <!-- 受伤人员 -->
           <el-col :span="8">
-            <el-form-item label="经度" prop="longitude">
-              <el-input v-model="formData.longitude" placeholder="请输入经度" />
+            <el-form-item label="受伤人员" prop="report.injuredCount">
+              <el-input-number v-model="formData.report.injuredCount" :min="0" :step="1" style="width: 100%" />
+              <span class="unit-suffix">人</span>
             </el-form-item>
           </el-col>
+
+          <!-- 死亡人员 -->
           <el-col :span="8">
-            <el-form-item label="纬度" prop="latitude">
-              <el-input v-model="formData.latitude" placeholder="请输入纬度" />
+            <el-form-item label="死亡人员" prop="report.deadCount">
+              <el-input-number v-model="formData.report.deadCount" :min="0" :step="1" style="width: 100%" />
+              <span class="unit-suffix">人</span>
+            </el-form-item>
+          </el-col>
+
+          <!-- 滞留人员 -->
+          <el-col :span="8">
+            <el-form-item label="滞留人员" prop="report.strandedPersonCount">
+              <el-input-number v-model="formData.report.strandedPersonCount" :min="0" :step="1" style="width: 100%" />
+              <span class="unit-suffix">人</span>
+            </el-form-item>
+          </el-col>
+
+          <!-- 损坏车辆 -->
+          <el-col :span="8">
+            <el-form-item label="损坏车辆" prop="report.damagedVehicleCount">
+              <el-input-number v-model="formData.report.damagedVehicleCount" :min="0" :step="1" style="width: 100%" />
+              <span class="unit-suffix">辆</span>
+            </el-form-item>
+          </el-col>
+
+          <!-- 滞留车辆 -->
+          <el-col :span="8">
+            <el-form-item label="滞留车辆" prop="report.strandedVehicleCount">
+              <el-input-number v-model="formData.report.strandedVehicleCount" :min="0" :step="1" style="width: 100%" />
+              <span class="unit-suffix">辆</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-card>
+
+      <!-- 灾毁损失区块 -->
+      <el-card class="form-section" shadow="never">
+        <template #header>
+          <div class="section-header">
+            <span class="section-title">灾毁损失</span>
+          </div>
+        </template>
+
+        <!-- 灾毁损失列表组件（需要根据实际业务实现） -->
+        <el-row :gutter="24">
+          <el-col :span="24">
+            <LossList v-model="formData.lossList" />
+          </el-col>
+
+          <!-- 处理情况 -->
+          <el-col :span="12">
+            <el-form-item label="处理情况" prop="report.remark">
+              <el-input v-model="formData.report.remark" type="textarea" :rows="2" placeholder="请填写（选填）" />
+            </el-form-item>
+          </el-col>
+
+          <!-- 损失总金额 -->
+          <el-col :span="12">
+            <el-form-item label="损失总金额" prop="report.totalLossAmount">
+              <el-input-number v-model="formData.report.totalLossAmount" :min="0" :precision="2" style="width: 100%" placeholder="请填写（选填）" />
+              <span class="unit-suffix">万元</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-card>
+
+      <!-- 投入资源区块 -->
+      <el-card class="form-section" shadow="never">
+        <template #header>
+          <div class="section-header">
+            <span class="section-title">投入资源</span>
+          </div>
+        </template>
+
+        <el-row :gutter="24">
+          <!-- 已投机械 -->
+          <el-col :span="8">
+            <el-form-item label="已投机械" prop="report.investedMachinery">
+              <el-input-number v-model="formData.report.investedMachinery" :min="0" :precision="1" style="width: 100%" />
+              <span class="unit-suffix">台/班</span>
+            </el-form-item>
+          </el-col>
+
+          <!-- 已投入力 -->
+          <el-col :span="8">
+            <el-form-item label="已投入力" prop="report.investedManpower">
+              <el-input-number v-model="formData.report.investedManpower" :min="0" :step="1" style="width: 100%" />
+              <span class="unit-suffix">人次</span>
+            </el-form-item>
+          </el-col>
+
+          <!-- 已投资金 -->
+          <el-col :span="8">
+            <el-form-item label="已投资金" prop="report.investedFunds">
+              <el-input-number v-model="formData.report.investedFunds" :min="0" :precision="2" style="width: 100%" />
+              <span class="unit-suffix">万元</span>
+            </el-form-item>
+          </el-col>
+
+          <!-- 现场描述 -->
+          <el-col :span="24">
+            <el-form-item label="现场描述" prop="report.siteDescription">
+              <el-input v-model="formData.report.siteDescription" type="textarea" :rows="2" placeholder="请填写" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -197,9 +348,9 @@
 
         <el-row :gutter="24">
           <el-col :span="12">
-            <el-form-item label="图片上传" prop="images">
+            <el-form-item label="图片上传" prop="fileList">
               <el-upload
-                v-model:file-list="formData.images"
+                v-model:file-list="imageFileList"
                 action="#"
                 list-type="picture-card"
                 :auto-upload="false"
@@ -215,171 +366,44 @@
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="视频上传" prop="videos">
-              <el-upload v-model:file-list="formData.videos" action="#" :auto-upload="false" :limit="3" :before-upload="beforeVideoUpload" accept="video/*">
+            <el-form-item label="视频上传" prop="fileList">
+              <el-upload v-model:file-list="videoFileList" action="#" :auto-upload="false" :limit="1" :before-upload="beforeVideoUpload" accept="video/*">
                 <el-button type="primary"
                   ><el-icon><Upload /></el-icon> 选择文件</el-button
                 >
               </el-upload>
-              <div class="upload-tip">仅支持3M以内的视频</div>
+              <div class="upload-tip">仅支持20s内的视频，不超过20MB</div>
+              <div v-if="videoFileList.length > 0 && videoFileList[0].url" class="video-preview">
+                <video :src="videoFileList[0].url" controls style="width: 100%; max-height: 200px"></video>
+              </div>
             </el-form-item>
           </el-col>
         </el-row>
       </el-card>
 
-      <!-- 灾毁损失区块 -->
+      <!-- 恢复重建区块 -->
       <el-card class="form-section" shadow="never">
         <template #header>
           <div class="section-header">
-            <span class="section-title">灾毁损失</span>
+            <span class="section-title">恢复重建</span>
           </div>
         </template>
 
         <el-row :gutter="24">
-          <el-col :span="24">
-            <div class="sub-section-title">路况事件信息</div>
-          </el-col>
+          <!-- 是否需要恢复重建 -->
           <el-col :span="8">
-            <el-form-item label="受伤人员" prop="injuredCount">
-              <el-input-number v-model="formData.injuredCount" :min="0" :step="1" style="width: 100%" />
-              <span class="unit-suffix">个</span>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="死亡人员" prop="deathCount">
-              <el-input-number v-model="formData.deathCount" :min="0" :step="1" style="width: 100%" />
-              <span class="unit-suffix">个</span>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="滞留人员" prop="deathCount">
-              <el-input-number v-model="formData.deathCount" :min="0" :step="1" style="width: 100%" />
-              <span class="unit-suffix">个</span>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="滞留车辆" prop="strandedVehicles">
-              <el-input-number v-model="formData.strandedVehicles" :min="0" :step="1" style="width: 100%" />
-              <span class="unit-suffix">辆</span>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="损坏车辆" prop="damagedVehicles">
-              <el-input-number v-model="formData.damagedVehicles" :min="0" :step="1" style="width: 100%" />
-              <span class="unit-suffix">辆</span>
+            <el-form-item label="是否需要恢复重建" prop="event.needsRecovery">
+              <el-select v-model="formData.event.needsRecovery" placeholder="请选择" style="width: 100%">
+                <el-option label="是" :value="true" />
+                <el-option label="否" :value="false" />
+              </el-select>
             </el-form-item>
           </el-col>
 
-          <el-col :span="24">
-            <div class="sub-section-title">道路损失及其他</div>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="清理方量" prop="clearVolume">
-              <el-input-number v-model="formData.clearVolume" :min="0" :precision="2" style="width: 100%" />
-              <span class="unit-suffix">立方米</span>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="填方及损失" prop="fillLoss">
-              <el-input v-model="formData.fillLoss" placeholder="填方及损失" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="路面及损失" prop="roadLoss">
-              <el-input v-model="formData.roadLoss" placeholder="路面及损失" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="护坡及损失" prop="slopeLoss">
-              <el-input v-model="formData.slopeLoss" placeholder="护坡及损失" />
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="8">
-            <el-form-item label="桥梁及损失" prop="bridgeLoss">
-              <el-input v-model="formData.bridgeLoss" placeholder="桥梁及损失" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="隧道及损失" prop="tunnelLoss">
-              <el-input v-model="formData.tunnelLoss" placeholder="隧道及损失" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="涵洞及损失" prop="culvertLoss">
-              <el-input v-model="formData.culvertLoss" placeholder="涵洞及损失" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="护栏" prop="guardrailLength">
-              <el-input-number v-model="formData.guardrailLength" :min="0" :precision="3" style="width: 100%" />
-              <span class="unit-suffix">公里</span>
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="8">
-            <el-form-item label="行道树" prop="roadsideTrees">
-              <el-input-number v-model="formData.roadsideTrees" :min="0" :step="1" style="width: 100%" />
-              <span class="unit-suffix">棵</span>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="其他损失" prop="otherLossAmount">
-              <el-input-number v-model="formData.otherLossAmount" :min="0" :precision="2" style="width: 100%" />
-              <span class="unit-suffix">万元</span>
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="24">
-            <el-form-item label="其他损失描述" prop="otherLossDesc">
-              <el-input v-model="formData.otherLossDesc" type="textarea" :rows="2" placeholder="请输入" />
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="24">
-            <div class="sub-section-title">已投入机械</div>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="投入机械" prop="inputMachinery">
-              <el-input-number v-model="formData.inputMachinery" :min="0" :precision="1" style="width: 100%" />
-              <span class="unit-suffix">台/班</span>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="投入人力" prop="inputLabor">
-              <el-input-number v-model="formData.inputLabor" :min="0" :step="1" style="width: 100%" />
-              <span class="unit-suffix">人</span>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="投入资金" prop="inputFunds">
-              <el-input-number v-model="formData.inputFunds" :min="0" :precision="2" style="width: 100%" />
-              <span class="unit-suffix">万元</span>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-card>
-
-      <!-- 恢复重建预估费用区块 -->
-      <el-card class="form-section" shadow="never">
-        <template #header>
-          <div class="section-header">
-            <span class="section-title">恢复重建预估费用</span>
-          </div>
-        </template>
-
-        <el-row :gutter="24">
-          <el-col :span="12">
-            <el-form-item label="是否需要恢复重建" prop="needReconstruction">
-              <el-radio-group v-model="formData.needReconstruction">
-                <el-radio label="是">是</el-radio>
-                <el-radio label="否">否</el-radio>
-              </el-radio-group>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="恢复重建预估费用" prop="reconstructionCost">
-              <el-input-number v-model="formData.reconstructionCost" :min="0" :precision="2" style="width: 100%" />
+          <!-- 恢复重建预估费用 -->
+          <el-col :span="8" v-if="!isContinue">
+            <el-form-item label="恢复重建预估费用" prop="event.estimatedRecoveryCost">
+              <el-input-number v-model="formData.event.estimatedRecoveryCost" :min="0" :precision="2" style="width: 100%" />
               <span class="unit-suffix">万元</span>
             </el-form-item>
           </el-col>
@@ -401,118 +425,150 @@
 </template>
 
 <script setup>
-import { ref, reactive, computed, onMounted } from 'vue'
+import { ref, reactive, computed, watch, onMounted } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
-import { ElMessage, ElMessageBox } from 'element-plus'
+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'
 
 const router = useRouter()
 const route = useRoute()
 const formRef = ref(null)
 const submitting = ref(false)
 
-// 是否为编辑模式
-const isEdit = computed(() => !!route.query.id)
+// 是否为续报
+const isContinue = computed(() => route.query.isContinue === 'true')
 
-// 图片预览
-const previewDialogVisible = ref(false)
-const previewImageUrl = ref('')
+// 处置措施数组（用于多选框组，需要转换为逗号分隔的字符串）
+const disposalMeasuresArray = ref([])
 
-// 地点级联选择器选项（示例数据）
-const locationOptions = [
-  {
-    value: 'chongqing',
-    label: '重庆市',
-    children: [
-      {
-        value: 'wanzhou',
-        label: '万州区',
-        children: [
-          { value: 'shuanghekou', label: '双河口街道' },
-          { value: 'zhoujiaba', label: '周家坝街道' }
-        ]
-      },
-      {
-        value: 'kaizhou',
-        label: '开州区',
-        children: [
-          { value: 'hanfeng', label: '汉丰街道' },
-          { value: 'wenfeng', label: '文峰街道' }
-        ]
-      }
-    ]
-  }
-]
+// 附件列表
+const imageFileList = ref([])
+const videoFileList = ref([])
 
-// 表单数据
+// 表单数据 - 按 H5 Request 接口结构定义
 const formData = reactive({
-  // 填报人员信息
-  reportUnit: '',
-  contactPerson: '',
-  contactPhone: '',
-  // 路况事件信息
-  eventType: '',
-  dangerDesc: '',
-  measure: '',
-  isBlocked: '',
-  waterDamageCount: 0,
-  blockedMileage: 0,
-  discoverTime: '',
-  predictRecoverTime: '',
-  siteDescription: '',
-  // 位置信息
-  routeType: '国省道',
-  district: '',
-  routeCode: '',
-  routeName: '',
-  startPile: '',
-  endPile: '',
-  locationPath: [],
-  smallPlaceName: '',
-  longitude: '',
-  latitude: '',
-  // 附件
-  images: [],
-  videos: [],
-  // 灾毁损失
-  injuredCount: 0,
-  deathCount: 0,
-  strandedVehicles: 0,
-  damagedVehicles: 0,
-  clearVolume: 0,
-  fillLoss: '',
-  roadLoss: '',
-  slopeLoss: '',
-  bridgeLoss: '',
-  tunnelLoss: '',
-  culvertLoss: '',
-  guardrailLength: 0,
-  roadsideTrees: 0,
-  otherLossAmount: 0,
-  otherLossDesc: '',
-  inputMachinery: 0,
-  inputLabor: 0,
-  inputFunds: 0,
-  // 恢复重建
-  needReconstruction: '是',
-  reconstructionCost: 0
+  // 顶层字段
+  occurLocation: '', // 发生地点/路况位置
+  occurTime: '', // 发生时间
+  roadConditionType: '', // 路况类别
+  routeNo: '', // 线路编号
+
+  // event 对象
+  event: {
+    blockedMileage: '', // 阻断里程
+    blockedPointName: '', // 阻断点小地名
+    contactPerson: '', // 联系人
+    contactPhone: '', // 联系电话
+    damageCount: '', // 水毁处数
+    district: '', // 上报区县
+    endStakeLat: '', // 止点纬度
+    endStakeLng: '', // 止点经度
+    endStakeNo: '', // 止点桩号
+    estimatedRecoveryCost: '', // 恢复重建预估费用
+    inspectionMileage: '', // 巡查里程
+    isBlocked: '', // 是否阻断
+    needsRecovery: '', // 是否需要恢复重建
+    repairProgress: '', // 抢修进度
+    reporterUnit: '', // 填报单位
+    startStakeLat: '', // 起点纬度
+    startStakeLng: '', // 起点经度
+    startStakeNo: '' // 起点桩号
+  },
+
+  // report 对象
+  report: {
+    actualRecoverTime: '', // 实际恢复时间
+    damagedVehicleCount: '', // 损坏车辆
+    deadCount: '', // 死亡人员
+    disposalMeasures: '', // 处置措施（逗号分隔）
+    expectRecoverTime: '', // 预计恢复时间
+    injuredCount: '', // 受伤人员
+    investedFunds: '', // 已投资金
+    investedMachinery: '', // 已投机械
+    investedManpower: '', // 已投人力
+    remark: '', // 处理情况/备注
+    siteDescription: '', // 现场描述
+    strandedPersonCount: '', // 滞留人员
+    strandedVehicleCount: '', // 滞留车辆
+    totalLossAmount: '' // 损失总金额
+  },
+
+  // lossList 数组
+  lossList: [],
+
+  // fileList 数组
+  fileList: []
 })
 
+// 监听处置措施数组变化，转换为逗号分隔的字符串存到 report.disposalMeasures
+watch(
+  disposalMeasuresArray,
+  (newVal) => {
+    formData.report.disposalMeasures = newVal.join(',')
+  },
+  { deep: true }
+)
+
+// 监听图片附件变化，同步到 fileList
+watch(
+  imageFileList,
+  (newVal) => {
+    syncFileList()
+  },
+  { deep: true }
+)
+
+// 监听视频附件变化，同步到 fileList
+watch(
+  videoFileList,
+  (newVal) => {
+    syncFileList()
+  },
+  { deep: true }
+)
+
+// 同步附件到 fileList
+const syncFileList = () => {
+  formData.fileList = [
+    ...imageFileList.value.map((f) => ({
+      fileName: f.name || '',
+      fileSize: f.size || 0,
+      fileType: 1, // 1-图片
+      fileUrl: f.url || f.content || ''
+    })),
+    ...videoFileList.value.map((f) => ({
+      fileName: f.name || '',
+      fileSize: f.size || 0,
+      fileType: 2, // 2-视频
+      fileUrl: f.url || f.content || ''
+    }))
+  ]
+}
+
+// 从 report.disposalMeasures 初始化处置措施数组
+watch(
+  () => formData.report.disposalMeasures,
+  (newVal) => {
+    if (newVal && typeof newVal === 'string') {
+      disposalMeasuresArray.value = newVal.split(',').filter(Boolean)
+    }
+  },
+  { immediate: true }
+)
+
 // 表单校验规则
 const formRules = {
-  reportUnit: [{ required: true, message: '请输入填报单位', trigger: 'blur' }],
-  contactPerson: [{ required: true, message: '请输入联系人', trigger: 'blur' }],
-  contactPhone: [
+  occurTime: [{ required: true, message: '请选择发生时间', trigger: 'change' }],
+  routeNo: [{ required: true, message: '请输入线路编号', trigger: 'blur' }],
+  'event.reporterUnit': [{ required: true, message: '请输入填报单位', trigger: 'blur' }],
+  'event.contactPerson': [{ required: true, message: '请输入联系人', trigger: 'blur' }],
+  'event.contactPhone': [
     { required: true, message: '请输入联系电话', trigger: 'blur' },
     { pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码', trigger: 'blur' }
-  ],
-  eventType: [{ required: true, message: '请选择事件类型', trigger: 'change' }],
-  isBlocked: [{ required: true, message: '请选择是否阻断', trigger: 'change' }],
-  discoverTime: [{ required: true, message: '请选择发现时间', trigger: 'change' }],
-  routeType: [{ required: true, message: '请选择路线类型', trigger: 'change' }],
-  district: [{ required: true, message: '请选择所属区县', trigger: 'change' }],
-  routeCode: [{ required: true, message: '请输入路线编号', trigger: 'blur' }]
+  ]
 }
 
 // 图片上传前校验
@@ -533,23 +589,25 @@ const beforeImageUpload = (file) => {
 
 // 视频上传前校验
 const beforeVideoUpload = (file) => {
-  const isLt3M = file.size / 1024 / 1024 < 3
-  if (!isLt3M) {
-    ElMessage.error('视频大小不能超过 3MB!')
+  const isLt20M = file.size / 1024 / 1024 < 20
+  if (!isLt20M) {
+    ElMessage.error('视频大小不能超过 20MB!')
     return false
   }
-  return false // 返回false阻止自动上传，由提交时统一处理
+  return false
 }
 
 // 图片预览
+const previewDialogVisible = ref(false)
+const previewImageUrl = ref('')
+
 const handlePicturePreview = (file) => {
   previewImageUrl.value = file.url
   previewDialogVisible.value = true
 }
 
-// 图片移除
 const handlePictureRemove = (file, fileList) => {
-  formData.images = fileList
+  imageFileList.value = fileList
 }
 
 // 返回上一页
@@ -557,108 +615,84 @@ const handleBack = () => {
   router.back()
 }
 
+// 初始化表单数据（用于编辑/续报）
+const initFormData = (data) => {
+  Object.assign(formData, data)
+}
+
+// 获取表单数据
+const getFormData = () => {
+  return { ...formData }
+}
+
+// 表单验证
+const validate = async () => {
+  if (!formRef.value) return false
+  try {
+    await formRef.value.validate()
+    return true
+  } catch (error) {
+    ElMessage.warning('请完善表单信息')
+    return false
+  }
+}
+
 // 提交表单
 const handleSubmit = async () => {
-  if (!formRef.value) return
+  // 验证表单
+  if (!validate()) {
+    return
+  }
 
-  await formRef.value.validate(async (valid) => {
-    if (!valid) {
-      ElMessage.warning('请完善表单信息')
-      return
+  submitting.value = true
+  try {
+    // 获取表单数据
+
+    // 添加事件类型和站点信息
+    const submitData = {
+      ...formData
+      // 可以在这里添加站点信息等其他数据
     }
 
-    submitting.value = true
-    try {
-      // 构建提交数据
-      const submitData = {
-        ...formData,
-        // 处理级联选择器值
-        locationPath: formData.locationPath.join('/'),
-        // 处理附件列表
-        imageList: formData.images.map((item) => item.raw),
-        videoList: formData.videos.map((item) => item.raw)
-      }
+    const res = await request({
+      url: '/snow-ops-platform/water-damage/addOrUpdate',
+      method: 'post',
+      data: submitData
+    })
 
-      // 模拟提交，实际使用时取消注释
-      // if (isEdit.value) {
-      //   await request({ url: `/api/water-damage/events/${route.query.id}`, method: 'put', data: submitData })
-      //   ElMessage.success('编辑成功')
-      // } else {
-      //   await request({ url: '/api/water-damage/events', method: 'post', data: submitData })
-      //   ElMessage.success('新增成功')
-      // }
-
-      await new Promise((resolve) => setTimeout(resolve, 500))
-      ElMessage.success(isEdit.value ? '编辑成功' : '新增成功')
-      router.back()
-    } catch (error) {
-      ElMessage.error('提交失败，请重试')
-      console.error(error)
-    } finally {
-      submitting.value = false
+    if (res?.code === '00000') {
+      ElMessage.success('提交成功')
+    } else {
+      ElMessage.error(res.message)
     }
-  })
+
+    // 提交成功后返回列表页
+    setTimeout(() => {
+      router.replace('/disasterManagement')
+    }, 1000)
+  } catch (error) {
+    ElMessage.error('提交失败，请重试')
+    console.error('提交失败:', error)
+  } finally {
+    submitting.value = false
+  }
 }
 
 // 加载编辑数据
 const loadEditData = async () => {
-  if (!isEdit.value) return
-
-  try {
-    // 模拟获取详情数据，实际使用时取消注释
-    // const response = await request({ url: `/api/water-damage/events/${route.query.id}`, method: 'get' })
-    // const data = response.data
-    // Object.assign(formData, data)
-
-    // 模拟数据
-    await new Promise((resolve) => setTimeout(resolve, 300))
-    Object.assign(formData, {
-      reportUnit: '万州区公路中心',
-      contactPerson: '王强',
-      contactPhone: '15978906789',
-      eventType: '水毁事件',
-      dangerDesc: '抢险中',
-      measure: '交通管制',
-      isBlocked: '是',
-      waterDamageCount: 3,
-      blockedMileage: 1.25,
-      discoverTime: '2024-07-11 16:00:00',
-      predictRecoverTime: '2024-08-12 16:30:00',
-      siteDescription: '边坡塌方导致道路中断，正在组织抢通',
-      routeType: '国省道',
-      district: '万州区',
-      routeCode: 'S202',
-      routeName: '开云路',
-      startPile: 'K17.200',
-      endPile: 'K17.350',
-      locationPath: ['chongqing', 'wanzhou', 'shuanghekou'],
-      smallPlaceName: '三汇口',
-      longitude: '108.408',
-      latitude: '30.808',
-      injuredCount: 0,
-      deathCount: 0,
-      strandedVehicles: 5,
-      damagedVehicles: 1,
-      clearVolume: 1200,
-      guardrailLength: 0.15,
-      roadsideTrees: 8,
-      otherLossAmount: 10,
-      otherLossDesc: '部分边沟损毁',
-      inputMachinery: 6,
-      inputLabor: 25,
-      inputFunds: 8,
-      needReconstruction: '是',
-      reconstructionCost: 50
-    })
-  } catch (error) {
-    ElMessage.error('加载数据失败')
-    console.error(error)
-  }
+  initFormData(mockData)
 }
 
 onMounted(() => {
   loadEditData()
 })
+
+// 暴露方法给父组件
+defineExpose({
+  validate,
+  initFormData,
+  getFormData
+})
 </script>
 
 <style scoped lang="scss">
@@ -724,6 +758,10 @@ onMounted(() => {
       margin-top: 8px;
     }
 
+    .video-preview {
+      margin-top: 12px;
+    }
+
     .form-actions {
       display: flex;
       justify-content: center;
diff --git a/packages/screen/src/views/DisasterManagement/DisasterReport/waterMockJson.json b/packages/screen/src/views/DisasterManagement/DisasterReport/waterMockJson.json
new file mode 100644
index 0000000..ce32ea7
--- /dev/null
+++ b/packages/screen/src/views/DisasterManagement/DisasterReport/waterMockJson.json
@@ -0,0 +1,45 @@
+{
+  "occurLocation": "G108国道 K2250+300处",
+  "occurTime": "2024-07-15 14:30:00",
+  "roadConditionType": "国道",
+  "routeNo": "G108",
+  "event": {
+    "blockedMileage": 1.5,
+    "blockedPointName": "磨盘山隧道口",
+    "contactPerson": "张明",
+    "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": "抢修中",
+    "reporterUnit": "武侯区交通运输局",
+    "startStakeLat": "30.652145",
+    "startStakeLng": "104.075632",
+    "startStakeNo": "K2250+300"
+  },
+  "report": {
+    "damagedVehicleCount": 2,
+    "strandedPersonCount": 12,
+    "deadCount": 0,
+    "strandedVehicleCount": 12,
+    "disposalMeasures": "halfClose,bypass",
+    "actualRecoverTime": "2024-07-17 12:00:00",
+    "expectRecoverTime": "2024-07-18 18:00:00",
+    "injuredCount": 1,
+    "investedFunds": 35.8,
+    "investedMachinery": 6,
+    "investedManpower": 45,
+    "remark": "已组织抢险队伍进行抢通，便道已修建完成",
+    "siteDescription": "因持续强降雨导致山体滑坡，掩埋路面约50米，边坡垮塌严重",
+    "totalLossAmount": 85.6
+  },
+  "lossList": [
+  ],
+  "fileList": []
+}
\ No newline at end of file
diff --git a/packages/screen/src/views/RiskWarning/Dialog/mapInfoDialog.vue b/packages/screen/src/views/RiskWarning/Dialog/mapInfoDialog.vue
new file mode 100644
index 0000000..f68c16c
--- /dev/null
+++ b/packages/screen/src/views/RiskWarning/Dialog/mapInfoDialog.vue
@@ -0,0 +1,156 @@
+<template>
+  <base-dialog
+    v-model:visible="props.visible"
+    :title="dialogTitle"
+    :table-data="[]"
+    :table-columns="[]"
+    :table-height="0"
+    :total="0"
+    :current-page="1"
+    :page-size="10"
+    :z-index="1000"
+    :max-width="400"
+    :show-filter="false"
+    :show-pagination="false"
+    @close="handleClose"
+  >
+    <!-- 标题栏下方自定义插槽 -->
+    <template #header>
+      <div class="dialog-content">
+        <div class="info-item" v-for="(item, index) in dialogItems" :key="index">
+          <label class="info-label">{{ item.label }}：</label>
+          <span class="info-value">{{ item.value }}</span>
+        </div>
+      </div>
+    </template>
+  </base-dialog>
+</template>
+
+<script setup>
+import { defineProps, defineEmits, computed } from "vue";
+import baseDialog from "../component/baseDialog.vue";
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    default: false,
+  },
+  type: {
+    type: String,
+    default: "project", // project, tunnel, bridge, road
+  },
+  data: {
+    type: Object,
+    default: () => ({}),
+  },
+});
+
+const emit = defineEmits(["update:visible"]);
+
+const handleClose = () => {
+  emit("update:visible", false);
+};
+
+// 根据类型和数据显示不同的标题和内容
+const dialogTitle = computed(() => {
+  const titleMap = {
+    project: "项目信息",
+    tunnel: "隧道信息",
+    bridge: "桥梁信息",
+    road: "路段信息",
+  };
+  return titleMap[props.type] || "详细信息";
+});
+
+const dialogItems = computed(() => {
+  const data = props.data;
+  const type = props.type;
+
+  switch (type) {
+    case "project":
+      return [
+        { label: "项目名称", value: data.NAME || data.name || "-" },
+        { label: "所属区县", value: data.COUNTY || data.county || "-" },
+        { label: "路线编号", value: data.ROUTE_CODE || data.routeCode || "-" },
+        { label: "路线名称", value: data.ROUTE_NAME || data.routeName || "-" },
+        { label: "项目类型", value: data.TYPE || data.type || "-" },
+        { label: "建设状态", value: data.STATUS || data.status || "-" },
+        { label: "开始时间", value: data.START_TIME || data.startTime || "-" },
+        { label: "预计完成", value: data.END_TIME || data.endTime || "-" },
+      ];
+    case "tunnel":
+      return [
+        { label: "隧道名称", value: data.NAME || data.name || data.GL1_SDMC || "-" },
+        { label: "所属区县", value: data.COUNTY || data.county || data.GL1_QXMC || "-" },
+        { label: "路线编号", value: data.ROUTE_CODE || data.routeCode || data.GL1_LXBM || "-" },
+        { label: "路线名称", value: data.ROUTE_NAME || data.routeName || data.GL1_LXMC || "-" },
+        { label: "隧道长度", value: data.LENGTH || data.GL1_SDCD ? `${data.LENGTH || data.GL1_SDCD}(米)` : "-" },
+        { label: "隧道净宽", value: data.WIDTH || data.GL1_SDKD ? `${data.WIDTH || data.GL1_SDKD}(米)` : "-" },
+        { label: "隧道净高", value: data.HEIGHT || data.GL1_SDGD ? `${data.HEIGHT || data.GL1_SDGD}(米)` : "-" },
+        { label: "建成时间", value: data.BUILD_TIME || data.buildTime || data.GL1_JCSJ || "-" },
+        { label: "评定等级", value: data.GRADE || data.grade || data.GL1_PDDJ || "-" },
+      ];
+    case "bridge":
+      return [
+        { label: "桥梁名称", value: data.NAME || data.name || data.GL1_QLMC || "-" },
+        { label: "所属区县", value: data.COUNTY || data.county || data.GL1_QXMC || "-" },
+        { label: "路线编号", value: data.ROUTE_CODE || data.routeCode || data.GL1_LXBM || "-" },
+        { label: "路线名称", value: data.ROUTE_NAME || data.routeName || data.GL1_LXMC || "-" },
+        { label: "桥梁长度", value: data.LENGTH || data.GL1_QLCD ? `${data.LENGTH || data.GL1_QLCD}(米)` : "-" },
+        { label: "桥梁宽度", value: data.WIDTH || data.GL1_QLKD ? `${data.WIDTH || data.GL1_QLKD}(米)` : "-" },
+        { label: "桥梁类型", value: data.TYPE || data.type || data.GL1_QLXZ || "-" },
+        { label: "建成时间", value: data.BUILD_TIME || data.buildTime || data.GL1_JCSJ || "-" },
+        { label: "评定等级", value: data.GRADE || data.grade || data.GL1_PDDJ || "-" },
+      ];
+    case "road":
+      return [
+        { label: "路段名称", value: data.NAME || data.name || data.GL1_LDMC || "-" },
+        { label: "所属区县", value: data.COUNTY || data.county || data.GL1_QXMC || "-" },
+        { label: "路线编号", value: data.ROUTE_CODE || data.routeCode || data.GL1_LXBM || "-" },
+        { label: "路线名称", value: data.ROUTE_NAME || data.routeName || data.GL1_LXMC || "-" },
+        { label: "路段长度", value: data.LENGTH || data.GL1_LDCD ? `${data.LENGTH || data.GL1_LDCD}(公里)` : "-" },
+        { label: "路面类型", value: data.PAVEMENT_TYPE || data.pavementType || data.GL1_LMLX || "-" },
+        { label: "车道数量", value: data.LANE_COUNT || data.laneCount || data.GL1_CDSL || "-" },
+        { label: "设计时速", value: data.SPEED_LIMIT || data.speedLimit ? `${data.SPEED_LIMIT || data.speedLimit}(km/h)` : "-" },
+      ];
+    default:
+      return [
+        { label: "名称", value: data.NAME || data.name || "-" },
+        { label: "所属区县", value: data.COUNTY || data.county || "-" },
+      ];
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+@function vw($px) {
+  @return calc($px / 1920 * 100vw);
+}
+
+.dialog-content {
+  padding: vw(10) vw(15);
+  max-height: vw(300);
+  overflow-y: auto;
+
+  .info-item {
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: vw(10);
+    line-height: 1.5;
+
+    .info-label {
+      color: rgba(255, 255, 255, 0.7);
+      font-size: vw(13);
+      min-width: vw(80);
+      flex-shrink: 0;
+    }
+
+    .info-value {
+      color: #fff;
+      font-size: vw(13);
+      flex: 1;
+      word-break: break-all;
+    }
+  }
+}
+</style>
diff --git a/packages/screen/src/views/RiskWarning/Dialog/tunnelInfoDialog.vue b/packages/screen/src/views/RiskWarning/Dialog/tunnelInfoDialog.vue
index 330cfbe..5e57899 100644
--- a/packages/screen/src/views/RiskWarning/Dialog/tunnelInfoDialog.vue
+++ b/packages/screen/src/views/RiskWarning/Dialog/tunnelInfoDialog.vue
@@ -22,7 +22,7 @@
           <span class="info-value">{{ item.value }}</span>
         </div>
       </div>
-      <div class="dialog-imgs">
+      <!-- <div class="dialog-imgs">
         <img
           class="dialog-img"
           v-for="(img, index) in rescueTeamData.imgs"
@@ -30,7 +30,7 @@
           :src="img"
           alt=""
         />
-      </div>
+      </div> -->
     </template>
   </base-dialog>
 </template>
@@ -47,9 +47,9 @@ const props = defineProps({
   data: {
     type: Object,
     default: () => ({
-      title: "隧道信息",
+      title: "项目信息",
       items: [
-        { label: "隧道名称", value: "蔺市隧道右线" },
+        { label: "项目名称", value: "蔺市隧道右线" },
         { label: "编号", value: "G212线" },
         { label: "所属区县", value: "涪陵" },
         { label: "隧道长度", value: "1782(米)" },
diff --git a/packages/screen/src/views/RiskWarning/bottom.vue b/packages/screen/src/views/RiskWarning/bottom.vue
index d8b4be2..0e1ed6e 100644
--- a/packages/screen/src/views/RiskWarning/bottom.vue
+++ b/packages/screen/src/views/RiskWarning/bottom.vue
@@ -6,7 +6,7 @@
         :key="index"
         class="nav-item"
         :class="{ active: activeIndex === index }"
-        @click="activeIndex = index"
+        @click="handleClick(index)"
       >
         <div class="nav-icon-box">
           <!-- <i :class="item.icon"></i> -->
@@ -22,6 +22,7 @@
           class="clear-icon"
           src="../../assets/RiskWarning_img/清除icon@2x.png"
           alt=""
+          @click="clearFilters"
         />
         <div class="panel-header">
           <div class="header-title">气象预警监测</div>
@@ -117,7 +118,7 @@ import bridgeIconIcon1 from "../../assets/RiskWarning_img/桥梁icon1@2x.png";
 import roadIconIcon1 from "../../assets/RiskWarning_img/线路路段icon1@2x.png";
 import teamIconIcon1 from "../../assets/RiskWarning_img/队伍icon1@2x.png";
 
-const activeIndex = ref(0);
+const activeIndex = ref(-1);
 
 const menuItems = [
   {
@@ -241,7 +242,24 @@ const cellStyle = () => ({
 const rowClassName = ({ rowIndex }) => {
   return rowIndex % 2 === 0 ? "even-row" : "odd-row";
 };
+const emit = defineEmits(["changeActiveIndex", "clearMapMarkers"]);
+// 点击切换导航项
+const handleClick = (index) => {
+  activeIndex.value = index;
+  emit("changeActiveIndex", index);
+};
 
+// 清除筛选条件
+const clearFilters = () => {
+  filters.value = {
+    red: false,
+    blue: false,
+    orange: false,
+    yellow: false,
+  };
+  // 触发清除地图标记事件
+  emit("clearMapMarkers");
+};
 // 表格自动滚动相关
 const tableRef = ref(null);
 const isScrolling = ref(true);
diff --git a/packages/screen/src/views/RiskWarning/component/ChongqingMap.vue b/packages/screen/src/views/RiskWarning/component/ChongqingMap.vue
index e2a00fc..78fe380 100644
--- a/packages/screen/src/views/RiskWarning/component/ChongqingMap.vue
+++ b/packages/screen/src/views/RiskWarning/component/ChongqingMap.vue
@@ -16,21 +16,47 @@
       :z-index="zIndex"
       :width="width"
     ></TongnanCenterCardDialog>
+    <tunnelInfoDialog
+      v-model:visible="tunnelDialogVisible"
+      :data="tunnelDialogData"
+    />
+    <mapInfoDialog
+      v-model:visible="mapInfoDialogVisible"
+      :type="mapInfoDialogType"
+      :data="mapInfoDialogData"
+    />
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted } from "vue";
+import { ref, onMounted, onUnmounted, watch, defineExpose } from "vue";
 import axios from "axios";
 import { request } from "@/utils/request";
 import TongnanCenterCardDialog from "@/views/RiskWarning/Dialog/tongnanCenterCardDialog.vue";
 
+import projectIcon from "../../../assets/MaMap_img/项目@2x.png";
+import bridgeIcon from "../../../assets/MaMap_img/桥梁icon@2x.png";
+import tunnelIcon from "../../../assets/MaMap_img/蓝色@2x1.png";
+import tunnelLineIcon from "../../../assets/MaMap_img/线路icon定位@2x.png";
+import tunnelIcon2 from "../../../assets/MaMap_img/隧洞icon@2x.png";
+import rescueTeamIcon from "../../../assets/MaMap_img/队伍icon@2x.png";
+
+import tunnelInfoDialog from "../Dialog/tunnelInfoDialog.vue";
+import mapInfoDialog from "../Dialog/mapInfoDialog.vue";
+
 const mapContainer = ref(null);
 const loading = ref(false);
 const error = ref(null);
 let mapInstance = null;
 let geoJsonLayer = null;
 
+const props = defineProps({
+  activeIndex: {
+    type: Number,
+    default: -1,
+  },
+});
+
 // 定义 emits
 const emit = defineEmits(["districtClick"]);
 
@@ -38,6 +64,27 @@ const emit = defineEmits(["districtClick"]);
 const selectedDistrict = ref(null);
 let selectedLayer = null;
 
+// 隧道信息弹窗
+const tunnelDialogVisible = ref(false);
+const tunnelDialogData = ref({});
+
+// 地图信息弹窗
+const mapInfoDialogVisible = ref(false);
+const mapInfoDialogType = ref("project");
+const mapInfoDialogData = ref({});
+
+// 打开地图信息弹窗
+const openMapInfoDialog = (type, data) => {
+  mapInfoDialogType.value = type;
+  mapInfoDialogData.value = data;
+  mapInfoDialogVisible.value = true;
+};
+
+// 打开隧道信息弹窗（兼容旧代码）
+const openTunnelDialog = (data) => {
+  openMapInfoDialog("tunnel", data);
+};
+
 // 受影响对象数据
 const affectedCountyData = ref({
   byName: {},
@@ -68,6 +115,265 @@ const getAffectedCountyData = async () => {
   }
 };
 
+const affectedBridgeData = ref([]);
+// 获取受影响桥梁数据
+const getAffectedBridgeData = async () => {
+  try {
+    const res = await request({
+      url: "snow-ops-platform/weather-warning/affected-object/bridge",
+      method: "GET",
+      params: {
+        start: "2025-03-03 12:33:00",
+        end: "2025-07-30 12:33:00",
+      },
+    });
+    if (res.code === "00000" && res.data) {
+      res.data.forEach((item) => {
+        item.COORDINATE_POINT = [item.GL1_QLJD, item.GL1_QLWD];
+      });
+    }
+    affectedBridgeData.value = res.data;
+
+    addProjectMarkers(res.data, bridgeIcon, "bridge");
+  } catch (error) {
+    console.error("获取受影响桥梁数据失败:", error);
+    return [];
+  }
+};
+
+const affectedTunnelData = ref([]);
+
+const tunnelInfoDialogRef = ref(null);
+// 获取受影响隧道数据
+const getAffectedTunnelData = async () => {
+  try {
+    const res = await request({
+      url: "snow-ops-platform/weather-warning/affected-object/tunnel",
+      method: "GET",
+      params: {
+        start: "2025-03-03 12:33:00",
+        end: "2025-07-30 12:33:00",
+      },
+    });
+    console.log("受影响隧道数据:", res);
+    if (res.code === "00000" && res.data) {
+      res.data.forEach((item) => {
+        item.COORDINATE_POINT = [
+          Number(item.GL1_SDJD2),
+          Number(item.GL1_SDWD2),
+        ];
+      });
+      tunnelInfoDialogRef.value = res.data;
+      console.log("受影响隧道数据:", res.data);
+
+      addProjectMarkers(res.data, tunnelIcon2, "tunnel");
+    }
+    return [];
+  } catch (error) {
+    console.error("获取受影响隧道数据失败:", error);
+    return [];
+  }
+};
+
+const affectedProjectData = ref([]);
+
+// 获取受影响项目数据
+const getAffectedProjectData = async () => {
+  try {
+    const res = await request({
+      url: "snow-ops-platform/weather-warning/affected-object/project",
+      method: "GET",
+      params: {
+        start: "2025-03-03 12:33:00",
+        end: "2025-07-30 12:33:00",
+      },
+    });
+    console.log("受影响项目数据:", res);
+    if (res.code === "00000" && res.data) {
+      console.log("项目数据条数:", res.data.length);
+      // 解析坐标数据
+      const parsedData = res.data.map((item) => {
+        const newItem = { ...item };
+        if (item.COORDINATE_POINT) {
+          console.log("原始坐标:", item.COORDINATE_POINT);
+          newItem.COORDINATE_POINT = item.COORDINATE_POINT.substring(
+            6,
+            item.COORDINATE_POINT.length - 1,
+          )
+            .split(" ")
+            .reverse();
+          console.log("解析后坐标:", newItem.COORDINATE_POINT);
+        }
+        return newItem;
+      });
+      affectedProjectData.value = parsedData;
+      // 在地图上添加项目标记
+      console.log("开始添加项目标记...");
+      addProjectMarkers(parsedData, projectIcon, "project");
+    } else {
+      console.warn("没有获取到项目数据或返回码错误:", res);
+    }
+    return res.data || [];
+  } catch (error) {
+    console.error("获取受影响项目数据失败:", error);
+    return [];
+  }
+};
+
+const affectedRoadSectionData = ref([]);
+// 获取受影响路段数据
+const getAffectedRoadSectionData = async () => {
+  try {
+    const res = await request({
+      url: "snow-ops-platform/weather-warning/affected-object/road-section",
+      method: "GET",
+      params: {
+        start: "2025-03-03 12:33:00",
+        end: "2025-07-30 12:33:00",
+      },
+    });
+    console.log("受影响路段数据:", res);
+    if (res.code === "00000" && res.data) {
+      res.data.forEach((item) => {
+        item.COORDINATE_POINT = JSON.parse(item.STARTPOINT);
+      });
+      affectedRoadSectionData.value = res.data;
+      // 在地图上添加项目标记
+      console.log("开始添加项目标记...");
+
+      addProjectMarkers(affectedRoadSectionData.value, tunnelLineIcon, "road");
+    }
+    return [];
+  } catch (error) {
+    console.error("获取受影响路段数据失败:", error);
+    return [];
+  }
+};
+
+const emergencyForceData = ref([]);
+// 获取应急力量数据
+const getEmergencyForceData = async () => {
+  try {
+    const res = await request({
+      url: "/snow-ops-platform/yhYjll/list",
+      method: "GET",
+      params: {
+        start: "2025-03-03 12:33:00",
+        end: "2025-07-30 12:33:00",
+      },
+    });
+    console.log("应急力量数据:", res);
+    if (
+      res.code === "00000" &&
+      res.data 
+    ) {
+      // 解析坐标数据
+      const parsedData = res.data.map((item) => {
+        const newItem = { ...item };
+        newItem.COORDINATE_POINT = [item.gl1Lng, item.gl1Lat];
+        console.log("解析后坐标:", newItem.COORDINATE_POINT);
+        return newItem;
+      });
+      emergencyForceData.value = parsedData;
+
+      // 在地图上添加应急力量标记
+      console.log("开始添加应急力量标记...", parsedData);
+      addProjectMarkers(parsedData, tunnelIcon, "tunnel");
+    } else {
+      console.warn("没有获取到应急力量数据或返回码错误:", res);
+    }
+    return res.data || [];
+  } catch (error) {
+    console.error("获取应急力量数据失败:", error);
+    return [];
+  }
+};
+
+let projectMarkers = []; // 存储项目标记
+
+// 清除项目标记
+const clearProjectMarkers = () => {
+  projectMarkers.forEach((marker) => {
+    if (mapInstance) {
+      mapInstance.removeLayer(marker);
+    }
+  });
+  projectMarkers = [];
+};
+
+// 在地图上添加项目标记
+const addProjectMarkers = (data, iconUrl, type = "project") => {
+  console.log(
+    "addProjectMarkers 被调用, mapInstance:",
+    !!mapInstance,
+    "数据条数:",
+    data?.length,
+    "类型:",
+    type,
+  );
+  if (!mapInstance) {
+    console.warn("mapInstance 未初始化，无法添加标记");
+    return;
+  }
+  if (!data || data.length === 0) {
+    console.warn("没有数据，无法添加标记");
+    return;
+  }
+
+  // // 清除之前的标记
+  // clearProjectMarkers();
+
+  // 创建自定义图标
+  const projectIconObj = window.L.icon({
+    iconUrl: iconUrl,
+    iconSize: [30, 30],
+    iconAnchor: [10, 10],
+    popupAnchor: [0, -10],
+  });
+
+  // 遍历数据添加标记
+  data.forEach((item) => {
+    if (item.COORDINATE_POINT && item.COORDINATE_POINT.length === 2) {
+      // COORDINATE_POINT 格式: [经度, 纬度]
+      // Leaflet 需要: [纬度, 经度]
+      const lng = item.COORDINATE_POINT[0];
+      const lat = item.COORDINATE_POINT[1];
+
+      const latNum = parseFloat(lat);
+      const lngNum = parseFloat(lng);
+
+      console.log(
+        "项目坐标:",
+        item.NAME || item.name,
+        "纬度:",
+        latNum,
+        "经度:",
+        lngNum,
+      );
+
+      if (!isNaN(latNum) && !isNaN(lngNum)) {
+        const marker = window.L.marker([latNum, lngNum], {
+          icon: projectIconObj,
+        });
+
+        // 点击 marker 打开对应类型的信息弹窗
+        marker.on("click", () => {
+          openMapInfoDialog(type, item);
+        });
+
+        marker.addTo(mapInstance);
+        projectMarkers.push(marker);
+      } else {
+        console.warn("无效的坐标:", item.COORDINATE_POINT, item);
+      }
+    } else {
+      console.warn("缺少坐标数据:", item);
+    }
+  });
+
+  console.log(`已添加 ${projectMarkers.length} 个项目标记`);
+};
+
 // 确定主要预警颜色（出现最多的预警等级）
 const getMainWarningColor = (levels) => {
   if (!levels || Object.keys(levels).length === 0) return "#1890ff"; // 默认蓝色
@@ -97,18 +403,6 @@ const getMainWarningColor = (levels) => {
   }
 };
 
-// 根据预警等级获取颜色
-const getColorByLevel = (level) => {
-  const colorMap = {
-    红色预警: "#FF4D4F",
-    橙色预警: "#EC7345",
-    黄色预警: "#FBC23C",
-    蓝色预警: "#3799FC",
-    未知: "#1890ff",
-  };
-  return colorMap[level] || "#1890ff";
-};
-
 // 统计各区县的预警数量（按预警等级区分）
 const countWarningsByCounty = (data) => {
   if (!data || !Array.isArray(data)) return {};
@@ -326,7 +620,17 @@ const simplifyDistrictName = (name) => {
   };
   return nameMap[name] || name;
 };
-
+// 根据预警等级获取颜色
+const getColorByLevel = (level) => {
+  const colorMap = {
+    红色预警: "#FF4D4F",
+    橙色预警: "#EC7345",
+    黄色预警: "#705D42",
+    蓝色预警: "#3799FC",
+    未知: "#1890ff",
+  };
+  return colorMap[level] || "#1890ff";
+};
 // 初始化地图
 const initMap = (geoJsonData) => {
   if (!mapContainer.value) return;
@@ -362,7 +666,8 @@ const initMap = (geoJsonData) => {
     // 添加 GeoJSON 图层
     geoJsonLayer = new window.L.GeoJSON(geoJsonData, {
       style: (feature) => {
-        const districtName = feature.properties.name;
+        // const districtName = feature.properties.name;
+        const districtName = simplifyDistrictName(feature.properties.name);
         let fillColor = "#132C44"; // 默认
         // 如果有预警统计数据，应用主要预警颜色
         if (
@@ -378,9 +683,9 @@ const initMap = (geoJsonData) => {
         return {
           fillColor: fillColor,
           weight: 1.5,
-          opacity: 0.6,
+          opacity: 0.5,
           color: "#40a9ff",
-          fillOpacity: 1,
+          fillOpacity: 0.5,
         };
       },
       onEachFeature: (feature, layer) => {
@@ -513,6 +818,31 @@ const initMap = (geoJsonData) => {
   }
 };
 
+// 监听 activeIndex 变化
+watch(
+  () => props.activeIndex,
+  async (newVal) => {
+    console.log("activeIndex 变化:", newVal);
+    switch (newVal) {
+      case 0:
+        await getAffectedProjectData();
+        break;
+      case 1:
+        await getAffectedTunnelData();
+        break;
+      case 3:
+        await getAffectedBridgeData();
+        break;
+      case 4:
+        await getAffectedRoadSectionData();
+        break;
+      default:
+        break;
+    }
+  },
+  { immediate: false },
+);
+
 // 组件挂载时加载地图
 onMounted(() => {
   // 获取受影响对象数据
@@ -546,6 +876,12 @@ onUnmounted(() => {
     mapInstance = null;
   }
 });
+
+// 暴露方法给父组件调用
+defineExpose({
+  getEmergencyForceData,
+  clearProjectMarkers,
+});
 </script>
 
 <style lang="scss">
@@ -659,6 +995,9 @@ onUnmounted(() => {
 // Leaflet 地图样式覆盖
 :deep(.leaflet-container) {
   background: #0f1c2e !important;
+  .leaflet-popup {
+    left: -20px !important;
+  }
 
   .leaflet-popup-content-wrapper {
     background: rgba(24, 144, 255, 0.95);
@@ -693,4 +1032,15 @@ onUnmounted(() => {
   transition: all 0.3s;
   cursor: pointer;
 }
+
+.project-popup {
+  width: vw(120);
+  height: vw(20);
+  color: #fff;
+  font-size: vw(12);
+  text-align: center;
+  margin: 0;
+  padding: 15px;
+  font-weight: 500;
+}
 </style>
diff --git a/packages/screen/src/views/RiskWarning/index.vue b/packages/screen/src/views/RiskWarning/index.vue
index 440de13..a9b0e56 100644
--- a/packages/screen/src/views/RiskWarning/index.vue
+++ b/packages/screen/src/views/RiskWarning/index.vue
@@ -93,6 +93,7 @@
     </div>
     <div class="right">
       <right
+        @openResourceDetail="openResourceDetail"
         @openClearanceSituation="openDialog('clearanceSituation')"
         @openControlSituation="openDialog('controlSituation')"
       ></right>
@@ -101,14 +102,14 @@
     <div class="center">
       <!-- 地图底层 -->
       <div class="map-layer">
-        <ChongqingMap />
+        <ChongqingMap ref="chongqingMapRef" :activeIndex="activeIndex" />
       </div>
 
       <!-- 地图遮罩层 -->
       <div class="map-mask" aria-hidden="true"></div>
     </div>
     <div class="bottom">
-      <bottom></bottom>
+      <bottom @changeActiveIndex="changeActiveIndex" @clearMapMarkers="clearMapMarkers"></bottom>
     </div>
     <top class="top" @openAIResult="openDialog('aiWarningResult')"></top>
 
@@ -306,6 +307,40 @@ const dialogVisible = ref({
   warningSituation: false,  
   tunnelInfo: false
 });
+const activeIndex = ref(0);
+
+// 地图组件引用
+const chongqingMapRef = ref(null);
+
+// 切换导航项时触发
+const changeActiveIndex = (index) => {
+  activeIndex.value = index;
+};
+
+// 打开资源详情（队伍、人员、装备、物资）
+const openResourceDetail = (item) => {
+  console.log("打开资源详情:", item);
+  // 判断是否为队伍或人员
+  if (item.label === "全市普通公路抢险队伍" || item.label === "人员") {
+    // 调用地图组件的获取应急力量方法
+    if (chongqingMapRef.value) {
+      chongqingMapRef.value.getEmergencyForceData();
+    }
+  }
+  // 打开对应的弹窗
+  const key = item.label.toLowerCase().replace(/[^a-z]/g, "");
+  if (dialogVisible.value[key] !== undefined) {
+    dialogVisible.value[key] = true;
+  }
+};
+
+// 清除地图标记
+const clearMapMarkers = () => {
+  console.log("清除地图标记");
+  if (chongqingMapRef.value) {
+    chongqingMapRef.value.clearProjectMarkers();
+  }
+};
 
 // 打开弹窗
 const openDialog = (dialogName) => {
diff --git a/packages/screen/src/views/RiskWarning/right.vue b/packages/screen/src/views/RiskWarning/right.vue
index fee29fd..84e9fbe 100644
--- a/packages/screen/src/views/RiskWarning/right.vue
+++ b/packages/screen/src/views/RiskWarning/right.vue
@@ -12,6 +12,7 @@
           v-for="(item, index) in resourceData"
           :key="index"
           class="resource-item"
+          @click="handleResourceClick(item)"
         >
           <!-- <div class="resource-icon" :class="item.iconClass"></div> -->
           <img class="resource-icon" :src="item.img" alt="" />
@@ -215,7 +216,11 @@ import icon62 from "../../assets/RiskWarning_img/路径62@2x.png";
 import icon621 from "../../assets/RiskWarning_img/路径62@2x (1).png";
 import icon622 from "../../assets/RiskWarning_img/路径62@2x (2).png";
 
-const emit = defineEmits(["openClearanceSituation", "openControlSituation"]);
+const emit = defineEmits([
+  "openClearanceSituation",
+  "openControlSituation",
+  "openResourceDetail",
+]);
 
 // 组件挂载时获取数据
 onMounted(() => {
@@ -251,6 +256,7 @@ const getYhYjllList = async () => {
         resourceData.value[1].unit = "人";
       }
       resourceData.value[0].value = gl1Yjllmcs;
+
     }
   } catch (error) {
     console.error("获取应急力量列表失败:", error);
@@ -369,6 +375,11 @@ const resourceData = ref([
   },
 ]);
 
+// 点击资源项
+const handleResourceClick = (item) => {
+  emit("openResourceDetail", item);
+};
+
 // 管控路段数据
 const controlData1 = [
   { label: "封闭管控数", value: "40" },