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

packages/screen/src/component/MyDialog/index.vue

@@ -10,7 +10,6 @@
       :is="dynamicComponent"
       ref="dynamicComponentRef"
       v-bind="componentProps"
-      @vue:mounted="handleComponentMount"
     />
     <slot></slot>
     <template #footer>

packages/screen/src/component/MyDrawer/index.vue

@@ -11,7 +11,6 @@
       :is="dynamicComponent"
       ref="dynamicComponentRef"
       v-bind="componentProps"
-      @vue:mounted="handleComponentMount"
     />
 
     <template #footer>

packages/screen/src/views/MaterialManagement/detailDialog.vue

@@ -3,7 +3,7 @@
     <el-card shadow="hover">
       <el-row :gutter="20">
         <el-col :span="12">
-          <el-descriptions title="基础信息" column="1">
+          <el-descriptions title="基础信息" :column="1">
             <el-descriptions-item label="物资名称: ">{{
               detailData.material?.wzmc
             }}</el-descriptions-item>
@@ -38,7 +38,7 @@
       </el-row>
     </el-card>
     <el-card shadow="hover">
-      <el-descriptions title="物资位置信息" column="3">
+      <el-descriptions title="物资位置信息" :column="3">
         <el-descriptions-item label="区县名称: ">{{
           detailData.material?.qxmc
         }}</el-descriptions-item>
@@ -51,7 +51,7 @@
       </el-descriptions>
     </el-card>
     <el-card shadow="hover">
-      <el-descriptions title="物资管理情况" column="3">
+      <el-descriptions title="物资管理情况" :column="3">
         <el-descriptions-item label="负责人: ">{{
           detailData.material?.fzr
         }}</el-descriptions-item>

packages/screen/src/views/SnowEventManagement/detailDialog.vue

@@ -1,52 +1,128 @@
 <template>
   <div class="detail-container">
-    <el-form
-      label-position="right"
-      label-width="150px"
-      style="max-height: 60vh; overflow-y: auto; padding-right: 50px"
-    >
-      <el-row :gutter="20">
-        <el-col :span="12">
-          <el-form-item label="物资名称:">
-            <el-input disabled v-model="detailData.wzmc" />
-          </el-form-item>
-          <el-form-item label="余量:">
-            <el-input disabled v-model="detailData.ye" />
-          </el-form-item>
-          <el-form-item label="入库日期:">
-            <el-input disabled v-model="detailData.rkrq" />
-          </el-form-item>
-          <el-form-item label="入库单位:">
-            <el-input disabled v-model="detailData.rkdw" />
-          </el-form-item>
-          <el-row :gutter="20">
-            <el-col :span="12">
-              <el-form-item label="数量:">
-                <el-input disabled v-model="detailData.sl"/>
-              </el-form-item>
-            </el-col>
-            <el-col :span="12">
-              <el-form-item label="单位:">
-                <el-input disabled v-model="detailData.dw" /> </el-form-item
-            ></el-col>
-          </el-row>
+    <el-card shadow="hover">
+      <el-descriptions title="基础信息" :column="3">
+        <el-descriptions-item label="发生时间: ">{{
+          detailData.event?.occurTime
+        }}</el-descriptions-item>
+        <el-descriptions-item label="发生地点: ">{{
+          detailData.event?.occurLocation
+        }}</el-descriptions-item>
+        <el-descriptions-item label="线路编号: ">{{
+          detailData.event?.routeNo
+        }}</el-descriptions-item>
+        <el-descriptions-item label="填报时间: ">{{
+          detailData.event?.reportTime
+        }}</el-descriptions-item>
+        <el-descriptions-item label="填报人: ">{{
+          detailData.event?.reporterName
+        }}</el-descriptions-item>
+        <el-descriptions-item label="所属区县: ">{{
+          detailData.event?.district
+        }}</el-descriptions-item>
+        <el-descriptions-item label="所属服务站: ">{{
+          detailData.event?.stationName
+        }}</el-descriptions-item>
+      </el-descriptions>
+      <el-row :gutter="20" class="custom-row">
+        <el-col :span="8">
+          <div class="stake-item">
+            <span class="label">起点桩号：</span>
+            <span class="value">{{ detailData.event?.startStakeNo }}</span>
+          </div>
         </el-col>
-        <el-col :span="12">
-          <el-form-item label="存放地点:">
-            <el-input disabled v-model="detailData.cfdd" />
-          </el-form-item>
-          <el-form-item label="负责人:">
-            <el-input disabled v-model="detailData.fzr" />
-          </el-form-item>
-          <el-form-item label="联系电话:">
-            <el-input disabled v-model="detailData.lxdh" />
-          </el-form-item>
-          <el-form-item label="区县名称:">
-            <el-input disabled v-model="detailData.qxmc" />
-          </el-form-item>
+
+        <el-col :span="8">
+          <div class="middle-column">
+            <div class="disaster-mileage">
+              受灾里程: {{ detailData.event?.disasterMileage }}
+            </div>
+            <div class="dash-line-container">
+              <span class="dash-line"></span>
+            </div>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="stake-item">
+            <span class="label">止点桩号：</span>
+            <span class="value">{{ detailData.event?.endStakeNo }}</span>
+          </div>
         </el-col>
       </el-row>
-    </el-form>
+    </el-card>
+    <el-card shadow="hover">
+      <el-descriptions title="处置情况" :column="3">
+        <el-descriptions-item label="处置措施: ">{{
+          detailData.event?.disposalMeasures
+        }}</el-descriptions-item>
+        <el-descriptions-item label="预计恢复时间: ">{{
+          detailData.event?.expectRecoverTime
+        }}</el-descriptions-item>
+      </el-descriptions>
+    </el-card>
+    <el-card shadow="hover">
+      <el-descriptions title="物资情况" :column="3">
+        <el-descriptions-item label="投入人力: ">{{
+          detailData.material?.inputManpower + "人次"
+        }}</el-descriptions-item>
+        <el-descriptions-item label="投入资金: ">{{
+          detailData.material?.inputFunds + "万元"
+        }}</el-descriptions-item>
+        <el-descriptions-item label="投入设备: ">{{
+          detailData.material?.inputEquipment + "台班"
+        }}</el-descriptions-item>
+        <el-descriptions-item
+          v-for="(item, index) in detailData.materialUsageList"
+          :key="index"
+          :label="item.materialName + ': '"
+          >{{ item.usageAmount + "" + item.materialUnit }}
+        </el-descriptions-item>
+      </el-descriptions>
+      <el-divider />
+      <el-descriptions title="通行情况" :column="3">
+        <el-descriptions-item label="当前通行情况: ">{{
+          {
+            1: "正常通行",
+            2: "限速通行",
+            3: "封闭交通",
+          }[detailData.traffic?.currentStatus] || "未知状态"
+        }}</el-descriptions-item>
+        <el-descriptions-item label="有无车辆滞留: ">{{
+          {
+            0: "无",
+            1: "有",
+          }[detailData.traffic?.hasStrandedVehicles] || "未知状态"
+        }}</el-descriptions-item>
+        <el-descriptions-item
+          v-if="detailData.traffic?.hasStrandedVehicles === 1"
+          label="滞留车辆数: "
+          >{{
+            detailData.traffic?.strandedVehicleCount + "辆"
+          }}</el-descriptions-item
+        >
+        <el-descriptions-item label="实际恢复时间: ">{{
+          detailData.traffic?.actualRecoverTime
+        }}</el-descriptions-item>
+      </el-descriptions>
+      <el-divider />
+      <el-descriptions title="现场情况" :column="3"> </el-descriptions>
+      <el-image
+        v-for="(item) in detailData.photos"
+        :key="item.id"
+        style="
+          width: 180px;
+          height: 180px;
+          margin: 10px;
+        "
+        :src="item.photoUrl"
+        :zoom-rate="1.2"
+        :max-scale="7"
+        :min-scale="0.2"
+        :preview-src-list="[item.photoUrl]"
+        show-progresss
+        fit="cover"
+      />
+    </el-card>
   </div>
 </template>
 
@@ -60,4 +136,56 @@ const props = defineProps({
 </script>
 
 <style>
+.detail-container {
+  display: flex;
+  flex-direction: column;
+  gap: 30px;
+}
+
+.stake-item {
+  display: flex;
+  align-items: flex-end;
+  justify-content: center;
+  gap: 8px;
+  height: 100%;
+  padding-bottom: 8px;
+}
+.label {
+  color: #606266;
+  white-space: nowrap;
+}
+.value {
+  color: #909399;
+}
+.custom-row {
+  margin-top: 30px;
+  text-align: center;
+}
+.middle-column {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  height: 100%;
+}
+.disaster-mileage {
+  margin-bottom: 2px;
+  color: #606266;
+}
+.dash-line-container {
+  width: 100%;
+  position: relative;
+  margin-top: 4px;
+}
+.dash-line {
+  display: block;
+  width: 100%;
+  height: 1px;
+  background: repeating-linear-gradient(
+    to right,
+    #909399 0px,
+    #909399 2px,
+    transparent 2px,
+    transparent 4px
+  );
+}
 </style>

packages/screen/src/views/SnowEventManagement/index.js

@@ -44,6 +44,19 @@ const model = reactive({
 const dialogType = ref(''); // 弹窗类型
 const dialogRef = ref(null); // 弹窗实例
 
+const drawerVisible = ref(false); // 抽屉显示状态
+const drawer = reactive({
+    title: '',
+    content: null,
+    props: {},
+    onCancel: null,
+    onConfirm: null,
+    direction: 'rtl',
+    size: '50%'
+}); // 抽屉内容
+const drawerType = ref(''); // 抽屉类型
+const drawerRef = ref(null); // 抽屉实例
+
 const INIT_FORM = {
     rkrq: "",
     rkdw: "",
@@ -86,7 +99,7 @@ const filterNode = (value, node) => {
 const getTreeData = async () => {
     try {
         const res = await request({
-            url: '/snow-ops-platform/yhz/listAreaGroup',
+            url: '/snow-ops-platform/yhz/listAreaGroup?dataType=ICE_SNOW_EVENT',
             method: 'GET'
         })
         if (res.code === '00000') {
@@ -223,24 +236,24 @@ const columns = [
                         type: "primary",
                         link: true,
                         onClick: async () => {
-                            dialogType.value = 'detail'
+                            drawerType.value = 'detail'
                             await getDetailData(row);
                         },
                     },
                     () => "详情"
                 ),
-                h(
-                    ElButton,
-                    {
-                        type: "primary",
-                        link: true,
-                        onClick: async () => {
-                            dialogType.value = 'edit'
-                            await getDetailData(row);
-                        },
-                    },
-                    () => "编辑"
-                ),
+                // h(
+                //     ElButton,
+                //     {
+                //         type: "primary",
+                //         link: true,
+                //         onClick: async () => {
+                //             dialogType.value = 'edit'
+                //             await getDetailData(row);
+                //         },
+                //     },
+                //     () => "编辑"
+                // ),
                 h(
                     ElButton,
                     {
@@ -248,16 +261,16 @@ const columns = [
                         link: true,
                         onClick: async () => {
                             try {
-                                await ElMessageBox.confirm("确定要删除该设备吗？", "删除确认", {
+                                await ElMessageBox.confirm("确定要删除该冰雪事件吗？", "删除确认", {
                                     confirmButtonText: "确定",
                                     cancelButtonText: "取消",
                                     type: "warning",
                                 });
                                 const res = await request({
-                                    url: `/snow-ops-platform/yjwz/delete`,
+                                    url: `/snow-ops-platform/event/delete`,
                                     method: 'POST',
                                     data: {
-                                        rid: row.rid,
+                                        id: row.id,
                                     }
                                 });
                                 if (res.code === '00000') {
@@ -313,21 +326,21 @@ const getDetailData = async (row) => {
             throw new Error('获取事件详情失败')
         }
         if (res.code === '00000') {
-            if (dialogType.value === 'detail') {
-                model.title = `事件详情`;
-                model.content = DetailDialog;
-                model.props = {
+            if (drawerType.value === 'detail') {
+                drawer.title = `事件详情`;
+                drawer.content = DetailDialog;
+                drawer.props = {
                     detailData: res.data,
                 };
-                model.onCancel = () => {
-                    dialogType.value = '';
-                    modelVisible.value = false;
+                drawer.onCancel = () => {
+                    drawerType.value = '';
+                    drawerVisible.value = false;
                 };
-                model.onConfirm = () => {
-                    dialogType.value = '';
-                    modelVisible.value = false;
+                drawer.onConfirm = () => {
+                    drawerType.value = '';
+                    drawerVisible.value = false;
                 };
-                modelVisible.value = true;
+                drawerVisible.value = true;
             }
             if (dialogType.value === 'edit') {
                 model.title = `编辑物资`;
@@ -433,5 +446,9 @@ export default () => {
         modelVisible,
         dialogRef,
         model,
+        drawerVisible,
+        drawer,
+        drawerRef,
+        yhzid,
     }
 }

packages/screen/src/views/SnowEventManagement/index.vue

@@ -65,6 +65,17 @@
         width="60%"
       >
       </MyDialog>
+      <MyDrawer
+        v-model="script.drawerVisible.value"
+        :title="script.drawer?.title"
+        :dynamicComponent="script.drawer?.content"
+        :component-props="script.drawer?.props"
+        :onConfirm="script.drawer?.onConfirm"
+        :onCancel="script.drawer?.onCancel"
+        ref="drawerRef"
+        :direction="script.drawer?.direction"
+        :size="script.drawer?.size"
+      ></MyDrawer>
     </div>
   </div>
 </template>
@@ -73,6 +84,7 @@
 import scriptFn from "./index.js";
 import DynamicTable from "../../component/DynamicTable";
 import MyDialog from "../../component/MyDialog";
+import MyDrawer from "../../component/MyDrawer";
 
 const script = scriptFn();
 const { treeRef, dialogRef } = script;