refactor：重构灾害预警

src/styles/custom-component.scss

@@ -77,3 +77,10 @@ $message-box-content-padding--icon: 36px;
     background-image: url('@/assets/images/message-box/error@1X.png');
   }
 }
+
+.custom-el-button {
+  --el-border-color: #1890ff;
+  --el-text-color-regular: #1890ff;
+  --el-color-primary: #fff;
+  --el-color-primary-light-9: #1890ff;
+}

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

@@ -70,19 +70,19 @@
                 </template>
                 <template #batchOperation v-if="disposalManagementPermissions">
                   <el-button
-                    type="primary"
+                    class="custom-el-button"
                     v-if="isBatchRelease(item.tableData[0].disasterReportTaskInfoList)"
                     @click.stop="handleBatchRelease(item.id)"
                     >发布
                   </el-button>
                   <el-button
-                    type="primary"
+                    class="custom-el-button"
                     v-if="isBatchWithdraw(item.tableData[0].disasterReportTaskInfoList)"
                     @click.stop="handleBatchWithdraw(item.id)"
                     >撤回
                   </el-button>
                   <el-button
-                    type="primary"
+                    class="custom-el-button"
                     v-if="isBatchDelete(item.tableData[0].disasterReportTaskInfoList)"
                     @click.stop="handleBatchDelete(item.id)"
                     >删除

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

@@ -302,7 +302,4 @@
     flex-direction: column !important;
     gap: 30px !important;
   }
-  :deep(.el-date-editor) {
-    --el-date-editor-width: 100%;
-  }
 </style>

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

@@ -84,17 +84,15 @@
   } from '../config';
   import type { LossReportItemFormData } from '@/types/disaster-control';
   import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
-  import { getAllUserGroup } from '@/api/system/person-group';
-  import type { UserGroupOption } from '@/types/person-group/type';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
-  import type { DeptTreeItem } from '@/types/dept/type';
-  import { getAllDepartments } from '@/api/auth/dept';
-  import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
   import { useDisasterControlHook } from '../hook';
+  import { useUserInfoHook, useDeptInfoHook, useGroupInfoHook } from '@/views/disaster/hooks';
 
+  const { realname } = useUserInfoHook();
+  const { groupOptions, getUserGroupList } = useGroupInfoHook();
+  const { getFirstLevelDepts, firstLevelDepts } = useDeptInfoHook();
   const { safetyLevelDice, priorityDice, getSafetyLevelDict, getPriorityDict } = useDisasterControlHook();
 
-  // 处理损失评估金额输入，只允许输入数字和小数点，且小数点后最多10位
+  // // 处理损失评估金额输入，只允许输入数字和小数点，且小数点后最多10位
   const handleEstimatedLossInput = (value: string) => {
     // 允许数字开头、小数点结尾、小数点后最多10位数字的情况
     const regex = /^(\d+\.?|\.\d{1,10}|\d+\.\d{0,10})$/;
@@ -132,7 +130,7 @@
     }
   };
 
-  // 处理失去焦点时，如果是小数点结尾则删除小数点
+  // // 处理失去焦点时，如果是小数点结尾则删除小数点
   const handleEstimatedLossChange = () => {
     // 检查当前值是否为字符串且以小数点结尾
     if (ruleFormData.estimatedLoss !== null) {
@@ -146,25 +144,14 @@
 
   const route = useRoute();
   const taskName = String(route.query.taskName);
-  const groupOptions = ref<UserGroupOption[]>([]);
   const { ruleFormConfig, ruleFormData, formRules, cloneRuleFormData, beforeRouteLeave } =
     useFormConfigHook<LossReportItemFormData>(
       LOSS_REPORT_ITEM_FORM_CONFIG_LOSS,
       LOSS_REPORT_ITEM_FORM_DATA,
       LOSS_REPORT_ITEM_FROM_RULES,
     );
-  const { realname } = useUserInfoHook();
-  const firstLevelDepts = ref<DeptTreeItem[]>([]);
   const basicFormRef = ref<InstanceType<typeof BasicForm>>();
   const uploadImagesRef = ref<InstanceType<typeof UploadImages>>();
-  const getUserGroupList = async () => {
-    const res = await getAllUserGroup();
-    groupOptions.value = res.groupVOList;
-  };
-  const getDeptList = async () => {
-    const res = await getAllDepartments();
-    firstLevelDepts.value = formatDeptTree(res);
-  };
   const validateForm = async () => {
     if (!basicFormRef.value) return;
     const validateResult = await basicFormRef.value.validateForm();
@@ -205,7 +192,7 @@
     initBasicFormData();
     getSafetyLevelDict();
     getPriorityDict();
-    getDeptList();
+    getFirstLevelDepts();
     getUserGroupList();
     cloneRuleFormData();
     beforeRouteLeave();

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

@@ -149,7 +149,6 @@
   import Search from '@/views/disaster/components/Search.vue';
   import BasicTable from '@/components/BasicTable.vue';
   import ActionButton from '@/components/ActionButton.vue';
-  import { getAllDepartments } from '@/api/auth/dept';
   import CollapseItem from './CollapseItem.vue';
   import { DEFAULT_PAGE_SIZE, DISASTER_CONTROL_PAGE_SIZE_CONFIG, FIX_STATUS } from '../constant';
   import type { DisposalManagementCollapseListResponse, LossRecordTableResponse } from '@/types/disaster-control';
@@ -161,16 +160,15 @@
   } from '../config';
   import Empty from 'assets/images/empty@1X.png';
   import useTableConfig from '@/hooks/useTableConfigHook';
-  import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
-  import type { DeptTreeItem } from '@/types/dept/type';
   import { getfixStatus } from '../util';
   import { useRouter } from 'vue-router';
   import { ElMessage } from 'element-plus';
   import { useDisasterControlHook } from '../hook';
+  import { useDeptInfoHook } from '@/views/disaster/hooks';
 
   const { getPriority, getPriorityDict } = useDisasterControlHook();
+  const { getFirstLevelDepts, firstLevelDepts } = useDeptInfoHook();
 
-  const firstLevelDepts = ref<DeptTreeItem[]>([]);
   const router = useRouter();
   const currentPage = ref(1);
   const pageSize = ref(DEFAULT_PAGE_SIZE);
@@ -299,8 +297,7 @@
   };
 
   onMounted(async () => {
-    const result = await getAllDepartments();
-    firstLevelDepts.value = formatDeptTree(result);
+    getFirstLevelDepts();
     getPriorityDict();
     await getDisposalData();
     await getDisposalTableData();

src/views/disaster/disaster-control/src/style/view-item.scss

@@ -7,7 +7,7 @@
   &__content--loss {
     display: flex;
     flex-direction: column;
-    gap: 8px;
+    gap: 12px;
     padding-left: 12px;
   }
   &__content--item {

src/views/disaster/disaster-control/src/util.ts

@@ -1,10 +1,12 @@
 import { TASK_STAGE_OPTIONS_DISPOSAL_MANAGEMENT, FIX_STATUS_OPTIONS } from './constant';
 
 // 获取任务阶段
-export const getTaskStage = (taskStage: number) => {
+const getTaskStage = (taskStage: number) => {
   return TASK_STAGE_OPTIONS_DISPOSAL_MANAGEMENT.find((item) => item.value === taskStage)?.label;
 };
 
-export const getfixStatus = (fixStatus: number) => {
+const getfixStatus = (fixStatus: number) => {
   return FIX_STATUS_OPTIONS.find((item) => item.value === fixStatus)?.label;
 };
+
+export { getTaskStage, getfixStatus };

src/views/disaster/disaster-precaution/PageTaskItem.vue

@@ -5,9 +5,7 @@
       <span class="disaster-precaution-container__title">{{ headerTitle }}</span>
     </header>
     <main class="disaster-precaution-container__main">
-      <section>
-        <component :is="dynamicComponent" :id="id" ref="dynamicComponentRef" />
-      </section>
+      <component :is="dynamicComponent" :id="id" ref="dynamicComponentRef" />
     </main>
     <footer class="disaster-precaution-container__footer" v-if="operate">
       <el-button @click="router.back()">取消</el-button>

src/views/disaster/disaster-precaution/PageTaskManagement.vue

@@ -85,7 +85,18 @@
                   v-if="taskManagementPermissions && scope.row.effectStatus === ACTIVE_STATUS.NOT_EFFECTIVE"
                   @click="handleEditTask(scope.row.id)"
                 />
-                <ActionButton text="查看" @click="handleViewTask(scope.row.id, scope.row.name, scope.row.deptName)" />
+                <ActionButton
+                  text="查看"
+                  @click="
+                    handleViewTask(
+                      scope.row.id,
+                      scope.row.name,
+                      scope.row.deptName,
+                      scope.row.taskState,
+                      scope.row.inspectType,
+                    )
+                  "
+                />
                 <ActionButton
                   text="发布"
                   :popconfirm="{
@@ -269,10 +280,10 @@
       query: { operate: 'edit', id },
     });
   };
-  const handleViewTask = (id: number, name: string, deptName: string) => {
+  const handleViewTask = (id: number, name: string, deptName: string, taskState: string, inspectType: string) => {
     router.push({
       name: defaultName,
-      query: { id, name, deptName },
+      query: { id, name, deptName, taskState, inspectType },
     });
   };
   const tableData = ref<TaskManagementListResponse[]>([]);
@@ -337,10 +348,4 @@
       cursor: pointer;
     }
   }
-  .custom-el-button {
-    --el-border-color: #1890ff;
-    --el-text-color-regular: #1890ff;
-    --el-color-primary: #fff;
-    --el-color-primary-light-9: #1890ff;
-  }
 </style>

src/views/disaster/disaster-precaution/src/components/CreateTaskItem.vue

@@ -44,18 +44,13 @@
   import { INSPECT_TYPE_OPTIONS } from '../constants/task-execution';
   import { TASK_TEMPLATE_LIST } from '../constants/template-detail';
   import { IS_PUSH } from '@/views/disaster/constant';
-  import type { UserGroupOption } from '@/types/person-group/type';
-  import { getAllUserGroup } from '@/api/system/person-group';
-  import { getAllDepartments } from '@/api/auth/dept';
-  import type { DeptTree } from '@/types/dept/type';
   import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
-  import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
+  import { useUserInfoHook, useDeptInfoHook, useGroupInfoHook } from '@/views/disaster/hooks';
 
   const { realname } = useUserInfoHook();
+  const { getFirstLevelDepts, firstLevelDepts } = useDeptInfoHook();
+  const { getUserGroupList, groupOptions } = useGroupInfoHook();
 
-  const groupOptions = ref<UserGroupOption[]>([]);
-  const firstLevelDepts = ref<DeptTree[]>([]);
   const basicFormRef = ref<InstanceType<typeof BasicForm>>();
 
   const handleTaskTypeChange = (taskType: number | null) => {
@@ -78,25 +73,17 @@
     cloneRuleFormData();
     return ruleFormData;
   };
-  const getDeptList = async () => {
-    const res = await getAllDepartments();
-    firstLevelDepts.value = formatDeptTree(res);
-  };
-  const getUserGroupList = async () => {
-    const res = await getAllUserGroup();
-    groupOptions.value = res.groupVOList;
-  };
   defineExpose({
     handleValidate,
     getFormData,
   });
 
-  onMounted(async () => {
+  onMounted(() => {
+    getFirstLevelDepts();
+    getUserGroupList();
     ruleFormData.realname = realname;
     cloneRuleFormData();
     beforeRouteLeave();
-    await getDeptList();
-    await getUserGroupList();
   });
 </script>
 

src/views/disaster/disaster-precaution/src/components/EditTaskItem.vue

@@ -33,15 +33,16 @@
   import { INSPECT_TYPE_OPTIONS } from '../constants/task-execution';
   import { TASK_TEMPLATE_LIST } from '../constants/template-detail';
   import { IS_PUSH } from '@/views/disaster/constant';
-  import type { UserGroupOption } from '@/types/person-group/type';
-  import { getAllUserGroup } from '@/api/system/person-group';
   import { viewTaskManagementDetail } from '@/api/disaster-precaution';
   import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
+  import { useGroupInfoHook } from '@/views/disaster/hooks';
+
   const props = defineProps<{
     id: number;
   }>();
 
-  const groupOptions = ref<UserGroupOption[]>([]);
+  const { getUserGroupList, groupOptions } = useGroupInfoHook();
+
   const basicFormRef = ref<InstanceType<typeof BasicForm>>();
 
   const getTaskManagementItemInfo = async () => {
@@ -76,20 +77,15 @@
     cloneRuleFormData();
     return ruleFormData;
   };
-  const getUserGroupList = async () => {
-    const res = await getAllUserGroup();
-    groupOptions.value = res.groupVOList;
-  };
   defineExpose({
     handleValidate,
     getFormData,
   });
 
-  onMounted(async () => {
-    cloneRuleFormData();
+  onMounted(() => {
+    getUserGroupList();
+    getTaskManagementItemInfo();
     beforeRouteLeave();
-    await getTaskManagementItemInfo();
-    await getUserGroupList();
   });
 </script>
 

src/views/disaster/disaster-precaution/src/components/ViewTaskItem.vue

@@ -1,11 +1,19 @@
 <template>
-  <div class="info-container">
-    <TemplateTableMerge
-      :operation-type="'view'"
-      :main-table="templateDetailList?.inspectTemplateDetailVOs || []"
-      :opinion-data="templateDetailList?.deptOpinion || opinionData"
-      :result-data="templateDetailList?.inspectResult || resultData"
-    />
+  <div class="disaster-precaution">
+    <p class="title">
+      任务名称：<span class="content">{{ taskName }}</span>
+    </p>
+    <p class="title">
+      被检查自查单位：<span class="content">{{ deptName }}</span>
+    </p>
+    <div class="info-container">
+      <TemplateTableMerge
+        :operation-type="operateType"
+        :main-table="templateDetail"
+        :opinion-data="opinionData"
+        :result-data="resultData"
+      />
+    </div>
   </div>
 </template>
 
@@ -13,20 +21,43 @@
   import { useRoute } from 'vue-router';
   import { ref, onMounted } from 'vue';
   import TemplateTableMerge from './TemplateTableMerge.vue';
-  import { getTaskExecutionDetail } from '@/api/disaster-precaution';
-  import type { TaskExecutionDetailResponse, TemplateDetailResponse, ContentItem } from '@/types/disaster-precaution';
+  import { TASK_STAGE } from '../constants/task-execution';
+  import { getTaskExecutionDetail, getTaskTemplateDetail } from '@/api/disaster-precaution';
+  import type { SpanTableData } from '@/views/disaster/disaster-precaution/src/type';
+  import type { TemplateDetailResponse, ContentItem } from '@/types/disaster-precaution';
 
   const route = useRoute();
   const id = Number(route.query.id);
+  const taskName = String(route.query.name);
+  const deptName = String(route.query.deptName);
+  const taskState = Number(route.query.taskState);
+  const operateType = ref<'view' | 'template'>('view');
+  const inspectType = Number(route.query.inspectType);
   const opinionData = ref<ContentItem>({} as ContentItem);
   const resultData = ref<ContentItem>({} as ContentItem);
 
-  const taskExecutionDetailList = ref<TaskExecutionDetailResponse>();
-  const templateDetailList = ref<TemplateDetailResponse>();
-  const getTaskExecutionDetailList = async () => {
+  const templateDetail = ref<SpanTableData[]>([]);
+  // 带审核和已完成调用后端查询任务执行详情接口
+  const getTaskExecutionDetailList_Task = async () => {
     const res = await getTaskExecutionDetail(id);
-    taskExecutionDetailList.value = res;
-    templateDetailList.value = JSON.parse(res.detail) as TemplateDetailResponse;
+    const templateDetailList = JSON.parse(res.detail) as TemplateDetailResponse;
+    templateDetail.value = templateDetailList.inspectTemplateDetailVOs;
+    opinionData.value = templateDetailList.deptOpinion || ({} as ContentItem);
+    resultData.value = templateDetailList.inspectResult || ({} as ContentItem);
+  };
+  // 其他状态调用后端模板接口
+  const getTaskExecutionDetailList_Template = async () => {
+    const res = await getTaskTemplateDetail(inspectType);
+    templateDetail.value = res;
+  };
+  const getTaskExecutionDetailList = async () => {
+    if (taskState === TASK_STAGE.COMPLETED || taskState === TASK_STAGE.PENDING_APPROVAL) {
+      operateType.value = 'view';
+      getTaskExecutionDetailList_Task();
+    } else {
+      operateType.value = 'template';
+      getTaskExecutionDetailList_Template();
+    }
   };
   onMounted(() => {
     getTaskExecutionDetailList();
@@ -34,5 +65,16 @@
 </script>
 
 <style scoped lang="scss">
+  @use '@/views/disaster/style/disaster.scss' as *;
   @use '@/views/disaster/style/info-container.scss' as *;
+  .title,
+  .content {
+    font-size: 14px;
+  }
+  .title {
+    color: rgba($text-color, 0.85);
+  }
+  .content {
+    color: rgba($text-color, 0.65);
+  }
 </style>

src/views/disaster/disaster-warning/PageDefenseNotice.vue

@@ -105,15 +105,19 @@
 </template>
 
 <script lang="ts" setup>
+  import { useRouter } from 'vue-router';
   import { ref, onMounted, reactive } from 'vue';
   import { Plus } from '@element-plus/icons-vue';
+  import { ElMessage } from 'element-plus';
   import Search from '@/views/disaster/components/Search.vue';
   import BasicTable from '@/components/BasicTable.vue';
   import ActionButton from '@/components/ActionButton.vue';
   import useTableConfig from '@/hooks/useTableConfigHook';
-  import { getDefenseNoticeList, deleteDefenseNoticeItem } from '@/api/disaster-warning';
+  import { useDisasterWarningHook } from './src/hook';
+  import { useUserInfoHook } from '@/views/disaster/hooks';
   import type { DefenseNoticeListResponse, DefenseNoticeListQuery } from '@/types/disaster-warning';
   import type { QueryPageRequest } from '@/types/disaster';
+  import { getDefenseNoticeList, deleteDefenseNoticeItem, publishDefenseNoticeItem } from '@/api/disaster-warning';
   import {
     ACTIVE_STATUS,
     ACTIVE_STATUS_COLOR,
@@ -129,11 +133,6 @@
     TABLE_HEIGHT_DEFAULT,
     TABLE_HEIGHT_PREMISSION,
   } from './src/config';
-  import { useRouter } from 'vue-router';
-  import { ElMessage } from 'element-plus';
-  import { publishDefenseNoticeItem } from '@/api/disaster-warning';
-  import { useDisasterWarningHook } from './src/hook';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
 
   const { permissions } = useUserInfoHook();
   const {

src/views/disaster/disaster-warning/PageDefenseNoticeItem.vue

@@ -16,15 +16,16 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, computed, defineAsyncComponent } from 'vue';
-  import UploadLoading from '@/components/UploadLoading.vue';
   import { useRoute, useRouter } from 'vue-router';
-  import BackIcon from 'assets/svg/back.svg';
+  import { ref, computed, defineAsyncComponent } from 'vue';
   import { ElMessage } from 'element-plus';
+  import UploadLoading from '@/components/UploadLoading.vue';
   import type { DefenseNoticeRuleForm } from './src/type';
-  import { uploadFileApi, UPLOAD_BIZ_TYPE } from '@/api/minio';
   import type { FileItem } from '@/views/disaster/types';
-  import { createDefenseNoticeItem, editDefenseNoticeItem } from '@/api/disaster-warning/index';
+  import { uploadFileApi, UPLOAD_BIZ_TYPE } from '@/api/minio';
+  import { createDefenseNoticeItem, editDefenseNoticeItem } from '@/api/disaster-warning';
+  import BackIcon from 'assets/svg/back.svg';
+
   const router = useRouter();
   const route = useRoute();
   const operate = route.query.operate;

src/views/disaster/disaster-warning/PageWarningInfo.vue

@@ -122,21 +122,25 @@
 </template>
 
 <script lang="ts" setup>
+  import { useRouter } from 'vue-router';
   import { ref, onMounted, reactive, nextTick } from 'vue';
   import { Plus } from '@element-plus/icons-vue';
+  import { ElMessage } from 'element-plus';
   import Search from '@/views/disaster/components/Search.vue';
   import BasicTable from '@/components/BasicTable.vue';
   import ActionButton from '@/components/ActionButton.vue';
   import useTableConfig from '@/hooks/useTableConfigHook';
-  import { getWarningInfoList } from '@/api/disaster-warning';
-  import type { WarningInfoListResponse } from '@/types/disaster-warning';
+  import { useDisasterWarningHook } from './src/hook';
+  import { useUserInfoHook } from '@/views/disaster/hooks';
+  import type { WarningInfoListResponse, WarningInfoListQuery } from '@/types/disaster-warning';
+  import type { QueryPageRequest } from '@/types/disaster';
+  import { getWarningInfoList, deleteWarningInfoItem, publishWarningInfoItem } from '@/api/disaster-warning';
   import {
     ACTIVE_STATUS,
     ACTIVE_STATUS_COLOR,
     ACTIVE_STATUS_MAP,
     DISASTER_PERMISSIONS,
   } from '@/views/disaster/constant';
-  import PlaceHolderWeather from './src/images/placeholder-weather@1X.png';
   import {
     WARNING_INFO_SEARCH_CONFIG_DEFAULT,
     WARNING_INFO_SEARCH_CONFIG_PERMISSION,
@@ -146,13 +150,7 @@
     TABLE_HEIGHT_DEFAULT,
     TABLE_HEIGHT_PREMISSION,
   } from './src/config';
-  import { useRouter } from 'vue-router';
-  import type { QueryPageRequest } from '@/types/disaster';
-  import type { WarningInfoListQuery } from '@/types/disaster-warning';
-  import { deleteWarningInfoItem, publishWarningInfoItem } from '@/api/disaster-warning';
-  import { ElMessage } from 'element-plus';
-  import { useDisasterWarningHook } from './src/hook';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
+  import PlaceHolderWeather from './src/images/placeholder-weather@1X.png';
 
   const { permissions } = useUserInfoHook();
   const { warningTypeDice, disasterLevelDice, getWarningInfoDict, getDisasterLevelDict, getDisasterLevel } =

src/views/disaster/disaster-warning/PageWarningInfoItem.vue

@@ -16,13 +16,13 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, computed, defineAsyncComponent } from 'vue';
   import { useRoute, useRouter } from 'vue-router';
-  import BackIcon from 'assets/svg/back.svg';
+  import { ref, computed, defineAsyncComponent } from 'vue';
   import { ElMessage } from 'element-plus';
-  import { WarningInfoRuleForm } from './src/type';
-  import { createWarningInfoItem, editWarningInfoItem } from '@/api/disaster-warning/index';
   import UploadLoading from '@/components/UploadLoading.vue';
+  import type { WarningInfoRuleForm } from './src/type';
+  import { createWarningInfoItem, editWarningInfoItem } from '@/api/disaster-warning';
+  import BackIcon from 'assets/svg/back.svg';
 
   const formLoading = ref(false);
   const router = useRouter();

src/views/disaster/disaster-warning/src/components/CreateDefenseNoticeItem.vue

@@ -41,17 +41,17 @@
 </template>
 
 <script setup lang="ts">
+  import { onMounted, ref } from 'vue';
   import BasicForm from '@/components/BasicForm.vue';
+  import SelectGroup from './SelectGroup.vue';
   import UploadFiles from '@/views/disaster/components/UploadFiles.vue';
   import { useFormConfigHook } from '@/hooks/useFormConfigHook';
+  import { useDisasterWarningHook } from '../hook';
+  import { useUserInfoHook } from '@/views/disaster/hooks';
+  import type { DefenseNoticeRuleForm } from '../type';
+  import type { FileItem } from '@/views/disaster/types';
   import { DEFENSE_NOTICE_FROM_CONFIG, DEFENSE_NOTICE_FROM_DATA, DEFENSE_NOTICE_FROM_RULES } from '../config';
   import { IS_PUSH } from '@/views/disaster/constant';
-  import { onMounted, ref } from 'vue';
-  import { DefenseNoticeRuleForm } from '../type';
-  import SelectGroup from './SelectGroup.vue';
-  import type { FileItem } from '@/views/disaster/types';
-  import { useDisasterWarningHook } from '../hook';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
 
   const { realname } = useUserInfoHook();
   const { disasterTypeDice, disasterLevelDice, getDisasterTypeDict, getDisasterLevelDict } = useDisasterWarningHook();

src/views/disaster/disaster-warning/src/components/CreateWarningInfoItem.vue

@@ -38,14 +38,14 @@
 </template>
 
 <script setup lang="ts">
-  import BasicForm from '@/components/BasicForm.vue';
-  import { useFormConfigHook } from '@/hooks/useFormConfigHook';
-  import { WARNING_INFO_FROM_CONFIG, WARNING_INFO_FROM_DATA, WARNING_INFO_FROM_RULES } from '../config';
   import { onMounted, ref } from 'vue';
-  import { WarningInfoRuleForm } from '../type';
+  import BasicForm from '@/components/BasicForm.vue';
   import SelectGroup from './SelectGroup.vue';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
+  import { useFormConfigHook } from '@/hooks/useFormConfigHook';
+  import { useUserInfoHook } from '@/views/disaster/hooks';
   import { useDisasterWarningHook } from '../hook';
+  import type { WarningInfoRuleForm } from '../type';
+  import { WARNING_INFO_FROM_CONFIG, WARNING_INFO_FROM_DATA, WARNING_INFO_FROM_RULES } from '../config';
   import { IS_PUSH } from '@/views/disaster/constant';
 
   const { realname } = useUserInfoHook();

src/views/disaster/disaster-warning/src/components/EditDefenseNoticeItem.vue

@@ -23,7 +23,12 @@
           </el-select>
         </template>
         <template #attachmentListRes>
-          <UploadFiles label="上传附件" ref="uploadFilesRef" :fileList="ruleFormData.attachmentListRes" @uploadSuccess="handleUploadSuccess" />
+          <UploadFiles
+            label="上传附件"
+            ref="uploadFilesRef"
+            :fileList="ruleFormData.attachmentListRes"
+            @uploadSuccess="handleUploadSuccess"
+          />
         </template>
         <template #isPush>
           <el-radio-group v-model="ruleFormData.isPush">
@@ -43,17 +48,17 @@
 </template>
 
 <script setup lang="ts">
+  import { onMounted, ref } from 'vue';
   import BasicForm from '@/components/BasicForm.vue';
   import UploadFiles from '@/views/disaster/components/UploadFiles.vue';
-  import { useFormConfigHook } from '@/hooks/useFormConfigHook';
-  import { DEFENSE_NOTICE_FROM_CONFIG, DEFENSE_NOTICE_FROM_DATA, DEFENSE_NOTICE_FROM_RULES } from '../config';
-  import { onMounted, ref } from 'vue';
-  import { DefenseNoticeRuleForm } from '../type';
   import SelectGroup from './SelectGroup.vue';
-  import type { FileItem } from '@/views/disaster/types';
-  import { IS_PUSH } from '@/views/disaster/constant';
+  import { useFormConfigHook } from '@/hooks/useFormConfigHook';
   import { useDisasterWarningHook } from '../hook';
+  import type { DefenseNoticeRuleForm } from '../type';
+  import type { FileItem } from '@/views/disaster/types';
   import { getDefenseNoticeDetail } from '@/api/disaster-warning';
+  import { DEFENSE_NOTICE_FROM_CONFIG, DEFENSE_NOTICE_FROM_DATA, DEFENSE_NOTICE_FROM_RULES } from '../config';
+  import { IS_PUSH } from '@/views/disaster/constant';
 
   const props = defineProps<{
     id: number;

src/views/disaster/disaster-warning/src/components/EditWarningInfoItem.vue

@@ -42,11 +42,11 @@
   import BasicForm from '@/components/BasicForm.vue';
   import SelectGroup from './SelectGroup.vue';
   import { useFormConfigHook } from '@/hooks/useFormConfigHook';
-  import { WARNING_INFO_FROM_CONFIG, WARNING_INFO_FROM_DATA, WARNING_INFO_FROM_RULES } from '../config';
-  import { WarningInfoRuleForm } from '../type';
   import { useDisasterWarningHook } from '../hook';
-  import { IS_PUSH } from '@/views/disaster/constant';
+  import type { WarningInfoRuleForm } from '../type';
   import { getWarningInfoDetail } from '@/api/disaster-warning';
+  import { WARNING_INFO_FROM_CONFIG, WARNING_INFO_FROM_DATA, WARNING_INFO_FROM_RULES } from '../config';
+  import { IS_PUSH } from '@/views/disaster/constant';
 
   const props = defineProps<{
     id: number;

src/views/disaster/disaster-warning/src/components/SelectGroup.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="select-group-container">
     <el-form :model="ruleForm" ref="ruleFormRef">
-      <el-form-item label="选择分组" prop="userGroupList" :rules="[{ required: true, message: '请选择分组' }]">
+      <el-form-item label="选择分组：" prop="userGroupList" :rules="[{ required: true, message: '请选择分组' }]">
         <GroupSelect
           v-model="ruleForm.userGroupList"
           :groupOptions="groupOptions"
@@ -14,10 +14,9 @@
 
 <script lang="ts" setup>
   import { ref, reactive, watch, onMounted } from 'vue';
-  import type { FormInstance } from 'element-plus';
-  import type { UserGroupOption } from '@/types/person-group/type';
-  import { getAllUserGroup } from '@/api/system/person-group';
   import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
+  import type { FormInstance } from 'element-plus';
+  import { useGroupInfoHook } from '@/views/disaster/hooks';
 
   const props = defineProps<{
     userGroupList: number[];
@@ -27,7 +26,8 @@
     userGroupList: number[];
   }
 
-  const groupOptions = ref<UserGroupOption[]>([]);
+  const { getUserGroupList, groupOptions } = useGroupInfoHook();
+
   const ruleFormRef = ref<FormInstance>();
   const ruleForm = reactive<RuleForm>({
     userGroupList: [],
@@ -49,9 +49,8 @@
     validateForm,
   });
 
-  onMounted(async () => {
-    const res = await getAllUserGroup();
-    groupOptions.value = res.groupVOList;
+  onMounted(() => {
+    getUserGroupList();
   });
 
   watch(

src/views/disaster/disaster-warning/src/components/ViewDefenseNoticeItem.vue

@@ -64,12 +64,12 @@
 
 <script setup lang="ts">
   import { ref, onMounted } from 'vue';
-  import { FILE_TYPE_ICON } from '@/views/disaster/constant';
-  import { getDefenseNoticeDetail } from '@/api/disaster-warning';
-  import type { DefenseNoticeDetailResponse } from '@/types/disaster-warning';
-  import { downloadFile } from '@/views/disaster/utils/download';
   import PreviewOnline from '@/views/disaster/components/PreviewOnline.vue';
   import { useDisasterWarningHook } from '../hook';
+  import { FILE_TYPE_ICON } from '@/views/disaster/constant';
+  import { downloadFile } from '@/views/disaster/utils';
+  import type { DefenseNoticeDetailResponse } from '@/types/disaster-warning';
+  import { getDefenseNoticeDetail } from '@/api/disaster-warning';
 
   const props = defineProps<{
     id: number;

src/views/disaster/hooks/deptInfo.ts

@@ -0,0 +1,18 @@
+/**
+ * 获取部门信息
+ */
+import { ref } from 'vue';
+import type { DeptTreeItem } from '@/types/dept/type';
+import { getAllDepartments } from '@/api/auth/dept';
+import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
+export const useDeptInfoHook = () => {
+  const firstLevelDepts = ref<DeptTreeItem[]>([]); // 第一部门的列表
+  const getFirstLevelDepts = async () => {
+    const res = await getAllDepartments();
+    firstLevelDepts.value = formatDeptTree(res);
+  };
+  return {
+    getFirstLevelDepts,
+    firstLevelDepts,
+  };
+};

src/views/disaster/hooks/groupInfo.ts

@@ -0,0 +1,17 @@
+/**
+ * 获取用户组信息
+ */
+import { ref } from 'vue';
+import type { UserGroupOption } from '@/types/person-group/type';
+import { getAllUserGroup } from '@/api/system/person-group';
+export const useGroupInfoHook = () => {
+  const groupOptions = ref<UserGroupOption[]>([]);
+  const getUserGroupList = async () => {
+    const res = await getAllUserGroup();
+    groupOptions.value = res.groupVOList;
+  };
+  return {
+    groupOptions,
+    getUserGroupList,
+  };
+};

src/views/disaster/hooks/index.ts

@@ -0,0 +1,4 @@
+import { useDeptInfoHook } from './deptInfo';
+import { useUserInfoHook } from './userInfo';
+import { useGroupInfoHook } from './groupInfo';
+export { useDeptInfoHook, useUserInfoHook, useGroupInfoHook };

src/views/disaster/utils/index.ts

@@ -0,0 +1,5 @@
+import { downloadFile } from './download';
+import { formatDeptTree } from './formatDeptTree';
+import { validateFormTime } from './validateTime';
+
+export { downloadFile, formatDeptTree, validateFormTime };