多组织机构审批流配置

src/api/approvalProcess.js

@@ -80,3 +80,15 @@ export const disableProcess = (id) => {
   })
 }
 
+/**
+ * 获取用户列表（用于审批人选择）
+ * @param {object} params - 查询参数
+ */
+export const getUserList = (params) => {
+  return request({
+    url: '/material-mall/userManage/userList',
+    method: 'GET',
+    params: params
+  })
+}
+

src/views/system/approval/components/NodeDialog.vue

@@ -10,25 +10,33 @@
       <el-form-item label="节点顺序" prop="nodeOrder">
         <el-input-number v-model="form.nodeOrder" :min="1" />
       </el-form-item>
-      <el-form-item label="节点编码" prop="nodeCode">
-        <el-input v-model="form.nodeCode" placeholder="请输入节点编码" />
-      </el-form-item>
       <el-form-item label="节点名称" prop="nodeName">
         <el-input v-model="form.nodeName" placeholder="请输入节点名称" />
       </el-form-item>
       <el-form-item label="审批人类型" prop="approverType">
         <el-radio-group v-model="form.approverType">
           <el-radio label="1">用户</el-radio>
-          <el-radio label="2">角色</el-radio>
+          <el-radio label="2" disabled="disabled">角色</el-radio>
         </el-radio-group>
       </el-form-item>
-      <el-form-item label="审批人ID" prop="approverIds">
+      <el-form-item label="审批人" prop="approverIds">
-        <el-input
+        <el-button type="primary" size="small" @click="handleSelectApprover">
-          v-model="form.approverIds"
+          选择审批人
-          placeholder="请输入审批人ID，多个用逗号分隔"
+        </el-button>
-          type="textarea"
+        <div v-if="selectedApprovers.length > 0" style="margin-top: 10px">
-          rows="3"
+          <el-tag
-        />
+            v-for="approver in selectedApprovers"
+            :key="approver.userId"
+            closable
+            @close="handleRemoveApprover(approver.userId)"
+            style="margin-right: 5px; margin-bottom: 5px"
+          >
+            {{ approver.userName }}
+          </el-tag>
+        </div>
+        <div v-else style="color: #999; margin-top: 10px">
+          未选择审批人
+        </div>
       </el-form-item>
       <el-form-item label="审批模式" prop="approveMode">
         <el-radio-group v-model="form.approveMode">
@@ -48,10 +56,45 @@
       <el-button @click="dialogVisible = false">取消</el-button>
       <el-button type="primary" @click="handleSubmit">确定</el-button>
     </span>
+
+    <!-- 用户列表选择对话框 -->
+    <el-dialog
+      title="选择审批人"
+      :visible.sync="userListDialogVisible"
+      width="70%"
+      append-to-body
+    >
+      <el-table
+        ref="userTable"
+        v-loading="userListLoading"
+        :data="userList"
+        style="width: 100%"
+        border
+        stripe
+        @selection-change="handleUserSelectionChange"
+      >
+        <el-table-column
+          type="selection"
+          width="55"
+          align="center"
+        />
+        <el-table-column prop="userId" label="用户ID" width="80" />
+        <el-table-column prop="userName" label="用户名" min-width="120" />
+        <el-table-column prop="nickName" label="昵称" min-width="120" />
+        <el-table-column prop="deptName" label="所属机构" min-width="120" />
+      </el-table>
+
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="userListDialogVisible = false">取消</el-button>
+        <el-button type="primary" @click="handleUserListConfirm">确定</el-button>
+      </span>
+    </el-dialog>
   </el-dialog>
 </template>
 
 <script>
+import { getUserList } from '@/api/approvalProcess'
+
 export default {
   name: 'NodeDialog',
   props: {
@@ -73,7 +116,6 @@ export default {
       dialogVisible: false,
       form: {
         nodeOrder: 1,
-        nodeCode: '',
         nodeName: '',
         approverType: '1',
         approverIds: '',
@@ -82,10 +124,14 @@ export default {
       },
       rules: {
         nodeOrder: [{ required: true, message: '请输入节点顺序', trigger: 'blur' }],
-        nodeCode: [{ required: true, message: '请输入节点编码', trigger: 'blur' }],
         nodeName: [{ required: true, message: '请输入节点名称', trigger: 'blur' }],
-        approverIds: [{ required: true, message: '请输入审批人ID', trigger: 'blur' }]
+        approverIds: [{ required: true, message: '请选择审批人', trigger: 'change' }]
-      }
+      },
+      selectedApprovers: [],
+      userListDialogVisible: false,
+      userList: [],
+      selectedUserIds: [],
+      userListLoading: false
     }
   },
   watch: {
@@ -93,10 +139,80 @@ export default {
       this.dialogVisible = val
       if (val) {
         this.form = JSON.parse(JSON.stringify(this.nodeData))
+        this.initSelectedApprovers()
       }
     }
   },
   methods: {
+    // 初始化已选择的审批人
+    initSelectedApprovers() {
+      if (this.form.approverIds) {
+        const ids = this.form.approverIds.split(',').map(id => id.trim())
+        this.selectedUserIds = ids
+        this.loadUserList()
+      } else {
+        this.selectedApprovers = []
+        this.selectedUserIds = []
+      }
+    },
+    // 加载用户列表
+    loadUserList() {
+      this.userListLoading = true
+      return getUserList({ pageNum: 1, pageSize: 1000 })
+        .then(res => {
+          this.userList = res.rows || []
+          // 根据已选择的ID过滤出已选择的用户
+          this.selectedApprovers = this.userList.filter(user =>
+            this.selectedUserIds.includes(String(user.userId))
+          )
+        })
+        .catch(error => {
+          console.error('加载用户列表失败:', error)
+          this.$message.error('加载用户列表失败')
+        })
+        .finally(() => {
+          this.userListLoading = false
+        })
+    },
+    // 打开用户选择对话框
+    handleSelectApprover() {
+      this.userListDialogVisible = true
+      this.loadUserList().then(() => {
+        // 预先选中已选择的用户
+        this.$nextTick(() => {
+          if (this.$refs.userTable && this.selectedApprovers.length > 0) {
+            this.selectedApprovers.forEach(approver => {
+              const user = this.userList.find(u => u.userId === approver.userId)
+              if (user) {
+                this.$refs.userTable.toggleRowSelection(user)
+              }
+            })
+          }
+        })
+      })
+    },
+    // 移除已选择的审批人
+    handleRemoveApprover(userId) {
+      this.selectedApprovers = this.selectedApprovers.filter(u => u.userId !== userId)
+      this.selectedUserIds = this.selectedApprovers.map(u => String(u.userId))
+      this.updateApproverIds()
+    },
+    // 更新审批人ID
+    updateApproverIds() {
+      this.form.approverIds = this.selectedUserIds.join(',')
+    },
+    // 用户表格选择变化
+    handleUserSelectionChange() {
+      // 这个方法用于跟踪表格选择变化
+    },
+    // 用户列表对话框确定
+    handleUserListConfirm() {
+      const selectedUsers = this.$refs.userTable.selection || []
+      this.selectedApprovers = selectedUsers
+      this.selectedUserIds = selectedUsers.map(u => String(u.userId))
+      this.updateApproverIds()
+      this.userListDialogVisible = false
+    },
     handleSubmit() {
       this.$refs.form.validate(valid => {
         if (!valid) return

src/views/system/approval/components/ProcessDialog.vue

@@ -7,9 +7,6 @@
     @close="handleClose"
   >
     <el-form ref="form" :model="form" :rules="rules" label-width="120px">
-      <el-form-item label="流程编码" prop="processCode">
-        <el-input v-model="form.processCode" placeholder="请输入流程编码" :disabled="isEdit" />
-      </el-form-item>
       <el-form-item label="流程名称" prop="processName">
         <el-input v-model="form.processName" placeholder="请输入流程名称" />
       </el-form-item>
@@ -42,7 +39,8 @@
               {{ scope.row.approverType === '1' ? '用户' : '角色' }}
             </template>
           </el-table-column>
-          <el-table-column prop="approverIds" label="审批人ID" min-width="80" show-overflow-tooltip />
+<!--          <el-table-column prop="approverIds" label="审批人ID" min-width="80" show-overflow-tooltip />-->
+          <el-table-column prop="name" label="审批人" min-width="80" show-overflow-tooltip />
           <el-table-column prop="approveMode" label="审批模式" width="100">
             <template slot-scope="scope">
               {{ scope.row.approveMode === '1' ? '或签' : '会签' }}
@@ -109,7 +107,6 @@ export default {
       currentNodeIndex: -1,
       form: {
         id: '',
-        processCode: '',
         processName: '',
         businessType: '',
         description: '',
@@ -117,7 +114,6 @@ export default {
         nodeList: []
       },
       rules: {
-        processCode: [{ required: true, message: '请输入流程编码', trigger: 'blur' }],
         processName: [{ required: true, message: '请输入流程名称', trigger: 'blur' }],
         businessType: [{ required: true, message: '请选择业务类型', trigger: 'change' }]
       }
@@ -131,7 +127,6 @@ export default {
       } else if (val) {
         this.form = {
           id: '',
-          processCode: '',
           processName: '',
           businessType: '',
           description: '',
@@ -153,7 +148,6 @@ export default {
       this.currentNode = {
         nodeOrder: this.form.nodeList.length + 1,
         nodeName: '',
-        nodeCode: '',
         approverType: '1',
         approverIds: '',
         approveMode: '1',

src/views/system/approval/detail.vue

@@ -4,9 +4,6 @@
       <!-- 基本信息 -->
       <div class="section-title">基本信息</div>
       <el-form :model="process" label-width="120px" :inline="true">
-        <el-form-item label="流程编码">
-          <el-input v-model="process.processCode" disabled />
-        </el-form-item>
         <el-form-item label="流程名称">
           <el-input v-model="process.processName" disabled />
         </el-form-item>
@@ -29,7 +26,7 @@
       <div class="section-title" style="margin-top: 30px">审批节点配置</div>
       <el-table :data="process.nodeList" border stripe height="546" style="margin-top: 10px">
         <el-table-column prop="nodeOrder" label="节点顺序" width="80" />
-        <el-table-column prop="nodeCode" label="节点编码" width="120" />
+<!--        <el-table-column prop="nodeCode" label="节点编码" width="120" />-->
         <el-table-column prop="nodeName" label="节点名称" min-width="150" />
         <el-table-column prop="approverType" label="审批人类型" width="100">
           <template slot-scope="scope">
@@ -82,7 +79,6 @@ export default {
       dialogVisible: false,
       process: {
         id: '',
-        processCode: '',
         processName: '',
         businessType: '',
         description: '',

src/views/system/approval/index.vue

@@ -47,13 +47,13 @@
       >
         <el-table-column align="center" label="序号" type="index" width="60"/>
 <!--        <el-table-column prop="id" label="ID" width="60" />-->
-        <el-table-column prop="processCode" align="center" label="流程编码" width="220" />
         <el-table-column prop="processName" align="center" label="流程名称" min-width="100" />
         <el-table-column prop="businessType" align="center" label="业务类型" width="150">
           <template slot-scope="scope">
             {{ getBusinessTypeLabel(scope.row.businessType) }}
           </template>
         </el-table-column>
+        <el-table-column prop="orgName" align="center" label="归属机构" min-width="100" />
         <el-table-column prop="description" align="center" label="流程描述" min-width="180" show-overflow-tooltip />
         <el-table-column prop="status" align="center" label="状态" width="80">
           <template slot-scope="scope">
@@ -66,7 +66,7 @@
         <el-table-column align="center" label="操作" width="160" fixed="right">
           <template slot-scope="scope">
             <el-button type="primary" size="mini" @click="handleEdit(scope.row)">编辑</el-button>
-            <el-button type="info" size="mini" @click="handleView(scope.row)">查看</el-button>
+<!--            <el-button type="info" size="mini" @click="handleView(scope.row)">查看</el-button>-->
             <!-- <el-button type="danger" size="mini" @click="handleDeleteOne(scope.row)">删除</el-button> -->
           </template>
         </el-table-column>