From 32c9b6f656f5a96f2524f365d0320089ba8552c5 Mon Sep 17 00:00:00 2001
From: LiuHao <liuhaoai545@gmail.com>
Date: Wed, 24 Jan 2024 18:06:59 +0800
Subject: [PATCH] =?UTF-8?q?update=20=20=E8=B0=83=E6=95=B4=E9=9D=A2?=
 =?UTF-8?q?=E6=9D=BF=E4=BD=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../BpmnDesign/assets/showConfig.ts           |  13 +-
 src/components/BpmnDesign/index.vue           |  25 +--
 src/components/BpmnDesign/panel/TaskPanel.vue | 168 +++++++++++++-----
 src/components/Process/sys-user.vue           |  88 +++++----
 src/components/RoleSelect/index.vue           |   0
 src/components/UserSelect/index.vue           | 114 ++++++------
 src/types/bpmn/design.d.ts                    |  19 +-
 src/views/workflow/task/allTaskWaiting.vue    |   8 +-
 8 files changed, 255 insertions(+), 180 deletions(-)
 create mode 100644 src/components/RoleSelect/index.vue

diff --git a/src/components/BpmnDesign/assets/showConfig.ts b/src/components/BpmnDesign/assets/showConfig.ts
index 07effb0..abd8419 100644
--- a/src/components/BpmnDesign/assets/showConfig.ts
+++ b/src/components/BpmnDesign/assets/showConfig.ts
@@ -5,16 +5,17 @@ export default {
     formKey: true
   },
   'bpmn:UserTask': {
-    userType: true,
-    assignee: true,
-    candidateUsers: true,
-    candidateGroups: true,
+    auditUserType: true,
+    users: true,
+    roles: true,
+    specifyDesc: true,
+    multipleUserAuditType: true,
     async: true,
     priority: true,
-    formKey: true,
     skipExpression: true,
     dueDate: true,
-    taskListener: true
+    taskListener: true,
+    executionListener: true
   },
   'bpmn:ServiceTask': {
     async: true,
diff --git a/src/components/BpmnDesign/index.vue b/src/components/BpmnDesign/index.vue
index 5bda3fe..f84da6a 100644
--- a/src/components/BpmnDesign/index.vue
+++ b/src/components/BpmnDesign/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-dialog ref="flowDialogRef" v-model="dialog.visible" :title="dialog.title" width="95%" @close="closeDialog">
+  <el-dialog ref="flowDialogRef" v-model="dialog.visible" width="95%" :title="dialog.title" @close="closeDialog">
     <div class="app-containers">
       <el-header style="border-bottom: 1px solid rgb(218 218 218); height: auto">
         <div class="flex pb-3 justify-between">
@@ -51,7 +51,7 @@
             <div ref="canvas" class="canvas" />
           </el-main>
           <el-scrollbar height="610px">
-            <el-aside style="width: 400px; min-height: 590px; background-color: #f0f2f5">
+            <el-aside style="width: 400px; min-height: 590px; background-color: #fff; box-shadow: 0 0 5px 1px #999">
               <PropertyPanel v-if="bpmnModeler" :modeler="bpmnModeler" :users="users" :groups="groups" />
             </el-aside>
           </el-scrollbar>
@@ -317,9 +317,6 @@ const getProcessElement = () => {
 </script>
 
 <style lang="scss" scoped>
-/*左边工具栏以及编辑节点的样式*/
-//@import 'bpmn-js/dist/assets/bpmn-js.css';
-
 .app-containers {
   width: 100%;
   height: 100%;
@@ -328,23 +325,5 @@ const getProcessElement = () => {
     height: 100%;
     background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHBhdHRlcm4gaWQ9ImEiIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgcGF0dGVyblVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHBhdGggZD0iTTAgMTBoNDBNMTAgMHY0ME0wIDIwaDQwTTIwIDB2NDBNMCAzMGg0ME0zMCAwdjQwIiBmaWxsPSJub25lIiBzdHJva2U9IiNlMGUwZTAiIG9wYWNpdHk9Ii4yIi8+PHBhdGggZD0iTTQwIDBIMHY0MCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTBlMGUwIi8+PC9wYXR0ZXJuPjwvZGVmcz48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+');
   }
-  .panel {
-    position: absolute;
-    right: 0;
-    top: 50px;
-    width: 300px;
-  }
-  .load {
-    margin-right: 10px;
-  }
-  .el-form-item__label {
-    font-size: 13px;
-  }
-}
-
-.bpmn-icon-start-event-none:before {
-  //background-color: green;
-  //border-radius: 100%;
-  //font-size: 30px;
 }
 </style>
diff --git a/src/components/BpmnDesign/panel/TaskPanel.vue b/src/components/BpmnDesign/panel/TaskPanel.vue
index c3ee8b1..472f327 100644
--- a/src/components/BpmnDesign/panel/TaskPanel.vue
+++ b/src/components/BpmnDesign/panel/TaskPanel.vue
@@ -1,37 +1,78 @@
 <template>
   <div>
-    <el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px">
-      <el-form-item prop="id" label="节点 ID">
-        <el-input v-model="formData.id" @change="idChange"> </el-input>
-      </el-form-item>
-      <el-form-item prop="name" label="节点名称">
-        <el-input v-model="formData.name" @change="nameChange"> </el-input>
-      </el-form-item>
-      <el-form-item prop="auditUserType" label="人员类型">
-        <el-select v-model="formData.auditUserType">
-          <el-option v-for="item in AuditUserTypeSelect" :key="item.id" :value="item.value" :label="item.label"> </el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item v-if="formData.auditUserType === AuditUserTypeEnum.USER" style="">
-        <el-button type="primary" @click="openUserSelect">选择人员</el-button>
-      </el-form-item>
-      <el-form-item v-if="formData.auditUserType === AuditUserTypeEnum.SPECIFY" style="">
-        <el-radio-group v-model="formData.specifyDesc" class="ml-4">
-          <el-radio v-for="item in SpecifyDesc" :key="item.id" :label="item.value" size="large">{{ item.label }}</el-radio>
-        </el-radio-group>
-      </el-form-item>
-      <el-form-item label="多人审批方式">
-        <el-radio-group v-model="formData.multipleUserAuditType" class="ml-4 block-radio">
-          <el-radio v-for="item in MultipleUserAuditType" :key="item.id" :label="item.value" size="large">{{ item.label }}</el-radio>
-        </el-radio-group>
-      </el-form-item>
-      <el-form-item label="执行监听器" style="margin-bottom: 0"> </el-form-item>
-      <ExecutionListener :modeler="modeler" :element="element"></ExecutionListener>
-      <el-form-item label="任务监听器" style="margin-bottom: 0"> </el-form-item>
-      <TaskListener :modeler="modeler" :element="element"></TaskListener>
-    </el-form>
-
-    <UserSelect ref="userSelectRef" v-model="formData.users"></UserSelect>
+    <el-collapse>
+      <el-collapse-item title="Consistency" name="1">
+        <el-form ref="formRef" size="small" :model="formData" :rules="formRules" label-width="90px">
+          <el-form-item prop="id" label="节点 ID">
+            <el-input v-model="formData.id" @change="idChange"> </el-input>
+          </el-form-item>
+          <el-form-item prop="name" label="节点名称">
+            <el-input v-model="formData.name" @change="nameChange"> </el-input>
+          </el-form-item>
+          <el-form-item v-if="showConfig.auditUserType" prop="auditUserType" label="人员类型">
+            <el-select v-model="formData.auditUserType">
+              <el-option v-for="item in AuditUserTypeSelect" :key="item.id" :value="item.value" :label="item.label"> </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item v-if="formData.auditUserType === AuditUserTypeEnum.USER && showConfig.users" style="">
+            <el-badge :value="formData.users.length" :max="99">
+              <el-button type="primary" @click="openUserSelect">选择人员</el-button>
+              <UserSelect ref="userSelectRef" v-model="formData.users"></UserSelect>
+            </el-badge>
+          </el-form-item>
+          <el-form-item v-if="formData.auditUserType === AuditUserTypeEnum.ROLE && showConfig.roles" style="">
+            <el-badge :value="formData.users.length" :max="99">
+              <el-button type="primary" disabled @click="openUserSelect">选择角色</el-button>
+              <UserSelect ref="userSelectRef" v-model="formData.roles"></UserSelect>
+            </el-badge>
+          </el-form-item>
+          <el-form-item v-if="formData.auditUserType === AuditUserTypeEnum.SPECIFY && showConfig.specifyDesc" style="">
+            <el-radio-group v-model="formData.specifyDesc" class="ml-4">
+              <el-radio v-for="item in SpecifyDesc" :key="item.id" :label="item.value" size="large">{{ item.label }}</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item v-if="showConfig.multipleUserAuditType" prop="multipleUserAuditType" label="多人审批方式">
+            <el-radio-group v-model="formData.multipleUserAuditType" class="ml-4 block-radio">
+              <el-radio v-for="item in MultipleUserAuditType" :key="item.id" :label="item.value" size="large">{{ item.label }}</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item v-if="showConfig.async" prop="sync" label="是否异步">
+            <el-switch v-model="formData.async" inline-prompt active-text="是" inactive-text="否" @change="syncChange" />
+          </el-form-item>
+          <el-form-item v-if="showConfig.priority" prop="priority" label="优先级">
+            <el-input v-model="formData.priority"> </el-input>
+          </el-form-item>
+          <el-form-item v-if="showConfig.skipExpression" prop="skipExpression" label="跳过表达式">
+            <el-input v-model="formData.skipExpression"> </el-input>
+          </el-form-item>
+          <el-form-item v-if="showConfig.isForCompensation" prop="isForCompensation" label="是否为补偿">
+            <el-switch v-model="formData.isForCompensation" inline-prompt active-text="是" inactive-text="否" />
+          </el-form-item>
+          <el-form-item v-if="showConfig.triggerServiceTask" prop="triggerServiceTask" label="服务任务可触发">
+            <el-switch v-model="formData.triggerServiceTask" inline-prompt active-text="是" inactive-text="否" />
+          </el-form-item>
+          <el-form-item v-if="showConfig.autoStoreVariables" prop="autoStoreVariables" label="自动存储变量">
+            <el-switch v-model="formData.autoStoreVariables" inline-prompt active-text="是" inactive-text="否" />
+          </el-form-item>
+          <el-form-item v-if="showConfig.ruleVariablesInput" prop="skipExpression" label="输入变量">
+            <el-input v-model="formData.ruleVariablesInput"> </el-input>
+          </el-form-item>
+          <el-form-item v-if="showConfig.exclude" prop="exclude" label="排除">
+            <el-switch v-model="formData.exclude" inline-prompt active-text="是" inactive-text="否" />
+          </el-form-item>
+          <el-form-item v-if="showConfig.class" prop="class" label="类">
+            <el-input v-model="formData.class"> </el-input>
+          </el-form-item>
+          <el-form-item v-if="showConfig.dueDate" prop="dueDate" label="到期时间">
+            <el-date-picker v-model="formData.dueDate" type="datetime" @change="dueDateChange" />
+          </el-form-item>
+          <el-form-item v-if="showConfig.executionListener" label="执行监听器" style="margin-bottom: 0"> </el-form-item>
+          <ExecutionListener v-if="showConfig.executionListener" :modeler="modeler" :element="element"></ExecutionListener>
+          <el-form-item v-if="showConfig.taskListener" label="任务监听器" style="margin-bottom: 0"> </el-form-item>
+          <TaskListener v-if="showConfig.taskListener" :modeler="modeler" :element="element"></TaskListener>
+        </el-form>
+      </el-collapse-item>
+    </el-collapse>
   </div>
 </template>
 <script setup lang="ts">
@@ -40,17 +81,14 @@ import usePanel from '@/components/BpmnDesign/hooks/usePanel';
 import UserSelect from '@/components/UserSelect';
 import { Element, Modeler } from 'bpmn';
 import { TaskPanel } from 'bpmnDesign';
-import { AuditUserTypeEnum, MultipleUserAuditTypeEnum } from '@/enums/bpmn/IndexEnums';
+import { AuditUserTypeEnum, MultipleUserAuditTypeEnum, SpecifyDescEnum } from '@/enums/bpmn/IndexEnums';
 
 interface PropType {
   modeler: Modeler;
   element: Element;
-  categorys?: any[];
 }
-const props = withDefaults(defineProps<PropType>(), {
-  categorys: () => []
-});
-const { nameChange, idChange } = usePanel({
+const props = withDefaults(defineProps<PropType>(), {});
+const { nameChange, idChange, showConfig, updateProperties } = usePanel({
   modeler: props.modeler,
   element: toRaw(props.element)
 });
@@ -58,14 +96,60 @@ const { parse, formData } = useParseElement<TaskPanel>({
   modeler: props.modeler,
   element: toRaw(props.element),
   initData: {
+    id: '',
+    name: '',
+    users: [],
+    roles: [],
     multipleUserAuditType: MultipleUserAuditTypeEnum.SERIAL,
     auditUserType: AuditUserTypeEnum.USER,
-    users: []
-  } as any
+    specifyDesc: SpecifyDescEnum.SPECIFY_SINGLE
+  }
 });
 
 const userSelectRef = ref<InstanceType<typeof UserSelect>>();
 
+const openUserSelect = () => {
+  userSelectRef.value.open();
+};
+
+const syncChange = (newVal) => {
+  updateProperties({ 'flowable:async': newVal });
+};
+
+const dueDateChange = (newVal) => {
+  console.log(newVal);
+  updateProperties({ 'flowable:dueDate': newVal });
+};
+
+watch(
+  () => formData.value.auditUserType,
+  (val, oldVal) => {
+    formData.value.users = [];
+  }
+);
+watch(
+  () => formData.value.users,
+  (newVal: Record<string, any>[]) => {
+    updateProperties({ 'flowable:candidateGroups': undefined });
+    if (newVal.length === 1) {
+      const user = newVal[0];
+      const userId = user.userId;
+      updateProperties({ 'flowable:assignee': userId });
+      updateProperties({ 'flowable:candidateUsers': undefined });
+      // 删除会签属性
+    } else if (newVal.length > 1) {
+      // 获取userId 用逗号,隔开
+      const userIds = newVal.map((item) => item.userId).join(',');
+      updateProperties({ 'flowable:candidateUsers': userIds });
+      updateProperties({ 'flowable:assignee': undefined });
+    } else {
+      updateProperties({ 'flowable:candidateUsers': undefined });
+      updateProperties({ 'flowable:assignee': undefined });
+    }
+  },
+  { deep: true }
+);
+
 const formRules = ref<ElFormRules>({
   id: [{ required: true, message: '请输入', trigger: 'blur' }],
   name: [{ required: true, message: '请输入', trigger: 'blur' }]
@@ -87,10 +171,6 @@ const MultipleUserAuditType = [
   { id: 'b4f0c683-1ccc-43c4-8380-e1b998986caf', label: '并行（所有人审批通过）', value: 'parallel' },
   { id: '373d4b81-a0d1-4eb8-8685-0d2fb1b468e2', label: '或签（任意一人审批通过）', value: 'orSign' }
 ];
-
-const openUserSelect = () => {
-  userSelectRef.value.open();
-};
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/components/Process/sys-user.vue b/src/components/Process/sys-user.vue
index c423352..04eccd5 100644
--- a/src/components/Process/sys-user.vue
+++ b/src/components/Process/sys-user.vue
@@ -1,34 +1,38 @@
 <template>
-  <el-dialog v-model="visible" draggable :title="title" :width="width" :height="height" append-to-body
-    :close-on-click-modal="false">
+  <el-dialog v-model="visible" draggable :title="title" :width="width" :height="height" append-to-body :close-on-click-modal="false">
     <div class="p-2">
       <el-row :gutter="20">
         <!-- 部门树 -->
         <el-col :lg="4" :xs="24" style="">
           <el-card shadow="hover">
             <el-input v-model="deptName" placeholder="请输入部门名称" prefix-icon="Search" clearable />
-            <el-tree class="mt-2" ref="deptTreeRef" node-key="id" :data="deptOptions"
-              :props="{ label: 'label', children: 'children' }" :expand-on-click-node="false"
-              :filter-node-method="filterNode" highlight-current default-expand-all
-              @node-click="handleNodeClick"></el-tree>
+            <el-tree
+              ref="deptTreeRef"
+              class="mt-2"
+              node-key="id"
+              :data="deptOptions"
+              :props="{ label: 'label', children: 'children' }"
+              :expand-on-click-node="false"
+              :filter-node-method="filterNode"
+              highlight-current
+              default-expand-all
+              @node-click="handleNodeClick"
+            ></el-tree>
           </el-card>
         </el-col>
         <el-col :lg="20" :xs="24">
-          <transition :enter-active-class="proxy?.animate.searchAnimate.enter"
-            :leave-active-class="proxy?.animate.searchAnimate.leave">
-            <div class="search" v-show="showSearch">
+          <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
+            <div v-show="showSearch" class="search">
               <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
                 <el-form-item label="用户名称" prop="userName">
-                  <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px"
-                    @keyup.enter="handleQuery" />
+                  <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px" @keyup.enter="handleQuery" />
                 </el-form-item>
                 <el-form-item label="用户昵称" prop="nickName">
-                  <el-input v-model="queryParams.nickName" placeholder="请输入用户昵称" clearable style="width: 240px"
-                    @keyup.enter="handleQuery" />
+                  <el-input v-model="queryParams.nickName" placeholder="请输入用户昵称" clearable style="width: 240px" @keyup.enter="handleQuery" />
                 </el-form-item>
                 <el-form-item>
-                  <el-button type="primary" @click="handleQuery" icon="Search">搜索</el-button>
-                  <el-button @click="resetQuery" icon="Refresh">重置</el-button>
+                  <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+                  <el-button icon="Refresh" @click="resetQuery">重置</el-button>
                 </el-form-item>
               </el-form>
             </div>
@@ -37,17 +41,16 @@
           <el-card shadow="hover">
             <template #header>
               <el-row :gutter="10">
-                <right-toolbar v-model:showSearch="showSearch" @queryTable="handleQuery" :search="true"></right-toolbar>
+                <right-toolbar v-model:showSearch="showSearch" :search="true" @query-table="getUserList"></right-toolbar>
               </el-row>
             </template>
 
-            <el-table v-loading="loading" :data="userList" ref="multipleTableRef" row-key="userId"
-              @selection-change="handleSelectionChange">
-              <el-table-column type="selection" width="50" align="center" />
-              <el-table-column label="用户编号" align="center" key="userId" prop="userId" />
-              <el-table-column label="用户名称" align="center" key="userName" prop="userName" :show-overflow-tooltip="true" />
-              <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" :show-overflow-tooltip="true" />
-              <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" width="120" />
+            <el-table ref="multipleTableRef" v-loading="loading" :data="userList" row-key="userId" @selection-change="handleSelectionChange">
+              <el-table-column type="selection" width="50" align="center" :reserve-selection="true" />
+              <el-table-column key="userId" label="用户编号" align="center" prop="userId" />
+              <el-table-column key="userName" label="用户名称" align="center" prop="userName" :show-overflow-tooltip="true" />
+              <el-table-column key="nickName" label="用户昵称" align="center" prop="nickName" :show-overflow-tooltip="true" />
+              <el-table-column key="phonenumber" label="手机号码" align="center" prop="phonenumber" width="120" />
               <el-table-column label="创建时间" align="center" prop="createTime" width="160">
                 <template #default="scope">
                   <span>{{ scope.row.createTime }}</span>
@@ -55,12 +58,17 @@
               </el-table-column>
             </el-table>
 
-            <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
-              v-model:limit="queryParams.pageSize" @pagination="handleQuery" />
+            <pagination
+              v-show="total > 0"
+              v-model:page="queryParams.pageNum"
+              v-model:limit="queryParams.pageSize"
+              :total="total"
+              @pagination="getUserList"
+            />
           </el-card>
           <el-card shadow="hover">
-            <el-tag v-for="(user, index) in chooseUserList" :key="user.userId" style="margin:2px" closable
-              @close="handleCloseTag(user, index)">{{ user.userName }}
+            <el-tag v-for="(user, index) in chooseUserList" :key="user.userId" style="margin: 2px" closable @close="handleCloseTag(user, index)"
+              >{{ user.userName }}
             </el-tag>
           </el-card>
         </el-col>
@@ -108,11 +116,11 @@ const props = defineProps({
   //回显用户id
   userIdList: {
     type: Array,
-    default: []
+    default: () => []
   }
 });
-const deptTreeRef = ref(ElTree);
-const multipleTableRef = ref(ElTable);
+const deptTreeRef = ref<ElTreeInstance>();
+const multipleTableRef = ref<ElTableInstance>();
 
 const userList = ref<UserVO[]>();
 const loading = ref(true);
@@ -164,6 +172,7 @@ const getList = async () => {
   loading.value = false;
   userList.value = res.rows;
   total.value = res.total;
+
   if (userList.value && userIds.value.length > 0) {
     const data = await getUserListByIds(userIds.value);
     if (data.data && data.data.length > 0) {
@@ -198,6 +207,7 @@ const resetQuery = () => {
 
 /** 选择条数  */
 const handleSelectionChange = (selection: UserVO[]) => {
+  console.log(selection);
   if (props.multiple) {
     chooseUserList.value = selection.filter((element, index, self) => {
       return self.findIndex((x) => x.userId === element.userId) === index;
@@ -251,7 +261,7 @@ const handleNodeClick = (data: DeptVO) => {
 //删除tag
 const handleCloseTag = (user: UserVO, index: any) => {
   if (multipleTableRef.value.selection && multipleTableRef.value.selection.length > 0) {
-    multipleTableRef.value.selection.forEach((u: UserVO, i: Number) => {
+    multipleTableRef.value.selection.forEach((u: UserVO, i: number) => {
       if (user.userId === u.userId) {
         multipleTableRef.value.selection.splice(i, 1);
       }
@@ -271,16 +281,16 @@ const handleCloseTag = (user: UserVO, index: any) => {
   }
 };
 const submitFileForm = async () => {
-  loading.value =  true
-  emits('submitCallback',chooseUserList);
-}
+  loading.value = true;
+  emits('submitCallback', chooseUserList);
+};
 const close = async () => {
-  visible.value = false
-  loading.value =  false
+  visible.value = false;
+  loading.value = false;
   emits('close');
-}
+};
 //事件
-const emits = defineEmits(['submitCallback','close']);
+const emits = defineEmits(['submitCallback', 'close']);
 
 /**
  * 对外暴露子组件方法
@@ -289,4 +299,4 @@ defineExpose({
   getUserList,
   close
 });
-</script>
\ No newline at end of file
+</script>
diff --git a/src/components/RoleSelect/index.vue b/src/components/RoleSelect/index.vue
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/UserSelect/index.vue b/src/components/UserSelect/index.vue
index ca9e7d6..db6476b 100644
--- a/src/components/UserSelect/index.vue
+++ b/src/components/UserSelect/index.vue
@@ -31,7 +31,7 @@
                         v-model="queryParams.userName"
                         placeholder="请输入用户名称"
                         clearable
-                        style="width: 240px"
+                        style="width: 200px"
                         @keyup.enter="handleQuery"
                       />
                     </el-form-item>
@@ -40,26 +40,10 @@
                         v-model="queryParams.phonenumber"
                         placeholder="请输入手机号码"
                         clearable
-                        style="width: 240px"
+                        style="width: 200px"
                         @keyup.enter="handleQuery"
                       />
                     </el-form-item>
-
-                    <el-form-item label="状态" prop="status">
-                      <el-select v-model="queryParams.status" placeholder="用户状态" clearable style="width: 240px">
-                        <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
-                      </el-select>
-                    </el-form-item>
-                    <el-form-item label="创建时间" style="width: 308px">
-                      <el-date-picker
-                        v-model="dateRange"
-                        value-format="YYYY-MM-DD"
-                        type="daterange"
-                        range-separator="-"
-                        start-placeholder="开始日期"
-                        end-placeholder="结束日期"
-                      ></el-date-picker>
-                    </el-form-item>
                     <el-form-item>
                       <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
                       <el-button icon="Refresh" @click="resetQuery">重置</el-button>
@@ -71,38 +55,37 @@
 
             <el-card shadow="hover">
               <template #header>
-                <el-row :gutter="10">
-                  <el-col :span="1.5">
-                    <el-button type="primary" plain icon="Plus">新增</el-button>
-                  </el-col>
-                  <right-toolbar v-model:showSearch="showSearch" :columns="columns" :search="true" @query-table="getList"></right-toolbar>
-                </el-row>
+                <el-tag v-for="user in selectUserList" :key="user.userId" closable style="margin: 2px" @close="handleCloseTag(user.userId)">{{
+                  user.userName
+                }}</el-tag>
               </template>
 
               <vxe-table
                 ref="tableRef"
-                height="500px"
+                height="400px"
                 border
                 show-overflow
                 :data="userList"
                 :loading="loading"
                 :row-config="{ keyField: 'userId' }"
-                :checkbox-config="{ reserve: true, checkRowKeys: modelValue }"
+                :checkbox-config="{ reserve: true, checkRowKeys: userIds }"
                 highlight-current-row
+                @checkbox-all="handleCheckboxAll"
+                @checkbox-change="handleCheckboxChange"
               >
                 <vxe-column type="checkbox" width="50" align="center" />
-                <vxe-column v-if="columns[0].visible" key="userId" title="用户编号" align="center" field="userId" />
-                <vxe-column v-if="columns[1].visible" key="userName" title="用户名称" align="center" field="userName" :show-overflow-tooltip="true" />
-                <vxe-column v-if="columns[2].visible" key="nickName" title="用户昵称" align="center" field="nickName" :show-overflow-tooltip="true" />
-                <vxe-column v-if="columns[3].visible" key="deptName" title="部门" align="center" field="deptName" :show-overflow-tooltip="true" />
-                <vxe-column v-if="columns[4].visible" key="phonenumber" title="手机号码" align="center" field="phonenumber" width="120" />
-                <vxe-column v-if="columns[5].visible" key="status" title="状态" align="center">
+                <vxe-column key="userId" title="用户编号" align="center" field="userId" />
+                <vxe-column key="userName" title="用户名称" align="center" field="userName" :show-overflow-tooltip="true" />
+                <vxe-column key="nickName" title="用户昵称" align="center" field="nickName" :show-overflow-tooltip="true" />
+                <vxe-column key="deptName" title="部门" align="center" field="deptName" :show-overflow-tooltip="true" />
+                <vxe-column key="phonenumber" title="手机号码" align="center" field="phonenumber" width="120" />
+                <vxe-column key="status" title="状态" align="center">
                   <template #default="scope">
                     <dict-tag :options="sys_normal_disable" :value="scope.row.status"></dict-tag>
                   </template>
                 </vxe-column>
 
-                <vxe-column v-if="columns[6].visible" title="创建时间" align="center" width="160">
+                <vxe-column title="创建时间" align="center" width="160">
                   <template #default="scope">
                     <span>{{ scope.row.createTime }}</span>
                   </template>
@@ -133,12 +116,11 @@
 import api from '@/api/system/user';
 import { UserQuery, UserVO } from '@/api/system/user/types';
 import { DeptVO } from '@/api/system/dept/types';
-import { globalHeaders } from '@/utils/request';
-import useDialog from '@/hooks/useDialog';
 import { VxeTableInstance } from 'vxe-table';
+import useDialog from '@/hooks/useDialog';
 
 interface PropType {
-  modelValue: string[];
+  modelValue: UserVO[];
 }
 const prop = defineProps<PropType>();
 const emit = defineEmits(['update:modelValue']);
@@ -146,6 +128,8 @@ const emit = defineEmits(['update:modelValue']);
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { sys_normal_disable } = toRefs<any>(proxy?.useDict('sys_normal_disable'));
 
+const userIds = computed(() => prop.modelValue.map((item) => item.userId as string));
+
 const userList = ref<UserVO[]>();
 const loading = ref(true);
 const showSearch = ref(true);
@@ -153,17 +137,7 @@ const total = ref(0);
 const dateRange = ref<[DateModelType, DateModelType]>(['', '']);
 const deptName = ref('');
 const deptOptions = ref<DeptVO[]>([]);
-
-// 列显隐信息
-const columns = ref<FieldOption[]>([
-  { key: 0, label: `用户编号`, visible: false, children: [] },
-  { key: 1, label: `用户名称`, visible: true, children: [] },
-  { key: 2, label: `用户昵称`, visible: true, children: [] },
-  { key: 3, label: `部门`, visible: true, children: [] },
-  { key: 4, label: `手机号码`, visible: true, children: [] },
-  { key: 5, label: `状态`, visible: true, children: [] },
-  { key: 6, label: `创建时间`, visible: true, children: [] }
-]);
+const selectUserList = ref<UserVO[]>([]);
 
 const deptTreeRef = ref<ElTreeInstance>();
 const queryFormRef = ref<ElFormInstance>();
@@ -199,17 +173,8 @@ watchEffect(
 );
 
 const confirm = () => {
-  const $table = tableRef.value;
-  if ($table) {
-    // 获取当前列表选中行
-    const checkboxRecords = $table.getCheckboxRecords();
-    // 获取其他列表选中行
-    const checkboxReserveRecords = $table.getCheckboxReserveRecords();
-    const data: UserVO[] = [...checkboxRecords, ...checkboxReserveRecords];
-    const userIds = data.map((item) => item.userId);
-    emit('update:modelValue', userIds);
-    userDialog.closeDialog();
-  }
+  emit('update:modelValue', [...selectUserList.value]);
+  userDialog.closeDialog();
 };
 
 /** 查询部门下拉树结构 */
@@ -248,9 +213,42 @@ const resetQuery = () => {
   handleQuery();
 };
 
+const handleCheckboxChange = (checked) => {
+  const row = checked.row;
+  if (checked.checked) {
+    selectUserList.value.push(row);
+  } else {
+    selectUserList.value = selectUserList.value.filter((item) => {
+      return item.userId !== row.userId;
+    });
+  }
+};
+const handleCheckboxAll = (checked) => {
+  const rows = userList.value;
+  if (checked.checked) {
+    rows.forEach((row) => {
+      if (!selectUserList.value.some((item) => item.userId === row.userId)) {
+        selectUserList.value.push(row);
+      }
+    });
+  } else {
+    selectUserList.value = selectUserList.value.filter((item) => {
+      return !rows.some((row) => row.userId === item.userId);
+    });
+  }
+};
+
+const handleCloseTag = (userId: string | number) => {
+  // 删除选中用户
+  selectUserList.value = selectUserList.value.filter((item) => {
+    return item.userId !== userId;
+  });
+};
+
 onMounted(() => {
   getTreeSelect(); // 初始化部门数据
   getList(); // 初始化列表数据
+  Object.assign(selectUserList.value, prop.modelValue);
 });
 
 defineExpose({
diff --git a/src/types/bpmn/design.d.ts b/src/types/bpmn/design.d.ts
index 1f777eb..2aee897 100644
--- a/src/types/bpmn/design.d.ts
+++ b/src/types/bpmn/design.d.ts
@@ -31,15 +31,22 @@ declare module 'bpmnDesign' {
   }
 
   export interface TaskPanel extends BasePanel {
-    processCategory: string;
     auditUserType: AuditUserTypeEnum;
     specifyDesc: SpecifyDescEnum;
     multipleUserAuditType: MultipleUserAuditTypeEnum;
-    users: string[];
-
-    assignee: string;
-    candidateUsers: string;
-    candidateGroups: string;
+    users?: Record<string, any>[];
+    roles?: Record<string, any>[];
+    async?: boolean;
+    priority?: string;
+    skipExpression?: string;
+    isForCompensation?: boolean;
+    triggerServiceTask?: boolean;
+    autoStoreVariables?: boolean;
+    ruleVariablesInput?: string;
+    excludeTaskListener?: boolean;
+    exclude?: boolean;
+    class?: string;
+    dueDate?: string;
   }
 
   export interface StartEndPanel extends BasePanel {}
diff --git a/src/views/workflow/task/allTaskWaiting.vue b/src/views/workflow/task/allTaskWaiting.vue
index 83d5900..ef1c45e 100644
--- a/src/views/workflow/task/allTaskWaiting.vue
+++ b/src/views/workflow/task/allTaskWaiting.vue
@@ -102,7 +102,7 @@
     <!-- 加签组件 -->
     <multiInstanceUser ref="multiInstanceUserRef" :title="title" @submit-callback="handleQuery" />
     <!-- 加签组件 -->
-    <SysUser ref="sysUserRef" :multiple="false" @submit-callback="submitCallback" />
+    <SysUser ref="sysUserRef" :multiple="true" @submit-callback="submitCallback" />
   </div>
 </template>
 
@@ -226,11 +226,11 @@ const handleUpdate = () => {
 };
 //修改办理人
 const submitCallback = (data) => {
-  if(data && data.value.length > 0){
-    updateAssignee(ids.value,data.value[0].userId).then((resp) => {
+  if (data && data.value.length > 0) {
+    updateAssignee(ids.value, data.value[0].userId).then((resp) => {
       sysUserRef.value.close();
       proxy?.$modal.msgSuccess('操作成功');
-      handleQuery()
+      handleQuery();
     });
   }
 };