Merge branch 'dev' of http://222.212.85.86:8222/bdzl2/bxztApp into dev

packages/screen/src/component/DynamicDetail/BlockItem.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="block-item">
+    <slot v-if="title" name="header">
+      <div class="header">
+        <div class="header-title">{{ title }}</div>
+        <div class="header-extra" v-if="$slots.headerExtra">
+          <slot name="headerExtra"></slot>
+        </div>
+      </div>
+    </slot>
+
+    <slot />
+  </div>
+</template>
+<script setup>
+import { onMounted, ref } from 'vue'
+
+const props = defineProps({
+  title: {
+    type: String,
+    default: ''
+  },
+})
+
+</script>
+<style scoped lang="scss">
+.block-item {
+  position: relative;
+  width: 100%;
+
+  & + .block-item {
+    margin-top: 10px;
+  }
+}
+.header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 18px;
+}
+.header-title {
+  font-weight: 500;
+  font-size: 15px;
+  color: #4a4a4a;
+  line-height: 16px;
+}
+</style>

packages/screen/src/component/DynamicDetail/DynamicData.vue

@@ -0,0 +1,65 @@
+<template>
+  <div class="dynamic-data">
+    <span class="info-label">{{ config.label }}：</span>
+    <span class="info-value">{{ getModelValue() || '-' }}</span>
+  </div>
+</template>
+<script setup>
+import { onMounted, ref, inject, toRaw } from 'vue'
+
+const formData = inject('formData')
+
+const props = defineProps({
+  config: {
+    type: Object,
+    default: () => ({})
+  }
+})
+
+const getModelValue = () => {
+  if (props.config.value !== null && props.config.value !== undefined && props.config.value !== '') return props.config.value
+  if (typeof props.config.value == 'function') return props.config.value(formData.value)
+
+  if (!props.config.prop) {
+    console.error('请配置prop属性', toRaw(props.config))
+    return null
+  }
+  const keys = props.config.prop?.split('.')
+  let current = formData.value
+  for (const key of keys) {
+    if (typeof current != 'object' || !current[key]) return null
+    current = current[key]
+  }
+
+  return current
+}
+</script>
+<style scoped lang="scss">
+.dynamic-data {
+  display: flex;
+  align-items: flex-start;
+  line-height: 1.5;
+
+  & + .dynamic-data {
+    margin-top: 10px;
+  }
+
+  &.margin {
+    margin-top: 10px;
+  }
+
+  .info-label {
+    white-space: nowrap;
+    flex-shrink: 0;
+    color: #909399;
+    font-size: 14px;
+  }
+
+  .info-value {
+    flex: 1;
+    color: #606266;
+    font-size: 14px;
+    word-break: break-all;
+  }
+}
+</style>

packages/screen/src/component/DynamicDetail/DynamicDetail.vue

@@ -0,0 +1,48 @@
+<template>
+  <div class="dynamic-detail">
+    <template v-for="(config, configIndex) in configList" :key="configIndex">
+      <DynamicDetailItem :config="config" />
+    </template>
+  </div>
+</template>
+<script setup>
+import { onMounted, watch, ref, provide, computed } from 'vue'
+import DynamicDetailItem from './DynamicDetailItem.vue'
+const props = defineProps({
+  configList: {
+    type: Array,
+    default: () => []
+  },
+  modelValue: {
+    type: Object,
+    default: () => {}
+  }
+})
+const computedModelValue = computed(() => {
+  return props.modelValue
+})
+provide('formData', computedModelValue)
+
+const formRef = ref(null)
+
+// 获得默认表单值
+const getDefaultFormValue = () => {
+  const form = {}
+  props.formConfig.forEach((config) => {
+    form[config.name] = config.default !== undefined ? config.default : ''
+  })
+  return form
+}
+
+defineExpose({
+  getDefaultFormValue,
+  formComponent: formRef.value
+})
+</script>
+<style scoped lang="scss">
+.form-wrapper {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 16px;
+}
+</style>

packages/screen/src/component/DynamicDetail/DynamicDetailItem.vue

@@ -0,0 +1,45 @@
+<template>
+  <template v-if="isShow() && !config.slot && checkLayout(config)">
+    <DynamicLayout :config="config">
+      <DynamicDetailItem v-for="(item, index) in config.children" :key="index" :config="item" />
+    </DynamicLayout>
+  </template>
+  <template v-if="isShow() && !config.slot && !checkLayout(config)">
+    <el-col class="col-item" :span="config.span">
+      <DynamicData style="width: 100%" :config="config" />
+    </el-col>
+  </template>
+  <template v-if="isShow() && config.slot">
+    <slot />
+  </template>
+</template>
+<script setup>
+import { onMounted, ref , inject} from 'vue'
+import DynamicLayout from './DynamicLayout.vue'
+import DynamicData from './DynamicData.vue'
+
+const layoutTypes = ['card', 'block', 'row']
+const checkLayout = (config) => {
+  return layoutTypes.includes(config?.type)
+}
+
+const formData = inject('formData')
+
+const props = defineProps({
+  config: {
+    type: Object,
+    default: () => ({})
+  }
+})
+
+const isShow = () => {
+  if(props.config.show === false) return false
+  if(typeof props.config.show === 'function') return props.config.show(formData)
+  return true
+}
+</script>
+<style scoped lang="scss">
+.col-item {
+  margin-bottom: 10px;
+}
+</style>

packages/screen/src/component/DynamicDetail/DynamicLayout.vue

@@ -0,0 +1,34 @@
+<template>
+  <template v-if="config.type == 'card'">
+    <el-card shadow="never">
+      <template #header>
+        <div class="section-header">
+          <span class="section-title">{{ config.label }}</span>
+        </div>
+      </template>
+      <slot />
+    </el-card>
+  </template>
+  <template v-else-if="config.type == 'block'">
+    <BlockItem :title="config.label">
+      <slot />
+    </BlockItem>
+  </template>
+  <template v-else-if="config.type == 'row'">
+    <el-row v-bind="config.componentProps">
+      <slot />
+    </el-row>
+  </template>
+</template>
+<script setup>
+import { onMounted, ref } from 'vue'
+import BlockItem from './BlockItem.vue';
+
+const props = defineProps({
+  config: {
+    type: Object,
+    default: () => ({})
+  },
+})
+</script>
+<style scoped lang="scss"></style>

packages/screen/src/component/DynamicForm/BlockItem.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="block-item">
+    <slot v-if="title" name="header">
+      <div class="header">
+        <div class="header-title">{{ title }}</div>
+        <div class="header-extra" v-if="$slots.headerExtra">
+          <slot name="headerExtra"></slot>
+        </div>
+      </div>
+    </slot>
+
+    <slot />
+  </div>
+</template>
+<script setup>
+import { onMounted, ref } from 'vue'
+
+const props = defineProps({
+  title: {
+    type: String,
+    default: ''
+  },
+})
+
+</script>
+<style scoped lang="scss">
+.block-item {
+  position: relative;
+  width: 100%;
+
+  & + .block-item {
+    margin-top: 10px;
+  }
+}
+.header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 18px;
+}
+.header-title {
+  font-weight: 500;
+  font-size: 15px;
+  color: #4a4a4a;
+  line-height: 16px;
+}
+</style>

packages/screen/src/component/DynamicForm/DynamicControl.vue

@@ -0,0 +1,111 @@
+<template>
+  <div class="dynamic-control">
+    <template v-if="config.type == 'input'">
+      <el-input
+        style="width: 100%"
+        :modelValue="getModelValue()"
+        @update:modelValue="changeModelValue"
+        :placeholder="config.componentProps?.placeholder"
+        :clearable="true"
+      />
+    </template>
+
+    <template v-if="config.type == 'inputNumber'">
+      <el-input-number
+        style="width: 100%"
+        :modelValue="getModelValue()"
+        @update:modelValue="changeModelValue"
+        :placeholder="config.componentProps?.placeholder"
+        :clearable="true"
+      />
+    </template>
+
+    <template v-if="config.type == 'radio'">
+      <el-radio-group
+        style="width: 100%"
+        :modelValue="getModelValue()"
+        @update:modelValue="changeModelValue"
+        :placeholder="config.componentProps?.placeholder"
+      >
+        <el-radio v-for="(option, i) in config.options" :value="option.value">{{
+          option.label
+        }}</el-radio>
+      </el-radio-group>
+    </template>
+
+    <template v-if="config.type == 'select'">
+      <el-select
+        style="width: 100%"
+        :modelValue="getModelValue()"
+        @update:modelValue="changeModelValue"
+        :placeholder="config.componentProps?.placeholder"
+      >
+        <el-option
+          v-for="(option, i) in config.options"
+          :key="i"
+          :label="option.label"
+          :value="option.value"
+        ></el-option>
+      </el-select>
+    </template>
+
+    <template v-if="config.type == 'date'">
+      <el-date-picker
+        style="width: 100%"
+        :modelValue="getModelValue()"
+        type="date"
+        @update:modelValue="changeModelValue"
+        :placeholder="config.componentProps?.placeholder"
+      />
+    </template>
+  </div>
+</template>
+<script setup>
+import { onMounted, ref, inject, toRaw } from 'vue'
+
+const formData = inject('formData')
+
+const props = defineProps({
+  config: {
+    type: Object,
+    default: () => ({}),
+  },
+})
+
+const getModelValue = () => {
+  if(!props.config.prop) {
+    console.error('请配置prop属性', toRaw(props.config))
+    return null
+  }
+  const keys = props.config.prop?.split('.')
+  let current = formData.value
+  for (const key of keys) {
+    if (typeof current != 'object' || !current[key]) return null
+    current = current[key]
+  }
+  return current
+}
+
+const changeModelValue = (value) => {
+  if(!props.config.prop) {
+    return null
+  }
+  // 1. 将路径字符串 'event.name' 按 '.' 拆分成数组
+  const keys = props.config.prop?.split('.')
+
+  // 2. 一直遍历到倒数第一个属性，确保中间路径上的对象都存在
+  let current = formData.value
+  for (let i = 0; i < keys.length - 1; i++) {
+    const key = keys[i]
+    // 如果中间层不存在，就自动创建一个空对象
+    if (!current[key] || typeof current[key] !== 'object') {
+      current[key] = {}
+    }
+    current = current[key]
+  }
+
+  // 3. 在最后一层进行赋值
+  current[keys[keys.length - 1]] = value
+}
+</script>
+<style scoped lang="scss"></style>

packages/screen/src/component/DynamicForm/DynamicForm.vue

@@ -1,91 +1,52 @@
 <template>
-    <div class="dynamic-form">
+  <div class="dynamic-form">
-        <el-form class="form-wrapper" :model="modelValue" ref="formRef">
+    <el-form class="form-wrapper" :model="modelValue" ref="formRef">
-            <el-form-item v-for="(config, index) in formConfig" :key="index" :prop="config['prop']"
+      <template v-for="(config, configIndex) in configList" :key="configIndex">
-                :label="config['label']" :rules="config['rules']" label-position="right">
+        <DynamicFormItem :config="config" />
-
+      </template>
-                <template v-if="config.type == 'input'">
+    </el-form>
-                    <el-input :modelValue="modelValue[config.name]"
+  </div>
-                        @update:modelValue="(event) => changeValue(config, event)"
-                        :placeholder="config.componentProps?.placeholder" :clearable="true" />
-                </template>
-
-
-                <template v-if="config.type == 'inputNumber'">
-                    <el-input-number :modelValue="modelValue[config.name]"
-                        @update:modelValue="(event) => changeValue(config, event)"
-                        :placeholder="config.componentProps?.placeholder" :clearable="true" />
-                </template>
-
-
-                <template v-if="config.type == 'radio'">
-                    <el-radio-group :modelValue="modelValue[config.name]"
-                        @update:modelValue="(event) => changeValue(config, event)"
-                        :placeholder="config.componentProps?.placeholder">
-                        <el-radio v-for="(option, i) in config.options" :value="option.value">{{ option.label
-                            }}</el-radio>
-                    </el-radio-group>
-                </template>
-
-
-                <template v-if="config.type == 'select'">
-                    <el-select :modelValue="modelValue[config.name]"
-                        @update:modelValue="(event) => changeValue(config, event)"
-                        :placeholder="config.componentProps?.placeholder">
-                        <el-option v-for="(option, i) in config.options" :key="i" :label="option.label"
-                            :value="option.value"></el-option>
-                    </el-select>
-                </template>
-
-                <template v-if="config.type == 'date'">
-                    <el-date-picker :modelValue="modelValue[config.name]" type="date"
-                        @update:modelValue="(event) => changeValue(config, event)"
-                        :placeholder="config.componentProps?.placeholder" />
-                </template>
-            </el-form-item>
-        </el-form>
-    </div>
 </template>
 <script setup>
-import { onMounted, watch, ref } from 'vue';
+import { onMounted, watch, ref, provide } from 'vue'
+import DynamicFormItem from './DynamicFormItem.vue'
 const props = defineProps({
-    formConfig: {
+  configList: {
-        type: Array,
+    type: Array,
-        default: () => []
+    default: () => []
-    },
+  },
-    modelValue: {
+  modelValue: {
-        type: Object,
+    type: Object,
-        default: () => { }
+    default: () => {}
-    }
+  }
 })
-const emit = defineEmits(['update:modelValue'])
+
+const computedModelValue = computed(() => {
+  return props.modelValue
+})
+
+provide('formData', computedModelValue)
+
 const formRef = ref(null)
-const changeValue = (config, value) => {
-    const form = { ...props.modelValue }
-    form[config.name] = value
-    emit('update:modelValue', form)
-}
 
 // 获得默认表单值
 const getDefaultFormValue = () => {
-    const form = {}
+  const form = {}
-    props.formConfig.forEach(config => {
+  props.formConfig.forEach((config) => {
-        form[config.name] = config.default !== undefined ? config.default : ''
+    form[config.name] = config.default !== undefined ? config.default : ''
-    })
+  })
-    return form
+  return form
 }
 
-
 defineExpose({
-    getDefaultFormValue,
+  getDefaultFormValue,
-    formComponent: formRef.value,
+  formComponent: formRef.value
 })
-
 </script>
 <style scoped lang="scss">
 .form-wrapper {
-    display: grid;
+  display: grid;
-    grid-template-columns: 1fr;
+  grid-template-columns: 1fr;
-    gap: 16px;
+  gap: 16px;
 }
-</style>
+</style>

packages/screen/src/component/DynamicForm/DynamicFormItem.vue

@@ -0,0 +1,37 @@
+<template>
+  <template v-if="!config.slot && checkLayout(config)">
+    <DynamicLayout :config="config">
+      <DynamicFormItem v-for="(item, index) in config.children" :key="index" :config="item" />
+    </DynamicLayout>
+  </template>
+  <template v-if="!config.slot && !checkLayout(config)">
+    <el-col :span="config.span">
+      <el-form-item :label="config.label" :prop="config.prop">
+        <DynamicControl style="width: 100%" :config="config" />
+      </el-form-item>
+     </el-col>
+  </template>
+  <template v-if="config.slot">
+    <slot />
+  </template>
+</template>
+<script setup>
+import { onMounted, ref } from 'vue';
+import DynamicLayout from './DynamicLayout.vue';
+import DynamicControl from './DynamicControl.vue';
+
+const layoutTypes = ['card', 'block', 'row']
+const checkLayout = (config) => {
+  return layoutTypes.includes(config?.type)
+};
+
+const props = defineProps({
+  config: {
+    type: Object,
+    default: () => ({})
+  }
+})
+
+</script>
+<style scoped lang="scss">
+</style>

packages/screen/src/component/DynamicForm/DynamicLayout.vue

@@ -0,0 +1,39 @@
+<template>
+  <template v-if="config.type == 'card'">
+    <el-card>
+      <template #header>
+        <div class="section-header">
+          <span class="section-title">{{ config.label }}</span>
+        </div>
+      </template>
+      <slot />
+    </el-card>
+  </template>
+  <template v-else-if="config.type == 'block'">
+    <BlockItem :title="config.label">
+      <slot />
+    </BlockItem>
+  </template>
+  <template v-else-if="config.type == 'row'">
+    <el-row v-bind="config.componentProps">
+      <slot />
+    </el-row>
+  </template>
+  <template v-else-if="config.type == 'col'">
+    <el-col v-bind="config.componentProps">
+      <slot />
+    </el-col>
+  </template>
+</template>
+<script setup>
+import { onMounted, ref } from 'vue'
+import BlockItem from './BlockItem.vue';
+
+const props = defineProps({
+  config: {
+    type: Object,
+    default: () => ({})
+  },
+})
+</script>
+<style scoped lang="scss"></style>

packages/screen/src/component/MenuBar/index.js

@@ -45,7 +45,8 @@ export default () => {
             await getMenuList();
             const firstMenuItem = menuList.value[0]?.children?.[0];
             if (firstMenuItem) {
-                handleMenuClick(firstMenuItem);
+                // 注释掉进入页面点击第一项的逻辑 后续记得打开
+                // handleMenuClick(firstMenuItem);
             }
         }
     }, { immediate: true });

packages/screen/src/router/index.js

@@ -258,6 +258,7 @@ const routes = [
     component: () => import('../views/DisasterManagement/IceDisasterReport/IceDisasterReportPC.vue'),
     meta: {
       title: '冰雪灾害上报',
+      parentRoute: 'disasterManagement',
       breadcrumb: true
     }
   },
@@ -266,6 +267,7 @@ const routes = [
     component: () => import('../views/DisasterManagement/IceDisasterDetail/IceDisasterDetailPC.vue'),
     meta: {
       title: '冰雪灾害详情',
+      parentRoute: 'disasterManagement',
       breadcrumb: true
     }
   },
@@ -274,6 +276,7 @@ const routes = [
     component: () => import('../views/DisasterManagement/WaterDisasterReport/WaterDisasterReportPC.vue'),
     meta: {
       title: '水毁灾害上报',
+      parentRoute: 'disasterManagement',
       breadcrumb: true
     }
   },
@@ -283,6 +286,7 @@ const routes = [
     component: () => import('../views/DisasterManagement/WaterDisasterDetail/WaterDisasterDetailPC.vue'),
     meta: {
       title: '水毁事件详情',
+      parentRoute: 'disasterManagement',
       breadcrumb: true
     }
   }

packages/screen/src/views/DisasterManagement/DisasterManagementPC.vue

@@ -323,7 +323,7 @@ const handleDetail = (row) => {
     router.push({ path: '/waterDisasterDetail', query: { id: row.id } })
   }
   if (row.disasterType == 'ICE_SNOW') {
-    router.push({ path: '/iceDisasterDetail', query: { id: row.id } })
+    router.push({ path: '/iceDisasterDetail', query: { id: row.relationId } })
   }
 }
 
@@ -333,7 +333,7 @@ const handleEdit = (row) => {
     router.push({ path: '/waterDisasterDetail', query: { id: row.id, mode: 'edit' } })
   }
   if (row.disasterType == 'ICE_SNOW') {
-    router.push({ path: '/iceDisasterDetail', query: { id: row.id, mode: 'edit' } })
+    router.push({ path: '/iceDisasterDetail', query: { id: row.relationId, mode: 'edit' } })
   }
 }
 

packages/screen/src/views/DisasterManagement/IceDisasterDetail/IceDisasterDetailPC.vue

@@ -1,238 +1,13 @@
 <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">
-        <!-- 基本信息卡片 -->
+        <DynamicDetail v-model="detailData" :config-list="detailConfig" />
-        <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">{{ getBaseDisposalMeasures() }}</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-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?.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.occurLocation || '-' }}</span>
-              </div>
-            </el-col>
-            <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?.endStakeNo || '-' }}</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-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?.district || '-' }}</span>
-              </div>
-            </el-col>
-            <el-col :span="8">
-              <div class="info-item">
-                <span class="info-label">发生时间：</span>
-                <span class="info-value">{{ detailData.occurTime || '-' }}</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?.needsRecovery ? '是' : '否' }}</span>
-              </div>
-            </el-col>
-            <el-col :span="16" v-if="detailData.event?.needsRecovery">
-              <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-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.reportTime || '-' }}</span>
-              </div>
-              <div class="content-wrapper">
-                <div class="basic-info-wrapper">
-                  <div class="info-list">
-                    <div class="info-item">
-                      <span class="info-label">现场描述：</span>
-                      <span class="info-value">{{ report.siteDescription || '-' }}</span>
-                    </div>
-                    <div class="info-item">
-                      <span class="info-label">处置措施：</span>
-                      <span class="info-value">{{ report.disposalMeasures || '-' }}</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.expectRecoverTime || '-' }}</span>
-                    </div>
-
-                    <div class="info-item">
-                      <span class="info-label">填报人：</span>
-                      <span class="info-value">{{ report.reporterName ? report.reporterName : '-' }}</span>
-                    </div>
-
-                    <div class="info-item">
-                      <span class="info-label">联系电话：</span>
-                      <span class="info-value">{{ report.phone ? report.phone : '-' }}</span>
-                    </div>
-                  </div>
-                  <div class="file-list">
-                    <FileUpload v-model="report.fileList" :readonly="!isEdit" />
-                  </div>
-                </div>
-
-                <div class="detal-info-wrapper">
-                  <template v-if="report.showDetail">
-                    <LossListDetail :modelValue="report.lossList" :col-span="8" />
-                    <el-row :gutter="24">
-                      <el-col :span="8">
-                        <div class="info-item margin">
-                          <span class="info-label">投入机械：</span>
-                          <span class="info-value">{{ report.investedMachinery ? report.investedMachinery + '台/班' : '-'}}</span>
-                        </div>
-                      </el-col>
-                      <el-col :span="8">
-                        <div class="info-item margin">
-                          <span class="info-label">投入人力：</span>
-                          <span class="info-value">{{ report.investedManpower ? report.investedManpower + '人次' : '-'}}</span>
-                        </div>
-                      </el-col>
-                      <el-col :span="8">
-                        <div class="info-item margin">
-                          <span class="info-label">投入资金：</span>
-                          <span class="info-value">{{ report.investedFunds ? report.investedFunds + '万元' : '-'}}</span>
-                        </div>
-                      </el-col>
-                    </el-row>
-                  </template>
-
-                  <el-button style="margin-top: 30px" type="primary" link @click="report.showDetail = !report.showDetail">
-                    {{ report.showDetail ? '点击关闭详情' : '点击查看详情' }}
-                  </el-button>
-                </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">
+      <!-- <div class="right-panel" v-if="isEdit">
         <ContinueReport ref="continueReport" @refresh="getDisasterDetail" />
-      </div>
+      </div> -->
     </div>
   </div>
 </template>
@@ -245,6 +20,8 @@ import { ArrowLeft, Picture, VideoCamera } from '@element-plus/icons-vue'
 import ContinueReport from './IceDisasterContinueReportPC.vue'
 import { request } from '@shared/utils/request'
 import FileUpload from '@/component/FileUpload/FileUpload.vue'
+import detailConfig from './detailConfig'
+import DynamicDetail from '@/component/DynamicDetail/DynamicDetail.vue'
 
 const router = useRouter()
 const route = useRoute()
@@ -291,57 +68,6 @@ const hasReportData = computed(() => {
   return allReports.value.length > 0
 })
 
-// 获取事件状态文本
-const getEventStatusText = () => {
-  return eventStatus.value === 1 ? '已解除' : '未解除'
-}
-
-// 获取事件状态类型
-const getEventStatusType = () => {
-  return eventStatus.value === 1 ? 'success' : 'danger'
-}
-
-const getBaseDisposalMeasures = () => {
-  const firstItem = allReports.value[0]
-  if (!firstItem) return '-'
-  return formatDisposalMeasures(firstItem.disposalMeasures || '') || '-'
-}
-
-// 格式化处置措施
-const formatDisposalMeasures = (measures) => {
-  if (!measures) return ''
-  const measureMap = {
-    半幅封闭: '半幅封闭',
-    全副封闭: '全副封闭',
-    便道通行: '便道通行',
-    正常通行: '正常通行'
-  }
-  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 () => {
@@ -353,9 +79,8 @@ const getDisasterDetail = async () => {
 
   try {
     const result = await request({
-      url: `/snow-ops-platform/water-damage/getById`,
+      url: `/snow-ops-platform/event/getById?id=${route.query.id}`,
       method: 'get',
-      params: { id }
     })
 
     if (result?.data) {
@@ -601,6 +326,5 @@ onMounted(() => {
   overflow: hidden;
 }
 .file-list {
-  
 }
 </style>

packages/screen/src/views/DisasterManagement/IceDisasterDetail/detailConfig.js

@@ -0,0 +1,111 @@
+export default [
+  {
+    type: 'card',
+    label: '基础信息',
+    children: [
+      {
+        type: 'row',
+        children: [
+          {
+            span: 8,
+            label: '事件类型',
+            value: '冰雪事件',
+          },
+          {
+            span: 8,
+            label: '路况类别',
+            prop: 'event.routeNo'
+          },
+          {
+            span: 8,
+            label: '处理措施',
+            prop: 'event.disposalMeasures'
+          }
+        ]
+      },
+      {
+        type: 'row',
+        children: [
+          {
+            span: 8,
+            label: '地点路线',
+            prop: 'event.occurLocation'
+          },
+          {
+            span: 8,
+            label: '起点桩号',
+            prop: 'event.startStakeNo'
+          },
+          {
+            span: 8,
+            label: '止点桩号',
+            prop: 'event.endStakeNo'
+          }
+        ]
+      },
+      {
+        type: 'row',
+        children: [
+          {
+            span: 8,
+            label: '路况位置',
+            prop: 'event.occurLocation'
+          },
+          {
+            span: 8,
+            label: '阻断点小地名',
+            prop: 'event.occurLocation'
+          },
+          {
+            span: 8,
+            label: '地点路线',
+            prop: 'event.occurLocation'
+          }
+        ]
+      },
+      {
+        type: 'row',
+        children: [
+          {
+            span: 24,
+            label: '受灾里程',
+            prop: 'event.disasterMileage'
+          }
+        ]
+      },
+      {
+        type: 'row',
+        children: [
+          {
+            span: 8,
+            label: '所属区县',
+            prop: 'event.district'
+          },
+          {
+            span: 8,
+            label: '发现时间',
+            prop: 'event.occurTime'
+          }
+        ]
+      },
+      {
+        type: 'row',
+        children: [
+          {
+            span: 8,
+            label: '是否需要恢复重建',
+            prop: 'event.actualRecoverTime'
+          },
+          {
+            show: (formData) => {
+              return formData.event?.actualRecoverTime
+            },
+            span: 8,
+            label: '恢复重建预估费用（万元）',
+            prop: 'event.estimatedRecoveryCost'
+          }
+        ]
+      }
+    ]
+  }
+]

packages/screen/src/views/DisasterManagement/IceDisasterReport/IceDisasterReportPC.vue

@@ -1,11 +1,5 @@
 <template>
   <div class="disaster-form-page">
-    <el-page-header style="margin-bottom: 10px;" @back="router.go(-1)" class="page-header">
-      <template #content>
-        <span class="title">{{ '冰雪灾害填报' }}</span>
-      </template>
-    </el-page-header>
-
     <el-form ref="formRef" :model="formData" :rules="formRules" label-width="140px" class="disaster-form" @submit.prevent>
       <!-- 基本信息区块 -->
       <el-card class="form-section" shadow="never">

packages/screen/src/views/DisasterManagement/WaterDisasterDetail/WaterDisasterContinueReportPC.vue

@@ -149,7 +149,7 @@ const props = defineProps({
 })
 
 // Emits 定义
-const emit = defineEmits(['input', 'change', 'submit'])
+const emit = defineEmits(['input', 'change'])
 
 // 表单数据
 const formData = reactive({
@@ -293,14 +293,6 @@ const calibrateTime = () => {
 
 // 表单验证
 const validate = () => {
-  if (!formData.occurTime) {
-    ElMessage.warning('请填写发生时间')
-    return false
-  }
-  if (!formData.routeNo) {
-    ElMessage.warning('请填写线路编号')
-    return false
-  }
   return true
 }
 
@@ -354,13 +346,6 @@ const resetForm = () => {
   disposalMeasureValue.value = ''
 }
 
-// 提交方法
-const submit = () => {
-  if (validate()) {
-    emit('submit', getFormData())
-  }
-}
-
 const handleSubmit = async () => {
   // 验证表单
   if (!validate()) {

packages/screen/src/views/DisasterManagement/WaterDisasterDetail/WaterDisasterDetailPC.vue

@@ -1,17 +1,5 @@
 <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">
@@ -293,16 +281,6 @@ const hasReportData = computed(() => {
   return allReports.value.length > 0
 })
 
-// 获取事件状态文本
-const getEventStatusText = () => {
-  return eventStatus.value === 1 ? '已解除' : '未解除'
-}
-
-// 获取事件状态类型
-const getEventStatusType = () => {
-  return eventStatus.value === 1 ? 'success' : 'danger'
-}
-
 const getBaseDisposalMeasures = () => {
   const firstItem = allReports.value[0]
   if (!firstItem) return '-'

packages/screen/src/views/DisasterManagement/WaterDisasterReport/WaterDisasterReportPC.vue

@@ -1,11 +1,5 @@
 <template>
   <div class="disaster-form-page">
-    <el-page-header style="margin-bottom: 10px;" @back="router.go(-1)" class="page-header">
-      <template #content>
-        <span class="title">{{ '水毁灾害填报' }}</span>
-      </template>
-    </el-page-header>
-    
     <el-form ref="formRef" :model="formData" :rules="formRules" label-width="140px" class="disaster-form" @submit.prevent>
       <!-- 基本信息区块 -->
       <el-card class="form-section" shadow="never">

packages/screen/src/views/WarningManagement/law/dutyManagement/addDialog.vue

@@ -2,91 +2,46 @@
   <div class="detail-container">
     <el-form ref="formRef" :model="form" label-position="right" label-width="auto"
       style="max-height: 60vh; overflow-y: auto; padding-right: 50px" :rules="rules">
-      <div class="form-part">
+
-        <el-row>
+      <el-form-item label="" prop="schedules">
-          <h4 style="margin: 0 0 20px 0;">气象信息</h4>
+        <div class="tree-transfer-container">
-        </el-row>
+          <!-- 左侧树形结构 -->
-        <el-row>
+          <div class="tree-panel">
-          <el-col :span="12">
+            <el-tree :data="treeOrgs" :props="{
-            <el-form-item label="预警标题" prop="预警标题">
+              children: 'children',
-              <el-input v-model="form.headline" />
+              label: 'orgName'
-            </el-form-item>
+            }" node-key="orgId" :expand-on-click-node="false" :default-expand-all="false" highlight-current
-          </el-col>
+              style="height: 400px; overflow-y: auto;"
-        </el-row>
+              @node-click="handleNodeClick">
-        <el-row>
+              <template #default="{ node, data }">
-          <el-col :span="24">
+                <span class="custom-tree-node">
-            <el-form-item label="预警时间" prop="预警时间">
+                  <span>{{ node.label }}</span>
-              <el-col :span="11">
+                </span>
-                <el-date-picker v-model="form.onset" type="date" placeholder="开始时间" style="width: 100%" />
+              </template>
-              </el-col>
+            </el-tree>
-              <el-col :span="2" class="text-center">
+          </div>
-                <span class="text-gray-500">-</span>
+          
-              </el-col>
+          <!-- 中间空白区域 -->
-              <el-col :span="11">
+          <div class="middle-panel">
-                <el-date-picker v-model="form.expires" type="date" placeholder="过期时间" style="width: 100%" />
+            <!-- 暂留空，后续使用 -->
-              </el-col>
+          </div>
-            </el-form-item>
+          
-          </el-col>
+          <!-- 右侧空白区域 -->
-        </el-row>
+          <div class="right-panel">
-        <el-row :gutter="20">
+            <!-- 暂留空，后续使用 -->
-          <el-col :span="12">
+          </div>
-            <el-form-item label="气象类型" prop="气象类型">
+        </div>
-              <el-select v-model="form.eventType" clearable placeholder="请选择">
+      </el-form-item>
-                <el-option v-for="(item, index) in [
-                  { label: '道路结冰', value: '道路结冰' },
-                  { label: '暴雪', value: '暴雪' },
-                  { label: '暴雨', value: '暴雨' },
-                ]" :key="index" :label="item.label" :value="item.value" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="气象来源" prop="气象来源">
-              <el-select v-model="form.weatherSource" clearable placeholder="请选择">
-                <el-option v-for="(item, index) in [
-                  { label: '市级', value: '1' },
-                  { label: '部级', value: '2' },
-                  { label: '区县', value: '3' },
-                ]" :key="index" :label="item.label" :value="item.value" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="预警等级" prop="预警等级">
-              <el-select v-model="form.urgency" clearable placeholder="请选择">
-                <el-option v-for="(item, index) in [
-                  { label: '1级（红色预警）', value: '1' },
-                  { label: '2级（橙色预警）', value: '2' },
-                  { label: '3级（黄色预警）', value: '3' },
-                  { label: '4级（蓝色预警）', value: '4' },
-                ]" :key="index" :label="item.label" :value="item.value" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="风险区县" prop="风险区县">
-              <el-select v-model="form.areaCodes" clearable placeholder="请选择" multiple>
-                <el-option v-for="(item, index) in areaList" :key="index" :label="item.qxmc" :value="item.xzdm" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </div>
 
     </el-form>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted, watch, computed } from "vue";
+import { ref, computed, onMounted } from "vue";
 import { request } from "@/utils/request";
-import FileUpload from '@/component/FileUpload/FileUpload.vue'
+import { ElMessage } from 'element-plus';
+
 const formRef = ref(null);
 defineExpose({ formRef });
 
@@ -97,47 +52,144 @@ const props = defineProps({
   },
 });
 
-const areaList = ref([])
 
-// 获取区县列表
+
-const getAreaList = async () => {
+const rules = computed(() => {
+  return {
+
+  };
+});
+
+// 用户组织列表
+const userOrgs = ref([]);
+// 树形结构数据
+const treeOrgs = ref([]);
+
+// 查询用户组织
+const getUserOrgs = async () => {
   try {
     const res = await request({
-      url: '/snow-ops-platform/infrastructure-asset/counties',
+      url: '/snow-ops-platform/user/userOrgs',
-      method: 'get',
+      method: 'GET',
     })
     if (res.code === '00000') {
-      areaList.value = res.data
+      userOrgs.value = res.data.data
+      // 构造树形结构
+      treeOrgs.value = buildOrgTree(userOrgs.value)
     } else {
       throw new Error(res.message)
     }
   } catch (error) {
-    ElMessage.error(error.message)
+    ElMessage.error('获取组织失败');
-    console.log(error)
+    console.error('获取组织失败:', error);
+  }
+}
+
+/**
+ * 构建组织树形结构
+ * @param {Array} orgList 组织列表
+ * @returns {Array} 树形结构数据
+ */
+const buildOrgTree = (orgList) => {
+  if (!orgList || !orgList.length) return [];
+
+  // 创建映射表，便于查找
+  const orgMap = {};
+  orgList.forEach(org => {
+    orgMap[org.orgId] = {
+      ...org,
+      children: []
+    };
+  });
+
+  const tree = [];
+
+  orgList.forEach(org => {
+    const currentOrg = orgMap[org.orgId];
+
+    // 根节点判断：orgParentId为-1或orgPids为"[-1],"
+    if (org.orgParentId === -1 || org.orgPids === "[-1],") {
+      tree.push(currentOrg);
+    } else {
+      // 找到父节点
+      // 从orgPids中提取父级orgId（这里简化处理，实际可能需要更复杂的解析）
+      let parentId = null;
+
+      // 方法1：尝试从orgPids中解析父级ID
+      if (org.orgPids) {
+        const pidMatches = org.orgPids.match(/\d+/g);
+        if (pidMatches && pidMatches.length > 0) {
+          // 取最后一个ID作为直接父级（排除-1）
+          const parentIds = pidMatches.filter(id => id !== '-1');
+          if (parentIds.length > 0) {
+            parentId = parseInt(parentIds[parentIds.length - 1]);
+          }
+        }
+      }
+
+      // 方法2：如果无法从orgPids解析，使用orgParentId
+      if (parentId === null && org.orgParentId && org.orgParentId !== -1) {
+        parentId = org.orgParentId;
+      }
+
+      // 添加到父节点的children中
+      if (parentId && orgMap[parentId]) {
+        orgMap[parentId].children.push(currentOrg);
+      } else {
+        // 如果没有找到父节点，也作为根节点
+        tree.push(currentOrg);
+      }
+    }
+  });
+
+  // 按orgSort排序
+  const sortTree = (tree) => {
+    tree.sort((a, b) => (a.orgSort || 0) - (b.orgSort || 0));
+    tree.forEach(node => {
+      if (node.children && node.children.length) {
+        sortTree(node.children);
+      }
+    });
+    return tree;
+  };
+
+  return sortTree(tree);
+}
+
+// 树节点点击事件
+const handleNodeClick = (data, node) => {
+  // 判断是否为叶子节点（没有子节点）
+  if (!node.childNodes || node.childNodes.length === 0) {
+    // 叶子节点，调用获取用户列表方法
+    getUsersByOrgId(data.orgId);
+  }
+}
+
+// 根据组织ID查询用户列表
+const getUsersByOrgId = async (orgId) => {
+  try {
+    const res = await request({
+      url: '/snow-ops-platform/user/orgUsers',
+      method: 'GET',
+      params: {
+        orgId
+      }
+    })
+    if (res.code === '00000') {
+      console.log('@@@@@@用户列表',res.data);
+    } else {
+      throw new Error(res.message)
+    }
+  } catch (error) {
+    ElMessage.error('获取用户失败');
+    console.error('获取用户失败:', error);
   }
 }
 
 onMounted(() => {
-  getAreaList()
+  getUserOrgs();
 })
 
-const rules = computed(() => {
-  return {
-    // mc: [
-    //   {
-    //     required: true,
-    //     validator: (rule, value, callback) => {
-    //       if (props.form.mc) {
-    //         callback();
-    //       } else {
-    //         callback(new Error("请输入服务站名称"));
-    //       }
-    //     },
-    //     trigger: "blur",
-    //   },
-    // ],
-  };
-});
 </script>
 
 <style scoped>
@@ -148,4 +200,46 @@ const rules = computed(() => {
 .text-center {
   text-align: center;
 }
+
+.tree-transfer-container {
+  display: flex;
+  gap: 20px;
+  width: 100%;
+}
+
+.tree-panel {
+  flex: 1;
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  padding: 10px;
+  background-color: #fff;
+}
+
+.empty-panel {
+
+}
+
+.middle-panel {
+  flex: 2;
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  padding: 10px;
+  background-color: #fff;
+}
+
+.right-panel {
+  flex: 2;
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  padding: 10px;
+  background-color: #fff;
+}
+
+.custom-tree-node {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+  padding-right: 8px;
+}
 </style>

packages/screen/src/views/WarningManagement/law/dutyManagement/index.js

@@ -102,7 +102,7 @@ const getTableData = async (filterData = {}) => {
 
 // 打开发布预警弹窗
 const openAddDialog = () => {
-    model.title = '发布预警';
+    model.title = '立即排班';
     Object.assign(form, INIT_FORM);
     model.props = {
         form: form,
@@ -113,14 +113,14 @@ const openAddDialog = () => {
     };
     model.onConfirm = async () => {
         await dialogRef?.value?.dynamicComponentRef?.formRef.validate().then(async () => {
-            console.log('@@@@@发布预警', form);
+            console.log('@@@@@立即排班', form);
             // await publishWarning(form)
         })
             .catch((err) => {
                 ElMessage.error('请处理表单中的错误项');
             });
     };
-    model.width = "50%"
+    model.width = "70%"
     modelVisible.value = true;
 }
 

packages/screen/src/views/WarningManagement/law/dutyManagement/index.vue

@@ -7,7 +7,7 @@
                 value-format="YYYY-MM-DD HH:mm:ss" />
         </div>
         <div class="event-box">
-            <el-button type="primary" @click="">立即排班</el-button>
+            <el-button type="primary" @click="script.openAddDialog">立即排班</el-button>
             <!-- <el-button type="primary" @click="script.gotoLedgerPage">驻地台账</el-button> -->
             <!-- <el-button type="primary" @click="script.openAddDialog">上报项目</el-button> -->
         </div>