chore: 完善请假申请

apps/web-antd/src/views/workflow/components/apply-modal.vue

@@ -0,0 +1,100 @@
+<!-- 流程发起(启动)的弹窗 -->
+
+<script setup lang="ts">
+import { useVbenModal } from '@vben/common-ui';
+
+import { cloneDeep } from 'lodash-es';
+
+import { useVbenForm } from '#/adapter/form';
+import { completeTask } from '#/api/workflow/task';
+
+interface Emits {
+  /**
+   * 完成
+   */
+  complete: [];
+}
+
+const emit = defineEmits<Emits>();
+
+interface ModalProps {
+  taskId: string;
+  taskVariables: Record<string, any>;
+  variables?: any; // 这个干啥的
+}
+
+const [BasicModal, modalApi] = useVbenModal({
+  title: '流程发起',
+  fullscreenButton: false,
+  onConfirm: handleSubmit,
+});
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 100,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  schema: [
+    {
+      fieldName: 'messageType',
+      component: 'CheckboxGroup',
+      componentProps: {
+        options: [
+          { label: '站内信', value: '1', disabled: true },
+          { label: '邮件', value: '2' },
+          { label: '短信', value: '3' },
+        ],
+      },
+      label: '通知方式',
+      defaultValue: ['1'],
+    },
+    {
+      fieldName: 'flowCopyList',
+      component: 'Input',
+      defaultValue: [],
+      label: '抄送人',
+    },
+  ],
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-2',
+});
+
+async function handleSubmit() {
+  try {
+    modalApi.modalLoading(true);
+    const { messageType, flowCopyList } = cloneDeep(await formApi.getValues());
+    const { taskId, taskVariables, variables } =
+      modalApi.getData() as ModalProps;
+    const data = {
+      messageType,
+      flowCopyList,
+      taskId,
+      taskVariables,
+      variables,
+    };
+    await completeTask(data);
+    modalApi.close();
+    emit('complete');
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.modalLoading(false);
+  }
+}
+</script>
+
+<template>
+  <BasicModal>
+    <BasicForm>
+      <template #flowCopyList>
+        <div>TODO: 等待组件开发</div>
+      </template>
+    </BasicForm>
+  </BasicModal>
+</template>

apps/web-antd/src/views/workflow/components/index.ts

@@ -1,3 +1,5 @@
+export { default as applyModal } from './apply-modal.vue';
 export { default as ApprovalCard } from './approval-card.vue';
 export { default as ApprovalPanel } from './approval-panel.vue';
 export { default as ApprovalTimeline } from './approval-timeline.vue';
+export { default as UserSelectModal } from './user-select-modal.vue';

apps/web-antd/src/views/workflow/components/user-select-modal.vue

@@ -0,0 +1,45 @@
+<script setup lang="ts">
+import { onMounted, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Transfer } from 'ant-design-vue';
+
+import { userList } from '#/api/system/user';
+
+defineOptions({
+  name: 'UserSelectModal',
+  inheritAttrs: false,
+});
+
+const [BasicModal] = useVbenModal({
+  title: '选择',
+  class: 'w-[800px]',
+});
+
+const targetKeys = ref<string[]>([]);
+
+const dataSource = ref<Awaited<ReturnType<typeof userList>>['rows']>([]);
+onMounted(async () => {
+  const resp = await userList({ pageNum: 1, pageSize: 10 });
+  dataSource.value = resp.rows.map((item) => ({
+    ...item,
+    userId: String(item.userId),
+  }));
+});
+</script>
+
+<template>
+  <BasicModal>
+    <div class="min-h-[350px]">
+      <Transfer
+        v-model:target-keys="targetKeys"
+        :data-source="dataSource"
+        :pagination="true"
+        :render="(item) => item.nickName"
+        :row-key="(record) => record.userId"
+        class="h-full"
+      />
+    </div>
+  </BasicModal>
+</template>