diff --git a/src/views/workflow/design/bpmn/components/ApproveUserRules.vue b/src/views/workflow/design/bpmn/components/ApproveUserRules.vue
new file mode 100644
index 0000000..9988344
--- /dev/null
+++ b/src/views/workflow/design/bpmn/components/ApproveUserRules.vue
@@ -0,0 +1,200 @@
+<template>
+  <FormItem :label="t('自动同意：')">
+    <a-tree-select
+      :value="props.autoAgreeRule"
+      style="width: 100%"
+      :tree-data="autoAgreeRuleOptions"
+      tree-checkable
+      allow-clear
+      :placeholder="t('请选择自动同意规则')"
+      @change="changeAutoAgreeRule"
+    />
+  </FormItem>
+  <FormItem :label="t('无处理人：')">
+    <a-select
+      :value="props.noHandler"
+      style="width: 100%"
+      :options="noHandlerOptions"
+      @change="changeNoHandler"
+    />
+  </FormItem>
+  <FormItem :label="t('指定审批人：')">
+    <a-select
+      :value="props.isPrevChooseNext"
+      style="width: 100%"
+      :options="designatedApproverOptions"
+      @change="changeDesignatedApprover"
+    />
+  </FormItem>
+  <FormItem
+    :tip="
+      t(
+        '临时审批人是指由上一节点审批人指定下一节点审批人过程中，是否允许在审批人基础上添加组织架构人员。',
+      )
+    "
+    :label="t('临时审批人：')"
+  >
+    <a-switch :checked="props.provisionalApprover" @change="changeProvisionalApprover" />
+  </FormItem>
+
+    <!-- 多选 ：是 / 否 -->
+    <FormItem :label="t('多选：')">
+        <a-switch :checked="props.isChooseMulti" @change="changeIsChooseMulti" />
+    </FormItem>
+    <FormItem :label="t('全选：')">
+        <a-switch :checked="props.isChooseAll" @change="changeIsChooseAll" />
+    </FormItem>
+    <FormItem :label="t('只读：')">
+        <a-switch :checked="props.isReadOnly" @change="changeIsReadOnly" />
+    </FormItem>
+    <FormItem :label="t('审批人最多：')" >
+        <a-input-number
+            v-model:value="maxAppRovers"
+            :min="0"
+            :max="100"
+            @change="changeMaxAppRovers"
+        />
+    </FormItem>
+    <FormItem :label="t('审批人最少：')">
+        <a-input-number
+            v-model:value="minAppRovers"
+            :min="0"
+            :max="100"
+            @change="changeMinAppRovers"
+        />
+    </FormItem>
+</template>
+
+<script setup lang="ts" name="ProcessBasic">
+  import FormItem from '/@bpmn/layout/FormItem.vue';
+  import { AutoAgreeRule, DesignatedApprover, NoHandler } from '/@/enums/workflowEnum';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  const { t } = useI18n();
+  const emits = defineEmits([
+    'update:autoAgreeRule',
+    'update:noHandler',
+    'update:isPrevChooseNext',
+    'update:provisionalApprover',
+    'update:isChooseMulti',
+    'update:isChooseAll',
+    'update:isReadOnly',
+    'update:minAppRovers',
+    'update:maxAppRovers',
+  ]);
+  const props = defineProps({
+    autoAgreeRule: Array,
+    noHandler: Number || String || Boolean,
+    isPrevChooseNext: Number || String || Boolean,
+    isChooseMulti: {
+      type: Boolean,
+      default: true,
+    },
+    isChooseAll: {
+      type: Boolean,
+      default: false,
+    },
+    isReadOnly: {
+      type: Boolean,
+      default: false,
+    },
+    provisionalApprover: {
+      type: Boolean || undefined,
+      default: undefined,
+    },
+    minAppRovers: {
+        type: Number,
+        default: 0,
+    },
+    maxAppRovers: {
+        type: Number,
+        default: 0,
+    },
+  });
+
+  // 自动同意规则
+  const autoAgreeRuleOptions = [
+    {
+      value: AutoAgreeRule.ORIGINATOR,
+      label: t('候选审批人包含流程任务发起人'),
+    },
+    {
+      value: AutoAgreeRule.PREVIOUS_NODE,
+      label: t('候选审批人包含上一节点审批人'),
+    },
+    {
+      value: AutoAgreeRule.APPROVED,
+      label: t('候选审批人在此流程中审批过'),
+    },
+  ];
+  function changeAutoAgreeRule(val: Array<AutoAgreeRule>) {
+    let autoAgreeRule = val;
+    if (val.length > 0) {
+      // 选择了自动同意规则后，无处理人 只能由 超级管理员处理 且 指定审批人 只能 不指定审批人
+      emits('update:noHandler', NoHandler.ADMIN);
+      emits('update:isPrevChooseNext', DesignatedApprover.NOT_SPECIFIED);
+    }
+    emits('update:autoAgreeRule', autoAgreeRule);
+  }
+  // 无处理人
+  const noHandlerOptions = [
+    {
+      value: NoHandler.ADMIN,
+      label: t('由超级管理员处理'),
+    },
+    {
+      value: NoHandler.PREVIOUS_NODE,
+      label: t('由上一节点审批人指定审批人'),
+    },
+  ];
+  function changeNoHandler(val: NoHandler) {
+    emits('update:noHandler', val);
+    if (val == NoHandler.PREVIOUS_NODE) {
+      // 无处理人 选择了 由上一节点审批人指定审批人；那么自动同意规则必须为空
+      emits('update:autoAgreeRule', []);
+    }
+  }
+  // 指定审批人
+  const designatedApproverOptions = [
+    {
+      value: DesignatedApprover.NOT_SPECIFIED,
+      label: t('不指定审批人'),
+    },
+    {
+      value: DesignatedApprover.PREVIOUS_NODE,
+      label: t('由上一节点审批人指定'),
+    },
+  ];
+  function changeDesignatedApprover(val: DesignatedApprover) {
+    emits('update:isPrevChooseNext', val);
+    if (val == DesignatedApprover.PREVIOUS_NODE) {
+      // 指定审批人 选择了 由上一节点审批人指定；那么自动同意规则必须为空
+      emits('update:autoAgreeRule', []);
+    }
+  }
+  // 临时审批人
+  function changeProvisionalApprover(val: Boolean) {
+    emits('update:provisionalApprover', val);
+  }
+  // 多选
+  function changeIsChooseMulti(val: Boolean) {
+    emits('update:isChooseMulti', val);
+  }
+  // 全选
+  function changeIsChooseAll(val: Boolean) {
+    emits('update:isChooseAll', val);
+  }
+  // 只读
+  function changeIsReadOnly(val: Boolean) {
+    emits('update:isReadOnly', val);
+  }
+  // 最少审批人
+  function changeMinAppRovers(val: number) {
+      emits('update:minAppRovers', val);
+  }
+  // 最多审批人
+  function changeMaxAppRovers(val: number) {
+      emits('update:maxAppRovers', val);
+  }
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/views/workflow/design/bpmn/components/member/MemberUserTable.vue b/src/views/workflow/design/bpmn/components/member/MemberUserTable.vue
new file mode 100644
index 0000000..13535c4
--- /dev/null
+++ b/src/views/workflow/design/bpmn/components/member/MemberUserTable.vue
@@ -0,0 +1,76 @@
+<template>
+    <FormItem
+        :tip="
+      t(
+        '临时传阅人是指由上一节点审批人指定下一节点传阅人过程中，是否允许在传阅人基础上添加组织架构人员。',
+      )
+    "
+        :label="t('临时传阅人：')"
+    >
+        <a-switch :checked="provisionalDistributor" @change="changeProvisionalDistributor" />
+    </FormItem>
+    <FormItem :label="t('传阅人最多：')">
+        <a-input-number
+            v-model:value="maxReaders"
+            :min="0"
+            :max="100"
+            @change="changeMaxReaders"
+        />
+    </FormItem>
+    <FormItem :label="t('传阅人最少：')">
+        <a-input-number
+            v-model:value="minReaders"
+            :min="0"
+            :max="100"
+            @change="changeMinReaders"
+        />
+    </FormItem>
+</template>
+
+<script setup lang="ts" name="ProcessBasic">
+  import FormItem from '/@bpmn/layout/FormItem.vue';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  const { t } = useI18n();
+  const emits = defineEmits([
+    'update:provisionalDistributor',
+    'update:maxReaders',
+    'update:minReaders'
+  ]);
+  const props = defineProps({
+    isChooseMulti: {
+      type: Boolean,
+      default: true,
+    },
+    isChooseAll: {
+      type: Boolean,
+      default: false,
+    },
+    provisionalDistributor: {
+      type: Boolean || undefined,
+      default: undefined,
+    },
+    maxReaders: {
+        type: Number,
+        default: 0,
+    },
+    minReaders: {
+        type: Number,
+        default: 0,
+    },
+  });
+
+  // 临时传阅人
+  function changeProvisionalDistributor(val: Boolean) {
+    emits('update:provisionalDistributor', val);
+  }
+  //最多传阅人
+  function changeMaxReaders(val: number) {
+      emits('update:maxReaders', val);
+  }
+  //最少传阅人
+  function changeMinReaders(val: number) {
+      emits('update:minReaders', val);
+  }
+</script>
+
+<style lang="less" scoped></style>