feat: 重新改版流程

apps/web-antd/src/api/hr/employeeInfo.ts

@@ -57,7 +57,7 @@ export function exportEmployeeList(params: PageQuery) {
 }
 /**
  * 导出员工信息
- * @param params
+ * @param id
  */
 export function apiExport(id: number) {
   return commonExport(`/employee/info/export/${id}`, {});
@@ -68,36 +68,52 @@ export function apiExport(id: number) {
  * @param data
  */
 export function applyEntry(data: EmployeeInfoApi.EmployeeApplyBo) {
-  return requestClient.post('/employee/info/applyEntry', data, {
-    successMessageMode: 'modal',
-  });
+  return requestClient.post<EmployeeInfoApi.EmployeeApplyBaseBo>(
+    '/employee/info/applyEntry',
+    data,
+    {
+      successMessageMode: 'message',
+    },
+  );
 }
 /**
  * 申请员工离职
  * @param data
  */
 export function applyResign(data: EmployeeInfoApi.EmployeeResignApplyBo) {
-  return requestClient.post('/employee/info/applyResign', data, {
-    successMessageMode: 'modal',
-  });
+  return requestClient.post<EmployeeInfoApi.EmployeeApplyBaseBo>(
+    '/employee/info/applyResign',
+    data,
+    {
+      successMessageMode: 'message',
+    },
+  );
 }
 /**
  * 申请员工调职
- * @param id
+ * @param data
  */
 export function applyTransfer(data: EmployeeInfoApi.EmployeeTransferApplyBo) {
-  return requestClient.post('/employee/info/applyTransfer', data, {
-    successMessageMode: 'modal',
-  });
+  return requestClient.post<EmployeeInfoApi.EmployeeApplyBaseBo>(
+    '/employee/info/applyTransfer',
+    data,
+    {
+      successMessageMode: 'message',
+    },
+  );
 }
 /**
  * 申请员工入职
  * @param data
  */
 export function applyRegular(data: EmployeeInfoApi.EmployeeRegularApplyBo) {
-  return requestClient.post('/employee/info/applyRegular', data, {
-    successMessageMode: 'modal',
-  });
+  return requestClient.post<EmployeeInfoApi.EmployeeApplyBaseBo>(
+    '/employee/info/applyRegular',
+    data,
+    {
+      successMessageMode: 'message',
+    },
+  );
 }
 /**
  * 申请员工入职
@@ -106,9 +122,13 @@ export function applyRegular(data: EmployeeInfoApi.EmployeeRegularApplyBo) {
 export function applyRenewalContract(
   data: EmployeeInfoApi.EmployeeRenewalContractApplyBo,
 ) {
-  return requestClient.post('/employee/info/applyRenewalContract', data, {
-    successMessageMode: 'modal',
-  });
+  return requestClient.post<EmployeeInfoApi.EmployeeApplyBaseBo>(
+    '/employee/info/applyRenewalContract',
+    data,
+    {
+      successMessageMode: 'message',
+    },
+  );
 }
 
 /**

apps/web-antd/src/api/hr/employeeModel.d.ts

@@ -380,6 +380,26 @@ export namespace EmployeeInfoApi {
      */
     id?: number;
 
+    /**
+     * 申请编号
+     */
+    applyCode?: string;
+
+    /**
+     * 流程code
+     */
+    flowCode?: string;
+
+    /**
+     * 员工id
+     */
+    employeeId?: number;
+
+    /**
+     * 部门名称
+     */
+    deptName?: string;
+
     /**
      * 员工姓名
      */
@@ -389,6 +409,11 @@ export namespace EmployeeInfoApi {
      * 备注
      */
     remark?: string;
+
+    /**
+     * 审核列表
+     */
+    auditLogList?: AuditLogBo[];
   }
 
   export interface EmployeeApplyBo extends EmployeeApplyBaseBo {
@@ -419,6 +444,11 @@ export namespace EmployeeInfoApi {
      * 部门ID
      */
     deptId?: number;
+
+    /**
+     * 原先部门
+     */
+    oldDeptName?: string;
   }
 
   export interface EmployeeResignApplyBo extends EmployeeApplyBaseBo {
@@ -497,6 +527,27 @@ export namespace EmployeeInfoApi {
   }
 }
 
+/**
+ * 审核记录
+ */
+
+export interface AuditLogBo {
+  /**
+   * 字段名称
+   */
+  auditField: string;
+
+  /**
+   * 字段注释名称
+   */
+  auditFieldName: string;
+
+  /**
+   * 变更后值
+   */
+  afterVal: string;
+}
+
 // export interface EmployeeResign extends EmployeeInfoApi.Employee {
 
 // }

apps/web-antd/src/router/routes/modules/hr.ts

@@ -124,7 +124,7 @@ const routes: RouteRecordRaw[] = [
       },
       {
         name: 'EmployeeFlowList',
-        path: '/hr/employee/flow',
+        path: '/hr/employee/flow/list',
         // hidden: false,
         component: () => import('#/views/workflow/hrFlow/list.vue'),
         meta: {
@@ -135,6 +135,20 @@ const routes: RouteRecordRaw[] = [
           // link: null,
         },
       },
+      {
+        name: 'EmployeeFlowEdit',
+        path: '/hr/employee/flow',
+        // hidden: false,
+        component: () => import('#/views/workflow/hrFlow/hrEdit.vue'),
+        meta: {
+          title: '人事申请编辑',
+          icon: 'fluent-mdl2:leave-user',
+          noCache: false,
+          hideInMenu: true,
+          componentPath: '#/views/workflow/hrFlow/hrEdit.vue',
+          // link: null,
+        },
+      },
     ],
   },
 ];

apps/web-antd/src/views/hr/contractExpirationReminder/apply-renewal_contract-model.vue → apps/web-antd/src/views/hr/contractExpirationReminder/apply-renewal-contract-model.vue

 <script lang="ts" setup>
+import type { ExtendedModalApi } from '@vben/common-ui';
+
 import type { VbenFormSchema } from '#/adapter/form';
 import type { EmployeeInfoApi } from '#/api/hr/employeeModel';
 
-import { ref } from 'vue';
+import { computed, ref, shallowRef } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { getVxePopupContainer } from '@vben/utils';
 
+import { Button } from 'ant-design-vue';
+
 import { useVbenForm } from '#/adapter/form';
+import { apiDetail } from '#/api/hr/employeeFlow';
 import { applyRenewalContract } from '#/api/hr/employeeInfo';
 import { getDictOptions } from '#/utils/dict';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 
 import { HrDictEnum } from '../dict-enum';
+import { useHrFlowHook } from '../useHrFlowHook';
 
 const emit = defineEmits<{
   success: [];
 }>();
-const formData = ref<EmployeeInfoApi.EmployeeRenewalContractApplyBo>();
+const isUpdate = ref(false);
 
 const formSchema: VbenFormSchema[] = [
   {
@@ -29,6 +35,25 @@ const formSchema: VbenFormSchema[] = [
       triggerFields: [''],
     },
   },
+  {
+    label: '员工id',
+    fieldName: 'employeeId',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    component: 'Input',
+    fieldName: 'applyCode',
+    label: '申请编号',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+    disabled: true,
+  },
   {
     component: 'Input',
     fieldName: 'name',
@@ -109,6 +134,7 @@ const formSchema: VbenFormSchema[] = [
     formItemClass: 'items-start',
   },
 ];
+const applyModalApi = shallowRef<ExtendedModalApi | null>(null);
 
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
@@ -141,45 +167,86 @@ const [BasicModal, modalApi] = useVbenModal({
     }
     modalApi.modalLoading(true);
 
-    const data = modalApi.getData() as { id?: number; name?: string };
-    if (data) {
-      formData.value = data;
-      await formApi.setValues(formData.value);
+    let data = modalApi.getData() as EmployeeInfoApi.EmployeeApplyBaseBo & {
+      applyModalApi: ExtendedModalApi;
+    };
+    applyModalApi.value = data.applyModalApi;
+    isUpdate.value = !!data?.id;
+    if (isUpdate.value && data.id) {
+      updateForm(isUpdate.value);
+      data = await apiDetail(data.id);
+      updateDataInfo(data);
     }
+    await formApi.setValues(data);
     await markInitialized();
 
     modalApi.modalLoading(false);
   },
 });
 
-async function onSubmit() {
-  const { valid } = await formApi.validate();
-  if (valid) {
-    modalApi.lock();
-    const data =
-      await formApi.getValues<EmployeeInfoApi.EmployeeRenewalContractApplyBo>();
-    try {
-      await applyRenewalContract(data);
-      resetInitialized();
-      emit('success');
-      modalApi.close();
-    } finally {
-      modalApi.unlock();
-    }
-  }
+const { handleTempSave, onSubmitFunc, updateDataInfo, updateForm } =
+  useHrFlowHook(formApi, modalApi, applyRenewalContract, () => {
+    resetInitialized();
+    emit('success');
+  });
+
+function onSubmit() {
+  onSubmitFunc(applyModalApi.value);
 }
 
+// function updateDataInfo(data: EmployeeInfoApi.EmployeeApplyBaseBo) {
+//   if (data.auditLogList && data.auditLogList.length > 0) {
+//     data.auditLogList.map((t) => {
+//       if (t && t.auditField) {
+//         (data as any)[t.auditField] = t.afterVal;
+//       }
+//       return t;
+//     });
+//   }
+// }
+// function updateForm(update: boolean) {
+//   formApi.updateSchema([
+//     {
+//       dependencies: {
+//         show: () => update,
+//         triggerFields: [''],
+//       },
+//       fieldName: 'applyCode',
+//     },
+//   ]);
+// }
+
+// async function onSubmit() {
+//   const { valid } = await formApi.validate();
+//   if (valid) {
+//     modalApi.lock();
+//     const data =
+//       await formApi.getValues<EmployeeInfoApi.EmployeeRenewalContractApplyBo>();
+//     try {
+//       await applyRenewalContract(data);
+//       resetInitialized();
+//       emit('success');
+//       modalApi.close();
+//     } finally {
+//       modalApi.unlock();
+//     }
+//   }
+// }
+
 async function handleClosed() {
   await formApi.resetForm();
   resetInitialized();
 }
 
-// const getModalTitle = computed(() =>
-//   formData.value?.id ? '修改字典类型' : '新增字典类型',
-// );
+const getModalTitle = computed(() =>
+  isUpdate.value ? '修改合同续约申请' : '合同续约申请',
+);
 </script>
 <template>
-  <BasicModal title="合同续约申请">
+  <BasicModal :title="getModalTitle">
     <BasicForm class="mx-4" />
+    <template #center-footer>
+      <Button @click="handleTempSave">暂存</Button>
+    </template>
   </BasicModal>
 </template>

apps/web-antd/src/views/hr/contractExpirationReminder/list.vue

@@ -18,8 +18,9 @@ import { GhostButton } from '#/components/global/button';
 import { commonDownloadExcel } from '#/utils/file/download';
 import DeptTree from '#/views/auth/user/deptTree.vue';
 
+import { applyModal } from '../../workflow/components';
 import employeeDetailDrawer from '../employeeInfo/employee-detail-drawer.vue';
-import applyRenewalContractModel from './apply-renewal_contract-model.vue';
+import applyRenewalContractModel from './apply-renewal-contract-model.vue';
 import { querySchema, useColumns } from './data';
 // import Form from './form.vue';
 
@@ -64,6 +65,9 @@ const [EmployeeDetailDrawer, employeeDetailDrawerApi] = useVbenDrawer({
 const [ApplyRenewalContractModel, applyRenewalContractModelApi] = useVbenModal({
   connectedComponent: applyRenewalContractModel,
 });
+const [ApplyModal, applyModalApi] = useVbenModal({
+  connectedComponent: applyModal,
+});
 
 const [Grid, gridApi] = useVbenVxeGrid({
   formOptions,
@@ -126,14 +130,19 @@ function onApplyRenewalContract(
 ) {
   applyRenewalContractModelApi
     .setData({
-      id: row.id,
+      employeeId: row.id,
       name: row.name,
       deptName: `${row.plate} / ${row.firstLevelDepartment} / ${
         row.secondLevelDepartment
       } / ${row.thirdLevelDepartment}`,
+      applyModalApi,
     })
     .open();
 }
+async function handleCompleteOrCancel() {
+  applyRenewalContractModelApi.close();
+  gridApi.query();
+}
 // function onCreate() {
 //   formDrawerApi.setData({}).open();
 // }
@@ -221,5 +230,9 @@ function handleDownloadExcel() {
       </template>
     </Grid>
     <ApplyRenewalContractModel />
+    <ApplyModal
+      @complete="handleCompleteOrCancel"
+      @cancel="handleCompleteOrCancel"
+    />
   </Page>
 </template>

apps/web-antd/src/views/hr/employeeInfo/apply-entry-model.vue

 <script lang="ts" setup>
+import type { ExtendedModalApi } from '@vben/common-ui';
+
 import type { VbenFormSchema } from '#/adapter/form';
 import type { EmployeeInfoApi } from '#/api/hr/employeeModel';
 
-import { ref } from 'vue';
+import { computed, ref, shallowRef } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { getVxePopupContainer } from '@vben/utils';
 
+import { Button } from 'ant-design-vue';
+
 import { useVbenForm } from '#/adapter/form';
+import { apiDetail } from '#/api/hr/employeeFlow';
 import { applyEntry } from '#/api/hr/employeeInfo';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 
+import { useHrFlowHook } from '../useHrFlowHook';
+
 const emit = defineEmits<{
   success: [];
 }>();
-const formData = ref<EmployeeInfoApi.EmployeeApplyBo>();
+const isUpdate = ref(false);
 
 const formSchema: VbenFormSchema[] = [
   {
@@ -26,6 +33,25 @@ const formSchema: VbenFormSchema[] = [
       triggerFields: [''],
     },
   },
+  {
+    label: '员工id',
+    fieldName: 'employeeId',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    component: 'Input',
+    fieldName: 'applyCode',
+    label: '申请编号',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+    disabled: true,
+  },
   {
     component: 'Input',
     fieldName: 'name',
@@ -82,6 +108,8 @@ const [BasicForm, formApi] = useVbenForm({
   wrapperClass: 'grid-cols-2',
 });
 
+const applyModalApi = shallowRef<ExtendedModalApi | null>(null);
+
 const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
   {
     initializedGetter: defaultFormValueGetter(formApi),
@@ -89,55 +117,104 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
   },
 );
 
+function onSubmit() {
+  onSubmitFunc(applyModalApi.value);
+}
+
 const [BasicModal, modalApi] = useVbenModal({
   fullscreenButton: false,
   onBeforeClose,
   onClosed: handleClosed,
   onConfirm: onSubmit,
+  confirmText: '提交申请',
   onOpenChange: async (isOpen) => {
     if (!isOpen) {
       return null;
     }
     modalApi.modalLoading(true);
 
-    const data = modalApi.getData() as { id?: number; name?: string };
-    if (data) {
-      formData.value = data;
-      await formApi.setValues(formData.value);
+    let data = modalApi.getData() as EmployeeInfoApi.EmployeeApplyBo & {
+      applyModalApi: ExtendedModalApi;
+    };
+    applyModalApi.value = data.applyModalApi;
+    isUpdate.value = !!data?.id;
+    if (isUpdate.value && data.id) {
+      updateForm(isUpdate.value);
+      data = await apiDetail(data.id);
+      updateDataInfo(data);
     }
+    await formApi.setValues(data);
     await markInitialized();
 
     modalApi.modalLoading(false);
   },
 });
 
-async function onSubmit() {
-  const { valid } = await formApi.validate();
-  if (valid) {
-    modalApi.lock();
-    const data = await formApi.getValues<EmployeeInfoApi.EmployeeApplyBo>();
-    try {
-      await applyEntry(data);
-      resetInitialized();
-      emit('success');
-      modalApi.close();
-    } finally {
-      modalApi.unlock();
-    }
-  }
-}
+const { handleTempSave, onSubmitFunc, updateDataInfo, updateForm } =
+  useHrFlowHook(formApi, modalApi, applyEntry, () => {
+    resetInitialized();
+    emit('success');
+  });
+
+// async function onSubmit() {
+//   const { valid } = await formApi.validate();
+//   if (valid) {
+//     modalApi.lock();
+//     const data = await formApi.getValues<EmployeeInfoApi.EmployeeApplyBo>();
+//     try {
+//       await applyEntry(data);
+//       resetInitialized();
+//       emit('success');
+//       modalApi.close();
+//     } finally {
+//       modalApi.unlock();
+//     }
+//   }
+// }
+
+// /**
+//  * 暂存/提交 提取通用逻辑
+//  */
+// async function handleSaveOrUpdate() {
+//   const { valid } = await formApi.validate();
+//   if (!valid) {
+//     throw new Error('表单验证失败');
+//   }
+//   const data = await formApi.getValues<EmployeeInfoApi.EmployeeApplyBo>();
+//   return await applyEntry(data);
+// }
+
+// /**
+//  * 暂存 草稿状态
+//  */
+// async function handleTempSave() {
+//   modalApi.lock();
+//   try {
+//     await handleSaveOrUpdate();
+//     resetInitialized();
+//     emit('success');
+//     modalApi.close();
+//   } catch (error) {
+//     console.error(error);
+//   } finally {
+//     modalApi.unlock();
+//   }
+// }
 
 async function handleClosed() {
   await formApi.resetForm();
   resetInitialized();
 }
 
-// const getModalTitle = computed(() =>
-//   formData.value?.id ? '修改字典类型' : '新增字典类型',
-// );
+const getModalTitle = computed(() =>
+  isUpdate.value ? '修改入职申请' : '入职申请',
+);
 </script>
 <template>
-  <BasicModal title="入职申请">
+  <BasicModal :title="getModalTitle">
     <BasicForm class="mx-4" />
+    <template #center-footer>
+      <Button @click="handleTempSave">暂存</Button>
+    </template>
   </BasicModal>
 </template>

apps/web-antd/src/views/hr/employeeInfo/apply-resign-model.vue

 <script lang="ts" setup>
+import type { ExtendedModalApi } from '@vben/common-ui';
+
 import type { VbenFormSchema } from '#/adapter/form';
 import type { EmployeeInfoApi } from '#/api/hr/employeeModel';
 
-import { ref } from 'vue';
+import { computed, ref, shallowRef } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { getVxePopupContainer } from '@vben/utils';
 
+import { Button } from 'ant-design-vue';
+
 import { useVbenForm } from '#/adapter/form';
+import { apiDetail } from '#/api/hr/employeeFlow';
 import { applyResign } from '#/api/hr/employeeInfo';
 import { getDictOptions } from '#/utils/dict';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 
 import { HrDictEnum } from '../dict-enum';
+import { useHrFlowHook } from '../useHrFlowHook';
 
 const emit = defineEmits<{
   success: [];
 }>();
-const formData = ref<EmployeeInfoApi.EmployeeResignApplyBo>();
+const isUpdate = ref(false);
 
 const formSchema: VbenFormSchema[] = [
   {
@@ -29,6 +35,25 @@ const formSchema: VbenFormSchema[] = [
       triggerFields: [''],
     },
   },
+  {
+    label: '员工id',
+    fieldName: 'employeeId',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    component: 'Input',
+    fieldName: 'applyCode',
+    label: '申请编号',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+    disabled: true,
+  },
   {
     component: 'Input',
     fieldName: 'name',
@@ -49,6 +74,7 @@ const formSchema: VbenFormSchema[] = [
       options: getDictOptions(HrDictEnum.HR_RESIGNATION_TYPE),
     },
     fieldName: 'resignationType',
+    defaultValue: '1',
     label: '离职类型',
     rules: 'required',
   },
@@ -93,6 +119,7 @@ const formSchema: VbenFormSchema[] = [
     formItemClass: 'items-start',
   },
 ];
+const applyModalApi = shallowRef<ExtendedModalApi | null>(null);
 
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
@@ -125,45 +152,92 @@ const [BasicModal, modalApi] = useVbenModal({
     }
     modalApi.modalLoading(true);
 
-    const data = modalApi.getData() as { id?: number; name?: string };
-    if (data) {
-      formData.value = data;
-      await formApi.setValues(formData.value);
+    let data = modalApi.getData() as EmployeeInfoApi.EmployeeResignApplyBo & {
+      applyModalApi: ExtendedModalApi;
+    };
+    applyModalApi.value = data.applyModalApi;
+    isUpdate.value = !!data?.id;
+    if (isUpdate.value && data.id) {
+      updateForm(isUpdate.value);
+      data = await apiDetail(data.id);
+      updateDataInfo(data, mapDict);
     }
+    await formApi.setValues(data);
     await markInitialized();
 
     modalApi.modalLoading(false);
   },
 });
 
-async function onSubmit() {
-  const { valid } = await formApi.validate();
-  if (valid) {
-    modalApi.lock();
-    const data =
-      await formApi.getValues<EmployeeInfoApi.EmployeeResignApplyBo>();
-    try {
-      await applyResign(data);
-      resetInitialized();
-      emit('success');
-      modalApi.close();
-    } finally {
-      modalApi.unlock();
-    }
-  }
+const { handleTempSave, onSubmitFunc, updateDataInfo, updateForm } =
+  useHrFlowHook(formApi, modalApi, applyResign, () => {
+    resetInitialized();
+    emit('success');
+  });
+
+function onSubmit() {
+  onSubmitFunc(applyModalApi.value);
 }
+const mapDict: Record<string, string> = {
+  resignationType: 'resignationType',
+  resignationDate: 'resignDate',
+  resignationReason: 'resignReason',
+  finalPayDate: 'finalPayDate',
+};
+// function updateDataInfo(data: EmployeeInfoApi.EmployeeApplyBaseBo) {
+//   if (data.auditLogList && data.auditLogList.length > 0) {
+//     data.auditLogList.map((t) => {
+//       if (t && t.auditField) {
+//         (data as any)[mapDict[t.auditField]!] = t.afterVal;
+//       }
+//       return t;
+//     });
+//   }
+// }
+
+// function updateForm(update: boolean) {
+//   formApi.updateSchema([
+//     {
+//       dependencies: {
+//         show: () => update,
+//         triggerFields: [''],
+//       },
+//       fieldName: 'applyCode',
+//     },
+//   ]);
+// }
+
+// async function onSubmit() {
+//   const { valid } = await formApi.validate();
+//   if (valid) {
+//     modalApi.lock();
+//     const data =
+//       await formApi.getValues<EmployeeInfoApi.EmployeeResignApplyBo>();
+//     try {
+//       await applyResign(data);
+//       resetInitialized();
+//       emit('success');
+//       modalApi.close();
+//     } finally {
+//       modalApi.unlock();
+//     }
+//   }
+// }
 
 async function handleClosed() {
   await formApi.resetForm();
   resetInitialized();
 }
 
-// const getModalTitle = computed(() =>
-//   formData.value?.id ? '修改字典类型' : '新增字典类型',
-// );
+const getModalTitle = computed(() =>
+  isUpdate.value ? '修改离职申请' : '离职申请',
+);
 </script>
 <template>
-  <BasicModal title="离职申请">
+  <BasicModal :title="getModalTitle">
     <BasicForm class="mx-4" />
+    <template #center-footer>
+      <Button @click="handleTempSave">暂存</Button>
+    </template>
   </BasicModal>
 </template>

apps/web-antd/src/views/hr/employeeInfo/apply-transfer-model.vue

 <script lang="ts" setup>
+import type { ExtendedModalApi } from '@vben/common-ui';
+
 import type { VbenFormSchema } from '#/adapter/form';
 import type { EmployeeInfoApi } from '#/api/hr/employeeModel';
 
-import { ref } from 'vue';
+import { computed, ref, shallowRef } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { addFullName, getVxePopupContainer } from '@vben/utils';
 
+import { Button } from 'ant-design-vue';
+
 import { useVbenForm } from '#/adapter/form';
 import { treeList } from '#/api/auth/dept';
+import { apiDetail } from '#/api/hr/employeeFlow';
 import { applyTransfer } from '#/api/hr/employeeInfo';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 
+import { useHrFlowHook } from '../useHrFlowHook';
+
 const emit = defineEmits<{
   success: [];
 }>();
-const formData = ref<EmployeeInfoApi.EmployeeTransferApplyBo>();
+const isUpdate = ref(false);
 
 const formSchema: VbenFormSchema[] = [
   {
@@ -27,6 +34,25 @@ const formSchema: VbenFormSchema[] = [
       triggerFields: [''],
     },
   },
+  {
+    label: '员工id',
+    fieldName: 'employeeId',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    component: 'Input',
+    fieldName: 'applyCode',
+    label: '申请编号',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+    disabled: true,
+  },
   {
     component: 'Input',
     fieldName: 'name',
@@ -113,6 +139,7 @@ const formSchema: VbenFormSchema[] = [
     formItemClass: 'items-start',
   },
 ];
+const applyModalApi = shallowRef<ExtendedModalApi | null>(null);
 
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
@@ -145,45 +172,87 @@ const [BasicModal, modalApi] = useVbenModal({
     }
     modalApi.modalLoading(true);
 
-    const data = modalApi.getData() as { id?: number; name?: string };
-    if (data) {
-      formData.value = data;
-      await formApi.setValues(formData.value);
+    let data = modalApi.getData() as EmployeeInfoApi.EmployeeTransferApplyBo & {
+      applyModalApi: ExtendedModalApi;
+    };
+    applyModalApi.value = data.applyModalApi;
+    isUpdate.value = !!data?.id;
+    if (isUpdate.value && data.id) {
+      updateForm(isUpdate.value);
+      data = await apiDetail(data.id);
+      data.oldDeptName = data.deptName;
+      updateDataInfo(data);
     }
+    await formApi.setValues(data);
     await markInitialized();
 
     modalApi.modalLoading(false);
   },
 });
 
-async function onSubmit() {
-  const { valid } = await formApi.validate();
-  if (valid) {
-    modalApi.lock();
-    const data =
-      await formApi.getValues<EmployeeInfoApi.EmployeeTransferApplyBo>();
-    try {
-      await applyTransfer(data);
-      resetInitialized();
-      emit('success');
-      modalApi.close();
-    } finally {
-      modalApi.unlock();
-    }
-  }
+const { handleTempSave, onSubmitFunc, updateDataInfo, updateForm } =
+  useHrFlowHook(formApi, modalApi, applyTransfer, () => {
+    resetInitialized();
+    emit('success');
+  });
+
+function onSubmit() {
+  onSubmitFunc(applyModalApi.value);
 }
 
+// function updateDataInfo(data: EmployeeInfoApi.EmployeeApplyBaseBo) {
+//   if (data.auditLogList && data.auditLogList.length > 0) {
+//     data.auditLogList.map((t) => {
+//       if (t && t.auditField) {
+//         (data as any)[t.auditField] = t.afterVal;
+//       }
+//       return t;
+//     });
+//   }
+// }
+// function updateForm(update: boolean) {
+//   formApi.updateSchema([
+//     {
+//       dependencies: {
+//         show: () => update,
+//         triggerFields: [''],
+//       },
+//       fieldName: 'applyCode',
+//     },
+//   ]);
+// }
+
+// async function onSubmit() {
+//   const { valid } = await formApi.validate();
+//   if (valid) {
+//     modalApi.lock();
+//     const data =
+//       await formApi.getValues<EmployeeInfoApi.EmployeeTransferApplyBo>();
+//     try {
+//       await applyTransfer(data);
+//       resetInitialized();
+//       emit('success');
+//       modalApi.close();
+//     } finally {
+//       modalApi.unlock();
+//     }
+//   }
+// }
+
 async function handleClosed() {
   await formApi.resetForm();
   resetInitialized();
 }
 
-// const getModalTitle = computed(() =>
-//   formData.value?.id ? '修改字典类型' : '新增字典类型',
-// );
+const getModalTitle = computed(() =>
+  isUpdate.value ? '修改调配申请' : '调配申请',
+);
 </script>
 <template>
-  <BasicModal title="调配申请">
+  <BasicModal :title="getModalTitle">
     <BasicForm class="mx-4" />
+    <template #center-footer>
+      <Button @click="handleTempSave">暂存</Button>
+    </template>
   </BasicModal>
 </template>

apps/web-antd/src/views/hr/employeeInfo/list.vue

 <script lang="ts" setup>
-import type { VbenFormProps } from '@vben/common-ui';
+import type { ExtendedModalApi, VbenFormProps } from '@vben/common-ui';
 
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { EmployeeInfoApi } from '#/api/hr/employeeModel';
 
-import { ref } from 'vue';
+import { ref, shallowRef } from 'vue';
 
 import { Page, useVbenDrawer, useVbenModal } from '@vben/common-ui';
 
@@ -26,6 +26,7 @@ import { GhostButton } from '#/components/global/button';
 import { commonDownloadExcel } from '#/utils/file/download';
 import DeptTree from '#/views/auth/user/deptTree.vue';
 
+import { applyModal } from '../../workflow/components';
 import applyEntryModel from './apply-entry-model.vue';
 import applyResignModel from './apply-resign-model.vue';
 import applyTransferModel from './apply-transfer-model.vue';
@@ -44,6 +45,9 @@ function handleImport() {
   employeeImportModalApi.open();
 }
 
+const [ApplyModal, applyModalApi] = useVbenModal({
+  connectedComponent: applyModal,
+});
 const [ApplyEntryModel, applyEntryModelApi] = useVbenModal({
   connectedComponent: applyEntryModel,
 });
@@ -54,6 +58,7 @@ const [ApplyResignModel, applyResignModelApi] = useVbenModal({
   connectedComponent: applyResignModel,
 });
 
+const modalApi = shallowRef<ExtendedModalApi | null>(null);
 // 左边部门用
 const selectDeptId = ref<number[]>([]);
 const formOptions: VbenFormProps = {
@@ -138,40 +143,53 @@ function onCreate() {
   formDrawerApi.setData({}).open();
 }
 function onEntryApply(row: EmployeeInfoApi.Employee) {
+  modalApi.value = applyEntryModelApi;
   applyEntryModelApi
     .setData({
-      id: row.id,
+      employeeId: row.id,
       name: row.name,
       deptName: `${row.plate} / ${row.firstLevelDepartment} / ${
         row.secondLevelDepartment
       } / ${row.thirdLevelDepartment}`,
+      applyModalApi,
     })
     .open();
 }
 
 function onResign(row: EmployeeInfoApi.Employee) {
+  modalApi.value = applyResignModelApi;
   applyResignModelApi
     .setData({
-      id: row.id,
+      employeeId: row.id,
       name: row.name,
       deptName: `${row.plate} / ${row.firstLevelDepartment} / ${
         row.secondLevelDepartment
       } / ${row.thirdLevelDepartment}`,
+      applyModalApi,
     })
     .open();
 }
 
 function onTransfer(row: EmployeeInfoApi.Employee) {
+  modalApi.value = applyTransferModelApi;
   applyTransferModelApi
     .setData({
-      id: row.id,
+      employeeId: row.id,
       name: row.name,
       oldDeptName: `${row.plate} / ${row.firstLevelDepartment} / ${
         row.secondLevelDepartment
       } / ${row.thirdLevelDepartment}`,
+      applyModalApi,
     })
     .open();
 }
+
+async function handleCompleteOrCancel() {
+  if (modalApi.value) {
+    modalApi.value.close();
+  }
+  gridApi.query();
+}
 function handleDownloadExcel(row: EmployeeInfoApi.Employee) {
   commonDownloadExcel(apiExport, '员工信息', row.id);
 }
@@ -248,18 +266,21 @@ function handleDownloadEmployeeList() {
             查看
           </GhostButton>
           <GhostButton
+            v-if="[0].includes(row.status)"
             v-access:code="['employee:info:edit']"
             @click.stop="onEdit(row)"
           >
             编辑
           </GhostButton>
           <GhostButton
+            v-if="[0].includes(row.status)"
             v-access:code="['employee:info:add']"
             @click.stop="onEntryApply(row)"
           >
             申请入职
           </GhostButton>
           <GhostButton
+            v-if="[1, 2].includes(row.status)"
             v-access:code="['employee:info:edit']"
             @click.stop="onTransfer(row)"
           >
@@ -267,6 +288,7 @@ function handleDownloadEmployeeList() {
           </GhostButton>
           <GhostButton
             danger
+            v-if="[1, 2].includes(row.status)"
             v-access:code="['employee:info:resign']"
             @click.stop="onResign(row)"
           >
@@ -277,8 +299,12 @@ function handleDownloadEmployeeList() {
       </template>
     </Grid>
     <EmployeeImportModal @reload="onRefresh" />
-    <ApplyEntryModel @reload="onRefresh" />
-    <ApplyTransferModel @reload="onRefresh" />
-    <ApplyResignModel @reload="onRefresh" />
+    <ApplyEntryModel />
+    <ApplyTransferModel />
+    <ApplyResignModel />
+    <ApplyModal
+      @complete="handleCompleteOrCancel"
+      @cancel="handleCompleteOrCancel"
+    />
   </Page>
 </template>

apps/web-antd/src/views/hr/regularReminder/apply-regular-model.vue

 <script lang="ts" setup>
+import type { ExtendedModalApi } from '@vben/common-ui';
+
 import type { VbenFormSchema } from '#/adapter/form';
 import type { EmployeeInfoApi } from '#/api/hr/employeeModel';
 
-import { ref } from 'vue';
+import { computed, ref, shallowRef } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { DictEnum } from '@vben/constants';
 import { getVxePopupContainer } from '@vben/utils';
 
+import { Button } from 'ant-design-vue';
+
 import { useVbenForm } from '#/adapter/form';
+import { apiDetail } from '#/api/hr/employeeFlow';
 import { applyRegular } from '#/api/hr/employeeInfo';
 import { getDictOptions } from '#/utils/dict';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 
+import { useHrFlowHook } from '../useHrFlowHook';
+
 const emit = defineEmits<{
   success: [];
 }>();
-const formData = ref<EmployeeInfoApi.EmployeeRegularApplyBo>();
+const isUpdate = ref(false);
 
 const formSchema: VbenFormSchema[] = [
   {
@@ -28,6 +35,25 @@ const formSchema: VbenFormSchema[] = [
       triggerFields: [''],
     },
   },
+  {
+    label: '员工id',
+    fieldName: 'employeeId',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    component: 'Input',
+    fieldName: 'applyCode',
+    label: '申请编号',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+    disabled: true,
+  },
   {
     component: 'Input',
     fieldName: 'name',
@@ -142,6 +168,7 @@ const formSchema: VbenFormSchema[] = [
     formItemClass: 'items-start',
   },
 ];
+const applyModalApi = shallowRef<ExtendedModalApi | null>(null);
 
 const [BasicForm, formApi] = useVbenForm({
   commonConfig: {
@@ -174,45 +201,86 @@ const [BasicModal, modalApi] = useVbenModal({
     }
     modalApi.modalLoading(true);
 
-    const data = modalApi.getData() as { id?: number; name?: string };
-    if (data) {
-      formData.value = data;
-      await formApi.setValues(formData.value);
+    let data = modalApi.getData() as EmployeeInfoApi.EmployeeApplyBaseBo & {
+      applyModalApi: ExtendedModalApi;
+    };
+    applyModalApi.value = data.applyModalApi;
+    isUpdate.value = !!data?.id;
+    if (isUpdate.value && data.id) {
+      updateForm(isUpdate.value);
+      data = await apiDetail(data.id);
+      updateDataInfo(data);
     }
+    await formApi.setValues(data);
     await markInitialized();
 
     modalApi.modalLoading(false);
   },
 });
 
-async function onSubmit() {
-  const { valid } = await formApi.validate();
-  if (valid) {
-    modalApi.lock();
-    const data =
-      await formApi.getValues<EmployeeInfoApi.EmployeeRegularApplyBo>();
-    try {
-      await applyRegular(data);
-      resetInitialized();
-      emit('success');
-      modalApi.close();
-    } finally {
-      modalApi.unlock();
-    }
-  }
+const { handleTempSave, onSubmitFunc, updateDataInfo, updateForm } =
+  useHrFlowHook(formApi, modalApi, applyRegular, () => {
+    resetInitialized();
+    emit('success');
+  });
+
+function onSubmit() {
+  onSubmitFunc(applyModalApi.value);
 }
 
+// function updateDataInfo(data: EmployeeInfoApi.EmployeeApplyBaseBo) {
+//   if (data.auditLogList && data.auditLogList.length > 0) {
+//     data.auditLogList.map((t) => {
+//       if (t && t.auditField) {
+//         (data as any)[t.auditField] = t.afterVal;
+//       }
+//       return t;
+//     });
+//   }
+// }
+// function updateForm(update: boolean) {
+//   formApi.updateSchema([
+//     {
+//       dependencies: {
+//         show: () => update,
+//         triggerFields: [''],
+//       },
+//       fieldName: 'applyCode',
+//     },
+//   ]);
+// }
+
+// async function onSubmit() {
+//   const { valid } = await formApi.validate();
+//   if (valid) {
+//     modalApi.lock();
+//     const data =
+//       await formApi.getValues<EmployeeInfoApi.EmployeeRegularApplyBo>();
+//     try {
+//       await applyRegular(data);
+//       resetInitialized();
+//       emit('success');
+//       modalApi.close();
+//     } finally {
+//       modalApi.unlock();
+//     }
+//   }
+// }
+
 async function handleClosed() {
   await formApi.resetForm();
   resetInitialized();
 }
 
-// const getModalTitle = computed(() =>
-//   formData.value?.id ? '修改字典类型' : '新增字典类型',
-// );
+const getModalTitle = computed(() =>
+  isUpdate.value ? '修改转正申请' : '转正申请',
+);
 </script>
 <template>
-  <BasicModal title="转正申请">
+  <BasicModal :title="getModalTitle">
     <BasicForm class="mx-4" />
+    <template #center-footer>
+      <Button @click="handleTempSave">暂存</Button>
+    </template>
   </BasicModal>
 </template>

apps/web-antd/src/views/hr/regularReminder/list.vue

@@ -18,6 +18,7 @@ import { GhostButton } from '#/components/global/button';
 import { commonDownloadExcel } from '#/utils/file/download';
 import DeptTree from '#/views/auth/user/deptTree.vue';
 
+import { applyModal } from '../../workflow/components';
 import employeeDetailDrawer from '../employeeInfo/employee-detail-drawer.vue';
 import applyRegularModel from './apply-regular-model.vue';
 import { querySchema, useColumns } from './data';
@@ -64,6 +65,9 @@ const [EmployeeDetailDrawer, employeeDetailDrawerApi] = useVbenDrawer({
 const [ApplyRegularModel, applyRegularModelApi] = useVbenModal({
   connectedComponent: applyRegularModel,
 });
+const [ApplyModal, applyModalApi] = useVbenModal({
+  connectedComponent: applyModal,
+});
 
 const [Grid, gridApi] = useVbenVxeGrid({
   formOptions,
@@ -126,14 +130,19 @@ function onApplyRegular(
 ) {
   applyRegularModelApi
     .setData({
-      id: row.id,
+      employeeId: row.id,
       name: row.name,
       deptName: `${row.plate} / ${row.firstLevelDepartment} / ${
         row.secondLevelDepartment
       } / ${row.thirdLevelDepartment}`,
+      applyModalApi,
     })
     .open();
 }
+async function handleCompleteOrCancel() {
+  applyRegularModelApi.close();
+  gridApi.query();
+}
 // function onCreate() {
 //   formDrawerApi.setData({}).open();
 // }
@@ -217,5 +226,9 @@ function handleDownloadExcel() {
       </template>
     </Grid>
     <ApplyRegularModel />
+    <ApplyModal
+      @complete="handleCompleteOrCancel"
+      @cancel="handleCompleteOrCancel"
+    />
   </Page>
 </template>

apps/web-antd/src/views/hr/useHrFlowHook.ts

+import type { ExtendedFormApi, ExtendedModalApi } from '@vben/common-ui';
+
+import type { EmployeeInfoApi } from '#/api/hr/employeeModel';
+import type { StartWorkFlowReqData } from '#/api/workflow/task/model';
+
+import { startWorkFlow } from '#/api/workflow/task';
+
+export function useHrFlowHook(
+  formApi: ExtendedFormApi,
+  modalApi: ExtendedModalApi,
+  applyFunc: <T extends EmployeeInfoApi.EmployeeApplyBaseBo>(
+    data: T,
+  ) => Promise<EmployeeInfoApi.EmployeeApplyBaseBo>,
+  callback: () => void,
+) {
+  /**
+   * 暂存/提交 提取通用逻辑
+   */
+  async function handleSaveOrUpdate() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      throw new Error('表单验证失败');
+    }
+    const data = await formApi.getValues<EmployeeInfoApi.EmployeeApplyBaseBo>();
+    return await applyFunc(data);
+  }
+
+  /**
+   * 暂存 草稿状态
+   */
+  async function handleTempSave() {
+    modalApi.lock();
+    try {
+      await handleSaveOrUpdate();
+      callback();
+      // resetInitialized();
+      // emit('success');
+      modalApi.close();
+    } catch (error) {
+      console.error(error);
+    } finally {
+      modalApi.unlock();
+    }
+  }
+
+  async function onSubmitFunc(applyModelApi: ExtendedModalApi | null) {
+    modalApi.lock();
+    try {
+      const applyResp = await handleSaveOrUpdate();
+      initAndStartFlow(applyResp, applyModelApi);
+      callback();
+      // resetInitialized();
+      // emit('success');
+      modalApi.close();
+    } catch (error) {
+      console.error(error);
+    } finally {
+      modalApi.unlock();
+    }
+  }
+
+  async function initAndStartFlow(
+    applyResp: EmployeeInfoApi.EmployeeApplyBaseBo,
+    applyModelApi: ExtendedModalApi | null,
+  ) {
+    // 启动流程
+    const taskVariables = {
+      leaveDays: applyResp.name,
+      userList: [applyResp.employeeId],
+    };
+    // const formValues = await formApi.getValues();
+    // const flowCode = formValues?.flowType ?? 'leave1';
+    const startWorkFlowData: StartWorkFlowReqData = {
+      businessId: applyResp.id,
+      flowCode: applyResp.flowCode || 'hrEntryFlow',
+      variables: taskVariables,
+      flowInstanceBizExtBo: {
+        businessTitle: '申请',
+        businessCode: applyResp.applyCode,
+      },
+    };
+    const { taskId } = await startWorkFlow(startWorkFlowData);
+    // 打开窗口
+    applyModelApi?.setData({
+      taskId,
+      taskVariables,
+      variables: {},
+    });
+    applyModelApi?.open();
+  }
+
+  function updateDataInfo(
+    data: EmployeeInfoApi.EmployeeApplyBo,
+    mapDict?: Record<string, string>,
+  ) {
+    if (data.auditLogList && data.auditLogList.length > 0) {
+      if (mapDict) {
+        data.auditLogList.map((t) => {
+          if (t && t.auditField) {
+            // 使用中间变量进行类型检查
+            const targetField = mapDict?.[t.auditField] ?? t.auditField;
+            if (targetField) {
+              (data as any)[targetField] = t.afterVal;
+            }
+          }
+          return t;
+        });
+      } else {
+        data.auditLogList.map((t) => {
+          if (t && t.auditField) {
+            (data as any)[t.auditField] = t.afterVal;
+          }
+          return t;
+        });
+      }
+    }
+  }
+
+  function updateForm(update: boolean) {
+    formApi.updateSchema([
+      {
+        dependencies: {
+          show: () => update,
+          triggerFields: [''],
+        },
+        fieldName: 'applyCode',
+      },
+    ]);
+  }
+
+  return {
+    handleTempSave,
+    onSubmitFunc,
+    updateDataInfo,
+    updateForm,
+  };
+}

apps/web-antd/src/views/workflow/components/actions/flow-actions.vue

@@ -97,7 +97,10 @@ const router = useRouter();
 function handleEdit() {
   const path = props.task?.formPath;
   if (path) {
-    router.push({ path, query: { id: props.task!.businessId } });
+    router.push({
+      path,
+      query: { id: props.task!.businessId, flowCode: props.task!.flowCode },
+    });
   }
 }
 
@@ -174,10 +177,10 @@ function handleDelegation(userList: User[]) {
   const current = userList[0];
   approveWithReasonModal({
     title: '委托',
-    description: `确定委托给[${current?.nickName}]吗?`,
+    description: `确定委托给[${current?.name}]吗?`,
     onOk: async (reason) => {
       await taskOperation(
-        { taskId: props.task!.id, userId: current!.userId, message: reason },
+        { taskId: props.task!.id, userId: current!.id, message: reason },
         'delegateTask',
       );
       emit('reload');
@@ -196,10 +199,10 @@ function handleTransfer(userList: User[]) {
   const current = userList[0];
   approveWithReasonModal({
     title: '转办',
-    description: `确定转办给[${current?.nickName}]吗?`,
+    description: `确定转办给[${current?.name}]吗?`,
     onOk: async (reason) => {
       await taskOperation(
-        { taskId: props.task!.id, userId: current!.userId, message: reason },
+        { taskId: props.task!.id, userId: current!.id, message: reason },
         'transferTask',
       );
       emit('reload');
@@ -212,7 +215,7 @@ const [AddSignatureModal, addSignatureModalApi] = useVbenModal({
 });
 function handleAddSignature(userList: User[]) {
   if (userList.length === 0) return;
-  const userIds = userList.map((user) => user.userId);
+  const userIds = userList.map((user) => user.id);
   Modal.confirm({
     title: '提示',
     content: '确认加签吗?',
@@ -229,7 +232,7 @@ const [ReductionSignatureModal, reductionSignatureModalApi] = useVbenModal({
 });
 function handleReductionSignature(userList: User[]) {
   if (userList.length === 0) return;
-  const userIds = userList.map((user) => user.userId);
+  const userIds = userList.map((user) => user.id);
   Modal.confirm({
     title: '提示',
     content: '确认减签吗?',
@@ -263,10 +266,10 @@ function handleUpdateAssignee(userList: User[]) {
   if (!current) return;
   Modal.confirm({
     title: '修改办理人',
-    content: `确定修改办理人为${current?.nickName}吗?`,
+    content: `确定修改办理人为${current?.name}吗?`,
     centered: true,
     onOk: async () => {
-      await updateAssignee([props.task!.id], current.userId);
+      await updateAssignee([props.task!.id], current.id);
       emit('reload');
     },
   });

apps/web-antd/src/views/workflow/hrFlow/form.vue

@@ -7,7 +7,7 @@ import { computed, ref } from 'vue';
 import { useVbenDrawer } from '@vben/common-ui';
 
 import { useVbenForm } from '#/adapter/form';
-import { apiAdd, apiUpdate } from '#/api/hr/employeeFlow';
+import { apiAdd, apiDetail, apiUpdate } from '#/api/hr/employeeFlow';
 import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 
 const emit = defineEmits<{
@@ -29,20 +29,23 @@ const formSchema: VbenFormSchema[] = [
     component: 'Input',
     fieldName: 'applyCode',
     label: '申请编号',
-    rules: 'required',
+    disabled: true,
+    // rules: 'required',
   },
   {
     component: 'Select',
     componentProps: {},
     fieldName: 'flowType',
     label: '审批类型',
-    rules: 'selectRequired',
+    disabled: true,
+    // rules: 'selectRequired',
   },
   {
     component: 'Input',
     fieldName: 'employeeId',
     label: '员工信息ID',
-    rules: 'required',
+    disabled: true,
+    // rules: 'required',
   },
   // {
   //   component: 'DatePicker',
@@ -102,10 +105,13 @@ const [Drawer, drawerApi] = useVbenDrawer({
     if (!isOpen) {
       return null;
     }
-    const data = drawerApi.getData<EmployeeFlowApi.EmployeeFlow>();
-    isUpdate.value = !!data?.id;
-    if (isUpdate.value) {
-      await formApi.setValues(formData.value);
+    const { id } = drawerApi.getData<EmployeeFlowApi.EmployeeFlow>() as {
+      id?: number;
+    };
+    isUpdate.value = !!id;
+    if (isUpdate.value && id) {
+      const data = await apiDetail(id);
+      await formApi.setValues(data);
     } else {
       formApi.resetForm();
     }

apps/web-antd/src/views/workflow/hrFlow/hook.ts

+import { onActivated, onMounted, ref } from 'vue';
+
+import { createGlobalState } from '@vueuse/core';
+
+export function useRouteIdEdit(
+  callback: (id: string, flowCode: string) => void,
+  timeout = 800,
+) {
+  const { businessId, flowCodeRef } = useQueryId();
+  function openEditFromRouteId() {
+    const id = businessId.value;
+    const flowCode = flowCodeRef.value;
+    if (!id) {
+      return;
+    }
+    setTimeout(() => {
+      // 回调
+      callback?.(id, flowCode);
+      // 执行完 清理id
+      businessId.value = '';
+    }, timeout);
+  }
+
+  onMounted(openEditFromRouteId);
+  onActivated(openEditFromRouteId);
+}
+
+/**
+ * 用来存储业务ID 传值
+ */
+export const useQueryId = createGlobalState(() => {
+  const businessId = ref('');
+  const flowCodeRef = ref('');
+
+  return {
+    businessId,
+    flowCodeRef,
+  };
+});

apps/web-antd/src/views/workflow/hrFlow/hrEdit.vue

+<!--
+后端版本>=5.4.0  这个从本地路由变为从后台返回
+未修改文件名 而是新加了这个文件
+-->
+<script setup lang="ts">
+import { onMounted } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+
+import { useTabs } from '@vben/hooks';
+
+import { Spin } from 'ant-design-vue';
+
+import { useQueryId } from './hook';
+
+const router = useRouter();
+const route = useRoute();
+const id = route.query.id as string;
+const flowCode = route.query.flowCode as string;
+
+/**
+ * 从我的任务 -> 点击重新编辑会跳转到这里
+ * 相当于一个中转 因为我的任务无法获取到列表页的路径(与ele交互不同)
+ *
+ * 为什么不使用路由的query来实现?
+ * 因为刷新后参数不会丢失 且tab存的也是全路径 切换也不会丢失 这不符合预期
+ * 可以通过window.history.replaceState来删除query参数 但是tab切换还是会保留
+ */
+const { closeCurrentTab } = useTabs();
+const { businessId, flowCodeRef } = useQueryId();
+onMounted(async () => {
+  await closeCurrentTab();
+  if (id) {
+    // 设置业务ID 存储在内存
+    businessId.value = id;
+    flowCodeRef.value = flowCode;
+    router.push({ path: '/hr/employee/flow/list' });
+  }
+});
+</script>
+
+<template>
+  <div>
+    <Spin :spinning="true" />
+  </div>
+</template>

apps/web-antd/src/views/workflow/hrFlow/list.vue

 <script lang="ts" setup>
-import type { VbenFormProps } from '@vben/common-ui';
+import type { ExtendedModalApi, VbenFormProps } from '@vben/common-ui';
 
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { EmployeeFlowApi } from '#/api/hr/employeeFlow';
 
-import { Page, useVbenDrawer, useVbenModal } from '@vben/common-ui';
-import { Plus } from '@vben/icons';
+import { shallowRef } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
 import { getVxePopupContainer } from '@vben/utils';
 
 import { Button, message, Popconfirm, Space } from 'ant-design-vue';
@@ -15,9 +16,14 @@ import { apiDelete, apiExport, apiPage } from '#/api/hr/employeeFlow';
 import { cancelProcessApply } from '#/api/workflow/instance/index';
 import { commonDownloadExcel } from '#/utils/file/download';
 
+import applyRenewalContractModel from '../../hr/contractExpirationReminder/apply-renewal-contract-model.vue';
+import applyEntryModel from '../../hr/employeeInfo/apply-entry-model.vue';
+import applyResignModel from '../../hr/employeeInfo/apply-resign-model.vue';
+import applyTransferModel from '../../hr/employeeInfo/apply-transfer-model.vue';
+import applyRegularModel from '../../hr/regularReminder/apply-regular-model.vue';
 import { applyModal, flowInfoModal } from '../components';
 import { querySchema, useColumns } from './data';
-import Form from './form.vue';
+import { useRouteIdEdit } from './hook';
 
 const formOptions: VbenFormProps = {
   commonConfig: {
@@ -29,6 +35,7 @@ const formOptions: VbenFormProps = {
   schema: querySchema,
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
 };
+const modalApi = shallowRef<ExtendedModalApi | null>(null);
 
 const [ApplyModal, applyModalApi] = useVbenModal({
   connectedComponent: applyModal,
@@ -36,9 +43,24 @@ const [ApplyModal, applyModalApi] = useVbenModal({
 const [FlowInfoModal, flowInfoModalApi] = useVbenModal({
   connectedComponent: flowInfoModal,
 });
-const [FormDrawer, formDrawerApi] = useVbenDrawer({
-  connectedComponent: Form,
+const [ApplyEntryModel, applyEntryModelApi] = useVbenModal({
+  connectedComponent: applyEntryModel,
+});
+const [ApplyResignModel, applyResignModelApi] = useVbenModal({
+  connectedComponent: applyResignModel,
+});
+const [ApplyTransferModel, applyTransferModelApi] = useVbenModal({
+  connectedComponent: applyTransferModel,
+});
+const [ApplyRegularModel, applyRegularModelApi] = useVbenModal({
+  connectedComponent: applyRegularModel,
+});
+const [ApplyRenewalContractModel, applyRenewalContractModelApi] = useVbenModal({
+  connectedComponent: applyRenewalContractModel,
 });
+// const [FormDrawer, formDrawerApi] = useVbenDrawer({
+//   connectedComponent: Form,
+// });
 
 const [Grid, gridApi] = useVbenVxeGrid({
   formOptions,
@@ -79,15 +101,80 @@ const [Grid, gridApi] = useVbenVxeGrid({
   },
 });
 
+useRouteIdEdit((id, flowCode) => {
+  // 打开编辑
+  if (id && flowCode) {
+    let flowType = '1';
+    switch (flowCode) {
+      case 'hrEntryFlow': {
+        flowType = '1';
+        break;
+      }
+      case 'hrRegularizationFlow': {
+        flowType = '4';
+        break;
+      }
+      case 'hrRenewalContractFlow': {
+        flowType = '5';
+        break;
+      }
+      case 'hrResignFlow': {
+        flowType = '2';
+        break;
+      }
+      case 'hrTransferFlow': {
+        flowType = '3';
+        break;
+      }
+      default: {
+        break;
+      }
+    }
+    // 打开编辑
+    onEdit({ flowType, id: Number(id) });
+  }
+});
+
 function onRefresh() {
   gridApi.query();
 }
 function onEdit(row: EmployeeFlowApi.EmployeeFlow) {
-  formDrawerApi.setData(row).open();
-}
-function onCreate() {
-  formDrawerApi.setData({}).open();
+  // formDrawerApi.setData(row).open();
+  switch (row.flowType) {
+    case '1': {
+      modalApi.value = applyEntryModelApi;
+      applyEntryModelApi.setData({ id: row.id, applyModalApi }).open();
+      break;
+    }
+    case '2': {
+      modalApi.value = applyResignModelApi;
+      applyResignModelApi.setData({ id: row.id, applyModalApi }).open();
+      break;
+    }
+    case '3': {
+      modalApi.value = applyTransferModelApi;
+      applyTransferModelApi.setData({ id: row.id, applyModalApi }).open();
+      break;
+    }
+    case '4': {
+      modalApi.value = applyRegularModelApi;
+      applyRegularModelApi.setData({ id: row.id, applyModalApi }).open();
+      break;
+    }
+    case '5': {
+      modalApi.value = applyRenewalContractModelApi;
+      applyRenewalContractModelApi
+        .setData({ id: row.id, applyModalApi })
+        .open();
+      break;
+    }
+    // No default
+  }
 }
+
+// function onCreate() {
+//   formDrawerApi.setData({}).open();
+// }
 function onDelete(row: EmployeeFlowApi.EmployeeFlow) {
   const hideLoading = message.loading({
     content: `正在删除${row.applyCode}...`,
@@ -119,7 +206,9 @@ async function handleRevoke(row: Required<EmployeeFlowApi.EmployeeFlow>) {
 }
 
 async function handleCompleteOrCancel() {
-  formDrawerApi.close();
+  if (modalApi.value) {
+    modalApi.value.close();
+  }
   gridApi.query();
 }
 
@@ -130,7 +219,7 @@ function handleInfo(row: Required<EmployeeFlowApi.EmployeeFlow>) {
 </script>
 <template>
   <Page auto-content-height>
-    <FormDrawer @success="onRefresh" />
+    <!-- <FormDrawer @success="onRefresh" /> -->
     <Grid table-title="人事审批列表">
       <template #toolbar-tools>
         <Space>
@@ -140,14 +229,14 @@ function handleInfo(row: Required<EmployeeFlowApi.EmployeeFlow>) {
           >
             导出
           </Button>
-          <Button
+          <!-- <Button
             v-access:code="['employee:flow:add']"
             type="primary"
             @click="onCreate"
           >
             <Plus class="size-5" />
             新增
-          </Button>
+          </Button> -->
         </Space>
       </template>
       <template #action="{ row }">
@@ -204,5 +293,10 @@ function handleInfo(row: Required<EmployeeFlowApi.EmployeeFlow>) {
       @complete="handleCompleteOrCancel"
       @cancel="handleCompleteOrCancel"
     />
+    <ApplyEntryModel @reload="onRefresh" />
+    <ApplyResignModel @reload="onRefresh" />
+    <ApplyTransferModel @reload="onRefresh" />
+    <ApplyRegularModel @reload="onRefresh" />
+    <ApplyRenewalContractModel @reload="onRefresh" />
   </Page>
 </template>