Procházet zdrojové kódy

fix:修复教育培训计划管理(管理员),员工培训记录卡管理代码格式问题

sunqijun před 2 měsíci
rodič
revize
9827814f3c
30 změnil soubory, kde provedl 3188 přidání a 3017 odebrání
  1. 75 92
      src/api/employee-training-record-card-management/index.ts
  2. 73 84
      src/api/production-education-training-plan-dept/index.ts
  3. 54 68
      src/api/production-education-training-plan/index.ts
  4. 55 52
      src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/components/addSafetySystem.vue
  5. 178 159
      src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/components/safetyOrganizationSystemManagementDetail.vue
  6. 53 57
      src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/configs/form.ts
  7. 1 1
      src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/configs/tables.ts
  8. 415 382
      src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/safetyOrganizationSystemManagement.vue
  9. 28 28
      src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/safetyOrganizationSystemManagementItem.vue
  10. 170 149
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/components/educationTrainingPlanManagementDetail.vue
  11. 125 101
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/components/issueEducationTrainingPlan.vue
  12. 31 36
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/configs/form.ts
  13. 17 17
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/configs/tables.ts
  14. 304 258
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/educationTrainingPlanManagement.vue
  15. 27 27
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/educationTrainingPlanManagementItem.vue
  16. 279 250
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/components/addTrainingInformation.vue
  17. 229 239
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/components/educationTrainingPlanManagementDeptDetail.vue
  18. 57 77
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/configs/form.ts
  19. 100 100
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/configs/tables.ts
  20. 194 167
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/educationTrainingPlanManagementDept.vue
  21. 23 23
      src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/educationTrainingPlanManagementDeptItem.vue
  22. 155 142
      src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/commonTable.vue
  23. 171 160
      src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/commonTable2.vue
  24. 129 134
      src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/employeeTrainingRecordCardManagementDetail.vue
  25. 7 8
      src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/fillDesc.vue
  26. 22 16
      src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/manageRule.vue
  27. 5 5
      src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/configs/form.ts
  28. 181 155
      src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/employeeTrainingRecordCardManagement.vue
  29. 27 27
      src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/employeeTrainingRecordCardManagementItem.vue
  30. 3 3
      utils/devProxy/staff/proxy.ts

+ 75 - 92
src/api/employee-training-record-card-management/index.ts

@@ -1,82 +1,71 @@
-/*
- * @Author: liuJie
- * @Date: 2026-02-13 15:28:09
- * @LastEditors: liuJie
- * @LastEditTime: 2026-02-25 10:41:24
- * @Describe: 员工培训记录卡管理
- */
+
 import { http } from '@/utils/http/axios';
 import type { QueryPageRequest, QueryPageResponse } from '@/types/basic-query';
 
 export interface EmployeeTableType {
-    id: number;
-    serialNum: number;
-    staffNo: number;
-    staffName: string;
-    staffBirthday: Date;
-    staffIdCard: string;
-    staffAddress: string;
-    staffImg?: string;
-    deptName: string;
-    dateOfJoining: Date;
-    highestDegree: string;
-    staffJob: string;
-    jobSeniority: string;
-    technicalLvl: string;
-    professionalTitle: string;
-    statusName: string;
-    createdUserName: string;
-    createdAt: Date;
-    updatedAt: Date;
-
+  id: number;
+  serialNum: number;
+  staffNo: number;
+  staffName: string;
+  staffBirthday: Date;
+  staffIdCard: string;
+  staffAddress: string;
+  staffImg?: string;
+  deptName: string;
+  dateOfJoining: Date;
+  highestDegree: string;
+  staffJob: string;
+  jobSeniority: string;
+  technicalLvl: string;
+  professionalTitle: string;
+  statusName: string;
+  createdUserName: string;
+  createdAt: Date;
+  updatedAt: Date;
 }
 
 // 分页查询参数接口
 export interface EducationStaffTrainingCardQueryParam {
-    pageNumber: number;
-    pageSize: number;
-    queryParam?: {
-        numOrName?: string;
-        status?: number | string;
-        dateOfJoiningStart?: string;
-        dateOfJoiningEnd?: string;
-    };
+  pageNumber: number;
+  pageSize: number;
+  queryParam?: {
+    numOrName?: string;
+    status?: number | string;
+    dateOfJoiningStart?: string;
+    dateOfJoiningEnd?: string;
+  };
 }
 
 // 员工培训记录卡项接口
 export interface EducationStaffTrainingCardItem {
-    id: number;
-    logType: number;
-    pestcId: number;
-    serialNum: number;
-    logDate: Date;
-    educationContentId: number;
-    educationContent: string;
-    scoreMust: number;
-    creditHour: number;
-    score: number;
-    operationCertificateNum: string;
-    trainingCompany: string;
-    educationSign: string;
-    createdUserName: string;
-    createdAt: string;
-    updatedAt: string;
-};
-
+  id: number;
+  logType: number;
+  pestcId: number;
+  serialNum: number;
+  logDate: Date;
+  educationContentId: number;
+  educationContent: string;
+  scoreMust: number;
+  creditHour: number;
+  score: number;
+  operationCertificateNum: string;
+  trainingCompany: string;
+  educationSign: string;
+  createdUserName: string;
+  createdAt: string;
+  updatedAt: string;
+}
 
 /**
  * 分页查询员工培训记录卡列表
  * @param data 查询参数
  */
-export function queryEducationStaffTrainingCardPage(
-    data: EducationStaffTrainingCardQueryParam
-) {
-    return http.request<QueryPageResponse<EducationStaffTrainingCardItem>>({
-        url: `/educationStaffTrainingCard/queryEducationStaffTrainingCard`,
-        method: 'post',
-        data,
-        
-    });
+export function queryEducationStaffTrainingCardPage(data: EducationStaffTrainingCardQueryParam) {
+  return http.request<QueryPageResponse<EducationStaffTrainingCardItem>>({
+    url: `/educationStaffTrainingCard/queryEducationStaffTrainingCard`,
+    method: 'post',
+    data,
+  });
 }
 
 /**
@@ -84,11 +73,10 @@ export function queryEducationStaffTrainingCardPage(
  * @param id 要删除的记录卡ID
  */
 export function deleteEducationStaffTrainingCard(id: number) {
-    return http.request<void>({
-        url: `/educationStaffTrainingCard/deleteEducationStaffTrainingCard?id=${id}`,
-        method: 'delete',
-        
-    });
+  return http.request<void>({
+    url: `/educationStaffTrainingCard/deleteEducationStaffTrainingCard?id=${id}`,
+    method: 'delete',
+  });
 }
 
 /**
@@ -96,27 +84,24 @@ export function deleteEducationStaffTrainingCard(id: number) {
  * @return {*}
  */
 export function getEducationStaffTrainingCardDetail(id: number) {
-    return http.request<EducationStaffTrainingCardItem>({
-        url: `/educationStaffTrainingCard/queryEducationStaffTrainingCardDetail?id=${id}`,
-        method: 'get',
-        
-    });
+  return http.request<EducationStaffTrainingCardItem>({
+    url: `/educationStaffTrainingCard/queryEducationStaffTrainingCardDetail?id=${id}`,
+    method: 'get',
+  });
 }
 
-
 // ______查看详情数据_____________
 
 /**
  * @description: 安全教育培训 员工培训记录卡-员工培训记录分页查询
  * @return {*}
  */
-export function getEmployeeDetailTableList(data:any){
-    return http.request<QueryPageResponse<EducationStaffTrainingCardItem>>({
-        url: `/educationStaffTrainingCard/queryEducationStaffTrainingCardLog`,
-        method: 'post',
-        data,
-        
-    }); 
+export function getEmployeeDetailTableList(data: any) {
+  return http.request<QueryPageResponse<EducationStaffTrainingCardItem>>({
+    url: `/educationStaffTrainingCard/queryEducationStaffTrainingCardLog`,
+    method: 'post',
+    data,
+  });
 }
 
 /**
@@ -124,12 +109,11 @@ export function getEmployeeDetailTableList(data:any){
  * @return {*}
  */
 export function updateEducationStaffTrainingCardScore(data: any) {
-    return http.request<void>({
-        url: `/educationStaffTrainingCard/updateEducationStaffTrainingCardLogScore`,
-        method: 'put',
-        data,
-        
-    });
+  return http.request<void>({
+    url: `/educationStaffTrainingCard/updateEducationStaffTrainingCardLogScore`,
+    method: 'put',
+    data,
+  });
 }
 
 /**
@@ -137,9 +121,8 @@ export function updateEducationStaffTrainingCardScore(data: any) {
  * @return {*}
  */
 export function delateEducationStaffTrainingCardScore(id: number) {
-    return http.request<void>({
-        url: `/educationStaffTrainingCard/deleteEducationStaffTrainingCardLog?id=${id}`,
-        method: 'delete',
-        
-    });
-}
+  return http.request<void>({
+    url: `/educationStaffTrainingCard/deleteEducationStaffTrainingCardLog?id=${id}`,
+    method: 'delete',
+  });
+}

+ 73 - 84
src/api/production-education-training-plan-dept/index.ts

@@ -1,137 +1,126 @@
-/*
- * @Author: liuJie
- * @Date: 2026-02-10 11:05:01
- * @LastEditors: liuJie
- * @LastEditTime: 2026-02-27 13:52:47
- * @Describe: 安全教育培训模块
- */
+
 import { http } from '@/utils/http/axios';
 import type { QueryPageRequest, QueryPageResponse } from '@/types/basic-query';
-import { id } from 'element-plus/es/locale';
 /**
  * 查询参数
  */
 export interface ProductionSafetyFileQuery {
-    keyword?: string; // 文件名称/编号(模糊查询)
-    status?: number; // 状态:1-启用,0-禁用
-    classifyName?: string; // 分类名称
-    startDate?: string; // 上传日期范围-开始日期
-    endDate?: string; // 上传日期范围-结束日期
+  keyword?: string; // 文件名称/编号(模糊查询)
+  status?: number; // 状态:1-启用,0-禁用
+  classifyName?: string; // 分类名称
+  startDate?: string; // 上传日期范围-开始日期
+  endDate?: string; // 上传日期范围-结束日期
 }
 
 // 新增、编辑表单数据类型
 export interface FormDataType {
-    id?: string; // 编辑时使用
-    trainingPlanName: string;
-    categoryName: string;
-    trainingContent: string;
-    trainingObject: string;
-    trainingCount: string;
-    trainingTime: string;
-    trainingMethod: string;
-    assessmentMethod: string;
-    responsibleDeptIds: string[];
-    studyHours: number | string; 
+  id?: string; // 编辑时使用
+  trainingPlanName: string;
+  categoryName: string;
+  trainingContent: string;
+  trainingObject: string;
+  trainingCount: string;
+  trainingTime: string;
+  trainingMethod: string;
+  assessmentMethod: string;
+  responsibleDeptIds: string[];
+  studyHours: number | string;
 }
 export interface FormSubmitDataType {
-    id?: number;
-    courseType: number;
-    petpiId: number;
-    courseName: string;
-    trainingMethod: string;
-    trainingTeacher: string;
-    planNumOfParticipants: number;
-    groupOfParticipants: Array<number>;
-    startDate: Date;
-    endDate: Date;
-    courseIntroduction: string;
-    courseContent: string;
-    isSign: number;
-    courseImg: string;
-};
+  id?: number;
+  courseType: number;
+  petpiId: number;
+  courseName: string;
+  trainingMethod: string;
+  trainingTeacher: string;
+  planNumOfParticipants: number;
+  groupOfParticipants: Array<number>;
+  startDate: Date;
+  endDate: Date;
+  courseIntroduction: string;
+  courseContent: string;
+  isSign: number;
+  courseImg: string;
+}
 
 export interface TableParamsType {
-    petpiId: number| string;
-    courseName: string;
-    dateStart: string;
-    dateEnd: string;
+  petpiId: number | string;
+  courseName: string;
+  dateStart: string;
+  dateEnd: string;
 }
 // -------------部门--------------
 /**
  * 获取教育培训计划管理(部门)-列表
  */
 export function getEducationAndTrainingProgramList(params: QueryPageRequest<ProductionSafetyFileQuery>) {
-    return http.request({
-        url: '/educationTrainingPlanIssuance/queryEducationTrainingPlanIssuance',
-        method: 'post',
-        params,
-        
-    });
+  return http.request({
+    url: '/educationTrainingPlanIssuance/queryEducationTrainingPlanIssuance',
+    method: 'post',
+    params,
+  });
 }
 
-
 /**
  * 安全教育培训 教育培训计划管理(部门)-添加培训课程
  */
-export function saveTrainingInformation(data: FormSubmitDataType) { 
-    return http.request({
-        url: '/educationTrainingPlanIssuance/saveEducationTrainingPlanCourse',
-        method: 'post',
-        data: data,
-    });
+export function saveTrainingInformation(data: FormSubmitDataType) {
+  return http.request({
+    url: '/educationTrainingPlanIssuance/saveEducationTrainingPlanCourse',
+    method: 'post',
+    data: data,
+  });
 }
 
 /**
  * 安全教育培训 教育培训计划管理(部门)-编辑培训课程
  */
-export function updateTrainingInformation(data: FormSubmitDataType) { 
-    return http.request({
-        url: '/educationTrainingPlanIssuance/updateEducationTrainingPlanCourse',
-        method: 'put',
-        data: data,
-        
-    });
+export function updateTrainingInformation(data: FormSubmitDataType) {
+  return http.request({
+    url: '/educationTrainingPlanIssuance/updateEducationTrainingPlanCourse',
+    method: 'put',
+    data: data,
+  });
 }
 
 /**
  * 安全教育培训 教育培训计划管理(部门)-培训计划中的课程列表
  */
-export function queryTrainingTableData(data: QueryPageRequest<TableParamsType>) { 
-    return http.request({
-        url: '/educationTrainingPlanIssuance/queryEducationTrainingPlanCourse',
-        method: 'post',
-        data: data,
-    });
+export function queryTrainingTableData(data: QueryPageRequest<TableParamsType>) {
+  return http.request({
+    url: '/educationTrainingPlanIssuance/queryEducationTrainingPlanCourse',
+    method: 'post',
+    data: data,
+  });
 }
 
 /**
  * 安全教育培训 教育培训计划管理(部门)-更新培训课程小结
  */
-export function updateEducationTrainingPlanCourseSummary(data: any) { 
-    return http.request({
-        url: '/educationTrainingPlanIssuance/updateEducationTrainingPlanCourseSummary',
-        method: 'put',
-        data,
-    });
+export function updateEducationTrainingPlanCourseSummary(data: any) {
+  return http.request({
+    url: '/educationTrainingPlanIssuance/updateEducationTrainingPlanCourseSummary',
+    method: 'put',
+    data,
+  });
 }
 
 /**
  * 安全教育培训 教育培训计划管理(部门)-培训计划中的课程-删除
  */
 export function deleteTrainingInformation(id: string | number) {
-    return http.request({
-        url: `/educationTrainingPlanIssuance/deleteEducationTrainingPlanCourse?id=${id}`,
-        method: 'delete',
-    });
+  return http.request({
+    url: `/educationTrainingPlanIssuance/deleteEducationTrainingPlanCourse?id=${id}`,
+    method: 'delete',
+  });
 }
 
 /**
  * 教育培训计划管理(部门)-详情
  */
 export function queryEducationAndTrainingProgramDetail(id: string | number) {
-    return http.request({
-        url: `/educationTrainingPlanIssuance/queryEducationTrainingPlanIssuanceDetail?id=${id}`,
-        method: 'get',
-    });
+  return http.request({
+    url: `/educationTrainingPlanIssuance/queryEducationTrainingPlanIssuanceDetail?id=${id}`,
+    method: 'get',
+  });
 }
-

+ 54 - 68
src/api/production-education-training-plan/index.ts

@@ -1,116 +1,102 @@
-/*
- * @Author: liuJie
- * @Date: 2026-02-10 11:05:01
- * @LastEditors: liuJie
- * @LastEditTime: 2026-02-26 15:40:29
- * @Describe: 安全教育培训模块
- */
+
 import { http } from '@/utils/http/axios';
 import type { QueryPageRequest, QueryPageResponse } from '@/types/basic-query';
 /**
  * 查询参数
  */
 export interface ProductionSafetyFileQuery {
-    keyword?: string; // 文件名称/编号(模糊查询)
-    status?: number; // 状态:1-启用,0-禁用
-    classifyName?: string; // 分类名称
-    startDate?: string; // 上传日期范围-开始日期
-    endDate?: string; // 上传日期范围-结束日期
+  keyword?: string; // 文件名称/编号(模糊查询)
+  status?: number; // 状态:1-启用,0-禁用
+  classifyName?: string; // 分类名称
+  startDate?: string; // 上传日期范围-开始日期
+  endDate?: string; // 上传日期范围-结束日期
 }
 
 // 新增、编辑表单数据类型
 export interface FormDataType {
-    id?: string; // 编辑时使用
-    trainingPlanName: string;
-    categoryName: string;
-    trainingContent: string;
-    trainingObject: string;
-    trainingCount: string;
-    trainingTime: string;
-    trainingMethod: string;
-    assessmentMethod: string;
-    responsibleDeptIds: string[];
-    studyHours: number | string; 
+  id?: string; // 编辑时使用
+  trainingPlanName: string;
+  categoryName: string;
+  trainingContent: string;
+  trainingObject: string;
+  trainingCount: string;
+  trainingTime: string;
+  trainingMethod: string;
+  assessmentMethod: string;
+  responsibleDeptIds: string[];
+  studyHours: number | string;
 }
 // -------------管理端--------------
 /**
  * 获取教育培训计划管理(管理员)-列表
  */
 export function getEducationAndTrainingProgramList(params: QueryPageRequest<ProductionSafetyFileQuery>) {
-    return http.request({
-        url: '/productioneducationtrainingplan/query-page',
-        method: 'post',
-        params,
-        
-    });
+  return http.request({
+    url: '/productioneducationtrainingplan/query-page',
+    method: 'post',
+    params,
+  });
 }
 /**
  * 教育培训计划管理(管理员)-新增
  */
-export function saveEducationAndTrainingProgram(data: any) { 
-    return http.request({
-        url: '/productioneducationtrainingplan/save',
-        method: 'post',
-        data: data,
-        
-    });
+export function saveEducationAndTrainingProgram(data: any) {
+  return http.request({
+    url: '/productioneducationtrainingplan/save',
+    method: 'post',
+    data: data,
+  });
 }
 
 /**
  * 教育培训计划管理(管理员)-更改
  */
-export function updateEducationAndTrainingProgram(data: any) { 
-    return http.request({
-        url: '/productioneducationtrainingplan/update',
-        method: 'put',
-        data: data,
-        
-    });
+export function updateEducationAndTrainingProgram(data: any) {
+  return http.request({
+    url: '/productioneducationtrainingplan/update',
+    method: 'put',
+    data: data,
+  });
 }
 
 /**
  * 教育培训计划管理(管理员)-下发
  */
-export function issueEducationAndTrainingProgram(data: any) { 
-    return http.request({
-        url: '/productioneducationtrainingplan/issue',
-        method: 'put',
-        data: data,
-        
-    });
+export function issueEducationAndTrainingProgram(data: any) {
+  return http.request({
+    url: '/productioneducationtrainingplan/issue',
+    method: 'put',
+    data: data,
+  });
 }
 
 /**
  * 教育培训计划管理(管理员)-作废
  */
-export function cancelEducationAndTrainingProgram(data: any) { 
-    return http.request({
-        url: '/productioneducationtrainingplan/cancel',
-        method: 'put',
-        data,
-        
-    });
+export function cancelEducationAndTrainingProgram(data: any) {
+  return http.request({
+    url: '/productioneducationtrainingplan/cancel',
+    method: 'put',
+    data,
+  });
 }
 
 /**
  * 教育培训计划管理(管理员)-删除
  */
 export function deleteEducationAndTrainingProgram(id: string | number) {
-    return http.request({
-        url: `/productioneducationtrainingplan/delete?id=${id}`,
-        method: 'delete',
-        
-    });
+  return http.request({
+    url: `/productioneducationtrainingplan/delete?id=${id}`,
+    method: 'delete',
+  });
 }
 
 /**
  * 教育培训计划管理(管理员)-详情
  */
 export function queryEducationAndTrainingProgramDetail(id: string | number) {
-    return http.request({
-        url: `/productioneducationtrainingplan/detail?id=${id}`,
-        method: 'get',
-        
-    });
+  return http.request({
+    url: `/productioneducationtrainingplan/detail?id=${id}`,
+    method: 'get',
+  });
 }
-

+ 55 - 52
src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/components/addSafetySystem.vue

@@ -6,68 +6,71 @@
  * @Describe: 添加组织
 -->
 <script lang="ts" setup>
-import { ref, watch } from 'vue'
+  import { ref, watch } from 'vue';
 
-const props = withDefaults(defineProps<{
-    visible?: boolean
-    data?: any
-}>(), {
-    visible: false,
-    data: () => ({})
-})
-const team = ref('')
-const emit = defineEmits(['update:visible', 'confirmAddSafetySystem'])
-const dialogVisible = ref(props.visible)
+  const props = withDefaults(
+    defineProps<{
+      visible?: boolean;
+      data?: any;
+    }>(),
+    {
+      visible: false,
+      data: () => ({}),
+    },
+  );
+  const team = ref('');
+  const emit = defineEmits(['update:visible', 'confirmAddSafetySystem']);
+  const dialogVisible = ref(props.visible);
 
-const title = ref('添加组织')
+  const title = ref('添加组织');
 
-
-watch(() => props.visible, val => {
-    dialogVisible.value = val
-    if (val) {
+  watch(
+    () => props.visible,
+    (val) => {
+      dialogVisible.value = val;
+      if (val) {
         if (props.data.type === 'parent' && props.data.action === 'add') {
-            title.value = '添加组织'
+          title.value = '添加组织';
         } else if (props.data.type === 'parent' && props.data.action === 'edit') {
-            title.value = '编辑组织'
-            team.value = props.data.orgName
+          title.value = '编辑组织';
+          team.value = props.data.orgName;
         } else if (props.data.type === 'children' && props.data.action === 'add') {
-            title.value = '添加子组织'
+          title.value = '添加子组织';
         } else {
-            title.value = '编辑子组织'
-            team.value = props.data.orgName
+          title.value = '编辑子组织';
+          team.value = props.data.orgName;
         }
-    }
-})
+      }
+    },
+  );
 
-watch(dialogVisible, val => {
-    emit('update:visible', val)
-})
+  watch(dialogVisible, (val) => {
+    emit('update:visible', val);
+  });
 
-const confirmSave = () => {
-    emit('confirmAddSafetySystem', { value: team.value, ...props.data })
-    handleClose()
-}
-function handleClose() {
-    dialogVisible.value = false
-    team.value = ''
-}
+  const confirmSave = () => {
+    emit('confirmAddSafetySystem', { value: team.value, ...props.data });
+    handleClose();
+  };
+  function handleClose() {
+    dialogVisible.value = false;
+    team.value = '';
+  }
 </script>
 <template>
-    <div class='content'>
-        <el-dialog v-model="dialogVisible" :title="title" width="500" :before-close="handleClose">
-            <div class="flex items-center">
-                <span style="width: 120px;">组织名称:</span>
-                <el-input v-model="team"></el-input>
-            </div>
-            <template #footer>
-                <div class="dialog-footer">
-                    <el-button @click="handleClose">取消</el-button>
-                    <el-button type="primary" @click="confirmSave">
-                        确认
-                    </el-button>
-                </div>
-            </template>
-        </el-dialog>
-    </div>
+  <div class="content">
+    <el-dialog v-model="dialogVisible" :title="title" width="500" :before-close="handleClose">
+      <div class="flex items-center">
+        <span style="width: 120px">组织名称:</span>
+        <el-input v-model="team"></el-input>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="handleClose">取消</el-button>
+          <el-button type="primary" @click="confirmSave"> 确认 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
 </template>
-<style lang="scss" scoped></style>
+<style lang="scss" scoped></style>

+ 178 - 159
src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/components/safetyOrganizationSystemManagementDetail.vue

@@ -1,228 +1,247 @@
 <template>
-    <main class="safety-platform-container__main">
-        <el-form ref="formRef" :model="form" :rules="rules" label-width="100px" style="max-width: 600px"
-            label-position="left">
-            <el-form-item label="员工工号:" prop="employeeId" required>
-                <el-input v-model="form.employeeId" placeholder="请输入员工工号" :disabled="isViewMode" />
-            </el-form-item>
-
-            <el-form-item label="员工姓名:" prop="employeeName" required>
-                <el-input v-model="form.employeeName" placeholder="请输入员工姓名" :disabled="isViewMode" />
-            </el-form-item>
-
-            <el-form-item label="组织名称:" prop="orgId" required>
-                <el-tree-select placeholder="请选择组织名称" v-model="form.orgId" :data="organizations" check-strictly
-                    :render-after-expand="false" @change="handleOrgChange" :disabled="isViewMode">
-                </el-tree-select>
-            </el-form-item>
-
-            <el-form-item label="岗位职责:" prop="jobResp" required>
-                <el-input v-model="form.jobResp" type="textarea" :rows="4" :maxlength="300" placeholder="请填写岗位职责"
-                    :disabled="isViewMode" />
-            </el-form-item>
-
-            <!-- 状态 -->
-            <el-form-item label="状态:" prop="status" required>
-                <el-radio-group v-model=form.status :disabled="isViewMode">
-                    <el-radio value="1">启用</el-radio>
-                    <el-radio value="2">禁用</el-radio>
-                </el-radio-group>
-            </el-form-item>
-        </el-form>
-    </main>
-    <footer class="safety-platform-container__footer">
-        <el-button @click="router.back()">返回</el-button>
-        <el-button v-if="!isViewMode" type="primary" @click="handleSubmit">
-            {{ isCreateMode ? '提交' : '保存' }}
-        </el-button>
-    </footer>
+  <main class="safety-platform-container__main">
+    <el-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      label-width="100px"
+      style="max-width: 600px"
+      label-position="left"
+    >
+      <el-form-item label="员工工号:" prop="employeeId" required>
+        <el-input v-model="form.employeeId" placeholder="请输入员工工号" :disabled="isViewMode" />
+      </el-form-item>
+
+      <el-form-item label="员工姓名:" prop="employeeName" required>
+        <el-input v-model="form.employeeName" placeholder="请输入员工姓名" :disabled="isViewMode" />
+      </el-form-item>
+
+      <el-form-item label="组织名称:" prop="orgId" required>
+        <el-tree-select
+          placeholder="请选择组织名称"
+          v-model="form.orgId"
+          :data="organizations"
+          check-strictly
+          :render-after-expand="false"
+          @change="handleOrgChange"
+          :disabled="isViewMode"
+        >
+        </el-tree-select>
+      </el-form-item>
+
+      <el-form-item label="岗位职责:" prop="jobResp" required>
+        <el-input
+          v-model="form.jobResp"
+          type="textarea"
+          :rows="4"
+          :maxlength="300"
+          placeholder="请填写岗位职责"
+          :disabled="isViewMode"
+        />
+      </el-form-item>
+
+      <!-- 状态 -->
+      <el-form-item label="状态:" prop="status" required>
+        <el-radio-group v-model="form.status" :disabled="isViewMode">
+          <el-radio value="1">启用</el-radio>
+          <el-radio value="2">禁用</el-radio>
+        </el-radio-group>
+      </el-form-item>
+    </el-form>
+  </main>
+  <footer class="safety-platform-container__footer">
+    <el-button @click="router.back()">返回</el-button>
+    <el-button v-if="!isViewMode" type="primary" @click="handleSubmit">
+      {{ isCreateMode ? '提交' : '保存' }}
+    </el-button>
+  </footer>
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, ref } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
-import { ElMessage } from 'element-plus';
-import { INVENTORY_FORM_CONFIG, INVENTORY_FORM_DATA, FORM_RULES } from '../configs/form';
-import {
+  import { computed, onMounted, ref } from 'vue';
+  import { useRoute, useRouter } from 'vue-router';
+  import { ElMessage } from 'element-plus';
+  import { INVENTORY_FORM_CONFIG, INVENTORY_FORM_DATA, FORM_RULES } from '../configs/form';
+  import {
     getSafetySystemList,
     addEmployee,
     updateEmployee,
-    employeeDetail
-} from '@/api/safety-organization-management';
+    employeeDetail,
+  } from '@/api/safety-organization-management';
 
-const router = useRouter();
-const route = useRoute();
+  const router = useRouter();
+  const route = useRoute();
 
-const operate = computed(() => (route.query.operate as string) || 'employee-create');
-const currentId = computed(() => Number(route.query.id));
+  const operate = computed(() => (route.query.operate as string) || 'employee-create');
+  const currentId = computed(() => Number(route.query.id));
 
-const isCreateMode = computed(() => operate.value === 'employee-create');
-const isEditMode = computed(() => operate.value === 'employee-edit');
-const isViewMode = computed(() => operate.value === 'employee-view');
+  const isCreateMode = computed(() => operate.value === 'employee-create');
+  const isEditMode = computed(() => operate.value === 'employee-edit');
+  const isViewMode = computed(() => operate.value === 'employee-view');
 
-// const { ruleFormData, formRules, ruleFormConfig, cloneRuleFormData, beforeRouteLeave } =
-//     useFormConfigHook(INVENTORY_FORM_CONFIG, INVENTORY_FORM_DATA);
+  // const { ruleFormData, formRules, ruleFormConfig, cloneRuleFormData, beforeRouteLeave } =
+  //     useFormConfigHook(INVENTORY_FORM_CONFIG, INVENTORY_FORM_DATA);
 
-// 查看模式下,所有字段设为只读
-const viewFormConfig = ref(
+  // 查看模式下,所有字段设为只读
+  const viewFormConfig = ref(
     INVENTORY_FORM_CONFIG.map((item) => ({
-        ...item,
-        componentProps: {
-            ...item.componentProps,
-            disabled: true,
-        },
+      ...item,
+      componentProps: {
+        ...item.componentProps,
+        disabled: true,
+      },
     })),
-);
-interface FormDataType {
+  );
+  interface FormDataType {
     id?: number;
     orgId?: string;
     employeeId: string;
     employeeName: string;
     jobResp: string;
     status: string;
-    selectedOrg?: any
-};
+    selectedOrg?: any;
+  }
 
-const form = ref<FormDataType>({
+  const form = ref<FormDataType>({
     id: undefined,
-    orgId: "",
-    employeeId: "",
-    employeeName: "",
-    jobResp: "",
-    status: "1",
-});
-const selectedOrg = ref({})
-// 表单验证规则
-const rules = ref(FORM_RULES);
-// 组织名称选项
-const organizations = ref([]);
-// 获取组织列表
-const fetchSafetyOrganizationTeamList = async () => {
+    orgId: '',
+    employeeId: '',
+    employeeName: '',
+    jobResp: '',
+    status: '1',
+  });
+  const selectedOrg = ref({});
+  // 表单验证规则
+  const rules = ref(FORM_RULES);
+  // 组织名称选项
+  const organizations = ref([]);
+  // 获取组织列表
+  const fetchSafetyOrganizationTeamList = async () => {
     try {
-        const res = await getSafetySystemList();
-        organizations.value = formatTreeData(res)
+      const res = await getSafetySystemList();
+      organizations.value = formatTreeData(res);
     } catch (error) {
-        ElMessage.error('获取组织列表失败');
+      ElMessage.error('获取组织列表失败');
     }
-};
-// 组织名称剔除空的children
-const formatTreeData = (data) => {
+  };
+  // 组织名称剔除空的children
+  const formatTreeData = (data) => {
     return data
-        .map(node => {
-            const children = node.children?.length ? formatTreeData(node.children) : undefined;
-            return {
-                value: node.orgId,
-                label: node.orgName,
-                orgId: node.orgId,
-                orgName: node.orgName,
-                children,
-            };
-        })
-        .filter(node => node); // 过滤掉无效节点
-};
-// 在树数据中根据 value 查找节点
-const findNodeByValue = (tree, value) => {
+      .map((node) => {
+        const children = node.children?.length ? formatTreeData(node.children) : undefined;
+        return {
+          value: node.orgId,
+          label: node.orgName,
+          orgId: node.orgId,
+          orgName: node.orgName,
+          children,
+        };
+      })
+      .filter((node) => node); // 过滤掉无效节点
+  };
+  // 在树数据中根据 value 查找节点
+  const findNodeByValue = (tree, value) => {
     if (!tree || !Array.isArray(tree)) {
-        return null;
+      return null;
     }
 
     for (const node of tree) {
-        // 如果当前节点的value匹配,返回该节点
-        if (node.value === value || node.orgId === value) {
-            return node;
-        }
-
-        // 如果有子节点,递归查找
-        if (node.children && node.children.length > 0) {
-            const found = findNodeByValue(node.children, value);
-            if (found) {
-                return found;
-            }
+      // 如果当前节点的value匹配,返回该节点
+      if (node.value === value || node.orgId === value) {
+        return node;
+      }
+
+      // 如果有子节点,递归查找
+      if (node.children && node.children.length > 0) {
+        const found = findNodeByValue(node.children, value);
+        if (found) {
+          return found;
         }
+      }
     }
 
     return null;
-};
+  };
 
-// 选中组织变化时的回调
-const handleOrgChange = (value) => {
+  // 选中组织变化时的回调
+  const handleOrgChange = (value) => {
     // 通过 value 在 organizations 树中查找对应的节点
     const selectedNode = findNodeByValue(organizations.value, value);
 
     if (selectedNode) {
-        // 存储当前选中的组织信息
-        form.value.orgId = selectedNode.orgId
-        selectedOrg.value = selectedNode
-    };
-};
-const computedFormConfig = computed(() => {
+      // 存储当前选中的组织信息
+      form.value.orgId = selectedNode.orgId;
+      selectedOrg.value = selectedNode;
+    }
+  };
+  const computedFormConfig = computed(() => {
     if (isViewMode.value) {
-        return viewFormConfig.value;
+      return viewFormConfig.value;
     }
     // return ruleFormConfig.value;
-});
+  });
 
-const formRef = ref();
+  const formRef = ref();
 
-const handleValidate = async () => {
+  const handleValidate = async () => {
     if (!formRef.value) return;
     const res = await formRef.value.validateField();
     return res;
-};
+  };
 
-const getDetail = async () => {
+  const getDetail = async () => {
     if (!currentId.value) return;
     try {
-        const res = await employeeDetail(currentId.value);
-        if (res) {
-            // 映射接口字段到表单字段
-            Object.assign(form.value, res)
-        }
-        // cloneRuleFormData();
+      const res = await employeeDetail(currentId.value);
+      if (res) {
+        // 映射接口字段到表单字段
+        Object.assign(form.value, res);
+      }
+      // cloneRuleFormData();
     } catch (e) {
-        console.error('获取物品库存详情失败:', e);
-        ElMessage.error('获取详情失败');
+      console.error('获取物品库存详情失败:', e);
+      ElMessage.error('获取详情失败');
     }
-};
+  };
 
-const handleSubmit = async () => {
+  const handleSubmit = async () => {
     const res = await handleValidate();
     if (!res) return;
     try {
-        console.log(res, form.value)
-
-        if (isCreateMode.value) {
-            await addEmployee(form.value);
-            ElMessage.success('创建成功');
-        } else if (isEditMode.value && currentId.value) {
-            await updateEmployee({
-                id: currentId.value,
-                ...form.value,
-            });
-            ElMessage.success('保存成功');
-        }
-
-        router.back();
+      console.log(res, form.value);
+
+      if (isCreateMode.value) {
+        await addEmployee(form.value);
+        ElMessage.success('创建成功');
+      } else if (isEditMode.value && currentId.value) {
+        await updateEmployee({
+          id: currentId.value,
+          ...form.value,
+        });
+        ElMessage.success('保存成功');
+      }
+
+      router.back();
     } catch (e) {
-        console.error('保存物品库存失败:', e);
-        ElMessage.error('保存失败,请重试');
+      console.error('保存物品库存失败:', e);
+      ElMessage.error('保存失败,请重试');
     }
-};
+  };
 
-onMounted(() => {
-    fetchSafetyOrganizationTeamList()
+  onMounted(() => {
+    fetchSafetyOrganizationTeamList();
     // cloneRuleFormData();
     // beforeRouteLeave();
     if (isEditMode.value || isViewMode.value) {
-        getDetail();
+      getDetail();
     }
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
 
-.el-form-item {
+  .el-form-item {
     margin-bottom: 30px;
-}
+  }
 </style>

+ 53 - 57
src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/configs/form.ts

@@ -8,71 +8,67 @@
 import { FormConfig } from '@/types/basic-form';
 
 export const INVENTORY_FORM_CONFIG: FormConfig[] = [
-    {
-        prop: 'itemName',
-        label: '员工工号:',
-        component: 'ElInput',
-        componentProps: {
-            placeholder: '请输入员工工号',
-        },
+  {
+    prop: 'itemName',
+    label: '员工工号:',
+    component: 'ElInput',
+    componentProps: {
+      placeholder: '请输入员工工号',
     },
-    {
-        prop: 'itemName',
-        label: '员工姓名:',
-        component: 'ElInput',
-        componentProps: {
-            placeholder: '请输入员工姓名',
-        },
+  },
+  {
+    prop: 'itemName',
+    label: '员工姓名:',
+    component: 'ElInput',
+    componentProps: {
+      placeholder: '请输入员工姓名',
     },
-    {
-        prop: 'itemQuantity',
-        label: '组织名称:',
-        component: 'ElSelect',
-        componentProps: {
-            placeholder: '请选择组织',
-        },
+  },
+  {
+    prop: 'itemQuantity',
+    label: '组织名称:',
+    component: 'ElSelect',
+    componentProps: {
+      placeholder: '请选择组织',
     },
-    {
-        label: '岗位职责:',
-        prop: 'remarks',
-        component: 'ElInput',
-        componentProps: {
-            type: 'textarea',
-            rows: 5,
-            placeholder: '请填写岗位职责',
-        },
-    },
-    {
-        prop: 'status',
-        label: '状态:',
-        slot: 'status',
+  },
+  {
+    label: '岗位职责:',
+    prop: 'remarks',
+    component: 'ElInput',
+    componentProps: {
+      type: 'textarea',
+      rows: 5,
+      placeholder: '请填写岗位职责',
     },
+  },
+  {
+    prop: 'status',
+    label: '状态:',
+    slot: 'status',
+  },
 ];
 
 export const INVENTORY_FORM_DATA = {
-    itemName: '',
-    warehouseDate: '',
-    itemQuantity: 1, // 最小值为1
-    remarks: '',
+  itemName: '',
+  warehouseDate: '',
+  itemQuantity: 1, // 最小值为1
+  remarks: '',
 };
 // 表单验证规则
 export const FORM_RULES = {
-    employeeId: [
-        { required: true, message: "请输入员工工号", trigger: "blur" },
-        { min: 1, max: 20, message: "长度在 1 到 20 个字符", trigger: "blur" },
-    ],
-    employeeName: [
-        { required: true, message: "请输入员工姓名", trigger: "blur" },
-        { min: 1, max: 10, message: "长度在 1 到 10 个字符", trigger: "blur" },
-    ],
-    organizationId: [
-        { required: true, message: "请选择组织名称", trigger: "change" },
-    ],
-    jobDuty: [
-        { required: true, message: "请填写岗位职责", trigger: "blur" },
-        { min: 1, max: 300, message: "最大字数300字", trigger: "blur" },
-    ],
-    status: [
-        { required: true, message: "请选择状态", trigger: "blur" },
-    ]
+  employeeId: [
+    { required: true, message: '请输入员工工号', trigger: 'blur' },
+    { min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur' },
+  ],
+  employeeName: [
+    { required: true, message: '请输入员工姓名', trigger: 'blur' },
+    { min: 1, max: 10, message: '长度在 1 到 10 个字符', trigger: 'blur' },
+  ],
+  organizationId: [{ required: true, message: '请选择组织名称', trigger: 'change' }],
+  jobDuty: [
+    { required: true, message: '请填写岗位职责', trigger: 'blur' },
+    { min: 1, max: 300, message: '最大字数300字', trigger: 'blur' },
+  ],
+  status: [{ required: true, message: '请选择状态', trigger: 'blur' }],
 };

+ 1 - 1
src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/configs/tables.ts

@@ -39,7 +39,7 @@ export const INVENTORY_TABLE_COLUMNS: TableColumnProps[] = [
     align: 'left',
     minWidth: '120px',
   },
-  
+
   {
     label: '组织名称',
     prop: 'orgName',

+ 415 - 382
src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/safetyOrganizationSystemManagement.vue

@@ -1,499 +1,532 @@
 <template>
-    <div class="safety-platform-container">
-        <header class="safety-platform-container__header">
-            <div class="breadcrumb-title"> 安全组织体系管理 </div>
-        </header>
-        <main class="safety-platform-container__main flex ">
-            <div class="nav">
-                <el-button type="primary" :icon="Plus" @click="addTeam('parent')">
-                    添加组织
-                </el-button>
-                <div class="collapse-wrapper">
-                    <el-collapse accordion v-model="activeName" v-if="fetchSafetyOrganizationList.length > 0">
-                        <el-collapse-item :name="item.orgId" v-for="item in fetchSafetyOrganizationList">
-                            <template #title="{ isActive }">
-                                <div :class="['title-wrapper', { 'is-active': isActive }]">
-                                    <span @click.stop="querySafetyTeamData('parent', item)">{{ item.orgName }}</span>
-                                    <div class="handler">
-                                        <el-button link size="small" type="primary"
-                                            @click.stop="handleCreateSafetySystem('children', item)">新增子组织</el-button>
-                                        <el-button link size="small" type="primary"
-                                            @click.stop="handleEditSafetySystem('parent', item, '')">编辑</el-button>
-                                        <el-button link size="small" type="danger"
-                                            @click.stop="handleDelSafetySystem('parent', item)">删除</el-button>
-                                    </div>
-                                </div>
-                            </template>
-                            <div class="collapse-item-content">
-                                <div v-if="item.children.length > 0">
-                                    <ul>
-                                        <li class="flex" v-for="children in item.children" :key="children.orgId">
-                                            <span @click="querySafetyTeamData('children', children)">
-                                                {{ children.orgName }}
-                                            </span>
-                                            <div class="handler">
-                                                <el-button link size="small" type="primary"
-                                                    @click.stop="handleEditSafetySystem('children', children, item.orgId)">编辑</el-button>
-                                                <el-button link size="small" type="danger"
-                                                    @click.stop="handleDelSafetySystem('children', children)">删除</el-button>
-                                            </div>
-                                        </li>
-                                    </ul>
-                                </div>
-                                <div v-else>
-                                    <el-empty description="未添加子组织" :image-size="40" />
-                                </div>
-                            </div>
-                        </el-collapse-item>
-                    </el-collapse>
-                    <div v-else>
-                        <el-empty description="未添加组织" />
-                    </div>
+  <div class="safety-platform-container">
+    <header class="safety-platform-container__header">
+      <div class="breadcrumb-title"> 安全组织体系管理 </div>
+    </header>
+    <main class="safety-platform-container__main flex">
+      <div class="nav">
+        <el-button type="primary" :icon="Plus" @click="addTeam('parent')"> 添加组织 </el-button>
+        <div class="collapse-wrapper">
+          <el-collapse accordion v-model="activeName" v-if="fetchSafetyOrganizationList.length > 0">
+            <el-collapse-item :name="item.orgId" v-for="item in fetchSafetyOrganizationList">
+              <template #title="{ isActive }">
+                <div :class="['title-wrapper', { 'is-active': isActive }]">
+                  <span @click.stop="querySafetyTeamData('parent', item)">{{ item.orgName }}</span>
+                  <div class="handler">
+                    <el-button link size="small" type="primary" @click.stop="handleCreateSafetySystem('children', item)"
+                      >新增子组织</el-button
+                    >
+                    <el-button link size="small" type="primary" @click.stop="handleEditSafetySystem('parent', item, '')"
+                      >编辑</el-button
+                    >
+                    <el-button link size="small" type="danger" @click.stop="handleDelSafetySystem('parent', item)"
+                      >删除</el-button
+                    >
+                  </div>
                 </div>
-                <AddSafetySystem v-model:visible="addSafetySystemVisible" :data="addSafetyOrganizationSystemFormData"
-                    @confirmAddSafetySystem="confirmAddSafetySystemCallback" />
-            </div>
-            <div class="search-table-container">
-                <header>
-                    <div class="act-search">
-                        <section class="select-box">
-                            <div class="select-box--item">
-                                <span>搜索工号/姓名:</span>
-                                <el-input v-model="tableQuery.queryParam.keyword" placeholder="搜索工号/姓名"
-                                    class="act-search-input" />
-                            </div>
-                            <div class="select-box--item">
-                                <span>状态:</span>
-                                <el-select v-model="tableQuery.queryParam.status" placeholder="请选择状态" clearable>
-                                    <el-option label="启用" value="1" />
-                                    <el-option label="禁用" value="2" />
-                                </el-select>
-                            </div>
-                            <div class="select-box--item">
-                                <span>日期范围:</span>
-                                <el-date-picker v-model="dateRange" @change="onchangeDateRange" type="daterange"
-                                    range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
-                                    value-format="YYYY-MM-DD" format="YYYY-MM-DD" />
-                            </div>
-                        </section>
-                        <section class="search-btn">
-                            <el-button type="primary" @click="handleSearch">查询</el-button>
-                            <el-button @click="handleReset">重置</el-button>
-                        </section>
-                    </div>
-                </header>
-
-                <div class="batch-table">
-                    <div style="position: relative">
-                        <el-button type="primary" class="search-table-container--button" @click="handleCreate">
-                            添加
-                        </el-button>
-                        <!-- <el-button plain class="search-table-container--button" @click="handleImport">
+              </template>
+              <div class="collapse-item-content">
+                <div v-if="item.children.length > 0">
+                  <ul>
+                    <li class="flex" v-for="children in item.children" :key="children.orgId">
+                      <span @click="querySafetyTeamData('children', children)">
+                        {{ children.orgName }}
+                      </span>
+                      <div class="handler">
+                        <el-button
+                          link
+                          size="small"
+                          type="primary"
+                          @click.stop="handleEditSafetySystem('children', children, item.orgId)"
+                          >编辑</el-button
+                        >
+                        <el-button
+                          link
+                          size="small"
+                          type="danger"
+                          @click.stop="handleDelSafetySystem('children', children)"
+                          >删除</el-button
+                        >
+                      </div>
+                    </li>
+                  </ul>
+                </div>
+                <div v-else>
+                  <el-empty description="未添加子组织" :image-size="40" />
+                </div>
+              </div>
+            </el-collapse-item>
+          </el-collapse>
+          <div v-else>
+            <el-empty description="未添加组织" />
+          </div>
+        </div>
+        <AddSafetySystem
+          v-model:visible="addSafetySystemVisible"
+          :data="addSafetyOrganizationSystemFormData"
+          @confirmAddSafetySystem="confirmAddSafetySystemCallback"
+        />
+      </div>
+      <div class="search-table-container">
+        <header>
+          <div class="act-search">
+            <section class="select-box">
+              <div class="select-box--item">
+                <span>搜索工号/姓名:</span>
+                <el-input
+                  v-model="tableQuery.queryParam.keyword"
+                  placeholder="搜索工号/姓名"
+                  class="act-search-input"
+                />
+              </div>
+              <div class="select-box--item">
+                <span>状态:</span>
+                <el-select v-model="tableQuery.queryParam.status" placeholder="请选择状态" clearable>
+                  <el-option label="启用" value="1" />
+                  <el-option label="禁用" value="2" />
+                </el-select>
+              </div>
+              <div class="select-box--item">
+                <span>日期范围:</span>
+                <el-date-picker
+                  v-model="dateRange"
+                  @change="onchangeDateRange"
+                  type="daterange"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  value-format="YYYY-MM-DD"
+                  format="YYYY-MM-DD"
+                />
+              </div>
+            </section>
+            <section class="search-btn">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button @click="handleReset">重置</el-button>
+            </section>
+          </div>
+        </header>
+
+        <div class="batch-table">
+          <div style="position: relative">
+            <el-button type="primary" class="search-table-container--button" @click="handleCreate"> 添加 </el-button>
+            <!-- <el-button plain class="search-table-container--button" @click="handleImport">
                             导入
                         </el-button>
                         <el-button plain class="search-table-container--button" @click="handleDownload">
                             导出
                         </el-button> -->
-                    </div>
-                    <BasicTable ref="basicTableRef" :tableData="tableData" :tableConfig="tableConfig"
-                        @update:pageSize="handleSizeChange" @update:pageNumber="handleCurrentChange">
-                        <template #status="scope">
-                            <span>
-                                {{ scope.row.status === 1 ? '启用' : scope.row.status === 2 ? '禁用' : '-' }}
-                            </span>
-                        </template>
-                        <template #action="scope">
-                            <div class="action-container--div" style="justify-content: left">
-                                <ActionButton text="编辑" @click="handleEdit(scope.row.id)" />
-                                <ActionButton text="删除" :popconfirm="{
-                                    title: '确定要删除?',
-                                }" @confirm="handleDelete(scope.row.id)" />
-                                <ActionButton text="查看" @click="handleView(scope.row.id)" />
-                            </div>
-                        </template>
-                    </BasicTable>
-                </div>
-            </div>
-        </main>
-        <BatchImport v-if="batchImportVisible" :visible="batchImportVisible" :import-api-url="importApiUrl"
-            :template-url="templateUrl" template-name="下载模板" :show-template="false" @close="batchImportVisible = false"
-            @update="handleUpdate" />
-    </div>
+          </div>
+          <BasicTable
+            ref="basicTableRef"
+            :tableData="tableData"
+            :tableConfig="tableConfig"
+            @update:pageSize="handleSizeChange"
+            @update:pageNumber="handleCurrentChange"
+          >
+            <template #status="scope">
+              <span>
+                {{ scope.row.status === 1 ? '启用' : scope.row.status === 2 ? '禁用' : '-' }}
+              </span>
+            </template>
+            <template #action="scope">
+              <div class="action-container--div" style="justify-content: left">
+                <ActionButton text="编辑" @click="handleEdit(scope.row.id)" />
+                <ActionButton
+                  text="删除"
+                  :popconfirm="{
+                    title: '确定要删除?',
+                  }"
+                  @confirm="handleDelete(scope.row.id)"
+                />
+                <ActionButton text="查看" @click="handleView(scope.row.id)" />
+              </div>
+            </template>
+          </BasicTable>
+        </div>
+      </div>
+    </main>
+    <BatchImport
+      v-if="batchImportVisible"
+      :visible="batchImportVisible"
+      :import-api-url="importApiUrl"
+      :template-url="templateUrl"
+      template-name="下载模板"
+      :show-template="false"
+      @close="batchImportVisible = false"
+      @update="handleUpdate"
+    />
+  </div>
 </template>
 
 <script setup lang="ts">
-import { onMounted, reactive, ref } from 'vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import { Plus } from '@element-plus/icons-vue';
-import BasicTable from '@/components/BasicTable.vue';
-import useTableConfig from '@/hooks/useTableConfigHook';
-import ActionButton from '@/components/ActionButton.vue';
-import { TABLE_OPTIONS, INVENTORY_TABLE_COLUMNS } from './configs/tables';
-import { useRouter } from 'vue-router';
-import type { QueryPageRequest } from '@/types/basic-query';
-import { queryInventoryManage, deleteInventory, exportInventory } from '@/api/inventory';
-import {
+  import { onMounted, reactive, ref } from 'vue';
+  import { ElMessage, ElMessageBox } from 'element-plus';
+  import { Plus } from '@element-plus/icons-vue';
+  import BasicTable from '@/components/BasicTable.vue';
+  import useTableConfig from '@/hooks/useTableConfigHook';
+  import ActionButton from '@/components/ActionButton.vue';
+  import { TABLE_OPTIONS, INVENTORY_TABLE_COLUMNS } from './configs/tables';
+  import { useRouter } from 'vue-router';
+  import type { QueryPageRequest } from '@/types/basic-query';
+  import { queryInventoryManage, deleteInventory, exportInventory } from '@/api/inventory';
+  import {
     getSafetySystemList,
     addSafetySystem,
     updateSafetySystem,
     deleteSafetySystem,
     fetchTableList,
-    delEmployee
-} from '@/api/safety-organization-management';
-import { downloadByData } from '@/utils/file/download';
-import BatchImport from '@/components/batch-import/BatchImport.vue';
-import { useGlobSetting } from '@/hooks/setting';
-import urlJoin from 'url-join';
-import { OptionsProps } from '@/types/log/constants';
-import { calculateTreeData } from '@/utils';
-import { getAllDepartments } from '@/api/auth/dept';
-import AddSafetySystem from './components/addSafetySystem.vue';
+    delEmployee,
+  } from '@/api/safety-organization-management';
+  import { downloadByData } from '@/utils/file/download';
+  import BatchImport from '@/components/batch-import/BatchImport.vue';
+  import { useGlobSetting } from '@/hooks/setting';
+  import urlJoin from 'url-join';
+  import { OptionsProps } from '@/types/log/constants';
+  import { calculateTreeData } from '@/utils';
+  import { getAllDepartments } from '@/api/auth/dept';
+  import AddSafetySystem from './components/addSafetySystem.vue';
 
-const router = useRouter();
-// 表格
-const basicTableRef = ref<InstanceType<typeof BasicTable>>();
+  const router = useRouter();
+  // 表格
+  const basicTableRef = ref<InstanceType<typeof BasicTable>>();
 
-const { tableConfig, pagination } = useTableConfig(INVENTORY_TABLE_COLUMNS, TABLE_OPTIONS);
+  const { tableConfig, pagination } = useTableConfig(INVENTORY_TABLE_COLUMNS, TABLE_OPTIONS);
 
-const tableData = ref<any[]>([]);
+  const tableData = ref<any[]>([]);
 
-const fetchSafetyOrganizationList = ref<any[]>([]);
+  const fetchSafetyOrganizationList = ref<any[]>([]);
 
-const activeName = ref('')
-// 日期范围(用于日期选择器)
-const dateRange = ref<[string, string] | string>('');
+  const activeName = ref('');
+  // 日期范围(用于日期选择器)
+  const dateRange = ref<[string, string] | string>('');
 
-const tableQuery = reactive<QueryPageRequest<any>>({
+  const tableQuery = reactive<QueryPageRequest<any>>({
     pageNumber: pagination.pageNumber,
     pageSize: pagination.pageSize,
     queryParam: {
-        classifyName: "",
-        keyword: "",
-        status: '',
-        startTime: "",
-        endTime: ""
+      classifyName: '',
+      keyword: '',
+      status: '',
+      startTime: '',
+      endTime: '',
     },
-});
-
-
+  });
 
-const handleSizeChange = (value: number) => {
+  const handleSizeChange = (value: number) => {
     pagination.pageSize = value;
     tableQuery.pageSize = value;
     getTableData();
-};
+  };
 
-const handleCurrentChange = (value: number) => {
+  const handleCurrentChange = (value: number) => {
     pagination.pageNumber = value;
     tableQuery.pageNumber = value;
     getTableData();
-};
+  };
 
-
-async function getTableData() {
+  async function getTableData() {
     tableConfig.loading = true;
     try {
-        const res = await fetchTableList(tableQuery);
-        if (res) {
-            // 映射返回数据字段到表格字段
-            tableData.value = res.records.map((item) => ({
-                id: item.id,
-                itemName: item.stuffName, // 物品名称
-                warehouseDate: item.inStoreTime, // 入库日期
-                itemQuantity: item.stuffQty, // 物品数量
-                handler: item.createdUserName, // 经办人
-                remarks: item.remark, // 备注
-                status: item.status, // 状态:1-启用,2-禁用
-                statusName: item.statusName, // 状态名称
-            }));
-            pagination.total = res.totalRow;
-        }
+      const res = await fetchTableList(tableQuery);
+      if (res) {
+        // 映射返回数据字段到表格字段
+        tableData.value = res.records.map((item) => ({
+          id: item.id,
+          itemName: item.stuffName, // 物品名称
+          warehouseDate: item.inStoreTime, // 入库日期
+          itemQuantity: item.stuffQty, // 物品数量
+          handler: item.createdUserName, // 经办人
+          remarks: item.remark, // 备注
+          status: item.status, // 状态:1-启用,2-禁用
+          statusName: item.statusName, // 状态名称
+        }));
+        pagination.total = res.totalRow;
+      }
     } catch (e) {
-        console.error('获取物品库存列表失败:', e);
-        tableData.value = [];
-        pagination.total = 0;
+      console.error('获取物品库存列表失败:', e);
+      tableData.value = [];
+      pagination.total = 0;
     } finally {
-        tableConfig.loading = false;
+      tableConfig.loading = false;
     }
-}
-
-
-interface addSafetyOrganizationSystemFormDataType {
-    type: String
-    orgName?: String
-    orgId?: String | number
-    action?: String
-    parentid?: String | number
-}
-
-const addSafetySystemVisible = ref(false)
-const addSafetyOrganizationSystemFormData = ref<addSafetyOrganizationSystemFormDataType>({
+  }
+
+  interface addSafetyOrganizationSystemFormDataType {
+    type: String;
+    orgName?: String;
+    orgId?: String | number;
+    action?: String;
+    parentid?: String | number;
+  }
+
+  const addSafetySystemVisible = ref(false);
+  const addSafetyOrganizationSystemFormData = ref<addSafetyOrganizationSystemFormDataType>({
     type: '',
     orgName: '',
     orgId: '',
     action: '',
-    parentid: ''
-})
-// 一级新增
-const addTeam = (type) => {
+    parentid: '',
+  });
+  // 一级新增
+  const addTeam = (type) => {
     addSafetyOrganizationSystemFormData.value = {
-        type,
-        action: 'add',
-    }
-    addSafetySystemVisible.value = true
-}
-// 获取组织列表
-const fetchSafetyOrganizationTeamList = async () => {
+      type,
+      action: 'add',
+    };
+    addSafetySystemVisible.value = true;
+  };
+  // 获取组织列表
+  const fetchSafetyOrganizationTeamList = async () => {
     try {
-        const res = await getSafetySystemList();
-        fetchSafetyOrganizationList.value = res;
+      const res = await getSafetySystemList();
+      fetchSafetyOrganizationList.value = res;
     } catch (error) {
-        ElMessage.error('获取组织列表失败');
+      ElMessage.error('获取组织列表失败');
     }
-};
-// 定义组织数据类型
-interface SafetySystemFormData {
+  };
+  // 定义组织数据类型
+  interface SafetySystemFormData {
     value: string; // 输入的组织名称
     action: 'add' | 'edit'; // 操作类型:新增或编辑
     orgId?: string | number; // 组织ID(编辑时必传)
     parentid?: string | number; // 父组织ID(新增子组织时必传)
     type?: 'children' | 'parent'; // 组织类型(子组织或根组织)
-}
+  }
 
-// 保存弹窗回调
-const confirmAddSafetySystemCallback = async (formData: SafetySystemFormData) => {
+  // 保存弹窗回调
+  const confirmAddSafetySystemCallback = async (formData: SafetySystemFormData) => {
     try {
-        if (!formData.value?.trim()) {
-            ElMessage.warning('请输入有效的组织名称!');
-            return;
+      if (!formData.value?.trim()) {
+        ElMessage.warning('请输入有效的组织名称!');
+        return;
+      }
+      const requestData = {
+        orgName: formData.value.trim(),
+        id: formData.action === 'edit' ? formData.orgId : undefined,
+        parentid: formData.action === 'add' ? formData.parentid : undefined,
+      };
+      // console.log(formData, 'formData')
+      if (formData.action === 'add') {
+        if (formData.type === 'children' && formData.orgId) {
+          requestData.parentid = formData.orgId;
         }
-        const requestData = {
-            orgName: formData.value.trim(),
-            id: formData.action === 'edit' ? formData.orgId : undefined,
-            parentid: formData.action === 'add' ? formData.parentid : undefined,
-        };
-        // console.log(formData, 'formData')
-        if (formData.action === 'add') {
-            if (formData.type === 'children' && formData.orgId) {
-                requestData.parentid = formData.orgId
-            }
-            await addSafetySystem(requestData)
-            ElMessage.success('新增组织成功!');
-        } else {
-            // 如果是子类,补充父级ID
-            if (formData.type === 'children' && formData.parentid) {
-                requestData.parentid = formData.parentid
-            }
-            await updateSafetySystem(requestData)
-            ElMessage.success('编辑组织成功!');
+        await addSafetySystem(requestData);
+        ElMessage.success('新增组织成功!');
+      } else {
+        // 如果是子类,补充父级ID
+        if (formData.type === 'children' && formData.parentid) {
+          requestData.parentid = formData.parentid;
         }
-        // 刷新列表
-        fetchSafetyOrganizationTeamList();
+        await updateSafetySystem(requestData);
+        ElMessage.success('编辑组织成功!');
+      }
+      // 刷新列表
+      fetchSafetyOrganizationTeamList();
     } catch (error) {
-        console.error('操作失败:', error);
-        ElMessage.error(formData.action === 'add' ? '新增组织失败!' : '编辑组织失败!');
+      console.error('操作失败:', error);
+      ElMessage.error(formData.action === 'add' ? '新增组织失败!' : '编辑组织失败!');
     }
-}
-// 二级新增
-const handleCreateSafetySystem = async (type, value) => {
+  };
+  // 二级新增
+  const handleCreateSafetySystem = async (type, value) => {
     addSafetyOrganizationSystemFormData.value = {
-        type,
-        action: 'add',
-        orgName: value.orgName,
-        orgId: value.orgId
-    }
-    addSafetySystemVisible.value = true
+      type,
+      action: 'add',
+      orgName: value.orgName,
+      orgId: value.orgId,
+    };
+    addSafetySystemVisible.value = true;
     // 打开某一个
-    activeName.value = value.orgId
-}
-// 编辑
-const handleEditSafetySystem = (type, value, parentid) => {
+    activeName.value = value.orgId;
+  };
+  // 编辑
+  const handleEditSafetySystem = (type, value, parentid) => {
     // console.log(value)
-    addSafetySystemVisible.value = true
+    addSafetySystemVisible.value = true;
     addSafetyOrganizationSystemFormData.value = {
-        type,
-        action: 'edit',
-        orgName: value.orgName,
-        orgId: value.orgId,
-        parentid
-    }
-}
-// 删除
-const handleDelSafetySystem = async (type, value) => {
+      type,
+      action: 'edit',
+      orgName: value.orgName,
+      orgId: value.orgId,
+      parentid,
+    };
+  };
+  // 删除
+  const handleDelSafetySystem = async (type, value) => {
     // console.log('删除', type, value)
     ElMessageBox.confirm('确认删除该组织吗?', '警告', { type: 'warning' }).then(async () => {
-        try {
-            await deleteSafetySystem(value.orgId);
-
-            ElMessage.success('删除成功');
-            // 刷新列表
-            fetchSafetyOrganizationTeamList();
-            handleReset()
-        } catch (error) {
-            ElMessage.error(error || '删除失败');
-        }
+      try {
+        await deleteSafetySystem(value.orgId);
+
+        ElMessage.success('删除成功');
+        // 刷新列表
+        fetchSafetyOrganizationTeamList();
+        handleReset();
+      } catch (error) {
+        ElMessage.error(error || '删除失败');
+      }
     });
-}
-// 查询
-const querySafetyTeamData = (type, value) => {
-    console.log(type, '查询', value)
-    tableQuery.queryParam.classifyName = value.orgId
-    getTableData()
-}
-// 时间查询
-const onchangeDateRange = () => {
-    tableQuery.queryParam.startTime = dateRange.value[0]
-    tableQuery.queryParam.endTime = dateRange.value[1]
-    getTableData()
-}
-const handleSearch = () => {
+  };
+  // 查询
+  const querySafetyTeamData = (type, value) => {
+    console.log(type, '查询', value);
+    tableQuery.queryParam.classifyName = value.orgId;
+    getTableData();
+  };
+  // 时间查询
+  const onchangeDateRange = () => {
+    tableQuery.queryParam.startTime = dateRange.value[0];
+    tableQuery.queryParam.endTime = dateRange.value[1];
+    getTableData();
+  };
+  const handleSearch = () => {
     pagination.pageNumber = 1;
     tableQuery.pageNumber = 1;
     getTableData();
-};
+  };
 
-const handleReset = () => {
+  const handleReset = () => {
     pagination.pageNumber = 1;
     tableQuery.queryParam = {
-        classifyName: "",
-        keyword: "",
-        status: "",// 重置为默认启用状态
-        startTime: "",
-        endTime: ""
+      classifyName: '',
+      keyword: '',
+      status: '', // 重置为默认启用状态
+      startTime: '',
+      endTime: '',
     };
-    dateRange.value = "";
+    dateRange.value = '';
     handleSearch();
-};
+  };
 
-// 批量导入
-const batchImportVisible = ref(false);
-const { urlPrefix } = useGlobSetting();
-const importApiUrl = ref(urlJoin(urlPrefix, '/inventory/importInventory'));
-const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-inventory-template.xlsx');
+  // 批量导入
+  const batchImportVisible = ref(false);
+  const { urlPrefix } = useGlobSetting();
+  const importApiUrl = ref(urlJoin(urlPrefix, '/inventory/importInventory'));
+  const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-inventory-template.xlsx');
 
-const handleImport = () => {
+  const handleImport = () => {
     batchImportVisible.value = true;
-};
+  };
 
-const handleUpdate = () => {
+  const handleUpdate = () => {
     batchImportVisible.value = false;
     getTableData();
-};
+  };
 
-const handleDownload = async () => {
+  const handleDownload = async () => {
     try {
-        const exportParams = {
-            stuffName: tableQuery.queryParam.stuffName || undefined,
-            status: tableQuery.queryParam.status,
-            ids: tableQuery.queryParam.ids.length > 0 ? tableQuery.queryParam.ids : undefined,
-        };
-        const response = await exportInventory(exportParams);
-        if (response) {
-            const fileName = `物品库存管理_${new Date().toISOString().split('T')[0]}.xlsx`;
-            downloadByData(response, fileName);
-            ElMessage.success('导出成功');
-        }
+      const exportParams = {
+        stuffName: tableQuery.queryParam.stuffName || undefined,
+        status: tableQuery.queryParam.status,
+        ids: tableQuery.queryParam.ids.length > 0 ? tableQuery.queryParam.ids : undefined,
+      };
+      const response = await exportInventory(exportParams);
+      if (response) {
+        const fileName = `物品库存管理_${new Date().toISOString().split('T')[0]}.xlsx`;
+        downloadByData(response, fileName);
+        ElMessage.success('导出成功');
+      }
     } catch (e) {
-        console.error('导出物品库存失败:', e);
-        ElMessage.error('导出失败,请重试');
+      console.error('导出物品库存失败:', e);
+      ElMessage.error('导出失败,请重试');
     }
-};
+  };
 
-const handleCreate = () => {
+  const handleCreate = () => {
     router.push({
-        name: 'SafetyOrganizationSystemManagementItem',
-        query: {
-            operate: 'employee-create',
-        },
+      name: 'SafetyOrganizationSystemManagementItem',
+      query: {
+        operate: 'employee-create',
+      },
     });
-};
+  };
 
-const handleEdit = (id: number) => {
+  const handleEdit = (id: number) => {
     router.push({
-        name: 'SafetyOrganizationSystemManagementItem',
-        query: {
-            id,
-            operate: 'employee-edit',
-        },
+      name: 'SafetyOrganizationSystemManagementItem',
+      query: {
+        id,
+        operate: 'employee-edit',
+      },
     });
-};
+  };
 
-const handleDelete = async (id: number) => {
+  const handleDelete = async (id: number) => {
     try {
-        await delEmployee(id);
-        ElMessage.success('删除成功');
-        getTableData();
+      await delEmployee(id);
+      ElMessage.success('删除成功');
+      getTableData();
     } catch (e) {
-        console.error('删除员工失败:', e);
-        ElMessage.error('删除失败,请重试');
+      console.error('删除员工失败:', e);
+      ElMessage.error('删除失败,请重试');
     }
-};
+  };
 
-const handleView = (id: number) => {
+  const handleView = (id: number) => {
     router.push({
-        name: 'SafetyOrganizationSystemManagementItem',
-        query: {
-            id,
-            operate: 'employee-view',
-        },
+      name: 'SafetyOrganizationSystemManagementItem',
+      query: {
+        id,
+        operate: 'employee-view',
+      },
     });
-};
+  };
 
-onMounted(() => {
-    fetchSafetyOrganizationTeamList()
+  onMounted(() => {
+    fetchSafetyOrganizationTeamList();
     getTableData();
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
-@use '@/styles/page-main-layout.scss' as *;
-@use '@/styles/basic-table-action.scss' as *;
-@use '@/views/traffic/violation/style/act-search-table.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
+  @use '@/styles/basic-table-action.scss' as *;
+  @use '@/views/traffic/violation/style/act-search-table.scss' as *;
 
-.nav {
+  .nav {
     width: 500px;
     margin-right: 15px;
     padding-right: 15px;
     border-right: 1px solid #eee;
 
     .collapse-wrapper {
-        margin-top: 10px;
+      margin-top: 10px;
+
+      .title-wrapper {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        width: 100%;
+
+        .handler {
+          flex: 1;
+          display: flex;
+          justify-content: flex-end;
+          align-items: center;
+          padding-right: 15px;
+        }
+      }
 
-        .title-wrapper {
+      .collapse-item-content {
+        ul {
+          padding-left: 40px;
+
+          li {
             display: flex;
             justify-content: space-between;
             align-items: center;
             width: 100%;
+            padding: 6px 0;
+            border-bottom: 1px solid #eeeeeed1;
 
-            .handler {
-                flex: 1;
-                display: flex;
-                justify-content: flex-end;
-                align-items: center;
-                padding-right: 15px;
-            }
-        }
-
-        .collapse-item-content {
-
-            ul {
-                padding-left: 40px;
-
-                li {
-                    display: flex;
-                    justify-content: space-between;
-                    align-items: center;
-                    width: 100%;
-                    padding: 6px 0;
-                    border-bottom: 1px solid #eeeeeed1;
-
-                    span {
-                        cursor: pointer;
-                    }
-                }
+            span {
+              cursor: pointer;
             }
+          }
         }
+      }
     }
-}
-</style>
+  }
+</style>

+ 28 - 28
src/views/production-safety/productionSafetySystem/safetyOrganizationSystemManagement/safetyOrganizationSystemManagementItem.vue

@@ -6,46 +6,46 @@
  * @Describe: file describe
 -->
 <template>
-    <div class="safety-platform-container">
-        <header class="safety-platform-container__header">
-            <BreadcrumbBack />
-            <span class="breadcrumb-title">{{ headerTitle }}</span>
-        </header>
-        <SafetyOrganizationSystemManagementDetail />
-    </div>
+  <div class="safety-platform-container">
+    <header class="safety-platform-container__header">
+      <BreadcrumbBack />
+      <span class="breadcrumb-title">{{ headerTitle }}</span>
+    </header>
+    <SafetyOrganizationSystemManagementDetail />
+  </div>
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
-import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
-import SafetyOrganizationSystemManagementDetail from './components/safetyOrganizationSystemManagementDetail.vue';
+  import { computed } from 'vue';
+  import { useRoute, useRouter } from 'vue-router';
+  import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
+  import SafetyOrganizationSystemManagementDetail from './components/safetyOrganizationSystemManagementDetail.vue';
 
-const route = useRoute();
-const router = useRouter();
-const operate = route.query.operate as string;
+  const route = useRoute();
+  const router = useRouter();
+  const operate = route.query.operate as string;
 
-const headerTitle = computed(() => {
+  const headerTitle = computed(() => {
     switch (operate) {
-        case 'employee-create':
-            return '新增员工';
-        case 'employee-edit':
-            return '编辑员工';
-        case 'employee-view':
-            return '查看员工';
-        default:
-            return '未知操作';
+      case 'employee-create':
+        return '新增员工';
+      case 'employee-edit':
+        return '编辑员工';
+      case 'employee-view':
+        return '查看员工';
+      default:
+        return '未知操作';
     }
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
-@use '@/styles/page-main-layout.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
 
-.safety-platform-container__header {
+  .safety-platform-container__header {
     flex-direction: row !important;
     justify-content: flex-start !important;
     gap: 8px !important;
-}
+  }
 </style>

+ 170 - 149
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/components/educationTrainingPlanManagementDetail.vue

@@ -1,95 +1,117 @@
 <template>
-    <main class="safety-platform-container__main">
-        <el-form :model="form" :rules="rules" ref="formRef" label-width="150px" style="max-width: 600px"
-            label-position="left">
-            <!-- 分类名称 -->
-            <el-form-item label="教育培训计划名称:" prop="trainingPlanName">
-                <el-input v-model="form.trainingPlanName" placeholder="输入教育培训计划名称" :disabled="isViewMode"></el-input>
-            </el-form-item>
-
-            <!-- 分类名称 -->
-            <el-form-item label="分类名称:" prop="categoryName">
-                <el-select v-model="form.categoryName" placeholder="请选择分类名称" filterable clearable
-                    :disabled="isViewMode">
-                    <el-option v-for="item in classifyNameOptions" :key="item.value" :label="item.label"
-                        :value="item.value" />
-                </el-select>
-            </el-form-item>
-
-            <!-- 培训名称(内容) -->
-            <el-form-item label="培训名称(内容):" prop="trainingContent">
-                <el-input v-model="form.trainingContent" placeholder="输入培训名称(内容)" :disabled="isViewMode" />
-            </el-form-item>
-
-            <!-- 培训对象 -->
-            <el-form-item label="培训对象:" prop="trainingObject">
-                <el-input v-model="form.trainingObject" placeholder="输入培训对象" :disabled="isViewMode" />
-            </el-form-item>
-
-            <!-- 培训人数 -->
-            <el-form-item label="培训人数:" prop="trainingCount">
-                <el-input v-model="form.trainingCount" placeholder="输入培训人数" :disabled="isViewMode" />
-            </el-form-item>
-
-            <!-- 培训时间 -->
-            <el-form-item label="培训时间:" prop="trainingTime">
-                <el-input v-model="form.trainingTime" placeholder="输入培训时间,如按需、12月等" :disabled="isViewMode" />
-            </el-form-item>
-
-            <!-- 培训方式 -->
-            <el-form-item label="培训方式:" prop="trainingMethod">
-                <el-input v-model="form.trainingMethod" placeholder="输入培训方式,如网络等" :disabled="isViewMode" />
-            </el-form-item>
-
-            <!-- 考核方式 -->
-            <el-form-item label="考核方式:" prop="assessmentMethod">
-                <el-input v-model="form.assessmentMethod" placeholder="输入考核方式,如网上学习/答题、发放材料等" :disabled="isViewMode" />
-            </el-form-item>
-
-            <!-- 培训责任部门 -->
-            <el-form-item label="培训责任部门:" prop="responsibleDeptIds">
-                <el-cascader v-model="form.responsibleDeptIds" :options="deptTree" :props="cascaderProp" clearable
-                    collapse-tags :show-all-levels="false" :max-collapse-tags="3" placeholder="选择培训责任名称"
-                    style="width: 100%" :disabled="isViewMode" />
-            </el-form-item>
-
-            <!-- 学时 -->
-            <el-form-item label="学时:" prop="studyHours">
-                <el-input v-model.number="form.studyHours" placeholder="输入学时,如6、2、8等,单位时" :disabled="isViewMode" />
-            </el-form-item>
-        </el-form>
-        <!-- 提交按钮 -->
-        <footer class="safety-platform-container__footer">
-            <el-button @click="router.back()">返回</el-button>
-            <el-button v-if="!isViewMode" type="primary" @click="handleSubmit">
-                {{ isCreateMode ? '提交' : '保存' }}
-            </el-button>
-        </footer>
-    </main>
+  <main class="safety-platform-container__main">
+    <el-form
+      :model="form"
+      :rules="rules"
+      ref="formRef"
+      label-width="150px"
+      style="max-width: 600px"
+      label-position="left"
+    >
+      <!-- 分类名称 -->
+      <el-form-item label="教育培训计划名称:" prop="trainingPlanName">
+        <el-input v-model="form.trainingPlanName" placeholder="输入教育培训计划名称" :disabled="isViewMode"></el-input>
+      </el-form-item>
+
+      <!-- 分类名称 -->
+      <el-form-item label="分类名称:" prop="categoryName">
+        <el-select v-model="form.categoryName" placeholder="请选择分类名称" filterable clearable :disabled="isViewMode">
+          <el-option v-for="item in classifyNameOptions" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+      </el-form-item>
+
+      <!-- 培训名称(内容) -->
+      <el-form-item label="培训名称(内容):" prop="trainingContent">
+        <el-input v-model="form.trainingContent" placeholder="输入培训名称(内容)" :disabled="isViewMode" />
+      </el-form-item>
+
+      <!-- 培训对象 -->
+      <el-form-item label="培训对象:" prop="trainingObject">
+        <el-input v-model="form.trainingObject" placeholder="输入培训对象" :disabled="isViewMode" />
+      </el-form-item>
+
+      <!-- 培训人数 -->
+      <el-form-item label="培训人数:" prop="trainingCount">
+        <el-input v-model="form.trainingCount" placeholder="输入培训人数" :disabled="isViewMode" />
+      </el-form-item>
+
+      <!-- 培训时间 -->
+      <el-form-item label="培训时间:" prop="trainingTime">
+        <el-input v-model="form.trainingTime" placeholder="输入培训时间,如按需、12月等" :disabled="isViewMode" />
+      </el-form-item>
+
+      <!-- 培训方式 -->
+      <el-form-item label="培训方式:" prop="trainingMethod">
+        <el-input v-model="form.trainingMethod" placeholder="输入培训方式,如网络等" :disabled="isViewMode" />
+      </el-form-item>
+
+      <!-- 考核方式 -->
+      <el-form-item label="考核方式:" prop="assessmentMethod">
+        <el-input
+          v-model="form.assessmentMethod"
+          placeholder="输入考核方式,如网上学习/答题、发放材料等"
+          :disabled="isViewMode"
+        />
+      </el-form-item>
+
+      <!-- 培训责任部门 -->
+      <el-form-item label="培训责任部门:" prop="responsibleDeptIds">
+        <el-cascader
+          v-model="form.responsibleDeptIds"
+          :options="deptTree"
+          :props="cascaderProp"
+          clearable
+          collapse-tags
+          :show-all-levels="false"
+          :max-collapse-tags="3"
+          placeholder="选择培训责任名称"
+          style="width: 100%"
+          :disabled="isViewMode"
+        />
+      </el-form-item>
+
+      <!-- 学时 -->
+      <el-form-item label="学时:" prop="studyHours">
+        <el-input v-model.number="form.studyHours" placeholder="输入学时,如6、2、8等,单位时" :disabled="isViewMode" />
+      </el-form-item>
+    </el-form>
+    <!-- 提交按钮 -->
+    <footer class="safety-platform-container__footer">
+      <el-button @click="router.back()">返回</el-button>
+      <el-button v-if="!isViewMode" type="primary" @click="handleSubmit">
+        {{ isCreateMode ? '提交' : '保存' }}
+      </el-button>
+    </footer>
+  </main>
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, ref, reactive } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
-import { ElMessage } from 'element-plus';
-import type { FormInstance, } from 'element-plus';
-import { FORM_RULES } from '../configs/form';
-import { queryEducationAndTrainingProgramDetail, saveEducationAndTrainingProgram, updateEducationAndTrainingProgram, type FormDataType } from '@/api/production-education-training-plan';
-import { DeptTree } from '@/types/dept/type';
-import { getAllDepartments } from '@/api/auth/dept';
-import { debounce } from 'lodash-es';
-const router = useRouter();
-const route = useRoute();
-
-const operate = computed(() => (route.query.operate as string) || 'education-training-plan-management-create');
-const currentId = computed(() => Number(route.query.id));
-
-const isCreateMode = computed(() => operate.value === 'education-training-plan-management-create');
-const isEditMode = computed(() => operate.value === 'education-training-plan-management-edit');
-const isViewMode = computed(() => operate.value === 'education-training-plan-management-view');
-
-// 表单数据
-const form = reactive<FormDataType>({
+  import { computed, onMounted, ref, reactive } from 'vue';
+  import { useRoute, useRouter } from 'vue-router';
+  import { ElMessage } from 'element-plus';
+  import type { FormInstance } from 'element-plus';
+  import { FORM_RULES } from '../configs/form';
+  import {
+    queryEducationAndTrainingProgramDetail,
+    saveEducationAndTrainingProgram,
+    updateEducationAndTrainingProgram,
+    type FormDataType,
+  } from '@/api/production-education-training-plan';
+  import { DeptTree } from '@/types/dept/type';
+  import { getAllDepartments } from '@/api/auth/dept';
+  import { debounce } from 'lodash-es';
+  const router = useRouter();
+  const route = useRoute();
+
+  const operate = computed(() => (route.query.operate as string) || 'education-training-plan-management-create');
+  const currentId = computed(() => Number(route.query.id));
+
+  const isCreateMode = computed(() => operate.value === 'education-training-plan-management-create');
+  const isEditMode = computed(() => operate.value === 'education-training-plan-management-edit');
+  const isViewMode = computed(() => operate.value === 'education-training-plan-management-view');
+
+  // 表单数据
+  const form = reactive<FormDataType>({
     trainingPlanName: '',
     categoryName: '',
     trainingContent: '',
@@ -100,112 +122,111 @@ const form = reactive<FormDataType>({
     assessmentMethod: '',
     responsibleDeptIds: [],
     studyHours: '',
-});
+  });
 
-// 分类名称选项
-const classifyNameOptions = ref<Array<{ label: string; value: string }>>([
+  // 分类名称选项
+  const classifyNameOptions = ref<Array<{ label: string; value: string }>>([
     { label: '全员安全培训', value: '全员安全培训' },
     { label: '新员工培训', value: '新员工培训' },
     { label: '岗位资质培训', value: '岗位资质培训' },
     { label: '生产作业安全培训', value: '生产作业安全培训' },
     { label: '安全管理人员培训', value: '安全管理人员培训' },
-]);
+  ]);
 
-
-const cascaderProp = {
+  const cascaderProp = {
     multiple: true,
     expandTrigger: 'hover',
     checkStrictly: true,
     emitPath: false,
     value: 'id',
     label: 'deptName',
-};
+  };
 
-// 获取级联部门数据
-const deptTree = ref<DeptTree[]>();
-const loadDeptTreeData = async () => {
+  // 获取级联部门数据
+  const deptTree = ref<DeptTree[]>();
+  const loadDeptTreeData = async () => {
     const result = await getAllDepartments();
     deptTree.value = result[0].children;
-};
+  };
 
-// 表单引用
-const formRef = ref<FormInstance>();
+  // 表单引用
+  const formRef = ref<FormInstance>();
 
-// 表单验证规则
-const rules = reactive(FORM_RULES);
+  // 表单验证规则
+  const rules = reactive(FORM_RULES);
 
-const handleValidate = async () => {
+  const handleValidate = async () => {
     if (!formRef.value) return;
     const res = await formRef.value.validateField();
     return res;
-};
-const parseDeptIds = (ids: string | string[] | number[] | undefined | null): number[] => {
+  };
+  const parseDeptIds = (ids: string | string[] | number[] | undefined | null): number[] => {
     if (!ids) {
-        return [];
+      return [];
     }
 
     if (Array.isArray(ids)) {
-        return ids.map((v: any) => Number(v)).filter(id => !isNaN(id));
+      return ids.map((v: any) => Number(v)).filter((id) => !isNaN(id));
     }
 
     return String(ids)
-        .split(',')
-        .map(Number)
-        .filter(id => !isNaN(id));
-}
-const getDetail = async () => {
+      .split(',')
+      .map(Number)
+      .filter((id) => !isNaN(id));
+  };
+  const getDetail = async () => {
     if (!currentId.value) return;
     try {
-        const res = await queryEducationAndTrainingProgramDetail(currentId.value);
-        if (res) {
-            Object.assign(form, {
-                ...res,
-                responsibleDeptIds: parseDeptIds(res.responsibleDeptIds)
-            })
-        }
+      const res = await queryEducationAndTrainingProgramDetail(currentId.value);
+      if (res) {
+        Object.assign(form, {
+          ...res,
+          responsibleDeptIds: parseDeptIds(res.responsibleDeptIds),
+        });
+      }
     } catch (e) {
-        ElMessage.error('获取详情失败');
+      ElMessage.error('获取详情失败');
     }
-};
+  };
 
-const handleSubmit = debounce(async () => {
+  const handleSubmit = debounce(async () => {
     const res = await handleValidate();
     if (!res) return;
     try {
-        const basePayload = {
-            ...form,
-            responsibleDeptIds: form.responsibleDeptIds.toString()
-        };
-
-        if (isCreateMode.value) {
-            await saveEducationAndTrainingProgram(basePayload);
-            ElMessage.success('创建成功');
-        } else if (isEditMode.value && currentId.value) {
-            await updateEducationAndTrainingProgram({
-                id: currentId.value,
-                ...basePayload,
-            });
-            ElMessage.success('保存成功');
-        }
-
-        router.back();
+      const basePayload = {
+        ...form,
+        responsibleDeptIds: form.responsibleDeptIds.toString(),
+      };
+
+      if (isCreateMode.value) {
+        await saveEducationAndTrainingProgram(basePayload);
+        ElMessage.success('创建成功');
+      } else if (isEditMode.value && currentId.value) {
+        await updateEducationAndTrainingProgram({
+          id: currentId.value,
+          ...basePayload,
+        });
+        ElMessage.success('保存成功');
+      }
+
+      router.back();
     } catch (e) {
-        ElMessage.error('保存失败,请重试');
+      ElMessage.error('保存失败,请重试');
     }
-}, 1000);
+  }, 1000);
 
-onMounted(() => {
-    loadDeptTreeData()
+  onMounted(() => {
+    loadDeptTreeData();
     if (isEditMode.value || isViewMode.value) {
-        getDetail();
+      getDetail();
     }
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
 
-.el-form-item {
+  .el-form-item {
     margin-bottom: 25px;
-}
+  }
 </style>

+ 125 - 101
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/components/issueEducationTrainingPlan.vue

@@ -1,125 +1,149 @@
 <script lang="ts" setup>
-import { ref, reactive, onMounted, watch } from 'vue';
-import { queryUserGroupPage } from '@/api/system/person-group';
-import { IssueWorkPlanFormRules } from '../configs/form';
-import { DistributeParameters } from '../configs/tables'
-import { type FormInstance } from 'element-plus';
+  import { ref, reactive, onMounted, watch } from 'vue';
+  import { queryUserGroupPage } from '@/api/system/person-group';
+  import { IssueWorkPlanFormRules } from '../configs/form';
+  import { DistributeParameters } from '../configs/tables';
+  import { type FormInstance } from 'element-plus';
 
-const props = defineProps<{
-    data: any,
-    visible
-}>();
-const emit = defineEmits(['update:visible', 'confirm'])
-/**
- * @description: 下发参数
- * @return {*}
- */
+  const props = defineProps<{
+    data: any;
+    visible;
+  }>();
+  const emit = defineEmits(['update:visible', 'confirm']);
+  /**
+   * @description: 下发参数
+   * @return {*}
+   */
 
-const issueWorkPlanForm = reactive<DistributeParameters>({
+  const issueWorkPlanForm = reactive<DistributeParameters>({
     id: 0,
-    groupId: "",
-    startTime: "",
-    endTime: "",
-    responsibleDeptIds: "",
-})
-const dialogVisible = ref(props.visible);
+    groupId: '',
+    startTime: '',
+    endTime: '',
+    responsibleDeptIds: '',
+  });
+  const dialogVisible = ref(props.visible);
 
-watch(() => props.visible, (newVal) => {
-    dialogVisible.value = newVal;
-});
-watch(dialogVisible, (newVal) => {
+  watch(
+    () => props.visible,
+    (newVal) => {
+      dialogVisible.value = newVal;
+    },
+  );
+  watch(dialogVisible, (newVal) => {
     emit('update:visible', newVal);
-});
+  });
 
-watch(() => props.data, (newData) => {
-    if (!newData) return;
-    Object.assign(issueWorkPlanForm, {
+  watch(
+    () => props.data,
+    (newData) => {
+      if (!newData) return;
+      Object.assign(issueWorkPlanForm, {
         id: newData.id,
         responsibleDeptIds: newData.responsibleDeptIds,
-        groupId: "",
-        startTime: "",
-        endTime: "",
-    });
-}, { immediate: true, deep: true })
-
-
-/**
- * @description: 下发rules验证
- * @param {*} value
- * @return {*}
- */
-const issueWorkPlanFormRules = ref(IssueWorkPlanFormRules)
-
+        groupId: '',
+        startTime: '',
+        endTime: '',
+      });
+    },
+    { immediate: true, deep: true },
+  );
 
+  /**
+   * @description: 下发rules验证
+   * @param {*} value
+   * @return {*}
+   */
+  const issueWorkPlanFormRules = ref(IssueWorkPlanFormRules);
 
-const groupList = ref<any>([]);
-// 获取级联部门分组数据
-const loadGroupTreeData = async () => {
+  const groupList = ref<any>([]);
+  // 获取级联部门分组数据
+  const loadGroupTreeData = async () => {
     queryUserGroupPage({
-        pageNumber: 1,
-        pageSize: 500,
+      pageNumber: 1,
+      pageSize: 500,
     }).then((res) => {
-        groupList.value = res.records;
+      groupList.value = res.records;
     });
-};
-const handleCancelIssue = () => {
+  };
+  const handleCancelIssue = () => {
     dialogVisible.value = false;
-}
-// 表单引用
-const formRef = ref<FormInstance>();
-const handleConfirmIssue = async () => {
+  };
+  // 表单引用
+  const formRef = ref<FormInstance>();
+  const handleConfirmIssue = async () => {
     if (!formRef.value) return;
     const res = await formRef.value.validateField();
     if (res) {
-        emit('confirm', issueWorkPlanForm)
-        handleCancelIssue()
+      emit('confirm', issueWorkPlanForm);
+      handleCancelIssue();
     }
-};
-onMounted(() => {
-    loadGroupTreeData()
-})
+  };
+  onMounted(() => {
+    loadGroupTreeData();
+  });
 </script>
 <template>
-    <div class='content'>
-        <el-dialog v-model="dialogVisible" title="下发安全教育培训计划任务" width="600" :close-on-click-modal="false"
-            :close-on-press-escape="false" @close="handleCancelIssue">
-            <div>
-                <el-form ref="formRef" :model="issueWorkPlanForm" :rules="issueWorkPlanFormRules" label-width="200px">
-                    <!-- 培训责任部门 -->
-                    <el-form-item label="培训责任部门:" prop="responsibleDeptIds">
-                        <el-select v-model="issueWorkPlanForm.responsibleDeptIds" :disabled="true" size="large"
-                            placeholder="分组名称" style="width: 100%">
-                            <el-option :label="props.data.responsibleNames" :value="props.data.responsibleDeptIds" />
-                        </el-select>
-                    </el-form-item>
+  <div class="content">
+    <el-dialog
+      v-model="dialogVisible"
+      title="下发安全教育培训计划任务"
+      width="600"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      @close="handleCancelIssue"
+    >
+      <div>
+        <el-form ref="formRef" :model="issueWorkPlanForm" :rules="issueWorkPlanFormRules" label-width="200px">
+          <!-- 培训责任部门 -->
+          <el-form-item label="培训责任部门:" prop="responsibleDeptIds">
+            <el-select
+              v-model="issueWorkPlanForm.responsibleDeptIds"
+              :disabled="true"
+              size="large"
+              placeholder="分组名称"
+              style="width: 100%"
+            >
+              <el-option :label="props.data.responsibleNames" :value="props.data.responsibleDeptIds" />
+            </el-select>
+          </el-form-item>
 
-                    <el-form-item label="培训责任部门责任人分组:" prop="groupId">
-                        <el-select v-model="issueWorkPlanForm.groupId" size="large" placeholder="请选择培训责任部门责任人所在分组名称"
-                            style="width: 100%">
-                            <el-option v-for="group in groupList" :key="group.id" :label="group.name"
-                                :value="group.id" />
-                        </el-select>
-                    </el-form-item>
+          <el-form-item label="培训责任部门责任人分组:" prop="groupId">
+            <el-select
+              v-model="issueWorkPlanForm.groupId"
+              size="large"
+              placeholder="请选择培训责任部门责任人所在分组名称"
+              style="width: 100%"
+            >
+              <el-option v-for="group in groupList" :key="group.id" :label="group.name" :value="group.id" />
+            </el-select>
+          </el-form-item>
 
-                    <el-form-item label="计划开始时间:" prop="startTime">
-                        <el-date-picker v-model="issueWorkPlanForm.startTime" type="date" placeholder="请选择完成时间"
-                            style="width: 100%" />
-                    </el-form-item>
+          <el-form-item label="计划开始时间:" prop="startTime">
+            <el-date-picker
+              v-model="issueWorkPlanForm.startTime"
+              type="date"
+              placeholder="请选择完成时间"
+              style="width: 100%"
+            />
+          </el-form-item>
 
-                    <el-form-item label="计划完成时间:" prop="endTime">
-                        <el-date-picker v-model="issueWorkPlanForm.endTime" type="date" placeholder="请选择完成时间"
-                            style="width: 100%" />
-                    </el-form-item>
-                </el-form>
-            </div>
-            <template #footer>
-                <div class="dialog-footer">
-                    <el-button @click="handleCancelIssue">取消</el-button>
-                    <el-button type="primary" @click="handleConfirmIssue">
-                        确认
-                    </el-button>
-                </div>
-            </template>
-        </el-dialog>
-    </div>
-</template>
+          <el-form-item label="计划完成时间:" prop="endTime">
+            <el-date-picker
+              v-model="issueWorkPlanForm.endTime"
+              type="date"
+              placeholder="请选择完成时间"
+              style="width: 100%"
+            />
+          </el-form-item>
+        </el-form>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="handleCancelIssue">取消</el-button>
+          <el-button type="primary" @click="handleConfirmIssue"> 确认 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>

+ 31 - 36
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/configs/form.ts

@@ -7,40 +7,35 @@
  */
 
 export const FORM_RULES = {
-    trainingPlanName: [{ required: true, message: '请输入分类名称', trigger: 'blur' }],
-    categoryName: [{ required: true, message: '请输入分类名称', trigger: 'change' }],
-    trainingContent: [{ required: true, message: '请输入培训名称(内容)', trigger: 'blur' }],
-    trainingObject: [{ required: true, message: '请输入培训对象', trigger: 'blur' }],
-    trainingCount: [{ required: true, message: '请输入培训人数', trigger: 'blur' }],
-    trainingTime: [{ required: true, message: '请输入培训时间', trigger: 'blur' }],
-    trainingMethod: [{ required: true, message: '请输入培训方式', trigger: 'blur' }],
-    assessmentMethod: [{ required: true, message: '请输入考核方式', trigger: 'blur' }],
-    responsibleDeptIds: [
-        { required: true, type: 'array', message: '请选择培训责任部门', trigger: 'change' },
-    ],
-    studyHours: [
-        { required: true, message: '请输入学时', trigger: 'blur' },
-        { type: 'number', message: '学时必须为数字', trigger: 'blur' }, 
-    ],
-}
+  trainingPlanName: [{ required: true, message: '请输入分类名称', trigger: 'blur' }],
+  categoryName: [{ required: true, message: '请输入分类名称', trigger: 'change' }],
+  trainingContent: [{ required: true, message: '请输入培训名称(内容)', trigger: 'blur' }],
+  trainingObject: [{ required: true, message: '请输入培训对象', trigger: 'blur' }],
+  trainingCount: [{ required: true, message: '请输入培训人数', trigger: 'blur' }],
+  trainingTime: [{ required: true, message: '请输入培训时间', trigger: 'blur' }],
+  trainingMethod: [{ required: true, message: '请输入培训方式', trigger: 'blur' }],
+  assessmentMethod: [{ required: true, message: '请输入考核方式', trigger: 'blur' }],
+  responsibleDeptIds: [{ required: true, type: 'array', message: '请选择培训责任部门', trigger: 'change' }],
+  studyHours: [
+    { required: true, message: '请输入学时', trigger: 'blur' },
+    { type: 'number', message: '学时必须为数字', trigger: 'blur' },
+  ],
+};
 
-export const  IssueWorkPlanFormRules = {
-    responsibleDeptIds:[{ required: true, message: '请选择培训责任部门', trigger: 'change' }],
-    groupId: [
-        {
-            required: true,
-            validator(_rule, value, callback) {
-                const empty =
-                    value === '' ||
-                    value === null ||
-                    value === undefined ||
-                    (Array.isArray(value) && value.length === 0);
-                if (empty) callback(new Error('请选择计划执行部门分组'));
-                else callback();
-            },
-            trigger: 'change',
-        },
-    ],
-    startTime:[{ required: true, message: '请选择计划开始日期', trigger: 'change' }],
-    endTime:[{ required: true, message: '请选择计划结束日期', trigger: 'change' }],
-}
+export const IssueWorkPlanFormRules = {
+  responsibleDeptIds: [{ required: true, message: '请选择培训责任部门', trigger: 'change' }],
+  groupId: [
+    {
+      required: true,
+      validator(_rule, value, callback) {
+        const empty =
+          value === '' || value === null || value === undefined || (Array.isArray(value) && value.length === 0);
+        if (empty) callback(new Error('请选择计划执行部门分组'));
+        else callback();
+      },
+      trigger: 'change',
+    },
+  ],
+  startTime: [{ required: true, message: '请选择计划开始日期', trigger: 'change' }],
+  endTime: [{ required: true, message: '请选择计划结束日期', trigger: 'change' }],
+};

+ 17 - 17
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/configs/tables.ts

@@ -15,28 +15,28 @@ export const TABLE_OPTIONS = {
 };
 // 下发参数
 export interface DistributeParameters {
-    id: string|number;
-    groupId: string;
-    startTime: string;
-    endTime: string;
-    responsibleDeptIds: string;
-};
+  id: string | number;
+  groupId: string;
+  startTime: string;
+  endTime: string;
+  responsibleDeptIds: string;
+}
 
 // 状态选项
 export const STATUS_OPTIONS = [
-    { label: '全部', value: '' },
-    { label: '未下发', value: 1 },
-    { label: '进行中', value: 2 },
-    { label: '已完成', value: 3 },
-    { label: '已作废', value: 4 },
+  { label: '全部', value: '' },
+  { label: '未下发', value: 1 },
+  { label: '进行中', value: 2 },
+  { label: '已完成', value: 3 },
+  { label: '已作废', value: 4 },
 ];
 
 // 状态标签映射
 export const STATUS_LABEL: Record<string, string> = {
-    '1': '未下发',
-    '2': '进行中',
-    '3': '已完成',
-    '4': '已作废',
+  '1': '未下发',
+  '2': '进行中',
+  '3': '已完成',
+  '4': '已作废',
 };
 
 export const TABLE_COLUMNS: TableColumnProps[] = [
@@ -108,7 +108,7 @@ export const TABLE_COLUMNS: TableColumnProps[] = [
     align: 'left',
     minWidth: '200px',
   },
-   {
+  {
     label: '学时',
     prop: 'studyHours',
     align: 'center',
@@ -126,7 +126,7 @@ export const TABLE_COLUMNS: TableColumnProps[] = [
     align: 'center',
     minWidth: '200px',
   },
-   {
+  {
     label: '计划开始时间',
     prop: 'startTime',
     align: 'center',

+ 304 - 258
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/educationTrainingPlanManagement.vue

@@ -1,342 +1,388 @@
 <template>
-    <div class="safety-platform-container">
-        <header class="safety-platform-container__header">
-            <div class="breadcrumb-title"> 教育培训计划管理</div>
-        </header>
-        <main class="safety-platform-container__main">
-            <div class="search-table-container">
-                <header>
-                    <div style="position: relative">
-                        <el-button type="primary" class="search-table-container--button" @click="handleCreate">
-                            添加
-                        </el-button>
-                        <!-- <el-button plain class="search-table-container--button" @click="handleImport">
+  <div class="safety-platform-container">
+    <header class="safety-platform-container__header">
+      <div class="breadcrumb-title"> 教育培训计划管理</div>
+    </header>
+    <main class="safety-platform-container__main">
+      <div class="search-table-container">
+        <header>
+          <div style="position: relative">
+            <el-button type="primary" class="search-table-container--button" @click="handleCreate"> 添加 </el-button>
+            <!-- <el-button plain class="search-table-container--button" @click="handleImport">
                             导入
                         </el-button>
                         <el-button plain class="search-table-container--button" @click="handleDownload">
                             导出
                         </el-button> -->
-                    </div>
-                    <div class="act-search">
-                        <section class="select-box">
-                            <div class="select-box--item">
-                                <span>培训内容/计划名称:</span>
-                                <el-input v-model="tableQuery.queryParam.keyword" placeholder="搜索培训内容或计划名称"
-                                    class="act-search-input" />
-                            </div>
-                            <div class="select-box--item">
-                                <span>状态:</span>
-                                <el-select v-model="tableQuery.queryParam.status" placeholder="请选择状态" clearable>
-                                    <el-option v-for="item in STATUS_OPTIONS" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </div>
-                            <div class="select-box--item">
-                                <span>分类名称:</span>
-                                <el-select v-model="tableQuery.queryParam.categoryName" placeholder="请选择分类名称" filterable
-                                    clearable>
-                                    <el-option v-for="item in classifyNameOptions" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </div>
-                            <div>
-                                <span>计划日期范围:</span>
-                                <el-date-picker v-model="dateRange" type="daterange" range-separator="至"
-                                    start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD"
-                                    format="YYYY-MM-DD" />
-                            </div>
-                        </section>
-                        <section class="search-btn">
-                            <el-button type="primary" @click="handleSearch">查询</el-button>
-                            <el-button @click="handleReset">重置</el-button>
-                        </section>
-                    </div>
-                </header>
+          </div>
+          <div class="act-search">
+            <section class="select-box">
+              <div class="select-box--item">
+                <span>培训内容/计划名称:</span>
+                <el-input
+                  v-model="tableQuery.queryParam.keyword"
+                  placeholder="搜索培训内容或计划名称"
+                  class="act-search-input"
+                />
+              </div>
+              <div class="select-box--item">
+                <span>状态:</span>
+                <el-select v-model="tableQuery.queryParam.status" placeholder="请选择状态" clearable>
+                  <el-option v-for="item in STATUS_OPTIONS" :key="item.value" :label="item.label" :value="item.value" />
+                </el-select>
+              </div>
+              <div class="select-box--item">
+                <span>分类名称:</span>
+                <el-select
+                  v-model="tableQuery.queryParam.categoryName"
+                  placeholder="请选择分类名称"
+                  filterable
+                  clearable
+                >
+                  <el-option
+                    v-for="item in classifyNameOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </div>
+              <div>
+                <span>计划日期范围:</span>
+                <el-date-picker
+                  v-model="dateRange"
+                  type="daterange"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  value-format="YYYY-MM-DD"
+                  format="YYYY-MM-DD"
+                />
+              </div>
+            </section>
+            <section class="search-btn">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button @click="handleReset">重置</el-button>
+            </section>
+          </div>
+        </header>
 
-                <div class="batch-table">
-                    <BasicTable ref="basicTableRef" :tableData="tableData" :tableConfig="tableConfig"
-                        @update:pageSize="handleSizeChange" @update:pageNumber="handleCurrentChange">
-                        <template #status="scope">
-                            <span>
-                                {{
-                                    scope.row.statusName ||
-                                    (scope.row.status === true || scope.row.status === 'true'
-                                        ? '启用'
-                                        : scope.row.status === false || scope.row.status === 'false'
-                                            ? '禁用'
-                                            : '-')
-                                }}
-                            </span>
-                        </template>
-                        <template #action="scope">
-                            <div class="action-container--div" style="justify-content: left">
-                                <!-- 状态:1-未下发 2-进行中 3-已完成 4-已作废 -->
-                                <!-- 1-未下发 -->
-                                <template v-if="scope.row.status === 1">
-                                    <ActionButton text="编辑" @click="handleEdit(scope.row.id)" />
-                                    <ActionButton text="查看" @click="handleView(scope.row.id)" />
-                                    <ActionButton text="删除" :popconfirm="{
-                                        title: '确定要删除?',
-                                    }" @confirm="handleDelete(scope.row.id)" />
-                                    <ActionButton text="下发" @click="handleIssue(scope.row)" />
-                                </template>
-                                <!-- 2-进行中 -->
-                                <template v-else-if="scope.row.status === 2">
-                                    <ActionButton text="查看" @click="handleView(scope.row.id)" />
-                                    <ActionButton text="作废" :popconfirm="{
-                                        title: '确定要作废?',
-                                    }" @confirm="handleCancel(scope.row.id)" />
-                                </template>
-                                <!-- 3-已完成 -->
-                                <template v-else-if="scope.row.status === 3">
-                                    <ActionButton text="查看" @click="handleView(scope.row.id)" />
-                                </template>
-                                <!-- 其他 -->
-                                <template v-else>
-                                    <ActionButton text="查看" @click="handleView(scope.row.id)" />
-                                    <ActionButton text="删除" :popconfirm="{
-                                        title: '确定要删除?',
-                                    }" @confirm="handleDelete(scope.row.id)" />
-                                </template>
-                            </div>
-                        </template>
-                    </BasicTable>
-                </div>
-            </div>
-        </main>
-        <IssueEducationTrainingPlan v-model:visible="issueWorkPlanDialogVisible" v-model:data="issueWorkPlanParams"
-            @confirm="handleConfirmIssue" />
-        <BatchImport v-if="batchImportVisible" :visible="batchImportVisible" :import-api-url="importApiUrl"
-            :template-url="templateUrl" template-name="下载模板" :show-template="false" @close="batchImportVisible = false"
-            @update="handleUpdate" />
-    </div>
+        <div class="batch-table">
+          <BasicTable
+            ref="basicTableRef"
+            :tableData="tableData"
+            :tableConfig="tableConfig"
+            @update:pageSize="handleSizeChange"
+            @update:pageNumber="handleCurrentChange"
+          >
+            <template #status="scope">
+              <span>
+                {{
+                  scope.row.statusName ||
+                  (scope.row.status === true || scope.row.status === 'true'
+                    ? '启用'
+                    : scope.row.status === false || scope.row.status === 'false'
+                    ? '禁用'
+                    : '-')
+                }}
+              </span>
+            </template>
+            <template #action="scope">
+              <div class="action-container--div" style="justify-content: left">
+                <!-- 状态:1-未下发 2-进行中 3-已完成 4-已作废 -->
+                <!-- 1-未下发 -->
+                <template v-if="scope.row.status === 1">
+                  <ActionButton text="编辑" @click="handleEdit(scope.row.id)" />
+                  <ActionButton text="查看" @click="handleView(scope.row.id)" />
+                  <ActionButton
+                    text="删除"
+                    :popconfirm="{
+                      title: '确定要删除?',
+                    }"
+                    @confirm="handleDelete(scope.row.id)"
+                  />
+                  <ActionButton text="下发" @click="handleIssue(scope.row)" />
+                </template>
+                <!-- 2-进行中 -->
+                <template v-else-if="scope.row.status === 2">
+                  <ActionButton text="查看" @click="handleView(scope.row.id)" />
+                  <ActionButton
+                    text="作废"
+                    :popconfirm="{
+                      title: '确定要作废?',
+                    }"
+                    @confirm="handleCancel(scope.row.id)"
+                  />
+                </template>
+                <!-- 3-已完成 -->
+                <template v-else-if="scope.row.status === 3">
+                  <ActionButton text="查看" @click="handleView(scope.row.id)" />
+                </template>
+                <!-- 其他 -->
+                <template v-else>
+                  <ActionButton text="查看" @click="handleView(scope.row.id)" />
+                  <ActionButton
+                    text="删除"
+                    :popconfirm="{
+                      title: '确定要删除?',
+                    }"
+                    @confirm="handleDelete(scope.row.id)"
+                  />
+                </template>
+              </div>
+            </template>
+          </BasicTable>
+        </div>
+      </div>
+    </main>
+    <IssueEducationTrainingPlan
+      v-model:visible="issueWorkPlanDialogVisible"
+      v-model:data="issueWorkPlanParams"
+      @confirm="handleConfirmIssue"
+    />
+    <BatchImport
+      v-if="batchImportVisible"
+      :visible="batchImportVisible"
+      :import-api-url="importApiUrl"
+      :template-url="templateUrl"
+      template-name="下载模板"
+      :show-template="false"
+      @close="batchImportVisible = false"
+      @update="handleUpdate"
+    />
+  </div>
 </template>
 
 <script setup lang="ts">
-import { onMounted, reactive, ref } from 'vue';
-import { ElMessage } from 'element-plus';
-import BasicTable from '@/components/BasicTable.vue';
-import useTableConfig from '@/hooks/useTableConfigHook';
-import ActionButton from '@/components/ActionButton.vue';
-import { TABLE_OPTIONS, TABLE_COLUMNS, STATUS_OPTIONS } from './configs/tables';
-import { useRouter } from 'vue-router';
-import type { QueryPageRequest } from '@/types/basic-query';
-import { getEducationAndTrainingProgramList, issueEducationAndTrainingProgram, cancelEducationAndTrainingProgram, deleteEducationAndTrainingProgram } from '@/api/production-education-training-plan';
-import { downloadByData } from '@/utils/file/download';
-import BatchImport from '@/components/batch-import/BatchImport.vue';
-import { useGlobSetting } from '@/hooks/setting';
-import urlJoin from 'url-join';
-import IssueEducationTrainingPlan from './components/issueEducationTrainingPlan.vue';
-const router = useRouter();
+  import { onMounted, reactive, ref } from 'vue';
+  import { ElMessage } from 'element-plus';
+  import BasicTable from '@/components/BasicTable.vue';
+  import useTableConfig from '@/hooks/useTableConfigHook';
+  import ActionButton from '@/components/ActionButton.vue';
+  import { TABLE_OPTIONS, TABLE_COLUMNS, STATUS_OPTIONS } from './configs/tables';
+  import { useRouter } from 'vue-router';
+  import type { QueryPageRequest } from '@/types/basic-query';
+  import {
+    getEducationAndTrainingProgramList,
+    issueEducationAndTrainingProgram,
+    cancelEducationAndTrainingProgram,
+    deleteEducationAndTrainingProgram,
+  } from '@/api/production-education-training-plan';
+  import { downloadByData } from '@/utils/file/download';
+  import BatchImport from '@/components/batch-import/BatchImport.vue';
+  import { useGlobSetting } from '@/hooks/setting';
+  import urlJoin from 'url-join';
+  import IssueEducationTrainingPlan from './components/issueEducationTrainingPlan.vue';
+  const router = useRouter();
 
-// 表格
-const basicTableRef = ref<InstanceType<typeof BasicTable>>();
+  // 表格
+  const basicTableRef = ref<InstanceType<typeof BasicTable>>();
 
-const { tableConfig, pagination } = useTableConfig(TABLE_COLUMNS, TABLE_OPTIONS);
+  const { tableConfig, pagination } = useTableConfig(TABLE_COLUMNS, TABLE_OPTIONS);
 
-const tableData = ref<any[]>([]);
-// 日期范围
-const dateRange = ref<[string, string] | null>(null);
-// 分类名称选项
-const classifyNameOptions = ref<Array<{ label: string; value: string }>>([
+  const tableData = ref<any[]>([]);
+  // 日期范围
+  const dateRange = ref<[string, string] | null>(null);
+  // 分类名称选项
+  const classifyNameOptions = ref<Array<{ label: string; value: string }>>([
     { label: '全部', value: '全部' },
     { label: '全员安全培训', value: '全员安全培训' },
     { label: '新员工培训', value: '新员工培训' },
     { label: '岗位资质培训', value: '岗位资质培训' },
     { label: '生产作业安全培训', value: '生产作业安全培训' },
     { label: '安全管理人员培训', value: '安全管理人员培训' },
-]);
-const tableQuery = reactive<QueryPageRequest<any>>({
+  ]);
+  const tableQuery = reactive<QueryPageRequest<any>>({
     pageNumber: pagination.pageNumber,
     pageSize: pagination.pageSize,
     queryParam: {
-        keyword: "",
-        status: "",
-        categoryName: "",
-        startDate: "",
-        endDate: "",
+      keyword: '',
+      status: '',
+      categoryName: '',
+      startDate: '',
+      endDate: '',
     },
-});
+  });
 
-const handleSizeChange = (value: number) => {
+  const handleSizeChange = (value: number) => {
     pagination.pageSize = value;
     tableQuery.pageSize = value;
     getTableData();
-};
+  };
 
-const handleCurrentChange = (value: number) => {
+  const handleCurrentChange = (value: number) => {
     pagination.pageNumber = value;
     tableQuery.pageNumber = value;
     getTableData();
-};
+  };
 
-async function getTableData() {
+  async function getTableData() {
     tableConfig.loading = true;
     try {
-        tableQuery.queryParam.startDate = dateRange.value ? dateRange.value[0] : '';
-        tableQuery.queryParam.endDate = dateRange.value ? dateRange.value[1] : '';
-        const res = await getEducationAndTrainingProgramList(tableQuery);
-        if (res) {
-            // 映射返回数据字段到表格字段
-            tableData.value = res.records
-            pagination.total = res.totalRow;
-        }
+      tableQuery.queryParam.startDate = dateRange.value ? dateRange.value[0] : '';
+      tableQuery.queryParam.endDate = dateRange.value ? dateRange.value[1] : '';
+      const res = await getEducationAndTrainingProgramList(tableQuery);
+      if (res) {
+        // 映射返回数据字段到表格字段
+        tableData.value = res.records;
+        pagination.total = res.totalRow;
+      }
     } catch (e) {
-        console.error('获取列表失败:', e);
-        tableData.value = [];
-        pagination.total = 0;
+      console.error('获取列表失败:', e);
+      tableData.value = [];
+      pagination.total = 0;
     } finally {
-        tableConfig.loading = false;
+      tableConfig.loading = false;
     }
-}
+  }
 
-const handleSearch = () => {
+  const handleSearch = () => {
     pagination.pageNumber = 1;
     tableQuery.pageNumber = 1;
     getTableData();
-};
+  };
 
-const handleReset = () => {
+  const handleReset = () => {
     pagination.pageNumber = 1;
     Object.assign(tableQuery, {
-        pageNumber: 1,
-        pageSize: pagination.pageSize,
-        queryParam: {
-            keyword: "",
-            status: "",
-            categoryName: "",
-            startDate: "",
-            endDate: "",
-        },
-    })
-    dateRange.value = null
+      pageNumber: 1,
+      pageSize: pagination.pageSize,
+      queryParam: {
+        keyword: '',
+        status: '',
+        categoryName: '',
+        startDate: '',
+        endDate: '',
+      },
+    });
+    dateRange.value = null;
     handleSearch();
-};
+  };
 
-// 批量导入
-const batchImportVisible = ref(false);
-const { urlPrefix } = useGlobSetting();
-const importApiUrl = ref(urlJoin(urlPrefix, '/inventory/importInventory'));
-const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-inventory-template.xlsx');
+  // 批量导入
+  const batchImportVisible = ref(false);
+  const { urlPrefix } = useGlobSetting();
+  const importApiUrl = ref(urlJoin(urlPrefix, '/inventory/importInventory'));
+  const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-inventory-template.xlsx');
 
-const handleImport = () => {
+  const handleImport = () => {
     batchImportVisible.value = true;
-};
+  };
 
-const handleUpdate = () => {
+  const handleUpdate = () => {
     batchImportVisible.value = false;
     getTableData();
-};
+  };
 
-const handleDownload = async () => {
+  const handleDownload = async () => {
     try {
-        const exportParams = {
-            stuffName: tableQuery.queryParam.stuffName || undefined,
-            status: tableQuery.queryParam.status,
-            ids: tableQuery.queryParam.ids.length > 0 ? tableQuery.queryParam.ids : undefined,
-        };
-        // const response = await exportInventory(exportParams);
-        // if (response) {
-        //     const fileName = `物品库存管理_${new Date().toISOString().split('T')[0]}.xlsx`;
-        //     downloadByData(response, fileName);
-        //     ElMessage.success('导出成功');
-        // }
+      const exportParams = {
+        stuffName: tableQuery.queryParam.stuffName || undefined,
+        status: tableQuery.queryParam.status,
+        ids: tableQuery.queryParam.ids.length > 0 ? tableQuery.queryParam.ids : undefined,
+      };
+      // const response = await exportInventory(exportParams);
+      // if (response) {
+      //     const fileName = `物品库存管理_${new Date().toISOString().split('T')[0]}.xlsx`;
+      //     downloadByData(response, fileName);
+      //     ElMessage.success('导出成功');
+      // }
     } catch (e) {
-        console.error('导出物品库存失败:', e);
-        ElMessage.error('导出失败,请重试');
+      console.error('导出物品库存失败:', e);
+      ElMessage.error('导出失败,请重试');
     }
-};
-/**
- * @description: 下发
- * @param {*} id
- * @return {*}
- */
-const issueWorkPlanDialogVisible = ref<boolean>(false)
-const issueWorkPlanParams = reactive<any>({})
-const handleIssue = async (value) => {
-    issueWorkPlanDialogVisible.value = true
-    Object.assign(issueWorkPlanParams, value)
-};
-// 格式化时间
-const formatDate = (date) => {
+  };
+  /**
+   * @description: 下发
+   * @param {*} id
+   * @return {*}
+   */
+  const issueWorkPlanDialogVisible = ref<boolean>(false);
+  const issueWorkPlanParams = reactive<any>({});
+  const handleIssue = async (value) => {
+    issueWorkPlanDialogVisible.value = true;
+    Object.assign(issueWorkPlanParams, value);
+  };
+  // 格式化时间
+  const formatDate = (date) => {
     if (!date) return '';
     const year = date.getFullYear();
     const month = String(date.getMonth() + 1).padStart(2, '0');
     const day = String(date.getDate()).padStart(2, '0');
     return `${year}-${month}-${day}`; // 输出:2026-02-11
-}
-const handleConfirmIssue = async (value) => {
+  };
+  const handleConfirmIssue = async (value) => {
     try {
-        await issueEducationAndTrainingProgram({
-            ...value,
-            startTime: formatDate(value.startTime),
-            endTime: formatDate(value.endTime),
-        });
-        ElMessage.success('下发成功');
-        getTableData();
+      await issueEducationAndTrainingProgram({
+        ...value,
+        startTime: formatDate(value.startTime),
+        endTime: formatDate(value.endTime),
+      });
+      ElMessage.success('下发成功');
+      getTableData();
     } catch (e) {
-        console.error('下发工作计划失败:', e);
-        ElMessage.error('下发失败,请重试');
+      console.error('下发工作计划失败:', e);
+      ElMessage.error('下发失败,请重试');
     }
-};
-const handleCreate = () => {
+  };
+  const handleCreate = () => {
     router.push({
-        name: 'educationTrainingPlanManagementItem',
-        query: {
-            operate: 'education-training-plan-management-create',
-        },
+      name: 'educationTrainingPlanManagementItem',
+      query: {
+        operate: 'education-training-plan-management-create',
+      },
     });
-};
+  };
 
-const handleEdit = (id: number) => {
+  const handleEdit = (id: number) => {
     router.push({
-        name: 'educationTrainingPlanManagementItem',
-        query: {
-            id,
-            operate: 'education-training-plan-management-edit',
-        },
+      name: 'educationTrainingPlanManagementItem',
+      query: {
+        id,
+        operate: 'education-training-plan-management-edit',
+      },
     });
-};
+  };
 
-const handleDelete = async (id: number) => {
+  const handleDelete = async (id: number) => {
     try {
-        await deleteEducationAndTrainingProgram(id);
-        ElMessage.success('删除成功');
-        getTableData();
+      await deleteEducationAndTrainingProgram(id);
+      ElMessage.success('删除成功');
+      getTableData();
     } catch (e) {
-        console.error('删除物品库存失败:', e);
-        ElMessage.error('删除失败,请重试');
+      console.error('删除物品库存失败:', e);
+      ElMessage.error('删除失败,请重试');
     }
-};
-const handleCancel = async (id: number) => {
+  };
+  const handleCancel = async (id: number) => {
     try {
-        await cancelEducationAndTrainingProgram({ id });
-        ElMessage.success('作废成功');
-        getTableData();
+      await cancelEducationAndTrainingProgram({ id });
+      ElMessage.success('作废成功');
+      getTableData();
     } catch (e) {
-        console.error('作废失败:', e);
-        ElMessage.error('作废失败,请重试');
+      console.error('作废失败:', e);
+      ElMessage.error('作废失败,请重试');
     }
-};
+  };
 
-const handleView = (id: number) => {
+  const handleView = (id: number) => {
     router.push({
-        name: 'educationTrainingPlanManagementItem',
-        query: {
-            id,
-            operate: 'education-training-plan-management-view',
-        },
+      name: 'educationTrainingPlanManagementItem',
+      query: {
+        id,
+        operate: 'education-training-plan-management-view',
+      },
     });
-};
+  };
 
-onMounted(() => {
+  onMounted(() => {
     getTableData();
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
-@use '@/styles/page-main-layout.scss' as *;
-@use '@/styles/basic-table-action.scss' as *;
-@use '@/views/traffic/violation/style/act-search-table.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
+  @use '@/styles/basic-table-action.scss' as *;
+  @use '@/views/traffic/violation/style/act-search-table.scss' as *;
 </style>

+ 27 - 27
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagement/educationTrainingPlanManagementItem.vue

@@ -6,45 +6,45 @@
  * @Describe: file describe
 -->
 <template>
-    <div class="safety-platform-container">
-        <header class="safety-platform-container__header">
-            <BreadcrumbBack />
-            <span class="breadcrumb-title">{{ headerTitle }}</span>
-        </header>
-        <EducationTrainingPlanManagementDetail />
-    </div>
+  <div class="safety-platform-container">
+    <header class="safety-platform-container__header">
+      <BreadcrumbBack />
+      <span class="breadcrumb-title">{{ headerTitle }}</span>
+    </header>
+    <EducationTrainingPlanManagementDetail />
+  </div>
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
-import { useRoute } from 'vue-router';
-import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
-import EducationTrainingPlanManagementDetail from './components/educationTrainingPlanManagementDetail.vue';
+  import { computed } from 'vue';
+  import { useRoute } from 'vue-router';
+  import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
+  import EducationTrainingPlanManagementDetail from './components/educationTrainingPlanManagementDetail.vue';
 
-const route = useRoute();
-const operate = route.query.operate as string;
+  const route = useRoute();
+  const operate = route.query.operate as string;
 
-const headerTitle = computed(() => {
+  const headerTitle = computed(() => {
     switch (operate) {
-        case 'education-training-plan-management-create':
-            return '新增教育培训计划(管理员)';
-        case 'education-training-plan-management-edit':
-            return '编辑教育培训计划(管理员)';
-        case 'education-training-plan-management-view':
-            return '查看教育培训计划(管理员)';
-        default:
-            return '未知操作';
+      case 'education-training-plan-management-create':
+        return '新增教育培训计划(管理员)';
+      case 'education-training-plan-management-edit':
+        return '编辑教育培训计划(管理员)';
+      case 'education-training-plan-management-view':
+        return '查看教育培训计划(管理员)';
+      default:
+        return '未知操作';
     }
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
-@use '@/styles/page-main-layout.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
 
-.safety-platform-container__header {
+  .safety-platform-container__header {
     flex-direction: row !important;
     justify-content: flex-start !important;
     gap: 8px !important;
-}
+  }
 </style>

+ 279 - 250
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/components/addTrainingInformation.vue

@@ -1,41 +1,41 @@
 <script lang="ts" setup>
-import { saveTrainingInformation, updateTrainingInformation } from '@/api/production-education-training-plan-dept';
-import { ref, reactive, onMounted, watch, shallowRef, computed } from 'vue';
-import { UploadFilled, Plus } from '@element-plus/icons-vue';
-import { TRAINING_FORM_RULES } from '../configs/form';
-import { queryUserGroupPage } from '@/api/system/person-group';
-import type { FileItem } from '@/components/UploadFiles/types';
-import UploadFiles from '@/components/UploadFiles/UploadFiles.vue';
-import { Editor, Toolbar } from '@wangeditor/editor-for-vue';
-// @ts-ignore: missing type declarations for CSS side-effect import
-import '@wangeditor/editor/dist/css/style.css';
-import { ElMessage } from 'element-plus';
-
-import { debounce } from 'lodash-es';
-
-const props = defineProps({
+  import { saveTrainingInformation, updateTrainingInformation } from '@/api/production-education-training-plan-dept';
+  import { ref, reactive, onMounted, watch, shallowRef, computed } from 'vue';
+  import { UploadFilled, Plus } from '@element-plus/icons-vue';
+  import { TRAINING_FORM_RULES } from '../configs/form';
+  import { queryUserGroupPage } from '@/api/system/person-group';
+  import type { FileItem } from '@/components/UploadFiles/types';
+  import UploadFiles from '@/components/UploadFiles/UploadFiles.vue';
+  import { Editor, Toolbar } from '@wangeditor/editor-for-vue';
+  // @ts-ignore: missing type declarations for CSS side-effect import
+  import '@wangeditor/editor/dist/css/style.css';
+  import { ElMessage } from 'element-plus';
+
+  import { debounce } from 'lodash-es';
+
+  const props = defineProps({
     state: {
-        type: String,
-        default: 'add', // add: 新增, edit: 编辑
+      type: String,
+      default: 'add', // add: 新增, edit: 编辑
     },
     visible: {
-        type: Boolean,
-        default: false,
+      type: Boolean,
+      default: false,
     },
     currentId: {
-        type: [String, Number],
-        default: null,
+      type: [String, Number],
+      default: null,
     },
-});
-const isViewMode = ref(props.state === 'view');
-const isEditMode = ref(props.state === 'edit');
-const isCreateMode = ref(props.state === 'add');
+  });
+  const isViewMode = ref(props.state === 'view');
+  const isEditMode = ref(props.state === 'edit');
+  const isCreateMode = ref(props.state === 'add');
 
-const emit = defineEmits(['update:visible', 'refreshList']);
-const formRef = ref();
-const rules = ref(TRAINING_FORM_RULES)
+  const emit = defineEmits(['update:visible', 'refreshList']);
+  const formRef = ref();
+  const rules = ref(TRAINING_FORM_RULES);
 
-const form = reactive({
+  const form = reactive({
     courseType: '',
     courseName: '',
     trainingMethod: '',
@@ -48,216 +48,236 @@ const form = reactive({
     courseContent: [] as FileItem[],
     isSign: 0,
     courseImg: [] as FileItem[],
-});
-const fileList = ref<FileItem[]>([]);
-const fileInfo = ref<any>(null);
+  });
+  const fileList = ref<FileItem[]>([]);
+  const fileInfo = ref<any>(null);
 
-const categoryOptions = ref([
+  const categoryOptions = ref([
     { label: '入院三级安全教育', value: 1 },
     { label: '安全生产继续教育', value: 2 },
     { label: '特种作业培训考核', value: 3 },
     { label: '特种作业复训考核', value: 4 },
-]);
+  ]);
 
-const handleValidate = async () => {
+  const handleValidate = async () => {
     if (!formRef.value) return;
     const res = await formRef.value.validateField();
     return res;
-};
-const handleSave = debounce(async () => {
+  };
+  const handleSave = debounce(async () => {
     const res = await handleValidate();
     if (!res) return;
     try {
-        const basePayload = {
-            ...form,
-            // responsibleDeptIds: form.responsibleDeptIds.toString()
-        };
-
-        if (isCreateMode.value) {
-
-            // await saveTrainingInformation(basePayload);
-            ElMessage.success('创建成功');
-        } else if (isEditMode.value && props.currentId) {
-
-            // await updateTrainingInformation({
-            //     id: props.currentId,
-            //     ...basePayload,
-            // });
-            ElMessage.success('保存成功');
-        }
-
+      const basePayload = {
+        ...form,
+        // responsibleDeptIds: form.responsibleDeptIds.toString()
+      };
+
+      if (isCreateMode.value) {
+        // await saveTrainingInformation(basePayload);
+        ElMessage.success('创建成功');
+      } else if (isEditMode.value && props.currentId) {
+        // await updateTrainingInformation({
+        //     id: props.currentId,
+        //     ...basePayload,
+        // });
+        ElMessage.success('保存成功');
+      }
     } catch (e) {
-        ElMessage.error('保存失败,请重试');
+      ElMessage.error('保存失败,请重试');
     }
     emit('update:visible', false);
-}, 1000);
-// const handleSave = () => {
-
-//     // 简单验证,可以根据需要添加更多验证逻辑
-//     if (!form.courseName || !form.courseType) {
-//         ElMessage.error('请填写完整信息');
-//         return;
-//     }
-//     emit('refreshList', { ...form }); // 传递表单数据,可以根据实际需求调整
-//     emit('update:visible', false);
-// };
-// 富文本编辑器
-const editorRef = shallowRef();
-const editorConfig = computed(() => ({
+  }, 1000);
+  // const handleSave = () => {
+
+  //     // 简单验证,可以根据需要添加更多验证逻辑
+  //     if (!form.courseName || !form.courseType) {
+  //         ElMessage.error('请填写完整信息');
+  //         return;
+  //     }
+  //     emit('refreshList', { ...form }); // 传递表单数据,可以根据实际需求调整
+  //     emit('update:visible', false);
+  // };
+  // 富文本编辑器
+  const editorRef = shallowRef();
+  const editorConfig = computed(() => ({
     placeholder: '请输入培训课程简述',
     MENU_CONF: {},
-}));
-
-const beforeUpload = (file) => {
-    const isAllowedType = ['application/rar', 'application/zip', 'application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'application/pdf', 'video/mp4']
-        .includes(file.type);
+  }));
+
+  const beforeUpload = (file) => {
+    const isAllowedType = [
+      'application/rar',
+      'application/zip',
+      'application/msword',
+      'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+      'application/pdf',
+      'video/mp4',
+    ].includes(file.type);
     const isLt20M = file.size / 1024 / 1024 < 20;
 
     if (!isAllowedType) {
-        ElMessage.error('上传文件格式不正确!');
+      ElMessage.error('上传文件格式不正确!');
     }
     if (!isLt20M) {
-        ElMessage.error('上传文件大小不能超过20MB!');
+      ElMessage.error('上传文件大小不能超过20MB!');
     }
     return isAllowedType && isLt20M;
-}
+  };
 
-const handleExceed = () => {
+  const handleExceed = () => {
     ElMessage.warning('只能上传一个文件,请先删除当前文件再上传!');
-}
+  };
 
-const handleEditorCreated = (editor: any) => {
+  const handleEditorCreated = (editor: any) => {
     editorRef.value = editor;
-};
+  };
 
-const handleEditorChange = () => {
+  const handleEditorChange = () => {
     // 编辑器内容变化时的处理
-};
-const handleImageUploadSuccess = (response: any, file: any, fileList: any[]) => {
-
-};
+  };
+  const handleImageUploadSuccess = (response: any, file: any, fileList: any[]) => {};
 
-const handleFileChange = (file, fileList) => {
+  const handleFileChange = (file, fileList) => {
     // 验证文件类型
     const allowedTypes = [
-        'application/rar',
-        'application/zip',
-        'application/msword',
-        'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
-        'application/pdf',
-        'video/mp4'
+      'application/rar',
+      'application/zip',
+      'application/msword',
+      'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+      'application/pdf',
+      'video/mp4',
     ];
 
     if (!allowedTypes.includes(file.raw.type)) {
-        ElMessage.error('不支持的文件格式');
-        return;
+      ElMessage.error('不支持的文件格式');
+      return;
     }
 
     // 验证文件大小
     if (file.raw.size > 20 * 1024 * 1024) {
-        ElMessage.error('文件大小不能超过20MB');
-        return;
+      ElMessage.error('文件大小不能超过20MB');
+      return;
     }
     console.log('选择的文件:', file.raw);
     fileList.value = [file.raw];
     // 生成文件信息JSON
     fileInfo.value = {
-        fileName: file.raw.name,
-        fileSize: `${(file.raw.size / (1024 * 1024)).toFixed(2)} MB`,
-        fileType: file.raw.type,
-        lastModified: new Date(file.raw.lastModified).toLocaleString(),
-        rawFile: file.raw  // 包含更多原始文件信息
+      fileName: file.raw.name,
+      fileSize: `${(file.raw.size / (1024 * 1024)).toFixed(2)} MB`,
+      fileType: file.raw.type,
+      lastModified: new Date(file.raw.lastModified).toLocaleString(),
+      rawFile: file.raw, // 包含更多原始文件信息
     };
-}
+  };
 
-const handleImageRemove = (file: any, fileList: any[]) => {
+  const handleImageRemove = (file: any, fileList: any[]) => {};
 
-};
-
-// 文件上传
-const handleUploadSuccess = (files: FileItem[]) => {
+  // 文件上传
+  const handleUploadSuccess = (files: FileItem[]) => {
     console.log('上传成功的文件列表:', files);
     form.courseImg = files;
-};
+  };
 
-const groupList = ref<any>([]);
-// 获取级联部门分组数据
-const loadGroupTreeData = async () => {
+  const groupList = ref<any>([]);
+  // 获取级联部门分组数据
+  const loadGroupTreeData = async () => {
     queryUserGroupPage({
-        pageNumber: 1,
-        pageSize: 500,
+      pageNumber: 1,
+      pageSize: 500,
     }).then((res) => {
-        groupList.value = res.records;
+      groupList.value = res.records;
     });
-};
-onMounted(() => {
-    loadGroupTreeData()
-})
+  };
+  onMounted(() => {
+    loadGroupTreeData();
+  });
 </script>
 
 <template>
-    <div class="training-course">
-        <el-drawer v-model="props.visible" direction="rtl" size="45%" :title="state === 'add' ? '新增培训课程' : '编辑培训课程'"
-            @close="$emit('update:visible', false)">
-
-            <el-form label-position="right" label-width="150px" :model="form" :rules="rules" ref="formRef">
-
-                <el-form-item label="课程所属类别:" prop="courseType">
-                    <el-select v-model="form.courseType" placeholder="请选择课程所属类别,单选" clearable :disabled="isViewMode">
-                        <el-option v-for="item in categoryOptions" :key="item.value" :label="item.label"
-                            :value="item.value" />
-                    </el-select>
-                </el-form-item>
-
-                <el-form-item label="培训课程名称:" prop="courseName">
-                    <el-input v-model="form.courseName" placeholder="输入课程名称" :disabled="isViewMode" />
-                </el-form-item>
-
-                <el-form-item label="培训方式:" prop="trainingMethod">
-                    <el-input v-model="form.trainingMethod" placeholder="输入培训方式" :disabled="isViewMode" />
-                </el-form-item>
-
-                <el-form-item label="培训课程讲师:" prop="trainingTeacher">
-                    <el-input v-model="form.trainingTeacher" placeholder="输入培训课程讲师" :disabled="isViewMode" />
-                </el-form-item>
-
-                <el-form-item label="计划参与人数:" prop="planNumOfParticipants">
-                    <el-input v-model.number="form.planNumOfParticipants" placeholder="输入计划参与人数"
-                        :disabled="isViewMode" />
-                </el-form-item>
-
-                <el-form-item label="参与人员分组:" prop="groupOfParticipants">
-                    <el-select v-model="form.groupOfParticipants" multiple placeholder="请选择培训责任部门责任人所在分组,多选" clearable
-                        :disabled="isViewMode">
-                        <el-option v-for="group in groupList" :key="group.id" :label="group.name" :value="group.id" />
-                    </el-select>
-                </el-form-item>
-
-                <el-form-item label="培训开始日期:" prop="startDate">
-                    <el-date-picker v-model="form.startDate" style="width: 100%;" type="date" placeholder="选择计划开始日期"
-                        :disabled="isViewMode" />
-                </el-form-item>
-
-                <el-form-item label="培训结束日期:" prop="endDate">
-                    <el-date-picker v-model="form.endDate" style="width: 100%;" type="date" placeholder="选择计划结束日期"
-                        :disabled="isViewMode" />
-                </el-form-item>
-
-                <el-form-item label="培训课程简述:" prop="courseIntroduction">
-                    <div class="editor-container">
-                        <Toolbar style="border-bottom: 1px solid #dcdfe6" :editor="editorRef" />
-                        <Editor style="height: 400px; overflow-y: auto" v-model="form.courseIntroduction" mode="default"
-                            :defaultConfig="editorConfig" @on-created="handleEditorCreated"
-                            @on-change="handleEditorChange" />
-                    </div>
-                </el-form-item>
-
-                <el-form-item label="课程内容:" prop="courseContent">
-                    <!-- <UploadFiles label="上传文件" :maxCount="1" :file-list="form.courseImg" :disabled="isViewMode"
+  <div class="training-course">
+    <el-drawer
+      v-model="props.visible"
+      direction="rtl"
+      size="45%"
+      :title="state === 'add' ? '新增培训课程' : '编辑培训课程'"
+      @close="$emit('update:visible', false)"
+    >
+      <el-form label-position="right" label-width="150px" :model="form" :rules="rules" ref="formRef">
+        <el-form-item label="课程所属类别:" prop="courseType">
+          <el-select v-model="form.courseType" placeholder="请选择课程所属类别,单选" clearable :disabled="isViewMode">
+            <el-option v-for="item in categoryOptions" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="培训课程名称:" prop="courseName">
+          <el-input v-model="form.courseName" placeholder="输入课程名称" :disabled="isViewMode" />
+        </el-form-item>
+
+        <el-form-item label="培训方式:" prop="trainingMethod">
+          <el-input v-model="form.trainingMethod" placeholder="输入培训方式" :disabled="isViewMode" />
+        </el-form-item>
+
+        <el-form-item label="培训课程讲师:" prop="trainingTeacher">
+          <el-input v-model="form.trainingTeacher" placeholder="输入培训课程讲师" :disabled="isViewMode" />
+        </el-form-item>
+
+        <el-form-item label="计划参与人数:" prop="planNumOfParticipants">
+          <el-input v-model.number="form.planNumOfParticipants" placeholder="输入计划参与人数" :disabled="isViewMode" />
+        </el-form-item>
+
+        <el-form-item label="参与人员分组:" prop="groupOfParticipants">
+          <el-select
+            v-model="form.groupOfParticipants"
+            multiple
+            placeholder="请选择培训责任部门责任人所在分组,多选"
+            clearable
+            :disabled="isViewMode"
+          >
+            <el-option v-for="group in groupList" :key="group.id" :label="group.name" :value="group.id" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="培训开始日期:" prop="startDate">
+          <el-date-picker
+            v-model="form.startDate"
+            style="width: 100%"
+            type="date"
+            placeholder="选择计划开始日期"
+            :disabled="isViewMode"
+          />
+        </el-form-item>
+
+        <el-form-item label="培训结束日期:" prop="endDate">
+          <el-date-picker
+            v-model="form.endDate"
+            style="width: 100%"
+            type="date"
+            placeholder="选择计划结束日期"
+            :disabled="isViewMode"
+          />
+        </el-form-item>
+
+        <el-form-item label="培训课程简述:" prop="courseIntroduction">
+          <div class="editor-container">
+            <Toolbar style="border-bottom: 1px solid #dcdfe6" :editor="editorRef" />
+            <Editor
+              style="height: 400px; overflow-y: auto"
+              v-model="form.courseIntroduction"
+              mode="default"
+              :defaultConfig="editorConfig"
+              @on-created="handleEditorCreated"
+              @on-change="handleEditorChange"
+            />
+          </div>
+        </el-form-item>
+
+        <el-form-item label="课程内容:" prop="courseContent">
+          <!-- <UploadFiles label="上传文件" :maxCount="1" :file-list="form.courseImg" :disabled="isViewMode"
                         accept=".rar,.zip,.doc,.docx,.pdf,.mp4" desc="支持格式:.rar .zip .doc .docx .pdf .mp4 ,单个文件不能超过20MB"
                         :allow-all-file-types="true" @uploadSuccess="handleUploadSuccess" /> -->
 
-                    <!-- <el-upload action="https://jsonplaceholder.typicode.com/posts/" :on-exceed="handleExceed"
+          <!-- <el-upload action="https://jsonplaceholder.typicode.com/posts/" :on-exceed="handleExceed"
                         :before-upload="beforeUpload" :file-list="fileList" :limit="1"
                         accept=".rar, .zip, .doc, .docx, .pdf, .mp4">
                         <el-button type="default" :disabled="isViewMode">
@@ -271,79 +291,88 @@ onMounted(() => {
                             </div>
                         </template>
 </el-upload> -->
-                    <el-upload action="" :auto-upload="false" :on-change="handleFileChange"
-                        accept=".rar, .zip, .doc, .docx, .pdf, .mp4" :file-list="fileList" :limit="1">
-                        <el-button type="default" :disabled="isViewMode">
-                            <el-icon style="margin-right: 6px;">
-                                <UploadFilled />
-                            </el-icon> 选择附件
-                        </el-button>
-                        <template #tip>
-                            <div class="el-upload__tip">
-                                支持格式:.rar .zip .doc .docx .pdf .mp4,单个文件不能超过20MB
-                            </div>
-                        </template>
-                    </el-upload>
-
-                    <!-- 显示文件信息 -->
-                    <div v-if="fileInfo" class="file-info">
-                        <h3>文件信息:</h3>
-                        <pre>{{ fileInfo }}</pre>
-                    </div>
-                </el-form-item>
-
-                <el-form-item label="是否需要签名:" prop="isSign">
-                    <el-radio-group v-model="form.isSign" :disabled="isViewMode">
-                        <el-radio label="是" :value="1"></el-radio>
-                        <el-radio label="否" :value="0"></el-radio>
-                    </el-radio-group>
-                </el-form-item>
-
-                <el-form-item label="课程图片:" prop="courseImg">
-                    <el-upload class="image-uploader" action="/api/admin/minio/uploadFile"
-                        :file-list="form.courseContent" :disabled="isViewMode" :limit="5"
-                        :on-success="handleImageUploadSuccess" :on-remove="handleImageRemove" list-type="picture-card">
-                        <el-icon>
-                            <Plus />
-                        </el-icon>
-
-                        <template #tip>
-                            <div class="el-upload__tip">
-                                支持格式:.jpg .png .jpeg,单个文件不能超过300k,设置一个默认图片。
-                            </div>
-                        </template>
-                    </el-upload>
-                </el-form-item>
-
-            </el-form>
-
-            <template #footer>
-                <div class="dialog-footer">
-                    <el-button @click="$emit('update:visible', false)">取消</el-button>
-                    <el-button type="primary" @click="handleSave" v-if="!isViewMode">
-                        {{ isEditMode ? '保存' : '新增' }}
-                    </el-button>
-                </div>
+          <el-upload
+            action=""
+            :auto-upload="false"
+            :on-change="handleFileChange"
+            accept=".rar, .zip, .doc, .docx, .pdf, .mp4"
+            :file-list="fileList"
+            :limit="1"
+          >
+            <el-button type="default" :disabled="isViewMode">
+              <el-icon style="margin-right: 6px">
+                <UploadFilled />
+              </el-icon>
+              选择附件
+            </el-button>
+            <template #tip>
+              <div class="el-upload__tip"> 支持格式:.rar .zip .doc .docx .pdf .mp4,单个文件不能超过20MB </div>
+            </template>
+          </el-upload>
+
+          <!-- 显示文件信息 -->
+          <div v-if="fileInfo" class="file-info">
+            <h3>文件信息:</h3>
+            <pre>{{ fileInfo }}</pre>
+          </div>
+        </el-form-item>
+
+        <el-form-item label="是否需要签名:" prop="isSign">
+          <el-radio-group v-model="form.isSign" :disabled="isViewMode">
+            <el-radio label="是" :value="1"></el-radio>
+            <el-radio label="否" :value="0"></el-radio>
+          </el-radio-group>
+        </el-form-item>
+
+        <el-form-item label="课程图片:" prop="courseImg">
+          <el-upload
+            class="image-uploader"
+            action="/api/admin/minio/uploadFile"
+            :file-list="form.courseContent"
+            :disabled="isViewMode"
+            :limit="5"
+            :on-success="handleImageUploadSuccess"
+            :on-remove="handleImageRemove"
+            list-type="picture-card"
+          >
+            <el-icon>
+              <Plus />
+            </el-icon>
+
+            <template #tip>
+              <div class="el-upload__tip"> 支持格式:.jpg .png .jpeg,单个文件不能超过300k,设置一个默认图片。 </div>
             </template>
-        </el-drawer>
-    </div>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="$emit('update:visible', false)">取消</el-button>
+          <el-button type="primary" @click="handleSave" v-if="!isViewMode">
+            {{ isEditMode ? '保存' : '新增' }}
+          </el-button>
+        </div>
+      </template>
+    </el-drawer>
+  </div>
 </template>
 
 <style lang="scss" scoped>
-.image-uploader {
+  .image-uploader {
     :deep(.el-upload--picture-card) {
-        width: 80px !important;
-        height: 80px !important;
-        line-height: 80px;
+      width: 80px !important;
+      height: 80px !important;
+      line-height: 80px;
     }
 
     :deep(.el-upload-list--picture-card .el-upload-list__item) {
-        width: 80px !important;
-        height: 80px !important;
+      width: 80px !important;
+      height: 80px !important;
     }
-}
+  }
 
-.editor-container {
+  .editor-container {
     width: 100%;
     border: 1px solid #dcdfe6;
     border-radius: 4px;
@@ -351,22 +380,22 @@ onMounted(() => {
     z-index: 1000;
 
     :deep(.w-e-text-placeholder) {
-        font-style: normal;
+      font-style: normal;
     }
-}
+  }
 
-.el-upload__tip {
+  .el-upload__tip {
     line-height: 1.5;
-}
+  }
 
-.file-info {
+  .file-info {
     margin-top: 20px;
     padding: 15px;
     background-color: #f5f7fa;
     border-radius: 4px;
-}
+  }
 
-pre {
+  pre {
     white-space: pre-wrap;
-}
+  }
 </style>

+ 229 - 239
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/components/educationTrainingPlanManagementDeptDetail.vue

@@ -1,155 +1,152 @@
 <template>
-    <main class="safety-platform-container__main">
-        <div class="page-container">
-            <!-- 标题 -->
-            <el-card shadow="never" class="mb-16">
-                <h2 class="title">
-                    {{ details.trainingPlanName }}
-                </h2>
-                <div class="meta">
-                    <span>分类名称:{{ details.categoryName }}</span>
-                    <span>创建人:{{ details.createdByName }}</span>
-                    <span>创建时间:{{ details.createdAt }}</span>
-                </div>
-            </el-card>
-
-            <!-- 基本信息 -->
-            <el-card shadow="never" class="mb-16">
-                <template #header>
-                    <strong>基本信息</strong>
-                </template>
-
-                <el-descriptions :column="2" border>
-                    <el-descriptions-item label="教育培训计划名称">
-                        {{ details.trainingPlanName }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="状态">
-                        <el-tag type="success">{{ details.statusName }}</el-tag>
-                    </el-descriptions-item>
-
-                    <el-descriptions-item label="培训对象">
-                        {{ details.trainingObject }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="培训人数">
-                        {{ details.trainingCount }}人
-                    </el-descriptions-item>
-
-                    <el-descriptions-item label="培训时间">
-                        {{ details.trainingTime }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="培训方式">
-                        {{ details.trainingMethod }}
-                    </el-descriptions-item>
-
-                    <el-descriptions-item label="考核方式">
-                        {{ details.assessmentMethod }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="培训责任部门">
-                        {{ details.deptName }}
-                    </el-descriptions-item>
-
-                    <el-descriptions-item label="学时">
-                        {{ details.studyHours }}小时
-                    </el-descriptions-item>
-                    <el-descriptions-item label="培训分组">
-                        {{ details.groupName }}
-                    </el-descriptions-item>
-                </el-descriptions>
-            </el-card>
-
-            <!-- 培训课程信息 -->
-            <el-card shadow="never">
-                <template #header>
-                    <strong>培训课程信息</strong>
-                </template>
-
-                <!-- 查询区 -->
-                <el-form :inline="true" class="mb-12">
-                    <el-form-item>
-                        <el-input v-model="tableQuery.queryParam.courseName" placeholder="搜索培训课程名称" clearable />
-                    </el-form-item>
-
-                    <el-form-item>
-                        <el-date-picker v-model="dateRange" type="daterange" range-separator="至"
-                            start-placeholder="开始时间" end-placeholder="结束时间" />
-                    </el-form-item>
-
-                    <el-form-item>
-                        <el-button type="primary" @click="handleSearch">
-                            查询
-                        </el-button>
-                        <el-button @click="handleExport">
-                            导出
-                        </el-button>
-                        <el-button type="primary" @click="handleAdd">
-                            新增课程
-                        </el-button>
-                    </el-form-item>
-                </el-form>
-
-                <!-- 表格 -->
-                <el-table :data="tableData" border stripe>
-                    <el-table-column prop="id" label="编号" width="80" />
-                    <el-table-column prop="trainTime" label="培训时间" />
-                    <el-table-column prop="courseName" label="培训课程名称" />
-                    <el-table-column prop="category" label="课程所属分类" />
-                    <el-table-column prop="mode" label="培训方式" width="120" />
-                    <el-table-column prop="summary" label="培训课程简述" />
-                    <el-table-column prop="teacher" label="培训课程讲师" />
-                    <el-table-column prop="group" label="计划参与人数所属分组" />
-                    <el-table-column prop="planCount" label="计划参与人数" width="140" />
-                    <el-table-column prop="signCount" label="签到人数" width="120" />
-
-                    <el-table-column label="操作" width="280" fixed="right">
-                        <template #default="{ row }">
-                            <el-button link type="primary" @click="handleEdit(row)">
-                                编辑
-                            </el-button>
-                            <el-button link type="danger" @click="handleDelete(row)">
-                                删除
-                            </el-button>
-                            <el-button link @click="handleView(row)">
-                                查看
-                            </el-button>
-                            <el-button link @click="handleSummary(row)">
-                                小结
-                            </el-button>
-                        </template>
-                    </el-table-column>
-                </el-table>
-                <div class="pagination">
-                    <el-pagination v-model:current-page="page.current" v-model:page-size="page.size"
-                        :page-sizes="[10, 20, 50, 100]" :total="page.total"
-                        layout="total, sizes, prev, pager, next, jumper" @current-change="handlePageChange"
-                        @size-change="handleSizeChange" />
-                </div>
-            </el-card>
+  <main class="safety-platform-container__main">
+    <div class="page-container">
+      <!-- 标题 -->
+      <el-card shadow="never" class="mb-16">
+        <h2 class="title">
+          {{ details.trainingPlanName }}
+        </h2>
+        <div class="meta">
+          <span>分类名称:{{ details.categoryName }}</span>
+          <span>创建人:{{ details.createdByName }}</span>
+          <span>创建时间:{{ details.createdAt }}</span>
         </div>
-        <AddTrainingInformation :state="type" v-model:visible="showAddTrainingInfo" :currentId="currentTableId" />
-    </main>
-
+      </el-card>
+
+      <!-- 基本信息 -->
+      <el-card shadow="never" class="mb-16">
+        <template #header>
+          <strong>基本信息</strong>
+        </template>
+
+        <el-descriptions :column="2" border>
+          <el-descriptions-item label="教育培训计划名称">
+            {{ details.trainingPlanName }}
+          </el-descriptions-item>
+          <el-descriptions-item label="状态">
+            <el-tag type="success">{{ details.statusName }}</el-tag>
+          </el-descriptions-item>
+
+          <el-descriptions-item label="培训对象">
+            {{ details.trainingObject }}
+          </el-descriptions-item>
+          <el-descriptions-item label="培训人数"> {{ details.trainingCount }}人 </el-descriptions-item>
+
+          <el-descriptions-item label="培训时间">
+            {{ details.trainingTime }}
+          </el-descriptions-item>
+          <el-descriptions-item label="培训方式">
+            {{ details.trainingMethod }}
+          </el-descriptions-item>
+
+          <el-descriptions-item label="考核方式">
+            {{ details.assessmentMethod }}
+          </el-descriptions-item>
+          <el-descriptions-item label="培训责任部门">
+            {{ details.deptName }}
+          </el-descriptions-item>
+
+          <el-descriptions-item label="学时"> {{ details.studyHours }}小时 </el-descriptions-item>
+          <el-descriptions-item label="培训分组">
+            {{ details.groupName }}
+          </el-descriptions-item>
+        </el-descriptions>
+      </el-card>
+
+      <!-- 培训课程信息 -->
+      <el-card shadow="never">
+        <template #header>
+          <strong>培训课程信息</strong>
+        </template>
+
+        <!-- 查询区 -->
+        <el-form :inline="true" class="mb-12">
+          <el-form-item>
+            <el-input v-model="tableQuery.queryParam.courseName" placeholder="搜索培训课程名称" clearable />
+          </el-form-item>
+
+          <el-form-item>
+            <el-date-picker
+              v-model="dateRange"
+              type="daterange"
+              range-separator="至"
+              start-placeholder="开始时间"
+              end-placeholder="结束时间"
+            />
+          </el-form-item>
+
+          <el-form-item>
+            <el-button type="primary" @click="handleSearch"> 查询 </el-button>
+            <el-button @click="handleExport"> 导出 </el-button>
+            <el-button type="primary" @click="handleAdd"> 新增课程 </el-button>
+          </el-form-item>
+        </el-form>
+
+        <!-- 表格 -->
+        <el-table :data="tableData" border stripe>
+          <el-table-column prop="id" label="编号" width="80" />
+          <el-table-column prop="trainTime" label="培训时间" />
+          <el-table-column prop="courseName" label="培训课程名称" />
+          <el-table-column prop="category" label="课程所属分类" />
+          <el-table-column prop="mode" label="培训方式" width="120" />
+          <el-table-column prop="summary" label="培训课程简述" />
+          <el-table-column prop="teacher" label="培训课程讲师" />
+          <el-table-column prop="group" label="计划参与人数所属分组" />
+          <el-table-column prop="planCount" label="计划参与人数" width="140" />
+          <el-table-column prop="signCount" label="签到人数" width="120" />
+
+          <el-table-column label="操作" width="280" fixed="right">
+            <template #default="{ row }">
+              <el-button link type="primary" @click="handleEdit(row)"> 编辑 </el-button>
+              <el-button link type="danger" @click="handleDelete(row)"> 删除 </el-button>
+              <el-button link @click="handleView(row)"> 查看 </el-button>
+              <el-button link @click="handleSummary(row)"> 小结 </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pagination">
+          <el-pagination
+            v-model:current-page="page.current"
+            v-model:page-size="page.size"
+            :page-sizes="[10, 20, 50, 100]"
+            :total="page.total"
+            layout="total, sizes, prev, pager, next, jumper"
+            @current-change="handlePageChange"
+            @size-change="handleSizeChange"
+          />
+        </div>
+      </el-card>
+    </div>
+    <AddTrainingInformation :state="type" v-model:visible="showAddTrainingInfo" :currentId="currentTableId" />
+  </main>
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, reactive, ref } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { queryTrainingTableData, queryEducationAndTrainingProgramDetail, deleteTrainingInformation, updateEducationTrainingPlanCourseSummary, type TableParamsType } from '@/api/production-education-training-plan-dept';
-import AddTrainingInformation from './addTrainingInformation.vue';
-import type { QueryPageRequest } from '@/types/basic-query';
-import { id, pa } from 'element-plus/es/locale';
-const router = useRouter();
-const route = useRoute();
-
-const operate = computed(() => (route.query.operate as string) || 'education-training-plan-management-dept-view');
-const currentId = computed(() => Number(route.query.id));
-
-const isViewMode = computed(() => operate.value === 'education-training-plan-management-dept-view');
-const query = ref({
+  import { computed, onMounted, reactive, ref } from 'vue';
+  import { useRoute, useRouter } from 'vue-router';
+  import { ElMessage, ElMessageBox } from 'element-plus';
+  import {
+    queryTrainingTableData,
+    queryEducationAndTrainingProgramDetail,
+    deleteTrainingInformation,
+    updateEducationTrainingPlanCourseSummary,
+    type TableParamsType,
+  } from '@/api/production-education-training-plan-dept';
+  import AddTrainingInformation from './addTrainingInformation.vue';
+  import type { QueryPageRequest } from '@/types/basic-query';
+  import { id, pa } from 'element-plus/es/locale';
+  const router = useRouter();
+  const route = useRoute();
+
+  const operate = computed(() => (route.query.operate as string) || 'education-training-plan-management-dept-view');
+  const currentId = computed(() => Number(route.query.id));
+
+  const isViewMode = computed(() => operate.value === 'education-training-plan-management-dept-view');
+  const query = ref({
     name: '',
-    time: []
-})
-const details = reactive({
+    time: [],
+  });
+  const details = reactive({
     trainingPlanName: '',
     categoryName: '',
     trainingObject: '',
@@ -164,154 +161,147 @@ const details = reactive({
     createdByName: '',
     createdAt: '',
     deptName: '',
-})
-const page = ref({
+  });
+  const page = ref({
     current: 1,
     size: 10,
-    total: 0
-})
+    total: 0,
+  });
 
-const tableData = ref([])
-const type = ref('add')
-const showAddTrainingInfo = ref(false)
-const currentTableId = ref('')
-// 搜索和筛选相关
-const dateRange = ref([]);
+  const tableData = ref([]);
+  const type = ref('add');
+  const showAddTrainingInfo = ref(false);
+  const currentTableId = ref('');
+  // 搜索和筛选相关
+  const dateRange = ref([]);
 
-const tableQuery = reactive<QueryPageRequest<TableParamsType>>({
+  const tableQuery = reactive<QueryPageRequest<TableParamsType>>({
     pageNumber: page.value.current,
     pageSize: page.value.size,
     queryParam: {
-        petpiId: currentId.value,
-        courseName: '',
-        dateStart: dateRange.value[0],
-        dateEnd: dateRange.value[1],
+      petpiId: currentId.value,
+      courseName: '',
+      dateStart: dateRange.value[0],
+      dateEnd: dateRange.value[1],
     },
-});
-
+  });
 
-const handlePageChange = (current) => {
-    page.value.current = current
+  const handlePageChange = (current) => {
+    page.value.current = current;
     getTableList();
-}
+  };
 
-const handleSizeChange = (size) => {
-    page.value.size = size
-    page.value.current = 1
+  const handleSizeChange = (size) => {
+    page.value.size = size;
+    page.value.current = 1;
     getTableList();
-}
+  };
 
-const handleSearch = () => {
+  const handleSearch = () => {
     page.value.current = 1;
     tableQuery.pageNumber = 1;
     getTableList();
-}
+  };
 
-const handleExport = () => {
-    ElMessage.success('点击了导出')
-}
+  const handleExport = () => {
+    ElMessage.success('点击了导出');
+  };
 
-const handleAdd = () => {
-    type.value = 'add'
-    showAddTrainingInfo.value = true
-}
+  const handleAdd = () => {
+    type.value = 'add';
+    showAddTrainingInfo.value = true;
+  };
 
-const handleEdit = (row) => {
-    type.value = 'edit'
-    showAddTrainingInfo.value = true
-    currentTableId.value = row.id
-}
+  const handleEdit = (row) => {
+    type.value = 'edit';
+    showAddTrainingInfo.value = true;
+    currentTableId.value = row.id;
+  };
 
-const handleView = (row) => {
-    type.value = 'view'
-    showAddTrainingInfo.value = true
-}
+  const handleView = (row) => {
+    type.value = 'view';
+    showAddTrainingInfo.value = true;
+  };
 
-const handleSummary = async (row) => {
+  const handleSummary = async (row) => {
     try {
-        await updateEducationTrainingPlanCourseSummary({ id: row.id, summary: row.summary });
-        ElMessage.success('更新小结成功');
-        getTableList();
+      await updateEducationTrainingPlanCourseSummary({ id: row.id, summary: row.summary });
+      ElMessage.success('更新小结成功');
+      getTableList();
     } catch (e) {
-        ElMessage.error('更新小结失败');
+      ElMessage.error('更新小结失败');
     }
-}
-
-const handleDelete = (row) => {
-    ElMessageBox.confirm(
-        `确认删除课程「${row.courseName}」吗?`,
-        '提示',
-        { type: 'warning' }
-    ).then(async () => {
-        await deleteTrainingInformation(row.id);
-        // 删除操作逻辑
-        ElMessage.success('删除成功')
-        getTableList(); // 重新获取列表数据
-    })
-}
-const getTableList = async () => {
+  };
+
+  const handleDelete = (row) => {
+    ElMessageBox.confirm(`确认删除课程「${row.courseName}」吗?`, '提示', { type: 'warning' }).then(async () => {
+      await deleteTrainingInformation(row.id);
+      // 删除操作逻辑
+      ElMessage.success('删除成功');
+      getTableList(); // 重新获取列表数据
+    });
+  };
+  const getTableList = async () => {
     if (!currentId.value) return;
     try {
-        const res = await queryTrainingTableData(tableQuery);
-        if (res) {
-            tableData.value = res.records || [];
-            page.value.total = res.total || 0;
-        }
-
+      const res = await queryTrainingTableData(tableQuery);
+      if (res) {
+        tableData.value = res.records || [];
+        page.value.total = res.total || 0;
+      }
     } catch (e) {
-        ElMessage.error('获取培训课程列表失败');
+      ElMessage.error('获取培训课程列表失败');
     }
-};
-const getDetail = async () => {
+  };
+  const getDetail = async () => {
     if (!currentId.value) return;
     try {
-        const res = await queryEducationAndTrainingProgramDetail(currentId.value);
-        if (res) {
-            Object.assign(details, res);
-        }
-
+      const res = await queryEducationAndTrainingProgramDetail(currentId.value);
+      if (res) {
+        Object.assign(details, res);
+      }
     } catch (e) {
-        ElMessage.error('获取详情失败');
+      ElMessage.error('获取详情失败');
     }
-};
+  };
 
-onMounted(() => {
+  onMounted(() => {
     getDetail();
     getTableList();
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
 
-.page-container {
+  .page-container {
     padding: 16px;
-}
+  }
 
-.pagination {
+  .pagination {
     width: 100%;
     margin-top: 20px;
     display: flex;
     justify-content: flex-end;
-}
+  }
 
-.title {
+  .title {
     margin: 0 0 8px;
-}
+  }
 
-.meta {
+  .meta {
     font-size: 13px;
     color: #666;
     display: flex;
     gap: 24px;
     margin-top: 20px;
-}
+  }
 
-.mb-12 {
+  .mb-12 {
     margin-bottom: 12px;
-}
+  }
 
-.mb-16 {
+  .mb-16 {
     margin-bottom: 16px;
-}
+  }
 </style>

+ 57 - 77
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/configs/form.ts

@@ -8,91 +8,71 @@
 import { FormConfig } from '@/types/basic-form';
 
 export const INVENTORY_FORM_CONFIG: FormConfig[] = [
-    {
-        prop: 'itemName',
-        label: '物品名称:',
-        component: 'ElInput',
-        componentProps: {
-            placeholder: '请输入物品名称',
-        },
+  {
+    prop: 'itemName',
+    label: '物品名称:',
+    component: 'ElInput',
+    componentProps: {
+      placeholder: '请输入物品名称',
     },
-    {
-        prop: 'warehouseDate',
-        label: '入库日期:',
-        component: 'ElDatePicker',
-        componentProps: {
-            type: 'date',
-            placeholder: '请选择入库日期',
-            valueFormat: 'YYYY-MM-DD',
-        },
+  },
+  {
+    prop: 'warehouseDate',
+    label: '入库日期:',
+    component: 'ElDatePicker',
+    componentProps: {
+      type: 'date',
+      placeholder: '请选择入库日期',
+      valueFormat: 'YYYY-MM-DD',
     },
-    {
-        prop: 'itemQuantity',
-        label: '物品数量:',
-        component: 'ElInputNumber',
-        componentProps: {
-            min: 1,
-            max: 99999,
-            precision: 0, // 不允许小数点,只能输入整数
-            placeholder: '请输入物品数量',
-        },
+  },
+  {
+    prop: 'itemQuantity',
+    label: '物品数量:',
+    component: 'ElInputNumber',
+    componentProps: {
+      min: 1,
+      max: 99999,
+      precision: 0, // 不允许小数点,只能输入整数
+      placeholder: '请输入物品数量',
     },
-    {
-        label: '备注:',
-        prop: 'remarks',
-        component: 'ElInput',
-        componentProps: {
-            type: 'textarea',
-            rows: 5,
-            placeholder: '请输入备注',
-        },
+  },
+  {
+    label: '备注:',
+    prop: 'remarks',
+    component: 'ElInput',
+    componentProps: {
+      type: 'textarea',
+      rows: 5,
+      placeholder: '请输入备注',
     },
+  },
 ];
 
 export const INVENTORY_FORM_DATA = {
-    itemName: '',
-    warehouseDate: '',
-    itemQuantity: 1, // 最小值为1
-    remarks: '',
+  itemName: '',
+  warehouseDate: '',
+  itemQuantity: 1, // 最小值为1
+  remarks: '',
 };
 
-
-
 // 验证规则
 export const TRAINING_FORM_RULES = {
-    courseType: [
-        { required: true, message: '请选择课程所属类别', trigger: 'blur' }
-    ],
-    courseName: [
-        { required: true, message: '请输入培训课程名称', trigger: 'blur' }
-    ],
-    trainingMethod: [
-        { required: true, message: '请输入培训方式', trigger: 'blur' }
-    ],
-    trainingTeacher: [
-        { required: true, message: '请输入培训课程讲师', trigger: 'blur' }
-    ],
-    planNumOfParticipants: [
-        { required: true, message: '请输入计划参与人数', trigger: 'blur' },
-        { type: 'number', message: '人数必须为数字值', trigger: 'blur' }
-    ],
-    groupOfParticipants: [
-        { required: true, message: '请选择参与人员分组', trigger: 'change' },
-        { type: 'array', min: 1, message: '至少选择一个分组', trigger: 'change' }
-    ],
-    startDate: [
-        { required: true, message: '请选择培训开始日期', trigger: 'change' }
-    ],
-    endDate: [
-        { required: true, message: '请选择培训结束日期', trigger: 'change' }
-    ],
-    courseIntroduction: [
-        { required: true, message: '请输入培训课程简述', trigger: 'blur' }
-    ],
-    courseContent: [
-        { required: true, message: '请输入课程内容', trigger: 'blur' }
-    ],
-    isSign: [
-        { required: true, message: '请选择是否需要签名', trigger: 'change' }
-    ],
-}
+  courseType: [{ required: true, message: '请选择课程所属类别', trigger: 'blur' }],
+  courseName: [{ required: true, message: '请输入培训课程名称', trigger: 'blur' }],
+  trainingMethod: [{ required: true, message: '请输入培训方式', trigger: 'blur' }],
+  trainingTeacher: [{ required: true, message: '请输入培训课程讲师', trigger: 'blur' }],
+  planNumOfParticipants: [
+    { required: true, message: '请输入计划参与人数', trigger: 'blur' },
+    { type: 'number', message: '人数必须为数字值', trigger: 'blur' },
+  ],
+  groupOfParticipants: [
+    { required: true, message: '请选择参与人员分组', trigger: 'change' },
+    { type: 'array', min: 1, message: '至少选择一个分组', trigger: 'change' },
+  ],
+  startDate: [{ required: true, message: '请选择培训开始日期', trigger: 'change' }],
+  endDate: [{ required: true, message: '请选择培训结束日期', trigger: 'change' }],
+  courseIntroduction: [{ required: true, message: '请输入培训课程简述', trigger: 'blur' }],
+  courseContent: [{ required: true, message: '请输入课程内容', trigger: 'blur' }],
+  isSign: [{ required: true, message: '请选择是否需要签名', trigger: 'change' }],
+};

+ 100 - 100
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/configs/tables.ts

@@ -2,117 +2,117 @@ import type { TableColumnProps } from '@/types/basic-table';
 
 // 状态标签映射
 export const STATUS_LABEL: Record<string, string> = {
-    '1': '未下发',
-    '2': '进行中',
-    '3': '已完成',
-    '4': '已作废',
+  '1': '未下发',
+  '2': '进行中',
+  '3': '已完成',
+  '4': '已作废',
 };
 
 // 基础表格样式配置
 export const TABLE_OPTIONS = {
-    emptyText: '暂无数据',
-    loading: true,
-    maxHeight: 'calc(70vh - 150px)',
+  emptyText: '暂无数据',
+  loading: true,
+  maxHeight: 'calc(70vh - 150px)',
 };
 
 // 状态选项
 export const STATUS_OPTIONS = [
-    { label: '全部', value: '' },
-    { label: '未下发', value: 1 },
-    { label: '进行中', value: 2 },
-    { label: '已完成', value: 3 },
-    { label: '已作废', value: 4 },
+  { label: '全部', value: '' },
+  { label: '未下发', value: 1 },
+  { label: '进行中', value: 2 },
+  { label: '已完成', value: 3 },
+  { label: '已作废', value: 4 },
 ];
 
 export const TABLE_COLUMNS: TableColumnProps[] = [
-    {
-        label: '编号',
-        type: 'index',
-        align: 'center',
-        width: '80px',
-        fixed: 'left',
-    },
-    {
-        label: '培训名称(内容)',
-        prop: 'trainingContent',
-        align: 'left',
-        minWidth: '220px',
-        fixed: 'left',
-    },
-    {
-        label: '状态',
-        prop: 'statusName',
-        align: 'center',
-        minWidth: '100px',
-    },
-    {
-        label: '分类名称',
-        prop: 'categoryName',
-        align: 'center',
-        minWidth: '110px',
-    },
-    {
-        label: '培训计划名称',
-        prop: 'trainingPlanName',
-        align: 'center',
-        minWidth: '140px',
-    },
-    {
-        label: '培训对象',
-        prop: 'trainingObject',
-        align: 'center',
-        minWidth: '110px',
-    },
-    {
-        label: '培训人数',
-        prop: 'trainingCount',
-        align: 'center',
-        minWidth: '120px',
-    },
-    {
-        label: '培训方式',
-        prop: 'trainingMethod',
-        align: 'center',
-        minWidth: '150px',
-    },
-    {
-        label: '培训时间',
-        prop: 'trainingTime',
-        align: 'center',
-        minWidth: '120px',
-    },
-    {
-        label: '考核方式',
-        prop: 'assessmentMethod',
-        align: 'center',
-        minWidth: '120px',
-    },
+  {
+    label: '编号',
+    type: 'index',
+    align: 'center',
+    width: '80px',
+    fixed: 'left',
+  },
+  {
+    label: '培训名称(内容)',
+    prop: 'trainingContent',
+    align: 'left',
+    minWidth: '220px',
+    fixed: 'left',
+  },
+  {
+    label: '状态',
+    prop: 'statusName',
+    align: 'center',
+    minWidth: '100px',
+  },
+  {
+    label: '分类名称',
+    prop: 'categoryName',
+    align: 'center',
+    minWidth: '110px',
+  },
+  {
+    label: '培训计划名称',
+    prop: 'trainingPlanName',
+    align: 'center',
+    minWidth: '140px',
+  },
+  {
+    label: '培训对象',
+    prop: 'trainingObject',
+    align: 'center',
+    minWidth: '110px',
+  },
+  {
+    label: '培训人数',
+    prop: 'trainingCount',
+    align: 'center',
+    minWidth: '120px',
+  },
+  {
+    label: '培训方式',
+    prop: 'trainingMethod',
+    align: 'center',
+    minWidth: '150px',
+  },
+  {
+    label: '培训时间',
+    prop: 'trainingTime',
+    align: 'center',
+    minWidth: '120px',
+  },
+  {
+    label: '考核方式',
+    prop: 'assessmentMethod',
+    align: 'center',
+    minWidth: '120px',
+  },
 
-    {
-        label: '学时',
-        prop: 'studyHours',
-        align: 'center',
-        minWidth: '80px',
-    },
+  {
+    label: '学时',
+    prop: 'studyHours',
+    align: 'center',
+    minWidth: '80px',
+  },
 
-    {
-        label: '计划开始时间',
-        prop: 'startTime',
-        align: 'center',
-        minWidth: '150px',
-    },
-    {
-        label: '计划结束时间',
-        prop: 'endTime',
-        align: 'center',
-        minWidth: '150px',
-    },
-    {
-        label: '操作',
-        prop: 'action',
-        slot: 'action',
-        fixed: 'right',
-        width: '300px',
-        align: 'left',
-    },
+  {
+    label: '计划开始时间',
+    prop: 'startTime',
+    align: 'center',
+    minWidth: '150px',
+  },
+  {
+    label: '计划结束时间',
+    prop: 'endTime',
+    align: 'center',
+    minWidth: '150px',
+  },
+  {
+    label: '操作',
+    prop: 'action',
+    slot: 'action',
+    fixed: 'right',
+    width: '300px',
+    align: 'left',
+  },
 ];

+ 194 - 167
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/educationTrainingPlanManagementDept.vue

@@ -1,230 +1,257 @@
 <template>
-    <div class="safety-platform-container">
-        <header class="safety-platform-container__header">
-            <div class="breadcrumb-title"> 教育培训计划管理(部门)</div>
-        </header>
-        <main class="safety-platform-container__main">
-            <div class="search-table-container">
-                <header>
-                    <div style="position: relative">
-                        <!-- <el-button type="primary" class="search-table-container--button" @click="handleCreate">
+  <div class="safety-platform-container">
+    <header class="safety-platform-container__header">
+      <div class="breadcrumb-title"> 教育培训计划管理(部门)</div>
+    </header>
+    <main class="safety-platform-container__main">
+      <div class="search-table-container">
+        <header>
+          <div style="position: relative">
+            <!-- <el-button type="primary" class="search-table-container--button" @click="handleCreate">
                             添加
                         </el-button> -->
-                        <!-- <el-button plain class="search-table-container--button" @click="handleImport">
+            <!-- <el-button plain class="search-table-container--button" @click="handleImport">
                             导入
                         </el-button>
                         <el-button plain class="search-table-container--button" @click="handleDownload">
                             导出
                         </el-button> -->
-                    </div>
-                    <div class="act-search">
-                        <section class="select-box">
-                            <div class="select-box--item">
-                                <span>培训内容/计划名称:</span>
-                                <el-input v-model="tableQuery.queryParam.keyword" placeholder="搜索培训内容或计划名称"
-                                    class="act-search-input" />
-                            </div>
-                            <div class="select-box--item">
-                                <span>状态:</span>
-                                <el-select v-model="tableQuery.queryParam.status" placeholder="请选择状态" clearable>
-                                    <el-option v-for="item in STATUS_OPTIONS" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </div>
-                            <div class="select-box--item">
-                                <span>分类名称:</span>
-                                <el-select v-model="tableQuery.queryParam.classifyName" placeholder="请选择分类名称" filterable
-                                    clearable>
-                                    <el-option v-for="item in classifyNameOptions" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </div>
-                            <div>
-                                <span>计划日期范围:</span>
-                                <el-date-picker v-model="dateRange" type="daterange" range-separator="至"
-                                    start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD"
-                                    format="YYYY-MM-DD" />
-                            </div>
-                        </section>
-                        <section class="search-btn">
-                            <el-button type="primary" @click="handleSearch">查询</el-button>
-                            <el-button @click="handleReset">重置</el-button>
-                        </section>
-                    </div>
-                </header>
-
-                <div class="batch-table">
-                    <BasicTable ref="basicTableRef" :tableData="tableData" :tableConfig="tableConfig"
-                        @update:pageSize="handleSizeChange" @update:pageNumber="handleCurrentChange">
-                        <template #action="scope">
-                            <div class="action-container--div" style="justify-content: left">
-                                <ActionButton text="查看" @click="handleView(scope.row.id)" />
-                            </div>
-                        </template>
-                    </BasicTable>
-                </div>
-            </div>
-        </main>
-        <BatchImport v-if="batchImportVisible" :visible="batchImportVisible" :import-api-url="importApiUrl"
-            :template-url="templateUrl" template-name="下载模板" :show-template="false" @close="batchImportVisible = false"
-            @update="handleUpdate" />
-    </div>
+          </div>
+          <div class="act-search">
+            <section class="select-box">
+              <div class="select-box--item">
+                <span>培训内容/计划名称:</span>
+                <el-input
+                  v-model="tableQuery.queryParam.keyword"
+                  placeholder="搜索培训内容或计划名称"
+                  class="act-search-input"
+                />
+              </div>
+              <div class="select-box--item">
+                <span>状态:</span>
+                <el-select v-model="tableQuery.queryParam.status" placeholder="请选择状态" clearable>
+                  <el-option v-for="item in STATUS_OPTIONS" :key="item.value" :label="item.label" :value="item.value" />
+                </el-select>
+              </div>
+              <div class="select-box--item">
+                <span>分类名称:</span>
+                <el-select
+                  v-model="tableQuery.queryParam.classifyName"
+                  placeholder="请选择分类名称"
+                  filterable
+                  clearable
+                >
+                  <el-option
+                    v-for="item in classifyNameOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </div>
+              <div>
+                <span>计划日期范围:</span>
+                <el-date-picker
+                  v-model="dateRange"
+                  type="daterange"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  value-format="YYYY-MM-DD"
+                  format="YYYY-MM-DD"
+                />
+              </div>
+            </section>
+            <section class="search-btn">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button @click="handleReset">重置</el-button>
+            </section>
+          </div>
+        </header>
+
+        <div class="batch-table">
+          <BasicTable
+            ref="basicTableRef"
+            :tableData="tableData"
+            :tableConfig="tableConfig"
+            @update:pageSize="handleSizeChange"
+            @update:pageNumber="handleCurrentChange"
+          >
+            <template #action="scope">
+              <div class="action-container--div" style="justify-content: left">
+                <ActionButton text="查看" @click="handleView(scope.row.id)" />
+              </div>
+            </template>
+          </BasicTable>
+        </div>
+      </div>
+    </main>
+    <BatchImport
+      v-if="batchImportVisible"
+      :visible="batchImportVisible"
+      :import-api-url="importApiUrl"
+      :template-url="templateUrl"
+      template-name="下载模板"
+      :show-template="false"
+      @close="batchImportVisible = false"
+      @update="handleUpdate"
+    />
+  </div>
 </template>
 
 <script setup lang="ts">
-import { onMounted, reactive, ref } from 'vue';
-import { ElMessage } from 'element-plus';
-import BasicTable from '@/components/BasicTable.vue';
-import useTableConfig from '@/hooks/useTableConfigHook';
-import ActionButton from '@/components/ActionButton.vue';
-import { TABLE_OPTIONS, TABLE_COLUMNS, STATUS_OPTIONS } from './configs/tables';
-import { useRouter } from 'vue-router';
-import type { QueryPageRequest } from '@/types/basic-query';
-import { getEducationAndTrainingProgramList } from '@/api/production-education-training-plan-dept';
-import { downloadByData } from '@/utils/file/download';
-import BatchImport from '@/components/batch-import/BatchImport.vue';
-import { useGlobSetting } from '@/hooks/setting';
-import urlJoin from 'url-join';
-const router = useRouter();
-
-// 表格
-const basicTableRef = ref<InstanceType<typeof BasicTable>>();
-
-const { tableConfig, pagination } = useTableConfig(TABLE_COLUMNS, TABLE_OPTIONS);
-
-const tableData = ref<any[]>([]);
-// 日期范围
-const dateRange = ref<[string, string] | null>(null);
-// 分类名称选项
-const classifyNameOptions = ref<Array<{ label: string; value: string }>>([
+  import { onMounted, reactive, ref } from 'vue';
+  import { ElMessage } from 'element-plus';
+  import BasicTable from '@/components/BasicTable.vue';
+  import useTableConfig from '@/hooks/useTableConfigHook';
+  import ActionButton from '@/components/ActionButton.vue';
+  import { TABLE_OPTIONS, TABLE_COLUMNS, STATUS_OPTIONS } from './configs/tables';
+  import { useRouter } from 'vue-router';
+  import type { QueryPageRequest } from '@/types/basic-query';
+  import { getEducationAndTrainingProgramList } from '@/api/production-education-training-plan-dept';
+  import { downloadByData } from '@/utils/file/download';
+  import BatchImport from '@/components/batch-import/BatchImport.vue';
+  import { useGlobSetting } from '@/hooks/setting';
+  import urlJoin from 'url-join';
+  const router = useRouter();
+
+  // 表格
+  const basicTableRef = ref<InstanceType<typeof BasicTable>>();
+
+  const { tableConfig, pagination } = useTableConfig(TABLE_COLUMNS, TABLE_OPTIONS);
+
+  const tableData = ref<any[]>([]);
+  // 日期范围
+  const dateRange = ref<[string, string] | null>(null);
+  // 分类名称选项
+  const classifyNameOptions = ref<Array<{ label: string; value: string }>>([
     { label: '全部', value: '全部' },
     { label: '全员安全培训', value: '全员安全培训' },
     { label: '新员工培训', value: '新员工培训' },
     { label: '岗位资质培训', value: '岗位资质培训' },
     { label: '生产作业安全培训', value: '生产作业安全培训' },
     { label: '安全管理人员培训', value: '安全管理人员培训' },
-]);
+  ]);
 
-const tableQuery = reactive<QueryPageRequest<any>>({
+  const tableQuery = reactive<QueryPageRequest<any>>({
     pageNumber: pagination.pageNumber,
     pageSize: pagination.pageSize,
     queryParam: {
-        keyword: "",
-        status: "",
-        categoryName: "",
-        startDate: "",
-        endDate: "",
+      keyword: '',
+      status: '',
+      categoryName: '',
+      startDate: '',
+      endDate: '',
     },
-});
+  });
 
-const handleSizeChange = (value: number) => {
+  const handleSizeChange = (value: number) => {
     pagination.pageSize = value;
     tableQuery.pageSize = value;
     getTableData();
-};
+  };
 
-const handleCurrentChange = (value: number) => {
+  const handleCurrentChange = (value: number) => {
     pagination.pageNumber = value;
     tableQuery.pageNumber = value;
     getTableData();
-};
+  };
 
-async function getTableData() {
+  async function getTableData() {
     tableConfig.loading = true;
     try {
-        tableQuery.queryParam.startDate = dateRange.value ? dateRange.value[0] : '';
-        tableQuery.queryParam.endDate = dateRange.value ? dateRange.value[1] : '';
-        const res = await getEducationAndTrainingProgramList(tableQuery);
-        if (res) {
-            // 映射返回数据字段到表格字段
-            tableData.value = res.records
-            pagination.total = res.totalRow;
-        }
+      tableQuery.queryParam.startDate = dateRange.value ? dateRange.value[0] : '';
+      tableQuery.queryParam.endDate = dateRange.value ? dateRange.value[1] : '';
+      const res = await getEducationAndTrainingProgramList(tableQuery);
+      if (res) {
+        // 映射返回数据字段到表格字段
+        tableData.value = res.records;
+        pagination.total = res.totalRow;
+      }
     } catch (e) {
-        console.error('获取物品库存列表失败:', e);
-        tableData.value = [];
-        pagination.total = 0;
+      console.error('获取物品库存列表失败:', e);
+      tableData.value = [];
+      pagination.total = 0;
     } finally {
-        tableConfig.loading = false;
+      tableConfig.loading = false;
     }
-}
+  }
 
-const handleSearch = () => {
+  const handleSearch = () => {
     pagination.pageNumber = 1;
     tableQuery.pageNumber = 1;
     getTableData();
-};
+  };
 
-const handleReset = () => {
+  const handleReset = () => {
     pagination.pageNumber = 1;
     Object.assign(tableQuery, {
-        pageNumber: 1,
-        pageSize: pagination.pageSize,
-        queryParam: {
-            keyword: "",
-            status: "",
-            categoryName: "",
-            startDate: "",
-            endDate: "",
-        },
-    })
-    dateRange.value = null
+      pageNumber: 1,
+      pageSize: pagination.pageSize,
+      queryParam: {
+        keyword: '',
+        status: '',
+        categoryName: '',
+        startDate: '',
+        endDate: '',
+      },
+    });
+    dateRange.value = null;
     handleSearch();
-};
+  };
 
-// 批量导入
-const batchImportVisible = ref(false);
-const { urlPrefix } = useGlobSetting();
-const importApiUrl = ref(urlJoin(urlPrefix, '/inventory/importInventory'));
-const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-inventory-template.xlsx');
+  // 批量导入
+  const batchImportVisible = ref(false);
+  const { urlPrefix } = useGlobSetting();
+  const importApiUrl = ref(urlJoin(urlPrefix, '/inventory/importInventory'));
+  const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-inventory-template.xlsx');
 
-const handleImport = () => {
+  const handleImport = () => {
     batchImportVisible.value = true;
-};
+  };
 
-const handleUpdate = () => {
+  const handleUpdate = () => {
     batchImportVisible.value = false;
     getTableData();
-};
+  };
 
-const handleDownload = async () => {
+  const handleDownload = async () => {
     try {
-        const exportParams = {
-            stuffName: tableQuery.queryParam.stuffName || undefined,
-            status: tableQuery.queryParam.status,
-            ids: tableQuery.queryParam.ids.length > 0 ? tableQuery.queryParam.ids : undefined,
-        };
-        // const response = await exportInventory(exportParams);
-        // if (response) {
-        //     const fileName = `物品库存管理_${new Date().toISOString().split('T')[0]}.xlsx`;
-        //     downloadByData(response, fileName);
-        //     ElMessage.success('导出成功');
-        // }
+      const exportParams = {
+        stuffName: tableQuery.queryParam.stuffName || undefined,
+        status: tableQuery.queryParam.status,
+        ids: tableQuery.queryParam.ids.length > 0 ? tableQuery.queryParam.ids : undefined,
+      };
+      // const response = await exportInventory(exportParams);
+      // if (response) {
+      //     const fileName = `物品库存管理_${new Date().toISOString().split('T')[0]}.xlsx`;
+      //     downloadByData(response, fileName);
+      //     ElMessage.success('导出成功');
+      // }
     } catch (e) {
-        console.error('导出物品库存失败:', e);
-        ElMessage.error('导出失败,请重试');
+      console.error('导出物品库存失败:', e);
+      ElMessage.error('导出失败,请重试');
     }
-};
-
+  };
 
-const handleView = (id: number) => {
+  const handleView = (id: number) => {
     router.push({
-        name: 'educationTrainingPlanManagementDeptItem',
-        query: {
-            id,
-            operate: 'education-training-plan-management-dept-view',
-        },
+      name: 'educationTrainingPlanManagementDeptItem',
+      query: {
+        id,
+        operate: 'education-training-plan-management-dept-view',
+      },
     });
-};
+  };
 
-onMounted(() => {
+  onMounted(() => {
     getTableData();
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
-@use '@/styles/page-main-layout.scss' as *;
-@use '@/styles/basic-table-action.scss' as *;
-@use '@/views/traffic/violation/style/act-search-table.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
+  @use '@/styles/basic-table-action.scss' as *;
+  @use '@/views/traffic/violation/style/act-search-table.scss' as *;
 </style>

+ 23 - 23
src/views/production-safety/safetyTrainingAndEducation/educationTrainingPlanManagementDept/educationTrainingPlanManagementDeptItem.vue

@@ -6,41 +6,41 @@
  * @Describe: file describe
 -->
 <template>
-    <div class="safety-platform-container">
-        <header class="safety-platform-container__header">
-            <BreadcrumbBack />
-            <span class="breadcrumb-title">{{ headerTitle }}</span>
-        </header>
-        <EducationTrainingPlanManagementDeptDetail />
-    </div>
+  <div class="safety-platform-container">
+    <header class="safety-platform-container__header">
+      <BreadcrumbBack />
+      <span class="breadcrumb-title">{{ headerTitle }}</span>
+    </header>
+    <EducationTrainingPlanManagementDeptDetail />
+  </div>
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
-import { useRoute } from 'vue-router';
-import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
-import EducationTrainingPlanManagementDeptDetail from './components/educationTrainingPlanManagementDeptDetail.vue';
+  import { computed } from 'vue';
+  import { useRoute } from 'vue-router';
+  import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
+  import EducationTrainingPlanManagementDeptDetail from './components/educationTrainingPlanManagementDeptDetail.vue';
 
-const route = useRoute();
-const operate = route.query.operate as string;
+  const route = useRoute();
+  const operate = route.query.operate as string;
 
-const headerTitle = computed(() => {
+  const headerTitle = computed(() => {
     switch (operate) {
-        case 'education-training-plan-management-dept-view':
-            return '查看教育培训计划内容(部门)';
-        default:
-            return '未知操作';
+      case 'education-training-plan-management-dept-view':
+        return '查看教育培训计划内容(部门)';
+      default:
+        return '未知操作';
     }
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
-@use '@/styles/page-main-layout.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
 
-.safety-platform-container__header {
+  .safety-platform-container__header {
     flex-direction: row !important;
     justify-content: flex-start !important;
     gap: 8px !important;
-}
+  }
 </style>

+ 155 - 142
src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/commonTable.vue

@@ -6,211 +6,224 @@
  * @Describe: file describe
 -->
 <script setup lang="ts">
-import { onMounted, ref, watch, reactive } from 'vue';
-import { ElDialog, ElPopconfirm } from 'element-plus';
-import { EDIT_EMPLOYEE_FORM_RULES } from '../configs/form';
-import { getEmployeeDetailTableList, type EmployeeTableType, updateEducationStaffTrainingCardScore, delateEducationStaffTrainingCardScore } from '@/api/employee-training-record-card-management';
-const props = defineProps({
+  import { onMounted, ref, watch, reactive } from 'vue';
+  import { ElDialog, ElPopconfirm } from 'element-plus';
+  import { EDIT_EMPLOYEE_FORM_RULES } from '../configs/form';
+  import {
+    getEmployeeDetailTableList,
+    type EmployeeTableType,
+    updateEducationStaffTrainingCardScore,
+    delateEducationStaffTrainingCardScore,
+  } from '@/api/employee-training-record-card-management';
+  const props = defineProps({
     index: {
-        type: Number,
-        default: 1
+      type: Number,
+      default: 1,
     },
     id: {
-        type: Number,
-        default: 0
-    }
-})
-const rules = ref(EDIT_EMPLOYEE_FORM_RULES)
-const tabName = ref('')
+      type: Number,
+      default: 0,
+    },
+  });
+  const rules = ref(EDIT_EMPLOYEE_FORM_RULES);
+  const tabName = ref('');
 
-const pagination = reactive({
+  const pagination = reactive({
     pageNumber: 1,
     pageSize: 10,
-    total: 0
-})
-// 日期范围
-const dateRange = ref<[string, string] | null>(null);
+    total: 0,
+  });
+  // 日期范围
+  const dateRange = ref<[string, string] | null>(null);
 
-const tableQuery = reactive({
+  const tableQuery = reactive({
     pageNumber: pagination.pageNumber,
     pageSize: pagination.pageSize,
     queryParam: {
-        logType: props.index,
-        pestcId: props.id,
-        keyWord: "",
-        dateStart: "",
-        dateEnd: ""
+      logType: props.index,
+      pestcId: props.id,
+      keyWord: '',
+      dateStart: '',
+      dateEnd: '',
     },
-});
-const handleSizeChange = (value: number) => {
+  });
+  const handleSizeChange = (value: number) => {
     pagination.pageSize = value;
     tableQuery.pageSize = value;
     getActionTableList();
-};
+  };
 
-const handleCurrentChange = (value: number) => {
+  const handleCurrentChange = (value: number) => {
     pagination.pageNumber = value;
     tableQuery.pageNumber = value;
     getActionTableList();
-};
-// 格式化时间
-const formatDate = (date) => {
+  };
+  // 格式化时间
+  const formatDate = (date) => {
     if (!date) return '';
     const year = date.getFullYear();
     const month = String(date.getMonth() + 1).padStart(2, '0');
     const day = String(date.getDate()).padStart(2, '0');
     return `${year}-${month}-${day}`; // 输出:2026-02-11
-}
+  };
 
-let tableData = ref<any[]>([])
-const getActionTableList = async () => {
+  let tableData = ref<any[]>([]);
+  const getActionTableList = async () => {
     tableQuery.queryParam.dateStart = dateRange.value ? formatDate(dateRange.value[0]) : '';
     tableQuery.queryParam.dateEnd = dateRange.value ? formatDate(dateRange.value[1]) : '';
     try {
-        const res = await getEmployeeDetailTableList(tableQuery)
-        if (res) {
-            tableData.value = res.records;
-            pagination.total = res.totalRow;
-        }
+      const res = await getEmployeeDetailTableList(tableQuery);
+      if (res) {
+        tableData.value = res.records;
+        pagination.total = res.totalRow;
+      }
     } catch (e) {
-        tableData.value = [];
-        pagination.total = 0;
+      tableData.value = [];
+      pagination.total = 0;
     }
-}
+  };
 
-watch(() => props.index, (val) => {
-    if (val === 1 || val === 2) {
-        tableQuery.queryParam.logType = val
-        getActionTableList()
-    }
-}, { immediate: true, deep: true })
+  watch(
+    () => props.index,
+    (val) => {
+      if (val === 1 || val === 2) {
+        tableQuery.queryParam.logType = val;
+        getActionTableList();
+      }
+    },
+    { immediate: true, deep: true },
+  );
 
-const ediDialogVisible = ref(false)
-const formData = reactive({
+  const ediDialogVisible = ref(false);
+  const formData = reactive({
     id: 0,
     scoreMust: 0,
-})
-const editHandle = (row) => {
+  });
+  const editHandle = (row) => {
     Object.assign(formData, {
-        id: row.id || '',
-        scoreMust: row.scoreMust,
-    })
-    ediDialogVisible.value = true
-}
-const deleteHandle = (id) => {
+      id: row.id || '',
+      scoreMust: row.scoreMust,
+    });
+    ediDialogVisible.value = true;
+  };
+  const deleteHandle = (id) => {
     try {
-        delateEducationStaffTrainingCardScore(id)
-        getActionTableList()
+      delateEducationStaffTrainingCardScore(id);
+      getActionTableList();
     } catch (e) {
-        console.error('删除失败', e)
+      console.error('删除失败', e);
     }
-}
+  };
 
-const cancelHandle = () => {
-    ediDialogVisible.value = false
-}
-const confirmHandle = async () => {
-    ediDialogVisible.value = false
-    formData.scoreMust = Number(formData.scoreMust)
+  const cancelHandle = () => {
+    ediDialogVisible.value = false;
+  };
+  const confirmHandle = async () => {
+    ediDialogVisible.value = false;
+    formData.scoreMust = Number(formData.scoreMust);
     try {
-        await updateEducationStaffTrainingCardScore(formData)
-        getActionTableList();
+      await updateEducationStaffTrainingCardScore(formData);
+      getActionTableList();
     } catch (e) {
-        console.error('保存失败', e)
+      console.error('保存失败', e);
     }
-}
-const handleSearch = () => {
+  };
+  const handleSearch = () => {
     pagination.pageNumber = 1;
     tableQuery.pageNumber = 1;
     getActionTableList();
-};
+  };
 
-const handleReset = () => {
+  const handleReset = () => {
     tableQuery.queryParam.keyWord = '';
     tableQuery.queryParam.dateStart = '';
     tableQuery.queryParam.dateEnd = '';
     dateRange.value = null;
     tableQuery.pageNumber = 1;
     handleSearch();
-};
-
+  };
 </script>
 <template>
-    <div>
-        <!-- 查询区 -->
-        <el-form :inline="true" class="mb-12">
-            <el-form-item>
-                <el-date-picker type="daterange" start-placeholder="开始时间" end-placeholder="结束时间" v-model="dateRange" />
-            </el-form-item>
-            <el-form-item>
-                <el-input placeholder="搜索关键词" v-model="tableQuery.queryParam.keyWord" />
-            </el-form-item>
-            <el-form-item>
-                <el-button type="primary" @click="handleSearch">搜索</el-button>
-                <el-button type="default" @click="handleReset">重置</el-button>
-                <!-- <el-button type="primary">导出</el-button>
+  <div>
+    <!-- 查询区 -->
+    <el-form :inline="true" class="mb-12">
+      <el-form-item>
+        <el-date-picker type="daterange" start-placeholder="开始时间" end-placeholder="结束时间" v-model="dateRange" />
+      </el-form-item>
+      <el-form-item>
+        <el-input placeholder="搜索关键词" v-model="tableQuery.queryParam.keyWord" />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="handleSearch">搜索</el-button>
+        <el-button type="default" @click="handleReset">重置</el-button>
+        <!-- <el-button type="primary">导出</el-button>
                 <el-button type="danger">删除</el-button> -->
-            </el-form-item>
-        </el-form>
-
-        <!-- 表格 -->
-        <el-table border stripe :data="tableData">
-            <el-table-column type="selection" width="50" />
-            <el-table-column label="编号" prop="serialNum" width="100" />
-            <el-table-column label="日期" prop="logDate" width="200" />
-            <el-table-column label="教育内容" prop="educationContent" width="280" />
-            <el-table-column label="学时" prop="creditHour">
-                <template #default="scope">
-                    <span>{{ scope.row.creditHour }}时</span>
-                </template>
-            </el-table-column>
-            <el-table-column label="成绩" prop="scoreMust">
-                <template #default="scope">
-                    <span>{{ scope.row.scoreMust }}分</span>
-                </template>
-            </el-table-column>
-            <el-table-column label="受教育者签字" prop="educationSign" />
-            <el-table-column label="操作" width="220">
-                <template #default="scope">
-                    <el-button link type="primary" @click="editHandle(scope.row)">编辑</el-button>
-                    <el-popconfirm title="确定要删除该条记录吗?" placement="top" @confirm="deleteHandle(scope.row.id)">
-                        <template #reference>
-                            <el-button link type="danger">删除</el-button>
-                        </template>
-                    </el-popconfirm>
-                </template>
-            </el-table-column>
-        </el-table>
-
-        <!-- 分页 -->
-        <div class="pagination">
-            <el-pagination layout="total, prev, pager, next" :total="pagination.total" :page-size="pagination.pageSize"
-                @size-change="handleSizeChange" @current-change="handleCurrentChange" />
-        </div>
+      </el-form-item>
+    </el-form>
 
-        <!-- 编辑 -->
-        <el-dialog v-model="ediDialogVisible" title="编辑内容" width="500px">
-            <el-form :rules="rules" :model="formData" label-width="120px">
-                <el-form-item label="成绩分数:" required prop="scoreMust">
-                    <el-input v-model="formData.scoreMust" placeholder="输入成绩分数,单位分,0-200" />
-                </el-form-item>
-            </el-form>
-            <template #footer>
-                <el-button @click="cancelHandle">取 消</el-button>
-                <el-button type="primary" @click="confirmHandle">保存</el-button>
+    <!-- 表格 -->
+    <el-table border stripe :data="tableData">
+      <el-table-column type="selection" width="50" />
+      <el-table-column label="编号" prop="serialNum" width="100" />
+      <el-table-column label="日期" prop="logDate" width="200" />
+      <el-table-column label="教育内容" prop="educationContent" width="280" />
+      <el-table-column label="学时" prop="creditHour">
+        <template #default="scope">
+          <span>{{ scope.row.creditHour }}时</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="成绩" prop="scoreMust">
+        <template #default="scope">
+          <span>{{ scope.row.scoreMust }}分</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="受教育者签字" prop="educationSign" />
+      <el-table-column label="操作" width="220">
+        <template #default="scope">
+          <el-button link type="primary" @click="editHandle(scope.row)">编辑</el-button>
+          <el-popconfirm title="确定要删除该条记录吗?" placement="top" @confirm="deleteHandle(scope.row.id)">
+            <template #reference>
+              <el-button link type="danger">删除</el-button>
             </template>
-        </el-dialog>
+          </el-popconfirm>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页 -->
+    <div class="pagination">
+      <el-pagination
+        layout="total, prev, pager, next"
+        :total="pagination.total"
+        :page-size="pagination.pageSize"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
     </div>
+
+    <!-- 编辑 -->
+    <el-dialog v-model="ediDialogVisible" title="编辑内容" width="500px">
+      <el-form :rules="rules" :model="formData" label-width="120px">
+        <el-form-item label="成绩分数:" required prop="scoreMust">
+          <el-input v-model="formData.scoreMust" placeholder="输入成绩分数,单位分,0-200" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="cancelHandle">取 消</el-button>
+        <el-button type="primary" @click="confirmHandle">保存</el-button>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <style scoped>
-.mb-12 {
+  .mb-12 {
     margin-bottom: 12px;
-}
+  }
 
-.pagination {
+  .pagination {
     margin-top: 16px;
     display: flex;
     justify-content: flex-end;
-}
+  }
 </style>

+ 171 - 160
src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/commonTable2.vue

@@ -6,231 +6,242 @@
  * @Describe: file describe
 -->
 <script setup lang="ts">
-import { ref, watch, reactive, onMounted } from 'vue';
-import { ElDialog, ElPopconfirm } from 'element-plus';
-import { EDIT_EMPLOYEE_FORM_RULES } from '../configs/form';
-import { getEmployeeDetailTableList, type EmployeeTableType, updateEducationStaffTrainingCardScore, delateEducationStaffTrainingCardScore } from '@/api/employee-training-record-card-management';
-const props = defineProps({
+  import { ref, watch, reactive, onMounted } from 'vue';
+  import { ElDialog, ElPopconfirm } from 'element-plus';
+  import { EDIT_EMPLOYEE_FORM_RULES } from '../configs/form';
+  import {
+    getEmployeeDetailTableList,
+    type EmployeeTableType,
+    updateEducationStaffTrainingCardScore,
+    delateEducationStaffTrainingCardScore,
+  } from '@/api/employee-training-record-card-management';
+  const props = defineProps({
     index: {
-        type: Number,
-        default: 1
+      type: Number,
+      default: 1,
     },
     id: {
-        type: Number,
-        default: 0
-    }
-})
-const rules = ref(EDIT_EMPLOYEE_FORM_RULES)
-
+      type: Number,
+      default: 0,
+    },
+  });
+  const rules = ref(EDIT_EMPLOYEE_FORM_RULES);
 
-const pagination = reactive({
+  const pagination = reactive({
     pageNumber: 1,
     pageSize: 10,
-    total: 0
-})
-// 日期范围
-const dateRange = ref<[string, string] | null>(null);
+    total: 0,
+  });
+  // 日期范围
+  const dateRange = ref<[string, string] | null>(null);
 
-const tableQuery = reactive({
+  const tableQuery = reactive({
     pageNumber: pagination.pageNumber,
     pageSize: pagination.pageSize,
     queryParam: {
-        logType: props.index,
-        pestcId: props.id,
-        keyword: "",
-        dateStart: "",
-        dateEnd: ""
+      logType: props.index,
+      pestcId: props.id,
+      keyword: '',
+      dateStart: '',
+      dateEnd: '',
     },
-});
-const handleSizeChange = (value: number) => {
+  });
+  const handleSizeChange = (value: number) => {
     pagination.pageSize = value;
     tableQuery.pageSize = value;
     getActionTableList();
-};
+  };
 
-const handleCurrentChange = (value: number) => {
+  const handleCurrentChange = (value: number) => {
     pagination.pageNumber = value;
     tableQuery.pageNumber = value;
     getActionTableList();
-};
-// 格式化时间
-const formatDate = (date) => {
+  };
+  // 格式化时间
+  const formatDate = (date) => {
     if (!date) return '';
     const year = date.getFullYear();
     const month = String(date.getMonth() + 1).padStart(2, '0');
     const day = String(date.getDate()).padStart(2, '0');
     return `${year}-${month}-${day}`; // 输出:2026-02-11
-}
-let tableData = ref<any[]>([])
-const getActionTableList = async () => {
+  };
+  let tableData = ref<any[]>([]);
+  const getActionTableList = async () => {
     tableQuery.queryParam.dateStart = dateRange.value ? formatDate(dateRange.value[0]) : '';
     tableQuery.queryParam.dateEnd = dateRange.value ? formatDate(dateRange.value[1]) : '';
 
     try {
-        const res = await getEmployeeDetailTableList(tableQuery)
-        if (res) {
-            tableData.value = res.records;
-            pagination.total = res.totalRow;
-        }
+      const res = await getEmployeeDetailTableList(tableQuery);
+      if (res) {
+        tableData.value = res.records;
+        pagination.total = res.totalRow;
+      }
     } catch (e) {
-        tableData.value = [];
-        pagination.total = 0;
-    }
-}
-watch(() => props.index, (val) => {
-    if (val === 3 || val === 4) {
-        tableQuery.queryParam.logType = val
-        getActionTableList()
+      tableData.value = [];
+      pagination.total = 0;
     }
-}, { immediate: true, deep: true })
-
+  };
+  watch(
+    () => props.index,
+    (val) => {
+      if (val === 3 || val === 4) {
+        tableQuery.queryParam.logType = val;
+        getActionTableList();
+      }
+    },
+    { immediate: true, deep: true },
+  );
 
-const ediDialogVisible = ref(false)
-const formData = reactive({
+  const ediDialogVisible = ref(false);
+  const formData = reactive({
     id: 0,
     educationContent: '',
     scoreMust: '',
     score: '',
     operationCertificateNum: '',
-})
-const editHandle = (row) => {
+  });
+  const editHandle = (row) => {
     Object.assign(formData, {
-        id: row.id,
-        educationContent: row.educationContent,
-        scoreMust: row.scoreMust,
-        score: row.score,
-        operationCertificateNum: row.operationCertificateNum,
-    })
-    ediDialogVisible.value = true
-}
-const deleteHandle = (id) => {
+      id: row.id,
+      educationContent: row.educationContent,
+      scoreMust: row.scoreMust,
+      score: row.score,
+      operationCertificateNum: row.operationCertificateNum,
+    });
+    ediDialogVisible.value = true;
+  };
+  const deleteHandle = (id) => {
     try {
-        delateEducationStaffTrainingCardScore(id)
-        getActionTableList()
+      delateEducationStaffTrainingCardScore(id);
+      getActionTableList();
     } catch (e) {
-        console.error('删除失败', e)
+      console.error('删除失败', e);
     }
-}
+  };
 
-const cancelHandle = () => {
-    ediDialogVisible.value = false
-}
-const confirmHandle = async () => {
-    ediDialogVisible.value = false
+  const cancelHandle = () => {
+    ediDialogVisible.value = false;
+  };
+  const confirmHandle = async () => {
+    ediDialogVisible.value = false;
     try {
-        await updateEducationStaffTrainingCardScore(formData)
-        getActionTableList();
+      await updateEducationStaffTrainingCardScore(formData);
+      getActionTableList();
     } catch (e) {
-        console.error('保存失败', e)
+      console.error('保存失败', e);
     }
-}
-const handleSearch = () => {
+  };
+  const handleSearch = () => {
     pagination.pageNumber = 1;
     tableQuery.pageNumber = 1;
     getActionTableList();
-};
+  };
 
-const handleReset = () => {
+  const handleReset = () => {
     tableQuery.queryParam.keyword = '';
     tableQuery.queryParam.dateStart = '';
     tableQuery.queryParam.dateEnd = '';
     dateRange.value = null;
     tableQuery.pageNumber = 1;
     handleSearch();
-};
-
+  };
 </script>
 <template>
-    <div>
-        <!-- 查询区 -->
-        <el-form :inline="true" class="mb-12">
-            <el-form-item>
-                <el-date-picker type="daterange" start-placeholder="开始时间" end-placeholder="结束时间" />
-            </el-form-item>
-            <el-form-item>
-                <el-input placeholder="搜索关键词" v-model="tableQuery.queryParam.keyword" />
-            </el-form-item>
-            <el-form-item>
-                <el-button type="primary" @click="handleSearch">搜索</el-button>
-                <el-button type="default" @click="handleReset">重置</el-button>
-                <!-- <el-button type="primary">导出</el-button>
+  <div>
+    <!-- 查询区 -->
+    <el-form :inline="true" class="mb-12">
+      <el-form-item>
+        <el-date-picker type="daterange" start-placeholder="开始时间" end-placeholder="结束时间" />
+      </el-form-item>
+      <el-form-item>
+        <el-input placeholder="搜索关键词" v-model="tableQuery.queryParam.keyword" />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="handleSearch">搜索</el-button>
+        <el-button type="default" @click="handleReset">重置</el-button>
+        <!-- <el-button type="primary">导出</el-button>
                 <el-button type="danger">删除</el-button> -->
-            </el-form-item>
-        </el-form>
-
-        <!-- 表格 -->
-        <el-table border stripe :data="tableData">
-            <el-table-column type="selection" width="50" />
-            <el-table-column label="编号" prop="serialNum" width="100" />
-            <el-table-column label="日期" prop="logDate" width="200" />
-            <el-table-column label="工种名称" prop="educationContent" width="180" />
-            <el-table-column label="考核成绩-应知" prop="score">
-                <template #default="scope">
-                    <span>{{ scope.row.score }}分</span>
-                </template>
-            </el-table-column>
-            <el-table-column label="考核成绩-应会" prop="scoreMust">
-                <template #default="scope">
-                    <span>{{ scope.row.scoreMust }}分</span>
-                </template>
-            </el-table-column>
-            <el-table-column label="操作证号" prop="operationCertificateNum" />
-            <el-table-column label="培训单位" prop="trainingCompany" />
-            <el-table-column label="学时" prop="creditHour">
-                <template #default="scope">
-                    <span>{{ scope.row.creditHour }}时</span>
-                </template>
-            </el-table-column>
-            <el-table-column label="操作" width="220">
-                <template #default="scope">
-                    <el-button link type="primary" @click="editHandle(scope.row)">编辑</el-button>
-                    <el-popconfirm title="确定要删除该条记录吗?" placement="top" @confirm="deleteHandle(scope.row.id)">
-                        <template #reference>
-                            <el-button link type="danger">删除</el-button>
-                        </template>
-                    </el-popconfirm>
-                </template>
-            </el-table-column>
-        </el-table>
+      </el-form-item>
+    </el-form>
 
-        <!-- 分页 -->
-        <div class="pagination">
-            <el-pagination layout="total, prev, pager, next" :total="pagination.total" :page-size="pagination.pageSize"
-                @size-change="handleSizeChange" @current-change="handleCurrentChange" />
-        </div>
-
-        <!-- 编辑 -->
-        <el-dialog v-model="ediDialogVisible" title="编辑内容" width="550px">
-            <el-form :rules="rules" :model="formData" label-width="140px">
-                <el-form-item label="工种名称:" prop="educationContent">
-                    <el-input v-model="formData.educationContent" placeholder="输入工种名称" />
-                </el-form-item>
-                <el-form-item label="考核成绩-应知:" prop="score">
-                    <el-input v-model="formData.score" placeholder="输入成绩分数,单位分,0-200" />
-                </el-form-item>
-                <el-form-item label="考核成绩-应会:" prop="scoreMust">
-                    <el-input v-model="formData.scoreMust" placeholder="输入成绩分数,单位分,0-200" />
-                </el-form-item>
-                <el-form-item label="操作证号:" prop="operationCertificateNum">
-                    <el-input v-model="formData.operationCertificateNum" placeholder="输入操作证号" />
-                </el-form-item>
-            </el-form>
-            <template #footer>
-                <el-button @click="cancelHandle">取 消</el-button>
-                <el-button type="primary" @click="confirmHandle">保存</el-button>
+    <!-- 表格 -->
+    <el-table border stripe :data="tableData">
+      <el-table-column type="selection" width="50" />
+      <el-table-column label="编号" prop="serialNum" width="100" />
+      <el-table-column label="日期" prop="logDate" width="200" />
+      <el-table-column label="工种名称" prop="educationContent" width="180" />
+      <el-table-column label="考核成绩-应知" prop="score">
+        <template #default="scope">
+          <span>{{ scope.row.score }}分</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="考核成绩-应会" prop="scoreMust">
+        <template #default="scope">
+          <span>{{ scope.row.scoreMust }}分</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作证号" prop="operationCertificateNum" />
+      <el-table-column label="培训单位" prop="trainingCompany" />
+      <el-table-column label="学时" prop="creditHour">
+        <template #default="scope">
+          <span>{{ scope.row.creditHour }}时</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" width="220">
+        <template #default="scope">
+          <el-button link type="primary" @click="editHandle(scope.row)">编辑</el-button>
+          <el-popconfirm title="确定要删除该条记录吗?" placement="top" @confirm="deleteHandle(scope.row.id)">
+            <template #reference>
+              <el-button link type="danger">删除</el-button>
             </template>
-        </el-dialog>
+          </el-popconfirm>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页 -->
+    <div class="pagination">
+      <el-pagination
+        layout="total, prev, pager, next"
+        :total="pagination.total"
+        :page-size="pagination.pageSize"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
     </div>
+
+    <!-- 编辑 -->
+    <el-dialog v-model="ediDialogVisible" title="编辑内容" width="550px">
+      <el-form :rules="rules" :model="formData" label-width="140px">
+        <el-form-item label="工种名称:" prop="educationContent">
+          <el-input v-model="formData.educationContent" placeholder="输入工种名称" />
+        </el-form-item>
+        <el-form-item label="考核成绩-应知:" prop="score">
+          <el-input v-model="formData.score" placeholder="输入成绩分数,单位分,0-200" />
+        </el-form-item>
+        <el-form-item label="考核成绩-应会:" prop="scoreMust">
+          <el-input v-model="formData.scoreMust" placeholder="输入成绩分数,单位分,0-200" />
+        </el-form-item>
+        <el-form-item label="操作证号:" prop="operationCertificateNum">
+          <el-input v-model="formData.operationCertificateNum" placeholder="输入操作证号" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="cancelHandle">取 消</el-button>
+        <el-button type="primary" @click="confirmHandle">保存</el-button>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <style scoped>
-.mb-12 {
+  .mb-12 {
     margin-bottom: 12px;
-}
+  }
 
-.pagination {
+  .pagination {
     margin-top: 16px;
     display: flex;
     justify-content: flex-end;
-}
+  }
 </style>

+ 129 - 134
src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/employeeTrainingRecordCardManagementDetail.vue

@@ -1,168 +1,163 @@
 <template>
-    <main class="safety-platform-container__main">
-        <div class="page-container">
-            <!-- 标题 -->
-            <el-card shadow="never" class="mb-16">
-                <h2>上飞院职工安全生产培训记录卡</h2>
-                <div class="meta">
-                    <span>创建人:{{ employeeDetail.createdUserName }}</span>
-                    <span>创建时间:{{ employeeDetail.createdAt }}</span>
-                </div>
-            </el-card>
-
-            <!-- 基本信息 -->
-            <el-card shadow="never" class="mb-16">
-                <template #header>
-                    <strong>基本信息</strong>
-                </template>
-
-                <el-descriptions :column="2" border>
-                    <el-descriptions-item label="工号">{{ employeeDetail.staffNo }}</el-descriptions-item>
-                    <el-descriptions-item label="状态">
-                        <el-tag type="success">{{ employeeDetail.statusName }}</el-tag>
-                    </el-descriptions-item>
-
-                    <el-descriptions-item label="姓名">{{ employeeDetail.staffName }}</el-descriptions-item>
-                    <el-descriptions-item label="出生年月">{{ employeeDetail.staffBirthday }}</el-descriptions-item>
-                    <el-descriptions-item label="身份证号">
-                        {{ employeeDetail.staffIdCard }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="所/中心/部门">
-                        {{ employeeDetail.deptName }}
-                    </el-descriptions-item>
-
-                    <el-descriptions-item label="家庭住址">
-                        {{ employeeDetail.staffAddress }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="入职日期">{{ employeeDetail.dateOfJoining }}</el-descriptions-item>
-
-                    <el-descriptions-item label="文化程度">{{ employeeDetail.highestDegree }}</el-descriptions-item>
-                    <el-descriptions-item label="从事岗位">{{ employeeDetail.staffJob }}</el-descriptions-item>
-
-                    <el-descriptions-item label="本岗位工龄">{{ employeeDetail.jobSeniority }}年</el-descriptions-item>
-                    <el-descriptions-item label="技术等级">{{ employeeDetail.technicalLvl }}级</el-descriptions-item>
-
-                    <el-descriptions-item label="职称">{{ employeeDetail.professionalTitle }}</el-descriptions-item>
-                    <el-descriptions-item label="照片">
-                        <img :src="employeeDetail.staffImg" v-if="employeeDetail.staffImg" alt="">
-                        <div class="photo-placeholder" v-else></div>
-                    </el-descriptions-item>
-                </el-descriptions>
-            </el-card>
-
-            <!-- 底部 Tab 区 -->
-            <el-card shadow="never">
-                <el-tabs v-model="activeTab" @tab-change="handleTabChange">
-                    <el-tab-pane label="填写说明" :name="0" />
-                    <el-tab-pane label="入院三级安全教育" :name="1" />
-                    <el-tab-pane label="安全生产继续教育" :name="2" />
-                    <el-tab-pane label="特种作业培训考核" :name="3" />
-                    <el-tab-pane label="特种作业复训考核" :name="4" />
-                    <el-tab-pane label="安全生产培训记录卡管理规定" :name="5" />
-                </el-tabs>
-
-                <!-- Tab 内容 -->
-                <div class="tab-content">
-                    <el-card shadow="never">
-                        <FillDesc v-if="activeTab === 0" />
-
-                        <CommonTable :id="employeeDetail.id" :index="activeTab"
-                            v-if="activeTab >= 1 && activeTab <= 2" />
-                        <CommonTable2 :id="employeeDetail.id" :index="activeTab"
-                            v-if="activeTab >= 3 && activeTab <= 4" />
-                        <ManageRule v-if="activeTab === 5" />
-                    </el-card>
-                </div>
-            </el-card>
-
-            <div class="footer">
-                <el-button>取消</el-button>
-            </div>
+  <main class="safety-platform-container__main">
+    <div class="page-container">
+      <!-- 标题 -->
+      <el-card shadow="never" class="mb-16">
+        <h2>上飞院职工安全生产培训记录卡</h2>
+        <div class="meta">
+          <span>创建人:{{ employeeDetail.createdUserName }}</span>
+          <span>创建时间:{{ employeeDetail.createdAt }}</span>
         </div>
-    </main>
+      </el-card>
+
+      <!-- 基本信息 -->
+      <el-card shadow="never" class="mb-16">
+        <template #header>
+          <strong>基本信息</strong>
+        </template>
+
+        <el-descriptions :column="2" border>
+          <el-descriptions-item label="工号">{{ employeeDetail.staffNo }}</el-descriptions-item>
+          <el-descriptions-item label="状态">
+            <el-tag type="success">{{ employeeDetail.statusName }}</el-tag>
+          </el-descriptions-item>
+
+          <el-descriptions-item label="姓名">{{ employeeDetail.staffName }}</el-descriptions-item>
+          <el-descriptions-item label="出生年月">{{ employeeDetail.staffBirthday }}</el-descriptions-item>
+          <el-descriptions-item label="身份证号">
+            {{ employeeDetail.staffIdCard }}
+          </el-descriptions-item>
+          <el-descriptions-item label="所/中心/部门">
+            {{ employeeDetail.deptName }}
+          </el-descriptions-item>
+
+          <el-descriptions-item label="家庭住址">
+            {{ employeeDetail.staffAddress }}
+          </el-descriptions-item>
+          <el-descriptions-item label="入职日期">{{ employeeDetail.dateOfJoining }}</el-descriptions-item>
+
+          <el-descriptions-item label="文化程度">{{ employeeDetail.highestDegree }}</el-descriptions-item>
+          <el-descriptions-item label="从事岗位">{{ employeeDetail.staffJob }}</el-descriptions-item>
+
+          <el-descriptions-item label="本岗位工龄">{{ employeeDetail.jobSeniority }}年</el-descriptions-item>
+          <el-descriptions-item label="技术等级">{{ employeeDetail.technicalLvl }}级</el-descriptions-item>
+
+          <el-descriptions-item label="职称">{{ employeeDetail.professionalTitle }}</el-descriptions-item>
+          <el-descriptions-item label="照片">
+            <img :src="employeeDetail.staffImg" v-if="employeeDetail.staffImg" alt="" />
+            <div class="photo-placeholder" v-else></div>
+          </el-descriptions-item>
+        </el-descriptions>
+      </el-card>
+
+      <!-- 底部 Tab 区 -->
+      <el-card shadow="never">
+        <el-tabs v-model="activeTab" @tab-change="handleTabChange">
+          <el-tab-pane label="填写说明" :name="0" />
+          <el-tab-pane label="入院三级安全教育" :name="1" />
+          <el-tab-pane label="安全生产继续教育" :name="2" />
+          <el-tab-pane label="特种作业培训考核" :name="3" />
+          <el-tab-pane label="特种作业复训考核" :name="4" />
+          <el-tab-pane label="安全生产培训记录卡管理规定" :name="5" />
+        </el-tabs>
+
+        <!-- Tab 内容 -->
+        <div class="tab-content">
+          <el-card shadow="never">
+            <FillDesc v-if="activeTab === 0" />
+
+            <CommonTable :id="employeeDetail.id" :index="activeTab" v-if="activeTab >= 1 && activeTab <= 2" />
+            <CommonTable2 :id="employeeDetail.id" :index="activeTab" v-if="activeTab >= 3 && activeTab <= 4" />
+            <ManageRule v-if="activeTab === 5" />
+          </el-card>
+        </div>
+      </el-card>
+
+      <div class="footer">
+        <el-button>取消</el-button>
+      </div>
+    </div>
+  </main>
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, ref, reactive } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
-import { ElMessage } from 'element-plus';
-import { getEducationStaffTrainingCardDetail, getEmployeeDetailTableList, type EmployeeTableType } from '@/api/employee-training-record-card-management';
-import FillDesc from './fillDesc.vue'
-import CommonTable from './commonTable.vue'
-import CommonTable2 from './commonTable2.vue'
-import ManageRule from './manageRule.vue'
-
-const activeTab = ref(0)
-
-const router = useRouter();
-const route = useRoute();
-
-const operate = computed(() => (route.query.operate as string) || 'inventory-create');
-const currentId = computed(() => Number(route.query.id));
-
-
-
-const handleTabChange = (name) => {
-    activeTab.value = Number(name)
-}
-let employeeDetail = reactive({}) as EmployeeTableType
-const getDetail = async () => {
+  import { computed, onMounted, ref, reactive } from 'vue';
+  import { useRoute, useRouter } from 'vue-router';
+  import { ElMessage } from 'element-plus';
+  import {
+    getEducationStaffTrainingCardDetail,
+    getEmployeeDetailTableList,
+    type EmployeeTableType,
+  } from '@/api/employee-training-record-card-management';
+  import FillDesc from './fillDesc.vue';
+  import CommonTable from './commonTable.vue';
+  import CommonTable2 from './commonTable2.vue';
+  import ManageRule from './manageRule.vue';
+
+  const activeTab = ref(0);
+
+  const router = useRouter();
+  const route = useRoute();
+
+  const operate = computed(() => (route.query.operate as string) || 'inventory-create');
+  const currentId = computed(() => Number(route.query.id));
+
+  const handleTabChange = (name) => {
+    activeTab.value = Number(name);
+  };
+  let employeeDetail = reactive({}) as EmployeeTableType;
+  const getDetail = async () => {
     if (!currentId.value) return;
     try {
-        const res = await getEducationStaffTrainingCardDetail(currentId.value);
-        if (res) {
-            // 映射接口字段到表单字段
-            Object.assign(employeeDetail, res);
-        }
+      const res = await getEducationStaffTrainingCardDetail(currentId.value);
+      if (res) {
+        // 映射接口字段到表单字段
+        Object.assign(employeeDetail, res);
+      }
     } catch (e) {
-        console.error('获取物品库存详情失败:', e);
-        ElMessage.error('获取详情失败');
+      console.error('获取物品库存详情失败:', e);
+      ElMessage.error('获取详情失败');
     }
-};
+  };
 
-
-onMounted(() => {
+  onMounted(() => {
     getDetail();
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
 
-.page-container {
+  .page-container {
     padding: 16px;
-}
+  }
 
-.mb-16 {
+  .mb-16 {
     margin-bottom: 16px;
-}
+  }
 
-.meta {
+  .meta {
     margin-top: 16px;
     font-size: 13px;
     color: #666;
     display: flex;
     gap: 24px;
-}
+  }
 
-.photo-placeholder {
+  .photo-placeholder {
     width: 80px;
     height: 80px;
     border: 1px solid #dcdfe6;
-    background: repeating-linear-gradient(45deg,
-            #eee,
-            #eee 10px,
-            #fff 10px,
-            #fff 20px);
-}
-
-.tab-content {
+    background: repeating-linear-gradient(45deg, #eee, #eee 10px, #fff 10px, #fff 20px);
+  }
+
+  .tab-content {
     margin-top: 16px;
-}
+  }
 
-.footer {
+  .footer {
     margin-top: 24px;
     display: flex;
     justify-content: flex-end;
-}
+  }
 </style>

+ 7 - 8
src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/fillDesc.vue

@@ -1,9 +1,7 @@
-<script lang="ts" setup>
-
-</script>
+<script lang="ts" setup></script>
 <template>
-    <div class='content'>
-        <pre>
+  <div class="content">
+    <pre>
 一、填卡说明:
 
     1.本卡适用于生产经营单位(事业单位)每一员工,一人一卡。填写应准确、清晰,字迹工整。
@@ -26,7 +24,8 @@
     3.安全生产继续教育
         主要是指:安全生产法律法规教育;采用新技术、新工艺、新材料、新设备的安全生产教育:安全技能培训;事故案例教育;
         全市性或全厂性的重大安全生产活动教育;因病因伤半年后的复工教育;违章行为被查实、举报或因违章造成险肇以上事故的安全强化教育:发生重大事故后的安全生产教育等。
-        </pre>
-    </div>
+        </pre
+    >
+  </div>
 </template>
-<style lang="scss" scoped></style>
+<style lang="scss" scoped></style>

+ 22 - 16
src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/components/manageRule.vue

@@ -1,28 +1,34 @@
-<script lang="ts" setup>
-
-</script>
+<script lang="ts" setup></script>
 <template>
-    <div class='content'>
-        <p>1. 各所、中心、部门应指定专门管理人员管理本所、中心、部门员工的安全生产培训记录卡。</p>
-
-        <p>2. 员工负责在本人安全生产培训记录卡上对本人每次的安全培训进行记录。</p>
+  <div class="content">
+    <p>1. 各所、中心、部门应指定专门管理人员管理本所、中心、部门员工的安全生产培训记录卡。</p>
 
-        <p>3. 各所、中心、部门的安全生产培训记录卡管理人员应妥善保管安全生产培训记录卡,指导员工及时、正确填写。</p>
+    <p>2. 员工负责在本人安全生产培训记录卡上对本人每次的安全培训进行记录。</p>
 
-        <p>4. 各所、中心、部门的安全生产培训记录卡管理人员定期将员工签字版安全生产培训记录卡扫描件、及汇总表提交安委办归档(每人一档,文件名请按照“工号-姓名-(所、中心)-部门-上飞院职工安全生产培训记录卡”命名)。</p>
+    <p>3. 各所、中心、部门的安全生产培训记录卡管理人员应妥善保管安全生产培训记录卡,指导员工及时、正确填写。</p>
 
-        <p>5. 若员工岗位调动、转岗、换岗,则在重新上岗前必须接受新部门的安全培训并记录,安全生产培训记录卡跟随本人至新部门。</p>
+    <p
+      >4.
+      各所、中心、部门的安全生产培训记录卡管理人员定期将员工签字版安全生产培训记录卡扫描件、及汇总表提交安委办归档(每人一档,文件名请按照“工号-姓名-(所、中心)-部门-上飞院职工安全生产培训记录卡”命名)。</p
+    >
 
-        <p>6. 安委办每年定期(一般每年第三季度)对各所、中心、部门的安全培训开展情况和安全生产培训记录卡填写情况进行检查。</p>
+    <p
+      >5.
+      若员工岗位调动、转岗、换岗,则在重新上岗前必须接受新部门的安全培训并记录,安全生产培训记录卡跟随本人至新部门。</p
+    >
 
-        <p>7. 新入职员工三级安全生产教育培训和继续教育每人每年时间不得少于24小时。</p>
+    <p
+      >6.
+      安委办每年定期(一般每年第三季度)对各所、中心、部门的安全培训开展情况和安全生产培训记录卡填写情况进行检查。</p
+    >
 
-    </div>
+    <p>7. 新入职员工三级安全生产教育培训和继续教育每人每年时间不得少于24小时。</p>
+  </div>
 </template>
 <style lang="scss" scoped>
-p {
+  p {
     margin-bottom: 12px;
     line-height: 1.7;
     font-size: 13px;
-}
-</style>
+  }
+</style>

+ 5 - 5
src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/configs/form.ts

@@ -8,8 +8,8 @@
 import { FormConfig } from '@/types/basic-form';
 
 export const EDIT_EMPLOYEE_FORM_RULES = {
-    educationContent: [{ required: true, message: '请输入工种名称', trigger: 'blur' }],
-    scoreMust: [{ required: true, message: '请输入成绩', trigger: 'blur' }],
-    score: [{ required: true, message: '请输入成绩', trigger: 'blur' }],
-    operationCertificateNum: [{ required: true, message: '请输入操作证号', trigger: 'blur' }],
-}
+  educationContent: [{ required: true, message: '请输入工种名称', trigger: 'blur' }],
+  scoreMust: [{ required: true, message: '请输入成绩', trigger: 'blur' }],
+  score: [{ required: true, message: '请输入成绩', trigger: 'blur' }],
+  operationCertificateNum: [{ required: true, message: '请输入操作证号', trigger: 'blur' }],
+};

+ 181 - 155
src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/employeeTrainingRecordCardManagement.vue

@@ -1,145 +1,172 @@
 <template>
-    <div class="safety-platform-container">
-        <header class="safety-platform-container__header">
-            <div class="breadcrumb-title"> 员工培训记录卡管理 </div>
-        </header>
-        <main class="safety-platform-container__main">
-            <div class="search-table-container">
-                <header>
-                    <div style="position: relative">
-                        <!-- <el-button plain class="search-table-container--button" @click="handleImport">
+  <div class="safety-platform-container">
+    <header class="safety-platform-container__header">
+      <div class="breadcrumb-title"> 员工培训记录卡管理 </div>
+    </header>
+    <main class="safety-platform-container__main">
+      <div class="search-table-container">
+        <header>
+          <div style="position: relative">
+            <!-- <el-button plain class="search-table-container--button" @click="handleImport">
                             导入
                         </el-button>
                         <el-button plain class="search-table-container--button" @click="handleDownload">
                             导出
                         </el-button> -->
-                    </div>
-
-                    <div class="act-search">
-                        <section class="select-box">
-                            <div class="select-box--item">
-                                <span>员工工号或姓名:</span>
-                                <el-input v-model="tableQuery.queryParam.numOrName" placeholder="搜索员工工号或姓名"
-                                    class="act-search-input" />
-                            </div>
-                            <div class="select-box--item">
-                                <span>状态:</span>
-                                <el-select v-model="tableQuery.queryParam.status" placeholder="请选择状态" clearable>
-                                    <el-option label="全部" value="" />
-                                    <el-option label="启用" :value="1" />
-                                    <el-option label="禁用" :value="0" />
-                                </el-select>
-                            </div>
-                            <div>
-                                <span>入职日期范围:</span>
-                                <el-date-picker v-model="dateRange" type="daterange" range-separator="至"
-                                    start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD"
-                                    format="YYYY-MM-DD" />
-                            </div>
-                        </section>
-                        <section class="search-btn">
-                            <el-button type="primary" @click="handleSearch">查询</el-button>
-                            <el-button @click="handleReset">重置</el-button>
-                        </section>
-                    </div>
-                </header>
-
-                <div class="batch-table">
-                    <BasicTable ref="basicTableRef" :tableData="tableData" :tableConfig="tableConfig"
-                        @update:pageSize="handleSizeChange" @update:pageNumber="handleCurrentChange">
-                        <template #action="scope">
-                            <div class="action-container--div" style="justify-content: left">
-                                <ActionButton text="删除" :popconfirm="{
-                                    title: '确定要删除?',
-                                }" @confirm="handleDelete(scope.row.id)" />
-                                <ActionButton text="查看" @click="handleView(scope.row.id)" />
-                            </div>
-                        </template>
-                    </BasicTable>
-                </div>
-            </div>
-        </main>
-        <BatchImport v-if="batchImportVisible" :visible="batchImportVisible" :import-api-url="importApiUrl"
-            :template-url="templateUrl" template-name="下载模板" :show-template="false" @close="batchImportVisible = false"
-            @update="handleUpdate" />
-    </div>
+          </div>
+
+          <div class="act-search">
+            <section class="select-box">
+              <div class="select-box--item">
+                <span>员工工号或姓名:</span>
+                <el-input
+                  v-model="tableQuery.queryParam.numOrName"
+                  placeholder="搜索员工工号或姓名"
+                  class="act-search-input"
+                />
+              </div>
+              <div class="select-box--item">
+                <span>状态:</span>
+                <el-select v-model="tableQuery.queryParam.status" placeholder="请选择状态" clearable>
+                  <el-option label="全部" value="" />
+                  <el-option label="启用" :value="1" />
+                  <el-option label="禁用" :value="0" />
+                </el-select>
+              </div>
+              <div>
+                <span>入职日期范围:</span>
+                <el-date-picker
+                  v-model="dateRange"
+                  type="daterange"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  value-format="YYYY-MM-DD"
+                  format="YYYY-MM-DD"
+                />
+              </div>
+            </section>
+            <section class="search-btn">
+              <el-button type="primary" @click="handleSearch">查询</el-button>
+              <el-button @click="handleReset">重置</el-button>
+            </section>
+          </div>
+        </header>
+
+        <div class="batch-table">
+          <BasicTable
+            ref="basicTableRef"
+            :tableData="tableData"
+            :tableConfig="tableConfig"
+            @update:pageSize="handleSizeChange"
+            @update:pageNumber="handleCurrentChange"
+          >
+            <template #action="scope">
+              <div class="action-container--div" style="justify-content: left">
+                <ActionButton
+                  text="删除"
+                  :popconfirm="{
+                    title: '确定要删除?',
+                  }"
+                  @confirm="handleDelete(scope.row.id)"
+                />
+                <ActionButton text="查看" @click="handleView(scope.row.id)" />
+              </div>
+            </template>
+          </BasicTable>
+        </div>
+      </div>
+    </main>
+    <BatchImport
+      v-if="batchImportVisible"
+      :visible="batchImportVisible"
+      :import-api-url="importApiUrl"
+      :template-url="templateUrl"
+      template-name="下载模板"
+      :show-template="false"
+      @close="batchImportVisible = false"
+      @update="handleUpdate"
+    />
+  </div>
 </template>
 
 <script setup lang="ts">
-import { onMounted, reactive, ref } from 'vue';
-import { ElMessage } from 'element-plus';
-import BasicTable from '@/components/BasicTable.vue';
-import useTableConfig from '@/hooks/useTableConfigHook';
-import ActionButton from '@/components/ActionButton.vue';
-import { TABLE_OPTIONS, TABLE_COLUMNS } from './configs/tables';
-import { useRouter } from 'vue-router';
-import type { QueryPageRequest } from '@/types/basic-query';
-import { queryEducationStaffTrainingCardPage, deleteEducationStaffTrainingCard } from '@/api/employee-training-record-card-management';
-import { downloadByData } from '@/utils/file/download';
-import BatchImport from '@/components/batch-import/BatchImport.vue';
-import { useGlobSetting } from '@/hooks/setting';
-import urlJoin from 'url-join';
-
-const router = useRouter();
-
-// 表格
-const basicTableRef = ref<InstanceType<typeof BasicTable>>();
-
-const { tableConfig, pagination } = useTableConfig(TABLE_COLUMNS, TABLE_OPTIONS);
-
-const tableData = ref<any[]>([]);
-// 日期范围
-const dateRange = ref<[string, string] | null>(null);
-
-const tableQuery = reactive<QueryPageRequest<any>>({
+  import { onMounted, reactive, ref } from 'vue';
+  import { ElMessage } from 'element-plus';
+  import BasicTable from '@/components/BasicTable.vue';
+  import useTableConfig from '@/hooks/useTableConfigHook';
+  import ActionButton from '@/components/ActionButton.vue';
+  import { TABLE_OPTIONS, TABLE_COLUMNS } from './configs/tables';
+  import { useRouter } from 'vue-router';
+  import type { QueryPageRequest } from '@/types/basic-query';
+  import {
+    queryEducationStaffTrainingCardPage,
+    deleteEducationStaffTrainingCard,
+  } from '@/api/employee-training-record-card-management';
+  import { downloadByData } from '@/utils/file/download';
+  import BatchImport from '@/components/batch-import/BatchImport.vue';
+  import { useGlobSetting } from '@/hooks/setting';
+  import urlJoin from 'url-join';
+
+  const router = useRouter();
+
+  // 表格
+  const basicTableRef = ref<InstanceType<typeof BasicTable>>();
+
+  const { tableConfig, pagination } = useTableConfig(TABLE_COLUMNS, TABLE_OPTIONS);
+
+  const tableData = ref<any[]>([]);
+  // 日期范围
+  const dateRange = ref<[string, string] | null>(null);
+
+  const tableQuery = reactive<QueryPageRequest<any>>({
     pageNumber: pagination.pageNumber,
     pageSize: pagination.pageSize,
     queryParam: {
-        numOrName: "",
-        status: "",
-        dateOfJoiningStart: "",
-        dateOfJoiningEnd: ""
+      numOrName: '',
+      status: '',
+      dateOfJoiningStart: '',
+      dateOfJoiningEnd: '',
     },
-});
+  });
 
-const handleSizeChange = (value: number) => {
+  const handleSizeChange = (value: number) => {
     pagination.pageSize = value;
     tableQuery.pageSize = value;
     getTableData();
-};
+  };
 
-const handleCurrentChange = (value: number) => {
+  const handleCurrentChange = (value: number) => {
     pagination.pageNumber = value;
     tableQuery.pageNumber = value;
     getTableData();
-};
+  };
 
-
-async function getTableData() {
+  async function getTableData() {
     tableConfig.loading = true;
     tableQuery.queryParam.dateOfJoiningStart = dateRange.value ? dateRange.value[0] : '';
     tableQuery.queryParam.dateOfJoiningEnd = dateRange.value ? dateRange.value[1] : '';
     try {
-        const res = await queryEducationStaffTrainingCardPage(tableQuery);
-        if (res) {
-            tableData.value = res.records;
-            pagination.total = res.totalRow;
-        }
+      const res = await queryEducationStaffTrainingCardPage(tableQuery);
+      if (res) {
+        tableData.value = res.records;
+        pagination.total = res.totalRow;
+      }
     } catch (e) {
-        tableData.value = [];
-        pagination.total = 0;
+      tableData.value = [];
+      pagination.total = 0;
     } finally {
-        tableConfig.loading = false;
+      tableConfig.loading = false;
     }
-}
+  }
 
-const handleSearch = () => {
+  const handleSearch = () => {
     pagination.pageNumber = 1;
     tableQuery.pageNumber = 1;
     getTableData();
-};
+  };
 
-const handleReset = () => {
+  const handleReset = () => {
     tableQuery.queryParam.numOrName = '';
     tableQuery.queryParam.status = '';
     tableQuery.queryParam.dateOfJoiningStart = '';
@@ -147,72 +174,71 @@ const handleReset = () => {
     dateRange.value = null;
     tableQuery.pageNumber = 1;
     handleSearch();
-};
+  };
 
-// 批量导入
-const batchImportVisible = ref(false);
-const { urlPrefix } = useGlobSetting();
-const importApiUrl = ref(urlJoin(urlPrefix, '/inventory/importInventory'));
-const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-inventory-template.xlsx');
+  // 批量导入
+  const batchImportVisible = ref(false);
+  const { urlPrefix } = useGlobSetting();
+  const importApiUrl = ref(urlJoin(urlPrefix, '/inventory/importInventory'));
+  const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-inventory-template.xlsx');
 
-const handleImport = () => {
+  const handleImport = () => {
     batchImportVisible.value = true;
-};
+  };
 
-const handleUpdate = () => {
+  const handleUpdate = () => {
     batchImportVisible.value = false;
     getTableData();
-};
+  };
 
-const handleDownload = async () => {
+  const handleDownload = async () => {
     try {
-        const exportParams = {
-            stuffName: tableQuery.queryParam.stuffName || undefined,
-            status: tableQuery.queryParam.status,
-            ids: tableQuery.queryParam.ids.length > 0 ? tableQuery.queryParam.ids : undefined,
-        };
-        // const response = await exportInventory(exportParams);
-        // if (response) {
-        //     const fileName = `物品库存管理_${new Date().toISOString().split('T')[0]}.xlsx`;
-        //     downloadByData(response, fileName);
-        //     ElMessage.success('导出成功');
-        // }
+      const exportParams = {
+        stuffName: tableQuery.queryParam.stuffName || undefined,
+        status: tableQuery.queryParam.status,
+        ids: tableQuery.queryParam.ids.length > 0 ? tableQuery.queryParam.ids : undefined,
+      };
+      // const response = await exportInventory(exportParams);
+      // if (response) {
+      //     const fileName = `物品库存管理_${new Date().toISOString().split('T')[0]}.xlsx`;
+      //     downloadByData(response, fileName);
+      //     ElMessage.success('导出成功');
+      // }
     } catch (e) {
-        console.error('导出物品库存失败:', e);
-        ElMessage.error('导出失败,请重试');
+      console.error('导出物品库存失败:', e);
+      ElMessage.error('导出失败,请重试');
     }
-};
-
+  };
 
-const handleDelete = async (id: number) => {
+  const handleDelete = async (id: number) => {
     try {
-        await deleteEducationStaffTrainingCard(id);
-        ElMessage.success('删除成功');
-        getTableData();
+      await deleteEducationStaffTrainingCard(id);
+      ElMessage.success('删除成功');
+      getTableData();
     } catch (e) {
-        console.error('删除失败:', e);
-        ElMessage.error('删除失败,请重试');
+      console.error('删除失败:', e);
+      ElMessage.error('删除失败,请重试');
     }
-};
+  };
 
-const handleView = (id: number) => {
+  const handleView = (id: number) => {
     router.push({
-        name: 'employeeTrainingRecordCardManagementItem',
-        query: {
-            id,
-            operate: 'employee-training-record-card-management-view',
-        },
+      name: 'employeeTrainingRecordCardManagementItem',
+      query: {
+        id,
+        operate: 'employee-training-record-card-management-view',
+      },
     });
-};
+  };
 
-onMounted(() => {
+  onMounted(() => {
     getTableData();
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
-@use '@/styles/page-main-layout.scss' as *;
-@use '@/styles/basic-table-action.scss' as *;
-@use '@/views/traffic/violation/style/act-search-table.scss' as *;
-</style>
+  @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
+  @use '@/styles/basic-table-action.scss' as *;
+  @use '@/views/traffic/violation/style/act-search-table.scss' as *;
+</style>

+ 27 - 27
src/views/production-safety/safetyTrainingAndEducation/employeeTrainingRecordCardManagement/employeeTrainingRecordCardManagementItem.vue

@@ -6,45 +6,45 @@
  * @Describe: file describe
 -->
 <template>
-    <div class="safety-platform-container">
-        <header class="safety-platform-container__header">
-            <BreadcrumbBack />
-            <span class="breadcrumb-title">{{ headerTitle }}</span>
-        </header>
-        <EmployeeTrainingRecordCardManagementDetail />
-    </div>
+  <div class="safety-platform-container">
+    <header class="safety-platform-container__header">
+      <BreadcrumbBack />
+      <span class="breadcrumb-title">{{ headerTitle }}</span>
+    </header>
+    <EmployeeTrainingRecordCardManagementDetail />
+  </div>
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
-import { useRoute } from 'vue-router';
-import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
-import EmployeeTrainingRecordCardManagementDetail from './components/employeeTrainingRecordCardManagementDetail.vue';
+  import { computed } from 'vue';
+  import { useRoute } from 'vue-router';
+  import BreadcrumbBack from '@/components/BreadcrumbBack.vue';
+  import EmployeeTrainingRecordCardManagementDetail from './components/employeeTrainingRecordCardManagementDetail.vue';
 
-const route = useRoute();
-const operate = route.query.operate as string;
+  const route = useRoute();
+  const operate = route.query.operate as string;
 
-const headerTitle = computed(() => {
+  const headerTitle = computed(() => {
     switch (operate) {
-        case 'employee-training-record-card-management-create':
-            return '新增员工培训记录卡';
-        case 'employee-training-record-card-management-edit':
-            return '编辑员工培训记录卡';
-        case 'employee-training-record-card-management-view':
-            return '查看员工培训记录卡';
-        default:
-            return '未知操作';
+      case 'employee-training-record-card-management-create':
+        return '新增员工培训记录卡';
+      case 'employee-training-record-card-management-edit':
+        return '编辑员工培训记录卡';
+      case 'employee-training-record-card-management-view':
+        return '查看员工培训记录卡';
+      default:
+        return '未知操作';
     }
-});
+  });
 </script>
 
 <style scoped lang="scss">
-@use '@/styles/page-details-layout.scss' as *;
-@use '@/styles/page-main-layout.scss' as *;
+  @use '@/styles/page-details-layout.scss' as *;
+  @use '@/styles/page-main-layout.scss' as *;
 
-.safety-platform-container__header {
+  .safety-platform-container__header {
     flex-direction: row !important;
     justify-content: flex-start !important;
     gap: 8px !important;
-}
+  }
 </style>

+ 3 - 3
utils/devProxy/staff/proxy.ts

@@ -2,7 +2,7 @@
  * @Author: liuJie
  * @Date: 2026-02-26 13:57:25
  * @LastEditors: liuJie
- * @LastEditTime: 2026-02-27 18:06:05
+ * @LastEditTime: 2026-02-28 16:33:13
  * @Describe: file describe
  */
 import { PROXY_TYPE } from '../types';
@@ -10,8 +10,8 @@ import path from 'path';
 
 // staff环境
 const proxyStaff: PROXY_TYPE = {
-//   serverHost: 'http://192.168.6.42:8802/',
-  serverHost: 'http://192.168.22.148:8802/',
+  serverHost: 'http://192.168.6.42:8802/',
+//   serverHost: 'http://192.168.22.148:8802/',
   skyeyeLoginHost: 'http://192.168.6.42:7000/skyeye-login/#/',
   skyeyePlatformHost: 'http://192.168.6.42:7000/skyeye-pc/#/',
   skyeyeAdminHost: 'http://192.168.6.42:7000/skyeye-admin/#/',