feat: 审批提交新增动态用户选择

src/components/FlowUserSelect/index.vue

@@ -1,124 +0,0 @@
-<template>
-	<el-dialog v-model="dialogVisible" title="人员选择" :width="680" destroy-on-close append-to-body @closed="emit('closed')">
-		<div class="sc-user-select">
-			<div class="sc-user-select__left">
-				<div class="sc-user-select__search">
-					<el-input v-model="keyword" prefix-icon="Search" placeholder="搜索成员">
-						<template #append>
-							<el-button icon="Search" @click="search"></el-button>
-						</template>
-					</el-input>
-				</div>
-				<div class="sc-user-select__select">
-					<div v-loading="showGrouploading" class="sc-user-select__tree">
-						<el-scrollbar>
-							<el-tree
-								ref="groupTree"
-								class="menu"
-								:data="group"
-								:node-key="groupProps.key"
-								:props="groupProps"
-								highlight-current
-								:expand-on-click-node="false"
-								:current-node-key="groupId"
-								@node-click="groupClick"
-							/>
-						</el-scrollbar>
-					</div>
-					<div v-loading="showUserloading" class="sc-user-select__user">
-						<div class="sc-user-select__user__list">
-							<el-scrollbar ref="userScrollbar">
-								<el-tree
-									ref="userTree"
-									class="menu"
-									:data="user"
-									:node-key="userProps.key"
-									:props="userProps"
-									:default-checked-keys="selectedIds"
-									show-checkbox
-									check-on-click-node
-									@check-change="userClick"
-								></el-tree>
-							</el-scrollbar>
-						</div>
-						<footer>
-							<el-pagination
-								v-model:currentPage="currentPage"
-								background
-								layout="prev,next"
-								small
-								:total="total"
-								:page-size="pageSize"
-								@current-change="paginationChange"
-							></el-pagination>
-						</footer>
-					</div>
-				</div>
-			</div>
-			<div class="sc-user-select__toicon">
-				<el-icon><arrow-right /></el-icon>
-			</div>
-			<div class="sc-user-select__selected">
-				<header>已选 ({{ selected.length }})</header>
-				<ul style="margin: 0; padding: 0">
-					<el-scrollbar>
-						<li v-for="(item, index) in selected" :key="item.id">
-							<span class="name">
-								<el-avatar size="small">{{ item.name.substring(0, 1) }}</el-avatar>
-								<label>{{ item.name }}</label>
-							</span>
-							<span class="delete">
-								<el-button type="danger" icon="Delete" circle size="small" @click="deleteSelected(index)" />
-							</span>
-						</li>
-					</el-scrollbar>
-				</ul>
-			</div>
-		</div>
-
-		<template #footer>
-			<el-button @click="dialogVisible = false">取 消</el-button>
-			<el-button type="primary" @click="save">确 认</el-button>
-		</template>
-	</el-dialog>
-</template>
-
-<script setup>
-import { ref } from 'vue'
-
-const emit = defineEmits(['closed'])
-
-const groupTreeRef = ref()
-
-const dialogVisible = ref(false)
-const keyword = ref('')
-const groupId = ref('')
-const currentPage = ref(1)
-const showUserloading = ref(false)
-
-const search = () => {
-	groupId.value = ''
-	groupTreeRef.value.setCurrentKey(groupId.value)
-	currentPage.value = 1
-	getUser()
-}
-
-const  getUser = () =>{
-			this.showUserloading = true
-			var params = {
-				data: {
-					keyword: this.keyword || null,
-					departmentId: this.groupId || null
-				},
-				page: this.currentPage,
-				pageSize: this.pageSize
-			}
-			var res = await user.userPageApi(params)
-			this.showUserloading = false
-			this.user = res.records
-			this.total = res.total || 0
-			this.$refs.userScrollbar.setScrollTop(0)
-		}
-</script>
-
-<style scoped lang="scss"></style>

src/views/approve/launch/ItemDrawer.vue

@@ -13,9 +13,9 @@
 					<template v-else>
 						{{ v.name }}
 						<!-- {{ v.local_name }} -->
-						<div style="display: flex; align-items: center; gap: 6px">
-							<el-button :icon="Plus" style="width: 32px" @click="selectHandler" />
-							<FlowNodeAvatar v-for="(item, index) in userList" id="1" :key="index" style="margin-top: 5px" />
+						<div v-if="v.type !== 0" style="display: flex; align-items: center; gap: 6px">
+							<el-button :icon="Plus" style="width: 32px" @click="selectHandler(v.name)" />
+							<FlowNodeAvatar v-for="(item, index) in userMap.get(v.name)" id="1" :key="index" style="margin-top: 5px" />
 						</div>
 					</template>
 				</el-timeline-item>
@@ -27,7 +27,7 @@
 <script setup lang="ts">
 import model from '@/api/flow/process'
 import viewForm from '@/utils/form'
-import { ref, inject, shallowRef, computed, reactive } from 'vue'
+import { ref, shallowRef, computed, reactive } from 'vue'
 import { ElMessage } from 'element-plus'
 import { Plus } from '@element-plus/icons-vue'
 import UseSelect from '@/components/scWorkflow/select.vue'
@@ -45,10 +45,13 @@ const emit = defineEmits<{
 	update: [value: string]
 }>()
 const updateModelValue = (bool: boolean) => emit('update:modelValue', bool)
-const userList = ref([])
+const userMap = ref(new Map())
 const useSelectRef = ref()
-const selectHandler = () => {
-	useSelectRef.value.open(1, userList.value)
+const selectHandler = (name: string) => {
+	if (!userMap.value.get(name)) {
+		userMap.value.set(name, [])
+	}
+	useSelectRef.value.open(1, userMap.value.get(name))
 }
 const FormCreate = viewForm.$form()
 const formOption = ref({
@@ -62,10 +65,18 @@ const formOption = ref({
 			// 填写的数据存储(local_: 本地数据处理标识)
 			v.local_value = formData[v.field]
 		})
+		const assigneeMap = {}
+		userMap.value.forEach((v, k) => {
+			assigneeMap[k] = {
+				assigneeList: v,
+				type: 1
+			}
+		})
 		model
 			.processLaunchApi({
 				processId, // 流程ID
-				processForm: JSON.stringify(processForm) // 流程表单JSON内容 & local_value 保存
+				processForm: JSON.stringify(processForm), // 流程表单JSON内容 & local_value 保存
+				assigneeMap: assigneeMap // 流程节点审批人
 			})
 			.then(res => {
 				ElMessage.success('提交成功')