refactor：灾害处置

src/components/BasicTable.vue

@@ -40,10 +40,11 @@
 
 <script lang="ts" setup>
   import { ref } from 'vue';
+  import type { ElTable } from 'element-plus';
   import type { BasicTableProps } from '@/types/basic-table';
   import { PAGE_SIZE_CONFIG } from '@/constant/pagination';
   import EmptyImg from 'assets/images/empty@1X.png';
-  import type { ElTable } from 'element-plus';
+
   const selectedIds = ref<number[]>([]);
   const tableRef = ref<InstanceType<typeof ElTable>>();
 

src/components/Login.vue

@@ -53,11 +53,11 @@
 
 <script lang="ts" setup>
   import { ref, reactive } from 'vue';
-  import exitIcon from 'assets/svg/exit.svg';
-  import type { FormInstance } from 'element-plus';
   import { ElMessage } from 'element-plus';
-
+  import type { FormInstance } from 'element-plus';
+  import exitIcon from 'assets/svg/exit.svg';
   import { useUserStore } from '@/store/modules/user';
+  
   const userStore = useUserStore();
 
   const formValue = reactive({

src/components/LoginOld.vue

@@ -1,212 +0,0 @@
-<template>
-  <div class="login-container">
-    <div class="login-form">
-      <img :src="exitIcon" alt="关闭" class="exit-icon" @click="emit('close')" />
-      <header class="login-form__header">
-        <span>{{ type !== 'modifyPassword' ? '登录' : '修改密码' }}</span>
-      </header>
-      <main class="login-form__main">
-        <el-form ref="formRef" :model="login" label-width="auto" class="login-form__form">
-          <el-form-item
-            prop="username"
-            :rules="[{ required: true, message: '账号不能为空' }]"
-            v-if="type !== 'modifyPassword'"
-          >
-            <el-input
-              placeholder="请输入您的账号"
-              v-model="login.username"
-              type="text"
-              autocomplete="off"
-              clearable
-              class="el-input--default"
-            />
-          </el-form-item>
-          <el-form-item
-            prop="password"
-            :rules="[{ required: true, message: type === 'modifyPassword' ? '原密码不能为空' : '密码不能为空' }]"
-          >
-            <el-input
-              :placeholder="type !== 'modifyPassword' ? '请输入您的密码' : '请输入原密码'"
-              v-model="login.password"
-              type="password"
-              autocomplete="off"
-              show-password
-              clearable
-              class="el-input--default"
-            />
-          </el-form-item>
-          <el-form-item
-            prop="newPassword"
-            v-if="type === 'modifyPassword'"
-            :rules="[
-              { required: true, message: '新密码不能为空' },
-              { min: 6, message: '新密码至少6位' },
-            ]"
-          >
-            <el-input
-              placeholder="请输入新密码(至少6位)"
-              v-model="login.newPassword"
-              type="password"
-              autocomplete="off"
-              show-password
-              clearable
-              class="el-input--default"
-            />
-          </el-form-item>
-          <el-form-item
-            prop="confirmPassword"
-            v-if="type === 'modifyPassword'"
-            :rules="[
-              { required: true, message: '确认密码不能为空' },
-              { validator: validatePassword, trigger: 'blur' },
-            ]"
-          >
-            <el-input
-              placeholder="请确认密码"
-              v-model="login.confirmPassword"
-              type="password"
-              autocomplete="off"
-              show-password
-              clearable
-              class="el-input--default"
-            />
-          </el-form-item>
-          <el-form-item
-            prop="code"
-            :rules="[{ required: true, message: '验证码不能为空' }]"
-            v-if="type !== 'modifyPassword'"
-          >
-            <el-input placeholder="验证码" v-model="login.code" clearable class="el-input--default" />
-          </el-form-item>
-        </el-form>
-      </main>
-      <footer class="login-form__footer">
-        <el-button class="login-form__button" @click="handleLogin">
-          {{ type !== 'modifyPassword' ? '登录' : '修改密码' }}
-        </el-button>
-      </footer>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-  import { ref, reactive } from 'vue';
-  import exitIcon from 'assets/svg/exit.svg';
-  import type { FormInstance } from 'element-plus';
-  import { ElMessage } from 'element-plus';
-  import useMockUserStore from '@/store/modules/mockUser';
-  import { storeToRefs } from 'pinia';
-  const mockUserStore = useMockUserStore();
-  const { userInfo } = storeToRefs(mockUserStore);
-  const props = defineProps<{
-    type: 'login' | 'switchAccount' | 'modifyPassword';
-  }>();
-  const login = reactive({
-    username: '',
-    password: '',
-    code: '',
-    newPassword: '',
-    confirmPassword: '',
-  });
-  const emit = defineEmits(['close']);
-  const validatePassword = (rule: any, value: string, callback: any) => {
-    if (value !== login.newPassword) {
-      callback(new Error('两次输入密码不一致'));
-    } else {
-      callback();
-    }
-  };
-  const formRef = ref<FormInstance>();
-  const handleLogin = () => {
-    if (!formRef.value) return;
-    formRef.value.validate((valid: boolean) => {
-      if (valid) {
-        userInfo.value = login.username;
-        const message =
-          props.type === 'login' ? '登录成功' : props.type === 'switchAccount' ? '切换账号成功' : '修改密码成功';
-        ElMessage.success(message);
-        emit('close');
-      }
-    });
-  };
-</script>
-
-<style lang="scss" scoped>
-  .login-container {
-    @include flex-center;
-    position: fixed;
-    left: 0;
-    top: 0;
-    width: 100vw;
-    height: 100vh;
-    background-color: rgba(0, 0, 0, 0.42);
-    z-index: 1000;
-  }
-  .login-form {
-    position: relative;
-    width: 700px;
-    padding: 0 33px;
-    background: $white-color;
-    border-radius: 24px;
-    &__header {
-      width: 100%;
-      height: 100px;
-      font-size: 28px;
-      font-weight: 550;
-      color: #333;
-      text-align: center;
-      line-height: 100px;
-      letter-spacing: 5px;
-    }
-    &__main {
-      @include flex-center;
-      flex-direction: column;
-      gap: 20px;
-    }
-    &__code {
-      @include flex-center;
-      justify-content: space-between;
-      width: 100%;
-      height: 72px;
-      .el-input--default {
-        width: 50%;
-      }
-    }
-    &__footer {
-      width: 100%;
-      height: 100px;
-      margin-top: 18px;
-      .login-form__button {
-        width: 100%;
-        height: 74px;
-        font-size: 24px;
-        color: $white-color;
-        background-color: $primary-color;
-        border-radius: 8px;
-        cursor: pointer;
-      }
-    }
-    .exit-icon {
-      position: absolute;
-      top: 15px;
-      right: 16px;
-      width: 40px;
-      height: 40px;
-      cursor: pointer;
-    }
-  }
-  .login-form__form {
-    display: flex;
-    flex-direction: column;
-    gap: 2px;
-    width: 100%;
-  }
-  .el-input--default {
-    width: 100%;
-    height: 72px;
-    :deep(.el-input__inner) {
-      font-size: 20px;
-      color: #999;
-    }
-  }
-</style>

src/components/Nav.vue

@@ -35,17 +35,17 @@
 <script lang="ts" setup>
   import { ref, computed } from 'vue';
   import { useRouter, useRoute } from 'vue-router';
-  import { NAV_LIST } from '@/constant/nav';
-  import logo from 'assets/images/home/comac-logo@1X.png';
-  import searchIcon from 'assets/svg/search.svg';
-  import Login from '@/components/Login.vue';
+  import { ElMessage } from 'element-plus';
   import UpdatePwd from '@/components/UpdatePwd.vue';
   import UserInfo from '@/components/UserInfo.vue';
-  import { useGlobSetting } from '@/hooks/setting';
-  import { useUserStore } from '@/store/modules/user';
+  import Login from '@/components/Login.vue';
   import SwitchTenant from '@/layout/components/SwitchTenant.vue';
+  import { useUserStore } from '@/store/modules/user';
+  import { useGlobSetting } from '@/hooks/setting';
   import { SYS_TENANT_ID } from '@/utils/useTargetTenantIdSetting';
-  import { ElMessage } from 'element-plus';
+  import { NAV_LIST } from '@/constant/nav';
+  import logo from 'assets/images/home/comac-logo@1X.png';
+  import searchIcon from 'assets/svg/search.svg';
 
   const userStore = useUserStore();
   const activeNav = ref(NAV_LIST[0].name);

src/components/UpdatePwd.vue

@@ -61,8 +61,8 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, reactive, nextTick } from 'vue';
-  import { ElMessage, ElLoading } from 'element-plus';
+  import { ref, reactive } from 'vue';
+  import { ElMessage } from 'element-plus';
   import type { FormInstance } from 'element-plus';
   import exitIcon from 'assets/svg/exit.svg';
   import { useUserStore } from '@/store/modules/user';

src/views/disaster/components/Group.vue

@@ -26,8 +26,9 @@
 
 <script lang="ts" setup>
   import { ref, watch } from 'vue';
-  import type { UserGroupInfo } from '@/types/person-group/type';
   import { ArrowUp, ArrowDown } from '@element-plus/icons-vue';
+  import type { UserGroupInfo } from '@/types/person-group/type';
+
   const userInfoRefs = ref<Record<string, HTMLElement>>({});
   const userGroupInfo = ref<UserGroupInfo[]>();
   const toggleExpand = (group: UserGroupInfo) => {

src/views/disaster/components/GroupSelect.vue

@@ -1,6 +1,13 @@
 <template>
   <div class="group-select-container">
-    <el-select v-model="selectedGroups" multiple placeholder="请选择分组" filterable @change="handleChange" :disabled="disabled">
+    <el-select
+      v-model="selectedGroups"
+      multiple
+      placeholder="请选择分组"
+      filterable
+      @change="handleChange"
+      :disabled="disabled"
+    >
       <el-option v-for="item in groupOptions" :key="item.id" :value="item.id" :label="item.name" />
     </el-select>
     <span @click="showGroupInfo" v-if="selectedGroups.length > 0" class="group-info-span"> 人员详情 </span>
@@ -20,9 +27,9 @@
 
 <script lang="ts" setup>
   import { ref, watch } from 'vue';
-  import type { UserGroupOption,UserGroupInfo } from '@/types/person-group/type';
-  import { getUserGroupDetailByIds } from '@/api/system/person-group';
   import Group from './Group.vue';
+  import type { UserGroupOption, UserGroupInfo } from '@/types/person-group/type';
+  import { getUserGroupDetailByIds } from '@/api/system/person-group';
 
   const props = defineProps<{
     modelValue: number[];

src/views/disaster/components/InspectorSelect.vue

@@ -65,11 +65,11 @@
 
 <script lang="ts" setup>
   import { onMounted, ref, watch, computed, nextTick } from 'vue';
-  import empty from 'assets/images/empty@1X.png';
   import type { TreeNode } from '@/views/disaster/types';
   import type { PersonGroupItem } from '@/types/person-group/type';
   import type { ElTree } from 'element-plus';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
+  import { useUserInfoHook } from '@/views/disaster/hooks';
+  import empty from 'assets/images/empty@1X.png';
 
   const { getUserFirstLevelTreeList, treeData, id: userId } = useUserInfoHook();
 

src/views/disaster/components/PreviewOnline.vue

@@ -7,10 +7,11 @@
 
 <script lang="ts" setup>
   import { ref, computed, defineAsyncComponent } from 'vue';
-  import { FILE_TYPE_ICON } from '@/views/disaster/constant';
   import { CloseBold } from '@element-plus/icons-vue';
+  import { FILE_TYPE_ICON } from '@/views/disaster/constant';
   import '@vue-office/docx/lib/index.css';
   import '@vue-office/excel/lib/index.css';
+
   const showPreviewOnline = ref(false);
   const documentUrl = ref('');
   const documentType = ref<keyof typeof FILE_TYPE_ICON>();

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

@@ -178,14 +178,23 @@
 </template>
 
 <script setup lang="ts">
+  import { useRouter } from 'vue-router';
+  import { onMounted, reactive, ref } from 'vue';
+  import { ElMessage } from 'element-plus';
   import { Plus } from '@element-plus/icons-vue';
   import Search from '@/views/disaster/components/Search.vue';
   import CollapseItem from './src/components/CollapseItem.vue';
+  import ActionButton from '@/components/ActionButton.vue';
   import BasicTable from '@/components/BasicTable.vue';
-  import { getAllDepartments } from '@/api/auth/dept';
-  import { onMounted, reactive, ref } from 'vue';
-  import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
-  import type { DeptTreeItem } from '@/types/dept/type';
+  import useTableConfig from '@/hooks/useTableConfigHook';
+  import { useDeptInfoHook, useUserInfoHook } from '../hooks';
+  import { getTaskStage } from './src/util';
+  import { openMessageBox } from '@/utils/element-plus/messageBox';
+  import type {
+    disasterReportTaskInfoListResponse,
+    DisposalManagementTableResponse,
+    DisposalManagementCollapseListResponse,
+  } from '@/types/disaster-control';
   import {
     getDisasterControlCollapseData,
     getDisasterControlTableData,
@@ -195,35 +204,22 @@
     deleteDisasterReportTask,
     editDisasterReportTask,
   } from '@/api/disaster-control';
-  import type { disasterReportTaskInfoListResponse } from '@/types/disaster-control';
-  import { DEFAULT_PAGE_SIZE, DISASTER_CONTROL_PAGE_SIZE_CONFIG, TASK_STAGE } from './src/constant';
-  import type {
-    DisposalManagementCollapseListResponse,
-    DisposalManagementTableResponse,
-  } from '@/types/disaster-control';
-  import useTableConfig from '@/hooks/useTableConfigHook';
   import {
     DISPOSAL_MANAGEMENT_SEARCH_CONFIG,
     DISPOSAL_MANAGEMENT_TABLE_COLUMNS,
     DISPOSAL_MANAGEMENT_TABLE_OPTIONS,
   } from './src/config';
-  import { getTaskStage } from './src/util';
+  import { DEFAULT_PAGE_SIZE, DISASTER_CONTROL_PAGE_SIZE_CONFIG, TASK_STAGE } from './src/constant';
   import {
     ACTIVE_STATUS,
     ACTIVE_STATUS_COLOR,
     ACTIVE_STATUS_MAP,
     DISASTER_PERMISSIONS,
   } from '@/views/disaster/constant';
-  import ActionButton from '@/components/ActionButton.vue';
-  import { useRouter } from 'vue-router';
   import Empty from 'assets/images/empty@1X.png';
   import ViewDocument from './src/svg/view-document.svg';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
-  import { openMessageBox } from '@/utils/element-plus/messageBox';
-  import { ElMessage } from 'element-plus';
 
   const { permissions } = useUserInfoHook();
-  const firstLevelDepts = ref<DeptTreeItem[]>([]);
   const searchData = reactive({
     reportDeptIds: null,
     status: null,
@@ -238,6 +234,7 @@
   const collapseList = ref<DisposalManagementCollapseListResponse<DisposalManagementTableResponse>[]>([]);
   const disposalManagementPermissions = ref(false);
 
+  const { firstLevelDepts, getFirstLevelDepts } = useDeptInfoHook();
   const { tableConfig } = useTableConfig(DISPOSAL_MANAGEMENT_TABLE_COLUMNS, DISPOSAL_MANAGEMENT_TABLE_OPTIONS, false);
 
   const activeId = ref<number | null>(null);
@@ -423,13 +420,12 @@
   };
 
   onMounted(async () => {
-    const result = await getAllDepartments();
+    getFirstLevelDepts();
     await getDisposalData();
     await getDisposalTableData();
     disposalManagementPermissions.value = Boolean(
       permissions.find((item: { code: string }) => item.code === DISASTER_PERMISSIONS.DISPOSAL_MANAGEMENT),
     );
-    firstLevelDepts.value = formatDeptTree(result);
   });
 </script>
 

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

@@ -16,13 +16,13 @@
 </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 { createDisasterReportTask, editDisasterReportTask } from '@/api/disaster-control';
+  import UploadLoading from '@/components/UploadLoading.vue';
   import type { DisposalManagementCreateQuery, DisasterReportEditQuery } from '@/types/disaster-control';
+  import { createDisasterReportTask, editDisasterReportTask } from '@/api/disaster-control';
+  import BackIcon from 'assets/svg/back.svg';
 
   const router = useRouter();
   const route = useRoute();

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

@@ -16,12 +16,13 @@
 </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 { createDisasterHandleTask } from '@/api/disaster-control';
+  import BackIcon from 'assets/svg/back.svg';
+
   const router = useRouter();
   const route = useRoute();
   const operate = route.query.operate;

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

@@ -155,36 +155,36 @@
 </template>
 
 <script setup lang="ts">
+  import { useRouter } from 'vue-router';
+  import { onMounted, reactive, ref } from 'vue';
+  import { ElMessage } from 'element-plus';
   import Search from '@/views/disaster/components/Search.vue';
   import CollapseItem from './src/components/CollapseItem.vue';
   import BasicTable from '@/components/BasicTable.vue';
   import InspectorSelect from '@/views/disaster/components/InspectorSelect.vue';
-  import { onMounted, reactive, ref } from 'vue';
-  import { getReportTaskList, getLossRecordTableData, addFixer } from '@/api/disaster-control';
-  import type { disasterReportTaskInfoListResponse } from '@/types/disaster-control';
-  import { DEFAULT_PAGE_SIZE, DISASTER_CONTROL_PAGE_SIZE_CONFIG, FIX_STATUS } from './src/constant';
+  import ActionButton from '@/components/ActionButton.vue';
+  import useTableConfig from '@/hooks/useTableConfigHook';
+  import { useDisasterControlHook } from './src/hook';
+  import { useUserInfoHook } from '@/views/disaster/hooks';
+  import { getfixStatus } from './src/util';
+  import type { PersonGroupItem } from '@/types/person-group/type';
   import type {
+    disasterReportTaskInfoListResponse,
     DisposalManagementCollapseListResponse,
     LossRecordTableResponse,
     disasterReportRecordDetailListResponse,
   } from '@/types/disaster-control';
-  import useTableConfig from '@/hooks/useTableConfigHook';
+  import { getReportTaskList, getLossRecordTableData, addFixer } from '@/api/disaster-control';
+  import { queryUserInfoByIds } from '@/api/system/person-group';
   import {
     DISPOSAL_RECTIFICATION_SEARCH_CONFIG,
     LOSS_RECORD_TABLE_COLUMNS,
     DISPOSAL_MANAGEMENT_TABLE_OPTIONS,
   } from './src/config';
-  import { getfixStatus } from './src/util';
+  import { DEFAULT_PAGE_SIZE, DISASTER_CONTROL_PAGE_SIZE_CONFIG, FIX_STATUS } from './src/constant';
   import { ACTIVE_STATUS } from '@/views/disaster/constant';
-  import ActionButton from '@/components/ActionButton.vue';
-  import { useRouter } from 'vue-router';
   import Empty from 'assets/images/empty@1X.png';
   import ViewDocument from './src/svg/view-document.svg';
-  import { useDisasterControlHook } from './src/hook';
-  import type { PersonGroupItem } from '@/types/person-group/type';
-  import { queryUserInfoByIds } from '@/api/system/person-group';
-  import { ElMessage } from 'element-plus';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
 
   const { id: userId } = useUserInfoHook();
 

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

@@ -113,24 +113,24 @@
 <script lang="ts" setup>
   import BackIcon from 'assets/svg/back.svg';
   import { useRoute, useRouter } from 'vue-router';
+  import { ref, onMounted, watch, computed, onUnmounted } from 'vue';
+  import { ElMessage } from 'element-plus';
   import UploadLoading from '@/components/UploadLoading.vue';
   import BasicForm from '@/components/BasicForm.vue';
   import UploadImages from './src/components/UploadImages.vue';
   import UploadFiles from '@/views/disaster/components/UploadFiles.vue';
-  import { ref, onMounted, watch, computed, onUnmounted } from 'vue';
   import { useDisasterControlHook } from './src/hook';
   import { useFormConfigHook } from '@/hooks/useFormConfigHook';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
-  import { createDisposalRectification } from '@/api/disaster-control';
-  import { uploadFileApi, UPLOAD_BIZ_TYPE } from '@/api/minio';
+  import { useUserInfoHook } from '@/views/disaster/hooks';
   import type { FileItem } from '@/views/disaster/types';
   import type { disasterReportRecordDetailListResponse, DisposalRectificationFormData } from '@/types/disaster-control';
+  import { createDisposalRectification } from '@/api/disaster-control';
+  import { uploadFileApi, UPLOAD_BIZ_TYPE } from '@/api/minio';
   import {
     DISPOSAL_RECTIFICATION_FORM_CONFIG,
     DISPOSAL_RECTIFICATION_FORM_DATA,
     DISPOSAL_RECTIFICATION_FORM_RULES,
   } from './src/config';
-  import { ElMessage } from 'element-plus';
 
   const basicFormRef = ref<InstanceType<typeof BasicForm>>();
   const uploadImagesRef = ref<InstanceType<typeof UploadImages>>();

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

@@ -13,8 +13,9 @@
 </template>
 
 <script setup lang="ts">
-  import { LOSS_REPORT_TABS } from './src/constant';
   import { computed, ref, defineAsyncComponent, onUnmounted } from 'vue';
+  import { LOSS_REPORT_TABS } from './src/constant';
+
   const activeName = ref(sessionStorage.getItem('loss-report-active') || LOSS_REPORT_TABS[0].value);
   const dynamicComponent = computed(() => {
     switch (activeName.value) {

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

@@ -17,14 +17,14 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, computed, defineAsyncComponent } from 'vue';
   import { useRouter, useRoute } from 'vue-router';
-  import BackIcon from 'assets/svg/back.svg';
-  import { LossRecordFormData } from '@/types/disaster-control';
-  import { createLossRecord, editLossRecord } from '@/api/disaster-control';
-  import { uploadFileApi, UPLOAD_BIZ_TYPE } from '@/api/minio';
+  import { ref, computed, defineAsyncComponent } from 'vue';
   import { ElMessage } from 'element-plus';
   import UploadLoading from '@/components/UploadLoading.vue';
+  import type { LossRecordFormData } from '@/types/disaster-control';
+  import { createLossRecord, editLossRecord } from '@/api/disaster-control';
+  import { uploadFileApi, UPLOAD_BIZ_TYPE } from '@/api/minio';
+  import BackIcon from 'assets/svg/back.svg';
 
   const router = useRouter();
   const route = useRoute();
@@ -113,7 +113,7 @@
     if (!success) return;
     dynamicComponentRef.value?.initFormData();
     // 滚动到页面顶部 - 使用更可靠的方法
-    const mainElement = document.querySelector('.disaster-precaution-container__main');
+    const mainElement = document.querySelector('.info-container');
     if (!mainElement) return;
     mainElement.scrollTop = 0;
   };

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

@@ -26,32 +26,26 @@
 </template>
 
 <script setup lang="ts">
+  import { useRoute } from 'vue-router';
+  import { onMounted, ref } from 'vue';
   import BasicForm from '@/components/BasicForm.vue';
   import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
   import { useFormConfigHook } from '@/hooks/useFormConfigHook';
+  import { useUserInfoHook, useDeptInfoHook, useGroupInfoHook } from '@/views/disaster/hooks';
+  import type { DisposalManagementRuleForm } from '@/types/disaster-control';
   import {
     DISPOSAL_MANAGEMENT_ITEM_FROM_CONFIG_CREATE,
     DISPOSAL_MANAGEMENT_TASK_FROM_DATA,
     DISPOSAL_MANAGEMENT_ITEM_FROM_RULES_CREATE,
   } from '../config';
-  import { onMounted, ref } from 'vue';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
-  import type { DisposalManagementRuleForm } from '@/types/disaster-control';
-  import type { DeptTreeItem } from '@/types/dept/type';
-  import type { UserGroupOption } from '@/types/person-group/type';
-  import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
-  import { getAllDepartments } from '@/api/auth/dept';
-  import { getAllUserGroup } from '@/api/system/person-group';
-  import { useRoute } from 'vue-router';
 
   const { realname } = useUserInfoHook();
+  const { getFirstLevelDepts, firstLevelDepts } = useDeptInfoHook();
+  const { groupOptions, getUserGroupList } = useGroupInfoHook();
   const route = useRoute();
   const taskName = route.query.taskName as string;
   const basicFormRef = ref<InstanceType<typeof BasicForm>>();
 
-  const firstLevelDepts = ref<DeptTreeItem[]>([]);
-  const groupOptions = ref<UserGroupOption[]>([]);
-
   const { ruleFormConfig, ruleFormData, formRules, cloneRuleFormData, beforeRouteLeave } =
     useFormConfigHook<DisposalManagementRuleForm>(
       DISPOSAL_MANAGEMENT_ITEM_FROM_CONFIG_CREATE,
@@ -68,14 +62,6 @@
     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,
@@ -83,7 +69,7 @@
   onMounted(() => {
     ruleFormData.createdByName = realname;
     ruleFormData.taskName = taskName;
-    getDeptList();
+    getFirstLevelDepts();
     getUserGroupList();
     cloneRuleFormData();
     beforeRouteLeave();
@@ -93,4 +79,4 @@
 <style scoped lang="scss">
   @use '@/views/disaster/style/info-container.scss' as *;
   @use '../style/item-common.scss' as *;
-</style>
+</style>

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

@@ -26,30 +26,24 @@
 </template>
 
 <script setup lang="ts">
+  import { onMounted, ref } from 'vue';
   import BasicForm from '@/components/BasicForm.vue';
   import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
   import { useFormConfigHook } from '@/hooks/useFormConfigHook';
+  import { useUserInfoHook, useDeptInfoHook, useGroupInfoHook } from '@/views/disaster/hooks';
   import {
     DISPOSAL_MANAGEMENT_TASK_FROM_CONFIG,
     DISPOSAL_MANAGEMENT_TASK_FROM_DATA,
     DISPOSAL_MANAGEMENT_TASK_FROM_RULES,
   } from '../config';
-  import { onMounted, ref } from 'vue';
-  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
   import type { DisposalManagementRuleForm } from '@/types/disaster-control';
-  import type { DeptTreeItem } from '@/types/dept/type';
-  import type { UserGroupOption } from '@/types/person-group/type';
-  import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
-  import { getAllDepartments } from '@/api/auth/dept';
-  import { getAllUserGroup } from '@/api/system/person-group';
 
   const { realname } = useUserInfoHook();
+  const { getFirstLevelDepts, firstLevelDepts } = useDeptInfoHook();
+  const { getUserGroupList, groupOptions } = useGroupInfoHook();
 
   const basicFormRef = ref<InstanceType<typeof BasicForm>>();
 
-  const firstLevelDepts = ref<DeptTreeItem[]>([]);
-  const groupOptions = ref<UserGroupOption[]>([]);
-
   const { ruleFormConfig, ruleFormData, formRules, cloneRuleFormData, beforeRouteLeave } =
     useFormConfigHook<DisposalManagementRuleForm>(
       DISPOSAL_MANAGEMENT_TASK_FROM_CONFIG,
@@ -66,21 +60,13 @@
     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(() => {
     ruleFormData.createdByName = realname;
-    getDeptList();
+    getFirstLevelDepts();
     getUserGroupList();
     cloneRuleFormData();
     beforeRouteLeave();

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

@@ -71,21 +71,21 @@
 </template>
 
 <script setup lang="ts">
-  import { onMounted, ref, watch } from 'vue';
   import { useRoute } from 'vue-router';
+  import { onMounted, ref, watch } from 'vue';
   import UploadImages from './UploadImages.vue';
   import BasicForm from '@/components/BasicForm.vue';
+  import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
+  import { useDisasterControlHook } from '../hook';
   import { useFormConfigHook } from '@/hooks/useFormConfigHook';
+  import { useUserInfoHook, useDeptInfoHook, useGroupInfoHook } from '@/views/disaster/hooks';
+  import type { LossReportItemFormData } from '@/types/disaster-control';
   import {
     LOSS_REPORT_ITEM_FORM_CONFIG_LOSS,
     LOSS_REPORT_ITEM_FORM_CONFIG_NO_LOSS,
     LOSS_REPORT_ITEM_FORM_DATA,
     LOSS_REPORT_ITEM_FROM_RULES,
   } from '../config';
-  import type { LossReportItemFormData } from '@/types/disaster-control';
-  import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
-  import { useDisasterControlHook } from '../hook';
-  import { useUserInfoHook, useDeptInfoHook, useGroupInfoHook } from '@/views/disaster/hooks';
 
   const { realname } = useUserInfoHook();
   const { groupOptions, getUserGroupList } = useGroupInfoHook();

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

@@ -15,34 +15,32 @@
 </template>
 
 <script setup lang="ts">
+  import { useRoute } from 'vue-router';
+  import { onMounted, ref } from 'vue';
   import BasicForm from '@/components/BasicForm.vue';
   import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
   import { useFormConfigHook } from '@/hooks/useFormConfigHook';
+  import { useGroupInfoHook } from '@/views/disaster/hooks';
+  import type { DisposalManagementRuleFormEdit } from '@/types/disaster-control';
+  import { getDisasterControlTableData } from '@/api/disaster-control';
   import {
     DISPOSAL_MANAGEMENT_ITEM_FROM_CONFIG_EDIT,
     DISPOSAL_MANAGEMENT_TASK_FROM_DATA_EDIT,
     DISPOSAL_MANAGEMENT_ITEM_FROM_RULES_EDIT,
   } from '../config';
-  import { onMounted, ref } from 'vue';
-  import type { DisposalManagementRuleFormEdit } from '@/types/disaster-control';
-  import type { UserGroupOption } from '@/types/person-group/type';
-  import { getAllUserGroup } from '@/api/system/person-group';
-  import { getDisasterControlTableData } from '@/api/disaster-control';
-  import { useRoute } from 'vue-router';
 
   const route = useRoute();
   const id = Number(route.params.id);
   const reportTaskId = Number(route.query.reportTaskId);
   const basicFormRef = ref<InstanceType<typeof BasicForm>>();
 
-  const groupOptions = ref<UserGroupOption[]>([]);
-
   const { ruleFormConfig, ruleFormData, formRules, cloneRuleFormData, beforeRouteLeave } =
     useFormConfigHook<DisposalManagementRuleFormEdit>(
       DISPOSAL_MANAGEMENT_ITEM_FROM_CONFIG_EDIT,
       DISPOSAL_MANAGEMENT_TASK_FROM_DATA_EDIT,
       DISPOSAL_MANAGEMENT_ITEM_FROM_RULES_EDIT,
     );
+  const { getUserGroupList, groupOptions } = useGroupInfoHook();
 
   const handleValidate = async () => {
     if (!basicFormRef.value) return;
@@ -53,10 +51,6 @@
     cloneRuleFormData();
     return ruleFormData;
   };
-  const getUserGroupList = async () => {
-    const res = await getAllUserGroup();
-    groupOptions.value = res.groupVOList;
-  };
   defineExpose({
     handleValidate,
     getFormData,

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

@@ -76,29 +76,27 @@
 </template>
 
 <script setup lang="ts">
-  import { onMounted, ref, watch } from 'vue';
   import { useRoute } from 'vue-router';
+  import { onMounted, ref, watch } from 'vue';
   import UploadImages from './UploadImages.vue';
   import BasicForm from '@/components/BasicForm.vue';
+  import GroupSelect from '@/views/disaster/components/GroupSelect.vue';
   import { useFormConfigHook } from '@/hooks/useFormConfigHook';
+  import { useGroupInfoHook, useDeptInfoHook } from '@/views/disaster/hooks';
+  import { useDisasterControlHook } from '../hook';
+  import type { LossReportItemFormData } from '@/types/disaster-control';
+  import { queryUserInfoByIds } from '@/api/system/person-group';
   import {
     LOSS_REPORT_ITEM_FORM_CONFIG_LOSS,
     LOSS_REPORT_ITEM_FORM_CONFIG_NO_LOSS,
     LOSS_REPORT_ITEM_FORM_DATA,
     LOSS_REPORT_ITEM_FROM_RULES,
   } 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 type { DeptTreeItem } from '@/types/dept/type';
-  import { getAllDepartments } from '@/api/auth/dept';
-  import { queryUserInfoByIds } from '@/api/system/person-group';
-  import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
-  import { useDisasterControlHook } from '../hook';
 
   const { safetyLevelDice, priorityDice, getSafetyLevelDict, getPriorityDict, getLossReportItem } =
     useDisasterControlHook();
+  const { groupOptions, getUserGroupList } = useGroupInfoHook();
+  const { getFirstLevelDepts, firstLevelDepts } = useDeptInfoHook();
 
   // 处理损失评估金额输入，只允许输入数字和小数点，且小数点后最多10位
   const handleEstimatedLossInput = (value: string) => {
@@ -152,24 +150,14 @@
   const route = useRoute();
   const reportTaskId = Number(route.query.id);
   const id = Number(route.params.id);
-  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 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();
@@ -213,7 +201,7 @@
     getLossReportItemData();
     getSafetyLevelDict();
     getPriorityDict();
-    getDeptList();
+    getFirstLevelDepts();
     getUserGroupList();
     beforeRouteLeave();
   });

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

@@ -110,7 +110,7 @@
                       <ActionButton text="查看" v-if="scope.row.fixStatus === FIX_STATUS.TEMPORARY_CLOSED" />
                       <ActionButton
                         text="编辑"
-                        @click="handleEdit(scope.row.id, item.id)"
+                        @click="handleEdit(scope.row.id, item.handleTaskId)"
                         v-if="isOverdue(item.dueCompleteTime) && scope.row.fixStatus !== FIX_STATUS.TEMPORARY_CLOSED"
                       />
                       <ActionButton
@@ -143,14 +143,18 @@
 </template>
 
 <script lang="ts" setup>
-  import ViewDocument from '../svg/view-document.svg';
+  import { useRouter } from 'vue-router';
   import { ref, reactive, onMounted, onUnmounted } 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 CollapseItem from './CollapseItem.vue';
-  import { DEFAULT_PAGE_SIZE, DISASTER_CONTROL_PAGE_SIZE_CONFIG, FIX_STATUS } from '../constant';
+  import useTableConfig from '@/hooks/useTableConfigHook';
+  import { useDisasterControlHook } from '../hook';
+  import { useDeptInfoHook } from '@/views/disaster/hooks';
+  import { getfixStatus } from '../util';
   import type { DisposalManagementCollapseListResponse, LossRecordTableResponse } from '@/types/disaster-control';
   import { getReportTaskList, getLossRecordTableData, deleteLossRecord } from '@/api/disaster-control';
   import {
@@ -158,13 +162,9 @@
     LOSS_RECORD_TABLE_COLUMNS,
     DISPOSAL_MANAGEMENT_TABLE_OPTIONS,
   } from '../config';
+  import { DEFAULT_PAGE_SIZE, DISASTER_CONTROL_PAGE_SIZE_CONFIG, FIX_STATUS } from '../constant';
   import Empty from 'assets/images/empty@1X.png';
-  import useTableConfig from '@/hooks/useTableConfigHook';
-  import { getfixStatus } from '../util';
-  import { useRouter } from 'vue-router';
-  import { ElMessage } from 'element-plus';
-  import { useDisasterControlHook } from '../hook';
-  import { useDeptInfoHook } from '@/views/disaster/hooks';
+  import ViewDocument from '../svg/view-document.svg';
 
   const { getPriority, getPriorityDict } = useDisasterControlHook();
   const { getFirstLevelDepts, firstLevelDepts } = useDeptInfoHook();

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

@@ -56,26 +56,27 @@
 </template>
 
 <script setup lang="ts">
+  import { useRouter } from 'vue-router';
   import { ref, reactive, onMounted, onUnmounted } from '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 InspectorSelect from '@/views/disaster/components/InspectorSelect.vue';
+  import useTableConfig from '@/hooks/useTableConfigHook';
+  import { getTaskStage } from '../util';
+  import type { LossReportReportTaskQuery, LossReportReportTaskResponse } from '@/types/disaster-control';
+  import type { QueryPageRequest } from '@/types/disaster';
+  import { getReportTaskList, addReporter } from '@/api/disaster-control';
   import {
     LOSS_REPORT_REPORT_TASK_SEARCH_CONFIG,
     LOSS_REPORT_REPORT_TASK_TABLE_OPTIONS,
     LOSS_REPORT_REPORT_TASK_TABLE_COLUMNS,
   } from '../config';
-  import useTableConfig from '@/hooks/useTableConfigHook';
-  import { getReportTaskList, addReporter } from '@/api/disaster-control';
-  import type { LossReportReportTaskQuery, LossReportReportTaskResponse } from '@/types/disaster-control';
-  import type { QueryPageRequest } from '@/types/disaster';
   import { TASK_STAGE } from '../constant';
-  import { getTaskStage } from '../util';
   import type { PersonGroupItem } from '@/types/person-group/type';
-  import { useRouter } from 'vue-router';
   import { queryUserInfoByIds } from '@/api/system/person-group';
-  import { ElMessage } from 'element-plus';
+
   const router = useRouter();
   const searchData = reactive({
     taskStage: null,

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

@@ -1,5 +1,5 @@
 <template>
-  <div> this is viewDisposalManagementTaskItem page </div>
+  <div> this is view disposal control item page </div>
 </template>
 
 <script lang="ts" setup></script>

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

@@ -1,13 +0,0 @@
-<template>
-  <div>
-    this is view disposal management item page
-  </div>
-</template>
-
-<script lang="ts" setup>
-
-</script>
-
-<style lang="scss" scoped>
-
-</style>

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

@@ -6,6 +6,14 @@
     </header>
     <main class="disaster-precaution-container__main">
       <div class="disaster-precaution">
+        <div class="export-file" @click="handleExportTaksTable" v-if="operationType === 'view'">
+          <el-button type="primary">
+            <template #icon>
+              <img :src="ExportIcon" />
+            </template>
+            导出预防检查任务单
+          </el-button>
+        </div>
         <p class="title">
           任务名称：<span class="content">{{ taskExecutionDetailList?.name }}</span>
         </p>
@@ -63,6 +71,7 @@
   } from '@/types/disaster-precaution';
   import { getTaskExecutionDetail, saveTaskDetail, saveTaskApproval } from '@/api/disaster-precaution';
   import BackIcon from 'assets/svg/back.svg';
+  import ExportIcon from 'assets/svg/export.svg';
 
   const { getUserFirstLevelTreeList, treeData, id: userId } = useUserInfoHook();
 
@@ -140,6 +149,10 @@
     }
   });
 
+  const handleExportTaksTable = () => {
+    ElMessage.warning('导出功能后端正在开发中，暂时无法下载');
+  };
+
   onMounted(() => {
     getTaskExecutionDetailList();
     getUserFirstLevelTreeList();
@@ -164,4 +177,12 @@
   .content {
     color: rgba($text-color, 0.65);
   }
+  .disaster-precaution {
+    position: relative;
+  }
+  .export-file {
+    position: absolute;
+    right: 0;
+    top: 0;
+  }
 </style>

src/views/disaster/disaster-warning/src/hook.ts

@@ -2,8 +2,8 @@
  * 灾害预警公用hook
  */
 import { ref } from 'vue';
-import { queryDictTypeDetail } from '@/api/dict';
 import type { SysDictDataDetail } from '@/api/dict';
+import { queryDictTypeDetail } from '@/api/dict';
 import { DICT_CODE } from '@/constant/dict';
 
 export const useDisasterWarningHook = () => {

src/views/disaster/hooks/deptInfo.ts

@@ -2,9 +2,9 @@
  * 获取部门信息
  */
 import { ref } from 'vue';
+import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
 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 () => {

src/views/disaster/hooks/userInfo.ts

@@ -1,9 +1,9 @@
-import { useUserStore } from '@/store/modules/user';
 import { storeToRefs } from 'pinia';
 import { computed, ref } from 'vue';
+import { useUserStore } from '@/store/modules/user';
 import type { QueryUserFirstLevelTreeRes } from '@/types/person-group/type';
-import { getUserFirstLevelTree } from '@/api/system/person-group';
 import type { TreeNode } from '@/views/disaster/types';
+import { getUserFirstLevelTree } from '@/api/system/person-group';
 
 const userStore = useUserStore();
 const { getUserInfo } = storeToRefs(userStore);