缺少模板难做

src/api/disaster-precaution/index.ts

@@ -1,10 +1,11 @@
 import { http } from '@/utils/http/axios';
 import type {
   TaskManagementListQuery,
+  TaskExecutionListQuery,
   TaskManagementListResponse,
   TaskExecutionListResponse,
-  TaskManagementItemResponse,
 } from '@/types/disaster-precaution';
+import type { UserInfo } from '@/types/push-object';
 import type { QueryPageRequest, QueryPageResponse } from '@/types/disaster';
 import type { TaskManagementRuleForm } from '@/views/disaster/disaster-precaution/src/type';
 /**
@@ -85,14 +86,23 @@ export const deleteTaskManagementItem = (preventInspectTaskIds: number[] | numbe
 /**
  * 获取任务执行表格数据
  */
-export function getTaskExecutionListData() {
-  return http.request<TaskExecutionListResponse[]>(
-    {
-      url: '/admin/task/getTaskExecutionList',
-      method: 'get',
-    },
-    {
-      ignoreTargetTenantId: true,
-    },
-  );
+export function getTaskExecutionList(query: QueryPageRequest<TaskExecutionListQuery>) {
+  return http.request<QueryPageResponse<TaskExecutionListResponse>>({
+    url: '/preventInspectTask/queryTaskExecutePage',
+    method: 'post',
+    data: query,
+  });
 }
+
+/**
+ * 查询检查人员
+ */
+export const getTaskInspectorList = (preventInspectTaskId: number) => {
+  return http.request<UserInfo[]>({
+    url: '/preventInspectTask/queryTaskInspector',
+    method: 'get',
+    params: {
+      preventInspectTaskId,
+    },
+  });
+};

src/types/disaster-precaution/index.ts

@@ -1,8 +1,13 @@
-export interface TaskManagementListQuery {
+import type { USER_TYPE } from '@/views/disaster/disaster-precaution/src/constants/task-execution';
+interface BasicQuery {
   inspectType?: string;
-  effectStatus?: string;
   taskState?: string;
 }
+export interface TaskManagementListQuery extends BasicQuery {
+  effectStatus?: string;
+}
+
+export interface TaskExecutionListQuery extends BasicQuery {}
 
 interface BasicResponse {
   id: number;
@@ -10,7 +15,7 @@ interface BasicResponse {
   deptName: string; // 被检查单位名称
   inspectType: number; // 检查类型
   dueCompleteTime: string;
-  taskState: number;
+  taskState: number; // 任务状态
   overdue: boolean;
   userGroupList: number[];
 }
@@ -19,7 +24,9 @@ export interface TaskManagementListResponse extends BasicResponse {
   effectStatus: number;
 }
 
-export interface TaskExecutionListResponse extends BasicResponse {}
+export interface TaskExecutionListResponse extends BasicResponse {
+  userTypeList: USER_TYPE[];
+}
 
 export interface TaskManagementItemResponse
   extends Omit<TaskManagementListResponse, 'deptName' | 'inspectType' | 'overdue' | 'effectStatus' | 'taskState'> {

src/types/push-object/index.ts

@@ -18,6 +18,7 @@ export interface UserInfo {
   id: number;
   realname: string;
   username: string;
+  isSelected?: boolean;
 }
 
 export interface UserGroupInfo extends PushObjectGroupInfoResponse {

src/views/disaster/WorkRecord.md

@@ -29,4 +29,14 @@
 - [ ] 任务执行页面完成
 
 ### 25/5/20
-### 完成灾害预警 准备提测
+### 完成灾害预警 准备提测
+
+### 25/5/22
+### 预防检查模块
+- [x] 任务管理模块开发完成
+- [ ] 任务执行做到看模板情况
+- [ ] 任务模板的接口、数据结构重构，组件重构
+### 灾害防范模块
+- [ ] 有许多公用逻辑可以抽成hook和util(后续优化)
+- [ ] 有很多字段和后端不一样，时间来不及修改（后续优化）
+- [ ] 有很多公共组件可以在进行二次封装，后续完成后再进行优化

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

@@ -20,32 +20,37 @@
         >
           <template #taskName="scope">
             <div class="task-name--div">
-              <el-tooltip :content="scope.row.taskName" placement="top" effect="light">
-                <span>{{ scope.row.taskName }}</span>
+              <el-tooltip :content="scope.row.name" placement="top" effect="light">
+                <span>{{ scope.row.name }}</span>
               </el-tooltip>
-              <img :src="OverdueIcon" alt="overdue" v-if="scope.row.isOverdue === OVERDUE_STATUS.OVERDUE" />
+              <img :src="OverdueIcon" v-if="scope.row.overdue" />
             </div>
           </template>
-          <template #taskType="scope">
-            <span>{{ TASK_TYPE_MAP[scope.row.taskType] }}</span>
+          <template #inspectType="scope">
+            <span>{{ INSPECT_TYPE_MAP[scope.row.inspectType] }}</span>
           </template>
           <template #taskStage="scope">
-            <span>{{ TASK_STAGE_MAP[scope.row.taskStage] }}</span>
+            <span>{{ TASK_STAGE_MAP[scope.row.taskState] }}</span>
           </template>
           <!-- action button 不仅分任务情况 还要分 人物权限 -->
           <template #action="scope">
             <!-- 检查任务操作入口 -->
-            <div class="action-container" v-if="scope.row.taskStage === TASK_STAGE.PENDING_CHECK">
+            <div class="action-container" v-if="scope.row.taskState === TASK_STAGE.PENDING_CHECK">
               <ActionButton text="去检查" />
               <!-- 仅检查责任人可以看到 -->
-              <ActionButton text="添加检查人" @click="handleAddCheckUser(scope.row)" />
+              <ActionButton
+                text="添加检查人"
+                @click="handleAddCheckUser(scope.row)"
+                v-if="scope.row.userTypeList.includes(USER_TYPE.CHECK_RESPONSIBLE)"
+              />
             </div>
             <!-- 审批任务操作入口 -->
-            <div class="action-container" v-else-if="scope.row.taskStage === TASK_STAGE.PENDING_APPROVAL">
+            <div class="action-container" v-else-if="scope.row.taskState === TASK_STAGE.PENDING_APPROVAL">
               <!-- 审批人员可以看到 -->
-              <ActionButton text="去审批" />
+              <ActionButton text="去审批" v-if="scope.row.userTypeList.includes(USER_TYPE.APPROVER)" />
               <!-- 检查责任人、检查执行人员可以看到 -->
               <ActionButton
+                v-else
                 text="撤回"
                 :popconfirm="{
                   title: '确定撤回吗？',
@@ -53,10 +58,11 @@
               />
             </div>
             <!-- 完成任务操作入口 -->
-            <div class="action-container" v-else-if="scope.row.taskStage === TASK_STAGE.COMPLETED">
+            <div class="action-container" v-else-if="scope.row.taskState === TASK_STAGE.COMPLETED">
               <ActionButton text="查看" />
               <!-- 仅审批人员可以看到 -->
               <ActionButton
+                v-if="scope.row.userTypeList.includes(USER_TYPE.APPROVER)"
                 text="撤回"
                 :popconfirm="{
                   title: '确定撤回吗？',
@@ -67,16 +73,6 @@
         </BasicTable>
       </div>
     </main>
-    <el-dialog
-      v-model="userInfo"
-      title="添加人员"
-      align-center
-      :close-on-click-modal="false"
-      :destroy-on-close="true"
-      class="customDialog--pushObject"
-    >
-      <User :customUserList="currentRow?.checkUser || []" @cancel="userInfo = false" @submit="handleSubmit"/>
-    </el-dialog>
   </div>
 </template>
 
@@ -86,27 +82,40 @@
   import ActionButton from '@/components/ActionButton.vue';
   import Search from '@/views/disaster/components/Search.vue';
   import useTableConfig from '@/hooks/useTableConfigHook';
-  import { getTaskExecutionListData } from '@/api/disaster-precaution';
+  import { getTaskExecutionList, getTaskInspectorList } from '@/api/disaster-precaution';
   import type { TaskExecutionListResponse } from '@/types/disaster-precaution';
   import OverdueIcon from '@/assets/svg/overdue.svg';
   import { TASK_STAGE } from './src/constants/task-execution';
-  import { OVERDUE_STATUS, TASK_TYPE_MAP, TASK_STAGE_MAP } from './src/constants/task-execution';
+  import { INSPECT_TYPE_MAP, TASK_STAGE_MAP } from './src/constants/task-execution';
   import { TABLE_OPTIONS_EXECUTION, TASK_EXECUTION_TABLE_COLUMNS, TASK_EXECUTION_SEARCH_CONFIG } from './src/config';
-  import User from '@/views/disaster/components/User.vue';
+  import type { TaskExecutionListQuery } from '@/types/disaster-precaution';
+  import type { QueryPageRequest } from '@/types/disaster';
+  import { USER_TYPE } from './src/constants/task-execution';
   import type { UserInfo } from '@/types/push-object';
 
   const userInfo = ref(false);
   const searchData = reactive({
-    taskType: '',
-    taskStage: '',
+    inspectType: '',
+    taskState: '',
   });
-  const handleSearch = (data: any) => {
-    console.log(data);
-    getTableData();
-  };
 
   const tableData = ref<TaskExecutionListResponse[]>([]);
   const { tableConfig, pagination } = useTableConfig(TASK_EXECUTION_TABLE_COLUMNS, TABLE_OPTIONS_EXECUTION);
+  let taskManagementListQuery: QueryPageRequest<TaskExecutionListQuery> = {
+    pageNumber: pagination.pageNumber,
+    pageSize: pagination.pageSize,
+    queryParam: {},
+  };
+  const handleSearch = () => {
+    taskManagementListQuery.queryParam = {};
+    if (searchData.inspectType !== '') {
+      taskManagementListQuery.queryParam.inspectType = searchData.inspectType;
+    }
+    if (searchData.taskState !== '') {
+      taskManagementListQuery.queryParam.taskState = searchData.taskState;
+    }
+    getTableData();
+  };
   const handleSizeChange = (value: number) => {
     pagination.pageSize = value;
     getTableData();
@@ -115,20 +124,24 @@
     pagination.pageNumber = value;
     getTableData();
   };
-  const currentRow = ref<TaskExecutionListResponse>();
-  const handleAddCheckUser = (row: TaskExecutionListResponse) => {
-    currentRow.value = row;
+  const currentTaskId = ref<number>();
+  const currentTaskInspectorList = ref<UserInfo[]>([]);
+  const handleAddCheckUser = async(row: TaskExecutionListResponse) => {
+    currentTaskId.value = row.id;
+    const res = await getTaskInspectorList(currentTaskId.value);
+    currentTaskInspectorList.value = res.map((item) => {
+      return {
+        ...item,
+        isSelected: true,
+      };
+    });
     userInfo.value = true;
   };
-  const handleSubmit = (userList: UserInfo[]) => {
-    const currentIndex = tableData.value.findIndex((item) => item.id === currentRow.value?.id);
-    tableData.value[currentIndex].checkUser = userList;
-  };
   const getTableData = async () => {
     tableConfig.loading = true;
-    const res = await getTaskExecutionListData();
-    tableData.value = res;
-    pagination.total = tableData.value.length;
+    const res = await getTaskExecutionList(taskManagementListQuery);
+    tableData.value = res.records;
+    pagination.total = res.totalRow;
     tableConfig.loading = false;
   };
   onMounted(() => {

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

@@ -5,7 +5,7 @@
       <span class="disaster-precaution-container__title">{{ name }}</span>
     </header>
     <main class="disaster-precaution-container__main">
-      <TemplateTableMerge :operation-type="operationType" :main-table="data!" height="calc(70vh - 40px)" />
+      <TemplateTableMerge :operation-type="operationType" :main-table="data!" height="calc(70vh - 25px)" />
     </main>
   </div>
 </template>

src/views/disaster/disaster-precaution/src/config/search.ts

@@ -47,10 +47,10 @@ export const TASK_MANAGEMENT_SEARCH_CONFIG: SearchConfig[] = [
 
 // 任务执行搜索配置
 export const TASK_EXECUTION_SEARCH_CONFIG: SearchConfig[] = [
-  BASIC_SEARCH_CONFIG.TASK_TYPE,
+  BASIC_SEARCH_CONFIG.INSPECT_TYPE,
   {
     label: '任务阶段',
-    prop: 'taskStage',
+    prop: 'taskState',
     component: 'ElSelect',
     selectOptions: TASK_STAGE_OPTIONS_EXECUTION,
     componentProps: {

src/views/disaster/disaster-precaution/src/config/table.ts

@@ -20,7 +20,7 @@ export const TABLE_OPTIONS_MANAGEMENT = {
 // 任务执行表格样式配置
 export const TABLE_OPTIONS_EXECUTION = {
   ...TABLE_OPTIONS_DEFAULT,
-  height: 'calc(70vh - 50px)',
+  height: TABLE_MANAGEMENT_HEIGHT_NOT_PERMISSION,
 };
 
 // 基础表格列配置
@@ -92,8 +92,8 @@ export const TASK_MANAGEMENT_TABLE_COLUMNS: TableColumnProps[] = [
 export const TASK_EXECUTION_TABLE_COLUMNS: TableColumnProps[] = [
   BASIC_TABLE_COLUMNS.TASK_NAME,
   BASIC_TABLE_COLUMNS.SELF_CHECK_UNIT,
-  BASIC_TABLE_COLUMNS.TASK_TYPE,
-  BASIC_TABLE_COLUMNS.SHOUDLE_COMPLETE_TIME,
+  BASIC_TABLE_COLUMNS.INSPECT_TYPE,
+  BASIC_TABLE_COLUMNS.DUE_COMPLETE_TIME,
   BASIC_TABLE_COLUMNS.TASK_STAGE,
   BASIC_TABLE_COLUMNS.ACTION,
 ];

src/views/disaster/disaster-precaution/src/constants/task-execution.ts

@@ -7,11 +7,6 @@ export enum INSPECT_TYPE {
   Later,
 }
 
-// export enum OVERDUE_STATUS {
-//   OVERDUE = 1,
-//   NOT_OVERDUE = 0,
-// }
-
 export const INSPECT_TYPE_MAP: Record<number, string> = {
   [INSPECT_TYPE.Previous]: '台讯前期',
   [INSPECT_TYPE.Midterm]: '台讯中期',
@@ -69,3 +64,9 @@ export const TASK_STAGE_OPTIONS_MANAGEMENT = [
   },
   ...TASK_STAGE_OPTIONS_EXECUTION,
 ];
+
+export enum USER_TYPE {
+  CHECK_RESPONSIBLE = 1, // 检查责任人
+  CHECK_PERSON, // 检查员
+  APPROVER, // 审批人
+}