配合后端修改灾害处置

src/styles/custom-component.scss

@@ -4,6 +4,10 @@
   max-width: 1000px;
 }
 
+.custom-tooltip--opacity0 {
+  opacity: 0;
+}
+
 .customDialog--pushObject {
   max-height: 60vh;
   border-radius: 8px !important;

src/types/disaster-control/index.ts

@@ -241,6 +241,7 @@ export interface ReportTaskListDetail {
   reportDeptName: string;
   reportTaskId: number;
   lossRecordList: LossRecordListDetail[]; // 损失记录列表
+  reportTime: string; //上报时间
 }
 
 export interface OverviewLossRecordInfo {

src/views/disaster/disaster-control/PageDisposalManagement.vue

@@ -54,9 +54,12 @@
               >
                 <template #view-operation>
                   <el-tooltip
-                    :content="isViewTask(item.tableData[0].disasterReportTaskInfoList) ? '查看' : '任务尚未发布'"
+                    :content="isViewTask(item.tableData[0].disasterReportTaskInfoList) ? '' : '任务尚未发布'"
                     placement="top"
                     effect="light"
+                    :popper-class="
+                      isViewTask(item.tableData[0].disasterReportTaskInfoList) ? 'custom-tooltip--opacity0' : ''
+                    "
                   >
                     <img
                       :src="ViewDocument"

src/views/disaster/disaster-control/PageDisposalManagementItem.vue

@@ -82,15 +82,8 @@
     }
   };
   const exportLossDetail = async () => {
-    const { id: lossRecordId, name: lossRecordName } = dynamicComponentRef.value?.getLossRecordListInfo();
-    await exportLossRecord(
-      {
-        handleTaskId: id,
-        reportRecordId: lossRecordId,
-      },
-      lossRecordName,
-    );
-    ElMessage.success(`导出${lossRecordName}损失明细成功`);
+    await exportLossRecord({ handleTaskId: id }, taskName);
+    ElMessage.success(`导出${taskName}损失明细成功`);
   };
 </script>
 

src/views/disaster/disaster-control/PageDisposalRectification.vue

@@ -39,9 +39,14 @@
               >
                 <template #view-operation>
                   <el-tooltip
-                    :content="item.tableData[0].disasterReportRecordDetailList.length ? '查看' : '任务无损失'"
+                    :content="item.tableData[0].disasterReportRecordDetailList.length ? '' : '任务无损失'"
                     placement="top"
                     effect="light"
+                    :popper-class="
+                      item.tableData[0].disasterReportRecordDetailList.length
+                        ? 'custom-tooltip--opacity0'
+                        : ''
+                    "
                   >
                     <img
                       :src="ViewDocument"

src/views/disaster/disaster-control/PageLossReportItem.vue

@@ -50,26 +50,12 @@
     }
   });
   const exportLossDetail = async () => {
-    let name;
     const params = {
       handleTaskId: reportTaskId,
       reporterId,
     };
-    if (viewType === 'task') {
-      name = taskName;
-      await exportLossRecord(params, name);
-    } else {
-      const { id, name: lossRecordName } = dynamicComponentRef.value?.getLossRecordListInfo();
-      name = lossRecordName;
-      await exportLossRecord(
-        {
-          ...params,
-          reportRecordId: id,
-        },
-        name,
-      );
-    }
-    ElMessage.success(`导出${name}损失明细成功`);
+    await exportLossRecord(params, taskName);
+    ElMessage.success(`导出${taskName}损失明细成功`);
   };
   const dynamicComponent = computed(() => {
     if (operate === 'create') {

src/views/disaster/disaster-control/src/components/LossRecord.vue

@@ -36,9 +36,12 @@
           >
             <template #view-operation>
               <el-tooltip
-                :content="item.tableData[0].disasterReportRecordDetailList.length ? '查看' : '任务无损失'"
+                :content="item.tableData[0].disasterReportRecordDetailList.length ? '' : '任务无损失'"
                 placement="top"
                 effect="light"
+                :popper-class="
+                  item.tableData[0].disasterReportRecordDetailList.length ? 'custom-tooltip--opacity0' : ''
+                "
               >
                 <img
                   :src="ViewDocument"

src/views/disaster/disaster-control/src/components/NoCollapseItem.vue

@@ -0,0 +1,39 @@
+<template>
+  <div class="collapse-item">
+    <div class="collapse-item__header">
+      <div class="collapse-item__header--left">
+        <span style="font-weight: 550">{{ name }}</span>
+        <slot name="view-operation" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+
+  defineProps<{
+    name: string;
+  }>();
+</script>
+
+<style lang="scss" scoped>
+  .collapse-item {
+    width: 100%;
+    background: #f2f8ff;
+    padding: 10px;
+    border-radius: 4px;
+    margin-bottom: 8px;
+    &__header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 10px 14px;
+      font-size: 20px;
+      color: rgba($text-color, 0.85);
+      &--left {
+        @include flex-center;
+        gap: 20px;
+      }
+    }
+  }
+</style>

src/views/disaster/disaster-control/src/components/ViewDisposalControlItem.vue

@@ -1,45 +1,54 @@
 <template>
   <div class="info-container">
-    <CollapseItem
-      v-for="reportTask in disasterLossDetailList?.reportTaskList"
-      :key="reportTask.reportDeptId"
-      :name="`上报单位：${reportTask.reportDeptName}`"
-      :isActive="activeId === reportTask.reportDeptId"
-      @toggle="handleCollapseToggle(reportTask.reportDeptId)"
-    >
-      <template #view-operation>
-        <div class="rectification-info">
-          <span class="num">{{ reportTask.lossRecordCount }}</span>
-          <span>条，整改完成{{ reportTask.fixFinishCount }}条</span>
-        </div>
-      </template>
-      <template #right-header>
-        <span class="collapse-item__header--right">
-          {{ activeId === reportTask.reportDeptId ? '收起' : '展开' }}
-        </span>
-      </template>
-      <template #main-table>
-        <div class="rectification-table">
-          <section class="damaged-list-container">
-            <DamagedList
-              :damagedList="reportTask.lossRecordList"
-              :active-id="activeTaskId || reportTask.lossRecordList[0].fixTaskId"
-              @update:activeId="handleActiveTask"
-            />
-          </section>
-          <section class="disaster-info-container">
-            <DisasterInfo :LossReportItemFormData="lossRecordListInfo" rectification v-if="lossRecordListInfo" />
-            <Rectification
-              v-if="lossRecordListInfo?.fixRecordList"
-              :rectification-list="lossRecordListInfo?.fixRecordList"
-              :rectification-dept-name="lossRecordListInfo?.responsibleDeptName"
-              :rectification-responsible-user-list="rectificationResponsibleUserList"
-              :rectification-priority="lossRecordListInfo?.priority"
-            />
-          </section>
-        </div>
-      </template>
-    </CollapseItem>
+    <template v-for="reportTask in disasterLossDetailList?.reportTaskList" :key="reportTask.reportDeptId">
+      <CollapseItem
+        v-if="reportTask.lossRecordList.length"
+        :name="`上报单位：${reportTask.reportDeptName}`"
+        :isActive="activeId === reportTask.reportDeptId"
+        @toggle="handleCollapseToggle(reportTask.reportDeptId)"
+      >
+        <template #view-operation>
+          <div class="rectification-info">
+            <span class="num">{{ reportTask.lossRecordCount }}</span>
+            <span>条，整改完成{{ reportTask.fixFinishCount }}条</span>
+          </div>
+        </template>
+        <template #right-header>
+          <span class="collapse-item__header--right">
+            {{ activeId === reportTask.reportDeptId ? '收起' : '展开' }}
+          </span>
+        </template>
+        <template #main-table>
+          <div class="rectification-table">
+            <section class="damaged-list-container">
+              <DamagedList
+                :damagedList="reportTask.lossRecordList"
+                :active-id="activeTaskId || reportTask.lossRecordList[0].fixTaskId"
+                @update:activeId="handleActiveTask"
+              />
+            </section>
+            <section class="disaster-info-container">
+              <DisasterInfo :LossReportItemFormData="lossRecordListInfo" rectification v-if="lossRecordListInfo" />
+              <Rectification
+                v-if="lossRecordListInfo?.fixRecordList"
+                :rectification-list="lossRecordListInfo?.fixRecordList"
+                :rectification-dept-name="lossRecordListInfo?.responsibleDeptName"
+                :rectification-responsible-user-list="rectificationResponsibleUserList"
+                :rectification-priority="lossRecordListInfo?.priority"
+              />
+            </section>
+          </div>
+        </template>
+      </CollapseItem>
+      <NoCollapseItem v-else :name="`上报单位：${reportTask.reportDeptName}`">
+        <template #view-operation>
+          <div class="rectification-info">
+            <span class="num">{{ reportTask.lossRecordCount }}</span>
+            <span class="info-text">条，上报时间：{{ reportTask.reportTime }}</span>
+          </div>
+        </template>
+      </NoCollapseItem>
+    </template>
   </div>
 </template>
 
@@ -47,12 +56,13 @@
   import { useRoute } from 'vue-router';
   import { onMounted, ref } from 'vue';
   import CollapseItem from './CollapseItem.vue';
+  import NoCollapseItem from './NoCollapseItem.vue';
   import DamagedList from './DamagedList.vue';
   import DisasterInfo from './DisasterInfo.vue';
   import Rectification from './Rectification.vue';
   import { useDisasterControlHook } from '../hook';
   import type { PersonGroupItem } from '@/types/person-group/type';
-  import type { ReportTaskListDetail, LossRecordListDetail, OverviewLossRecordInfo } from '@/types/disaster-control';
+  import type { ReportTaskListDetail, LossRecordListDetail } from '@/types/disaster-control';
   import { queryUserInfoByIds } from '@/api/system/person-group';
 
   const route = useRoute();
@@ -113,13 +123,6 @@
       });
     }
   };
-  const getLossRecordListInfo = () => {
-    if (!lossRecordListInfo.value) return;
-    return {
-      id: lossRecordListInfo.value.id,
-      name: lossRecordListInfo.value.affectedItems,
-    };
-  };
   onMounted(async () => {
     await getDisasterLossDetailList({ handleTaskId });
     if (!disasterLossDetailList.value?.reportTaskList.length) return;
@@ -128,14 +131,12 @@
     reportTaskListInfo.value = reportTaskList.value.find((item) => item.reportDeptId === activeId.value);
     if (!reportTaskListInfo.value) return;
     lossRecordList.value = reportTaskListInfo.value?.lossRecordList;
+    if (!lossRecordList.value.length) return;
     activeTaskId.value = lossRecordList.value[0].fixTaskId;
     lossRecordListInfo.value = lossRecordList.value.find((item) => item.fixTaskId === activeTaskId.value);
     getFixUserList(lossRecordListInfo.value?.fixPrincipals);
     getFixRecordUser();
   });
-  defineExpose({
-    getLossRecordListInfo,
-  });
 </script>
 
 <style lang="scss" scoped>

src/views/disaster/disaster-control/src/components/ViewDisposalControlTaskItem.vue

@@ -1,45 +1,54 @@
 <template>
   <div class="info-container">
-    <CollapseItem
-      v-for="reportTask in disasterLossDetailList?.reportTaskList"
-      :key="reportTask.reportDeptId"
-      :name="`上报单位：${reportTask.reportDeptName}`"
-      :isActive="activeId === reportTask.reportDeptId"
-      @toggle="handleCollapseToggle(reportTask.reportDeptId)"
-    >
-      <template #view-operation>
-        <div class="rectification-info">
-          <span class="num">{{ reportTask.lossRecordCount }}</span>
-          <span>条，整改完成{{ reportTask.fixFinishCount }}条</span>
-        </div>
-      </template>
-      <template #right-header>
-        <span class="collapse-item__header--right">
-          {{ activeId === reportTask.reportDeptId ? '收起' : '展开' }}
-        </span>
-      </template>
-      <template #main-table>
-        <div class="rectification-table">
-          <section class="damaged-list-container">
-            <DamagedList
-              :damagedList="reportTask.lossRecordList"
-              :active-id="activeTaskId || reportTask.lossRecordList[0].fixTaskId"
-              @update:activeId="handleActiveTask"
-            />
-          </section>
-          <section class="disaster-info-container">
-            <DisasterInfo :LossReportItemFormData="lossRecordListInfo" rectification v-if="lossRecordListInfo" />
-            <Rectification
-              v-if="lossRecordListInfo?.fixRecordList"
-              :rectification-list="lossRecordListInfo?.fixRecordList"
-              :rectification-dept-name="lossRecordListInfo?.responsibleDeptName"
-              :rectification-responsible-user-list="rectificationResponsibleUserList"
-              :rectification-priority="lossRecordListInfo?.priority"
-            />
-          </section>
-        </div>
-      </template>
-    </CollapseItem>
+    <template v-for="reportTask in disasterLossDetailList?.reportTaskList" :key="reportTask.reportDeptId">
+      <CollapseItem
+        v-if="reportTask.lossRecordList.length"
+        :name="`上报单位：${reportTask.reportDeptName}`"
+        :isActive="activeId === reportTask.reportDeptId"
+        @toggle="handleCollapseToggle(reportTask.reportDeptId)"
+      >
+        <template #view-operation>
+          <div class="rectification-info">
+            <span class="num">{{ reportTask.lossRecordCount }}</span>
+            <span class="info-text">条，整改完成{{ reportTask.fixFinishCount }}条</span>
+          </div>
+        </template>
+        <template #right-header>
+          <span class="collapse-item__header--right">
+            {{ activeId === reportTask.reportDeptId ? '收起' : '展开' }}
+          </span>
+        </template>
+        <template #main-table>
+          <div class="rectification-table">
+            <section class="damaged-list-container">
+              <DamagedList
+                :damagedList="reportTask.lossRecordList"
+                :active-id="activeTaskId || reportTask.lossRecordList[0].fixTaskId"
+                @update:activeId="handleActiveTask"
+              />
+            </section>
+            <section class="disaster-info-container">
+              <DisasterInfo :LossReportItemFormData="lossRecordListInfo" rectification v-if="lossRecordListInfo" />
+              <Rectification
+                v-if="lossRecordListInfo?.fixRecordList"
+                :rectification-list="lossRecordListInfo?.fixRecordList"
+                :rectification-dept-name="lossRecordListInfo?.responsibleDeptName"
+                :rectification-responsible-user-list="rectificationResponsibleUserList"
+                :rectification-priority="lossRecordListInfo?.priority"
+              />
+            </section>
+          </div>
+        </template>
+      </CollapseItem>
+      <NoCollapseItem v-else :name="`上报单位：${reportTask.reportDeptName}`">
+        <template #view-operation>
+          <div class="rectification-info">
+            <span class="num">{{ reportTask.lossRecordCount }}</span>
+            <span class="info-text">条，上报时间：{{ reportTask.reportTime }}</span>
+          </div>
+        </template>
+      </NoCollapseItem>
+    </template>
   </div>
 </template>
 
@@ -47,6 +56,7 @@
   import { useRoute } from 'vue-router';
   import { onMounted, ref } from 'vue';
   import CollapseItem from './CollapseItem.vue';
+  import NoCollapseItem from './NoCollapseItem.vue';
   import DamagedList from './DamagedList.vue';
   import DisasterInfo from './DisasterInfo.vue';
   import Rectification from './Rectification.vue';
@@ -136,6 +146,7 @@
     reportTaskListInfo.value = reportTaskList.value.find((item) => item.reportDeptId === activeId.value);
     if (!reportTaskListInfo.value) return;
     lossRecordList.value = reportTaskListInfo.value?.lossRecordList;
+    if (!lossRecordList.value.length) return;
     activeTaskId.value = lossRecordList.value[0].fixTaskId;
     lossRecordListInfo.value = lossRecordList.value.find((item) => item.fixTaskId === activeTaskId.value);
     getFixUserList(lossRecordListInfo.value?.fixPrincipals);

src/views/disaster/disaster-control/src/components/ViewLossReportItem.vue

@@ -1,45 +1,54 @@
 <template>
   <div class="info-container">
-    <CollapseItem
-      v-for="reportTask in disasterLossDetailList?.reportTaskList"
-      :key="reportTask.reportDeptId"
-      :name="`上报单位：${reportTask.reportDeptName}`"
-      :isActive="activeId === reportTask.reportDeptId"
-      @toggle="handleCollapseToggle(reportTask.reportDeptId)"
-    >
-      <template #view-operation>
-        <div class="rectification-info">
-          <span class="num">{{ reportTask.lossRecordCount }}</span>
-          <span>条，整改完成{{ reportTask.fixFinishCount }}条</span>
-        </div>
-      </template>
-      <template #right-header>
-        <span class="collapse-item__header--right">
-          {{ activeId === reportTask.reportDeptId ? '收起' : '展开' }}
-        </span>
-      </template>
-      <template #main-table>
-        <div class="rectification-table">
-          <section class="damaged-list-container">
-            <DamagedList
-              :damagedList="reportTask.lossRecordList"
-              :active-id="activeTaskId"
-              @update:activeId="handleActiveTask"
-            />
-          </section>
-          <section class="disaster-info-container">
-            <DisasterInfo :LossReportItemFormData="lossRecordListInfo" rectification v-if="lossRecordListInfo" />
-            <Rectification
-              v-if="lossRecordListInfo?.fixRecordList"
-              :rectification-list="lossRecordListInfo?.fixRecordList"
-              :rectification-dept-name="lossRecordListInfo?.responsibleDeptName"
-              :rectification-responsible-user-list="rectificationResponsibleUserList"
-              :rectification-priority="lossRecordListInfo?.priority"
-            />
-          </section>
-        </div>
-      </template>
-    </CollapseItem>
+    <template v-for="reportTask in disasterLossDetailList?.reportTaskList" :key="reportTask.reportDeptId">
+      <CollapseItem
+        v-if="reportTask.lossRecordList.length"
+        :name="`上报单位：${reportTask.reportDeptName}`"
+        :isActive="activeId === reportTask.reportDeptId"
+        @toggle="handleCollapseToggle(reportTask.reportDeptId)"
+      >
+        <template #view-operation>
+          <div class="rectification-info">
+            <span class="num">{{ reportTask.lossRecordCount }}</span>
+            <span class="info-text">条，整改完成{{ reportTask.fixFinishCount }}条</span>
+          </div>
+        </template>
+        <template #right-header>
+          <span class="collapse-item__header--right">
+            {{ activeId === reportTask.reportDeptId ? '收起' : '展开' }}
+          </span>
+        </template>
+        <template #main-table>
+          <div class="rectification-table">
+            <section class="damaged-list-container">
+              <DamagedList
+                :damagedList="reportTask.lossRecordList"
+                :active-id="activeTaskId"
+                @update:activeId="handleActiveTask"
+              />
+            </section>
+            <section class="disaster-info-container">
+              <DisasterInfo :LossReportItemFormData="lossRecordListInfo" rectification v-if="lossRecordListInfo" />
+              <Rectification
+                v-if="lossRecordListInfo?.fixRecordList"
+                :rectification-list="lossRecordListInfo?.fixRecordList"
+                :rectification-dept-name="lossRecordListInfo?.responsibleDeptName"
+                :rectification-responsible-user-list="rectificationResponsibleUserList"
+                :rectification-priority="lossRecordListInfo?.priority"
+              />
+            </section>
+          </div>
+        </template>
+      </CollapseItem>
+      <NoCollapseItem v-else :name="`上报单位：${reportTask.reportDeptName}`">
+        <template #view-operation>
+          <div class="rectification-info">
+            <span class="num">{{ reportTask.lossRecordCount }}</span>
+            <span class="info-text">条，上报时间：{{ reportTask.reportTime }}</span>
+          </div>
+        </template>
+      </NoCollapseItem>
+    </template>
   </div>
 </template>
 
@@ -47,6 +56,7 @@
   import { useRoute } from 'vue-router';
   import { onMounted, ref } from 'vue';
   import CollapseItem from './CollapseItem.vue';
+  import NoCollapseItem from './NoCollapseItem.vue';
   import DamagedList from './DamagedList.vue';
   import DisasterInfo from './DisasterInfo.vue';
   import Rectification from './Rectification.vue';
@@ -108,13 +118,6 @@
       });
     }
   };
-  const getLossRecordListInfo = () => {
-    if (!lossRecordListInfo.value) return;
-    return {
-      id: lossRecordListInfo.value.id,
-      name: lossRecordListInfo.value.affectedItems,
-    };
-  };
   onMounted(async () => {
     await getDisasterLossDetailList({ handleTaskId, reporterId });
     if (!disasterLossDetailList.value?.reportTaskList.length) return;
@@ -123,6 +126,7 @@
     reportTaskListInfo.value = reportTaskList.value.find((item) => item.reportDeptId === activeId.value);
     if (!reportTaskListInfo.value) return;
     lossRecordList.value = reportTaskListInfo.value?.lossRecordList;
+    if (!lossRecordList.value.length) return;
     if (isNaN(activeTaskId.value)) {
       activeTaskId.value = lossRecordList.value[0].fixTaskId;
     }
@@ -130,9 +134,6 @@
     getFixUserList(lossRecordListInfo.value?.fixPrincipals);
     getFixRecordUser();
   });
-  defineExpose({
-    getLossRecordListInfo,
-  });
 </script>
 
 <style lang="scss" scoped>

src/views/disaster/disaster-control/src/style/common.scss

@@ -20,6 +20,9 @@
   .num {
     color: $primary-color;
   }
+  .info-text{
+    color: #666;
+  }
 }
 .collapse-item__header--right {
   font-size: 16px;