@lambo-design-mobile/workflow-approve 1.0.0-beta.1 → 1.0.0-beta.3

package/CHANGELOG.md

@@ -1,8 +1,12 @@
 # Changelog
-## 1.0.0-beta.1 (2024-10-09)
+## [1.0.0-beta.3](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design-mobile/workflow-approve@1.0.0-beta.2...@lambo-design-mobile/workflow-approve@1.0.0-beta.3) (2024-11-04)
 
+## [1.0.0-beta.2](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design-mobile/workflow-approve@1.0.0-beta.1...@lambo-design-mobile/workflow-approve@1.0.0-beta.2) (2024-10-10)
 
-### ✨ Features | 新功能
-
-* **@lambo-design-mobile/workflow-approve:** 新增流程中心移动端组件 ([bcdf45c](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/commit/bcdf45cb682e1ea5f3205b473a2c04060a660460))
-* **@lambo-design-mobile/workflow-approve:** 新增流程中心移动端组件 ([14df440](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/commit/14df44002a9b20f6cb979bebc8902b5cd78bb57f))
+## 1.0.0-beta.1 (2024-10-09)
+
+
+### ✨ Features | 新功能
+
+* **@lambo-design-mobile/workflow-approve:** 新增流程中心移动端组件 ([bcdf45c](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/commit/bcdf45cb682e1ea5f3205b473a2c04060a660460))
+* **@lambo-design-mobile/workflow-approve:** 新增流程中心移动端组件 ([14df440](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/commit/14df44002a9b20f6cb979bebc8902b5cd78bb57f))

package/README.md

@@ -1,39 +1,3 @@
 # 工作流
-
-### 介绍
-
-
-
-### 引入
-
-``` javascript
-
-```
-
-## 代码演示
-
-### 基础用法
-
-```html
-```
-
-```javascript
-
-
-```
-
- 
-
-      
-### Props
-
-| 参数               | 说明                | 类型      | 默认值              | 版本 |
-|------------------|-------------------|---------|------------------|----|
-
-
-
-### Events
-
-| 事件名 | 说明         | 回调参数  |
-|------------------|------------|-------|
-
+【腾讯文档】移动端工作流组件库
+https://docs.qq.com/aio/DRGlBZFd5UVRWQU9C

package/api.js

@@ -243,6 +243,17 @@ export const batchApproval = (status, flowIds, auditOpinion) => {
     }));
 }
 
+export const getProcessType = (proType) => {
+    const params = {
+        proType: proType,
+    };
+    return ajax.request({
+        url: config.smartFlowServerContext + "/manage/processType/lists",
+        method: 'get',
+        params: params
+    })
+}
+
 export const getUserList = (offset, limit, searchForm = {}) => {
 
     // 处理 searchForm 的各个字段，确保即使未传值也有默认空字符串
@@ -250,7 +261,7 @@ export const getUserList = (offset, limit, searchForm = {}) => {
         offset: offset,
         limit: limit,
         orgTreeType: "00",
-        permScopeList: "all",
+        permScopeList: searchForm.permScopeList || 'all',
         userId: searchForm.userId || '',
         userName: searchForm.userName || '',
         organId: searchForm.organId || '',
@@ -274,4 +285,45 @@ export const getOrgRootTree = () => {
         method: 'get',
         params: params,
     });
+}
+
+export const getOrgSubNodes = (organCode) => {
+    const params = {
+        treeTypeId: "00",
+        organCode: organCode,
+    };
+    return ajax.request({
+        url: config.upmsServerContext + "/manage/ucOrgan/getOrgSubNodes",
+        method: 'get',
+        params: params,
+    });
+}
+
+export const getPosition = (positionId) => {
+    const params = {
+        positionId: positionId,
+    };
+    return ajax.request({
+        url: config.smartFlowServerContext + "/manage/position/get",
+        method: 'get',
+        params: params
+    })
+}
+
+export const getRole = (roleId) => {
+    return ajax.request({
+        url: config.upmsServerContext + "/manage/role/get/" + roleId,
+        method: 'get',
+    })
+}
+
+export const getOrgan = (organId) => {
+    const data = {
+        orgTreeType: "00",
+    };
+    return ajax.request({
+        url: config.upmsServerContext + "/manage/org/get/" + organId,
+        method: 'post',
+        data
+    })
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lambo-design-mobile/workflow-approve",
-  "version": "1.0.0-beta.1",
+  "version": "1.0.0-beta.3",
   "description": "",
   "main": "index.js",
   "author": "lambo",
@@ -14,8 +14,8 @@
   },
   "devDependencies": {
     "@lambo-design-mobile/lambo-scan-code": "^1.0.0-beta.1",
-    "@lambo-design-mobile/upload-file": "^1.0.0-beta.9",
-    "@lambo-design-mobile/shared": "^1.0.0-beta.8"
+    "@lambo-design-mobile/shared": "^1.0.0-beta.9",
+    "@lambo-design-mobile/upload-file": "^1.0.0-beta.9"
   },
   "scripts": {
     "release": "pnpm release-beta && git push --follow-tags && pnpm re-publish",

package/src/FlowApproval.vue

@@ -195,18 +195,18 @@
                   :is-link="true" :arrow-direction="detailsVisible[index] ? 'down' : ''">
         </van-cell>
         <div v-if="detailsVisible[index] && item.personType === 'candidate'">
-          <van-cell @click="clickCandidateGroup()" title-style="padding-left:10px" title="候选用户"
-                    :value="(item.candidateGroups?.users ?? []).map(user => user.name).join(',')">
-          </van-cell>
-          <van-cell @click="clickCandidateGroup()" title-style="padding-left:10px" title="候选岗位"
-                    :value="(item.candidateGroups?.positions ?? []).map(position => position.name).join(',')">
-          </van-cell>
-          <van-cell @click="clickCandidateGroup()" title-style="padding-left:10px" title="候选角色"
-                    :value="(item.candidateGroups?.roles ?? []).map(role => role.name).join(',')">
-          </van-cell>
-          <van-cell @click="clickCandidateGroup()" title-style="padding-left:10px" title="候选组织"
-                    :value="(item.candidateGroups?.organs ?? []).map(organ => organ.name).join(',')">
-          </van-cell>
+          <van-field @click="handleSelectUserPopupShow(index)" label="候选用户" readonly placeholder="点击选择"
+                     :value="(item.candidateGroups?.users ?? []).map(user => user.name).join(',')">
+          </van-field>
+          <van-field @click="handleSelectPositionPopupShow(index)" label="候选岗位" readonly placeholder="点击选择"
+                     :value="(item.candidateGroups?.positions ?? []).map(position => position.name).join(',')">
+          </van-field>
+          <van-field @click="handleSelectRolePopupShow(index)" label="候选角色" readonly placeholder="点击选择"
+                     :value="(item.candidateGroups?.roles ?? []).map(role => role.name).join(',')">
+          </van-field>
+          <van-field @click="handleSelectOrganizePopupShow(index)" label="候选组织" readonly placeholder="点击选择"
+                     :value="(item.candidateGroups?.organs ?? []).map(organ => organ.name).join(',')">
+          </van-field>
         </div>
         <van-cell center title="停留时间">
           <template #default>
@@ -260,9 +260,25 @@
         <div class="bar-item approve" @click="handleSelect('select')">确认</div>
       </div>
     </van-popup>
-    <van-popup v-model="selectHandlePopupShow" closeable round position="bottom"
+    <van-popup v-if="selectHandlePopupShow" v-model="selectHandlePopupShow" closeable round position="bottom"
                :style="{ height: '80%' }" style="background: #f7f8fa">
-      <select-handle @selectHandle="handleSelectResult"></select-handle>
+      <select-handle title="指定办理人" :multi-select="false" :procType="procType" @selectHandle="handleSelectResult"></select-handle>
+    </van-popup>
+    <van-popup v-if="selectOrganizePopupShow" v-model="selectOrganizePopupShow" closeable round position="bottom"
+               :style="{ height: '80%' }">
+      <select-organize ref="selectOrganize" :all-organize="false" :organize-id-list="permissionsScope.O"  @selectOrganizeHandle="selectOrganizeHandle" ></select-organize>
+    </van-popup>
+    <van-popup v-if="selectUserPopupShow" v-model="selectUserPopupShow" closeable round position="bottom"
+               :style="{ height: '80%' }">
+      <select-handle title="选择用户" :multi-select="true" :procType="procType" @selectHandle="selectUserHandle" ></select-handle>
+    </van-popup>
+    <van-popup v-if="selectPositionPopupShow" v-model="selectPositionPopupShow" closeable round position="bottom"
+               :style="{ height: '80%' }">
+      <select-normal-list title="选择岗位" :id-list="permissionsScope.P" @selectNormalListHandle="selectPositionHandle" :parse-function="parsePositionFunction"></select-normal-list>
+    </van-popup>
+    <van-popup v-if="selectRolePopupShow" v-model="selectRolePopupShow" closeable round position="bottom"
+               :style="{ height: '80%' }">
+      <select-normal-list title="选择角色" :id-list="permissionsScope.R" @selectNormalListHandle="selectRoleHandle" :parse-function="parseRoleFunction"></select-normal-list>
     </van-popup>
     <van-dialog v-model="nodeListDialogShow" @confirm="processJumpSpecifiedNode()" @close="nodeListDialogShowClose()"
                 :title="getAuditButtonStatus(auditResult)" show-cancel-button>
@@ -297,18 +313,24 @@
 
 <script>
 import {
-  audit, config,
+  audit,
+  config,
   getAllPreNodes,
   getAttachmentList,
   getNextNodes,
   getNodesBehind,
+  getPosition,
   getPreNode,
-  getProcessHis
+  getProcessHis,
+  getProcessType, getRole
 } from "../api";
 import {Dialog, Toast} from "vant";
 import UploadFile from '@lambo-design-mobile/upload-file';
 import {flutterUtil} from "./utils/flutterUtil";
 import SelectHandle from "./SelectHandle.vue";
+import Tree from "./tree/Tree.vue";
+import SelectOrganize from "./SelectOrganize.vue";
+import SelectNormalList from "./SelectNormalList.vue";
 
 
 export default {
@@ -317,7 +339,7 @@ export default {
       return config
     }
   },
-  components: {SelectHandle, UploadFile},
+  components: {SelectNormalList, SelectOrganize, Tree, SelectHandle, UploadFile},
   props: {
     //业务表单保存方法
     businessFormSave: {
@@ -348,6 +370,7 @@ export default {
       //初始化路由数据
       taskNode: this.$route.query.taskNode,
       procId: this.$route.query.procId,
+      procType: this.$route.query.procType,
       instanceId: this.$route.query.instanceId,
       applyId: this.$route.query.applyId,
       formUrl: this.$route.query.formUrl,
@@ -404,7 +427,13 @@ export default {
       //给附件列表展示
       files: [],
       //文件上传列表
-      fileList: []
+      fileList: [],
+
+      permissionsScope: {},
+      selectOrganizePopupShow: false,
+      selectUserPopupShow: false,
+      selectRolePopupShow: false,
+      selectPositionPopupShow: false,
     };
   },
   methods: {
@@ -412,6 +441,7 @@ export default {
       this.getProcessHistory();
       this.getNextNodes();
       this.getAttachmentList();
+      this.getProcessTypeList();
       //设置提示持续时间默认为500ms
       Toast.setDefaultOptions({duration: 500});
     },
@@ -434,6 +464,77 @@ export default {
         }
       })
     },
+    getProcessTypeList() {
+      getProcessType(this.procType).then(res => {
+        let permScope = res.data.data.rows[0].permScope;
+        this.permissionsScope = this.extractPermissions(permScope);
+      });
+    },
+    extractPermissions(permScope) {
+      const permissions = {};
+
+      // 使用正则分别匹配 O、U、P 和 R
+      const oMatch = permScope.match(/O:([^,]*)/);
+      const uMatch = permScope.match(/U:([^,]*)/);
+      const pMatch = permScope.match(/P:([^,]*)/);
+      const rMatch = permScope.match(/R:([^,]*)/);
+
+      // 分别解析 O、U、P 和 R 权限
+      permissions.O = oMatch && oMatch[1] ? oMatch[1].split(';') : [];
+      permissions.U = uMatch && uMatch[1] ? uMatch[1].split(';') : [];
+      permissions.P = pMatch && pMatch[1] ? pMatch[1].split(';') : [];
+      permissions.R = rMatch && rMatch[1] ? rMatch[1].split(';') : [];
+
+      return permissions;
+    },
+    async parsePositionFunction(idList) {
+      try {
+        // 并行调用 getPosition 方法
+        return await Promise.all(
+            idList.map(async (id) => {
+              const response = await getPosition(id);
+              const result = response.data; // 假设响应的主体包含在 data 中
+
+              // 返回 { id, name } 对象
+              return {
+                id: id,
+                name: result.data.positionName || `Unknown Name for ${id}`, // 使用返回数据中的 name，若无则提供默认值
+              };
+            })
+        ); // 返回解析结果数组
+      } catch (error) {
+        console.error('Error fetching positions:', error);
+        // 在错误情况下返回默认结构
+        return idList.map((id) => ({
+          id: id,
+          name: `Unknown Name for ${id}`,
+        }));
+      }
+    },
+    async parseRoleFunction(idList) {
+      try {
+        // 并行调用 getPosition 方法
+        return await Promise.all(
+            idList.map(async (id) => {
+              const response = await getRole(id);
+              const result = response.data; // 假设响应的主体包含在 data 中
+
+              // 返回 { id, name } 对象
+              return {
+                id: id,
+                name: result.data.name || `Unknown Name for ${id}`, // 使用返回数据中的 name，若无则提供默认值
+              };
+            })
+        ); // 返回解析结果数组
+      } catch (error) {
+        console.error('Error fetching positions:', error);
+        // 在错误情况下返回默认结构
+        return idList.map((id) => ({
+          id: id,
+          name: `Unknown Name for ${id}`,
+        }));
+      }
+    },
     processData(data) {
       return data.map(node => {
         node.personType = node.assignee ? "assignee" : "candidate";
@@ -527,6 +628,22 @@ export default {
         this.nextNodePopupShow = false;
       }
     },
+    handleSelectOrganizePopupShow(index) {
+      this.nextNodeHandleIndex = index;
+      this.selectOrganizePopupShow=true;
+    },
+    handleSelectUserPopupShow(index) {
+      this.nextNodeHandleIndex = index;
+      this.selectUserPopupShow=true;
+    },
+    handleSelectRolePopupShow(index) {
+      this.nextNodeHandleIndex = index;
+      this.selectRolePopupShow = true;
+    },
+    handleSelectPositionPopupShow(index) {
+      this.nextNodeHandleIndex = index;
+      this.selectPositionPopupShow = true;
+    },
     getAttachmentList() {
       getAttachmentList(this.procId, this.applyId).then(resp => {
         if (resp.data.code === '200') {
@@ -604,6 +721,8 @@ export default {
         query: {
           applyId: this.applyId,
           procId: this.procId,
+          instanceId: this.instanceId,
+          taskNode: this.taskNode,
         }
       })
     },
@@ -821,6 +940,44 @@ export default {
       }
       self.selectHandlePopupShow = false;
     },
+    selectOrganizeHandle(handle, checkedNodes) {
+      if (handle === 'select') {
+        this.nextNodeProcessedData[this.nextNodeHandleIndex].candidateGroups.organs =
+            checkedNodes.map(item => ({
+              name: item.node.title,
+              id: item.node.id,
+            }));
+      }
+      this.selectOrganizePopupShow = false
+    },
+    selectUserHandle(checkResult) {
+      this.nextNodeProcessedData[this.nextNodeHandleIndex].candidateGroups.users =
+          checkResult.map(item => ({
+            name: item.userName,
+            id: item.userId,
+          }));
+      this.selectUserPopupShow = false;
+    },
+    selectPositionHandle(handle, result) {
+      if (handle === 'select') {
+        this.nextNodeProcessedData[this.nextNodeHandleIndex].candidateGroups.positions =
+            result.map(item => ({
+              name: item.name,
+              id: item.id,
+            }));
+      }
+      this.selectPositionPopupShow = false
+    },
+    selectRoleHandle(handle, result) {
+      if (handle === 'select') {
+        this.nextNodeProcessedData[this.nextNodeHandleIndex].candidateGroups.roles =
+            result.map(item => ({
+              name: item.name,
+              id: item.id,
+            }));
+      }
+      this.selectRolePopupShow = false
+    },
   },
   activated() {
     this.updateActiveTab();

package/src/SelectHandle.vue

@@ -2,7 +2,7 @@
   <div>
     <div id="headTitle" class="headTitle">
       <div class="van-nav-bar__content">
-        <div class="van-nav-bar__title">指定办理人</div>
+        <div class="van-nav-bar__title">{{title}}</div>
       </div>
       <van-search
           show-action
@@ -28,8 +28,8 @@
                :overlay-style="{ position:'absolute',marginTop: '104px'}" transition="none">
       <div style="padding: 12px">
         <van-form>
-          <van-field clearable v-model="searchForm.organId" label="组织ID" readonly />
-          <van-field clearable v-model="searchForm.organTitle" label="组织名称" readonly />
+          <van-field clearable @click="searchOrganShow = true" v-model="searchForm.organId" label="组织ID" readonly />
+          <van-field clearable @click="searchOrganShow = true" v-model="searchForm.organTitle" label="组织名称" readonly />
           <van-field clearable v-model="searchForm.userId" label="用户ID" placeholder="请输入用户ID"/>
           <van-field name="radio" label="是否管理员">
             <template #input>
@@ -47,12 +47,12 @@
         </van-form>
       </div>
     </van-popup>
-    <div id="listContent">
+    <div id="listContent" style="background: #f7f8fa">
       <van-list v-model="loading" style="padding-top: 15px"
                 :finished="finished"
                 finished-text="没有更多了"
                 @load="handleLoad()">
-        <select-handle-card ref="selectHandleCard" :person-list="personList.rows"
+        <select-handle-card ref="selectHandleCard" :multi-select="multiSelect" :person-list="personList.rows"
                             :result.sync="checkResult">
         </select-handle-card>
       </van-list>
@@ -61,23 +61,45 @@
       <div class="bar-item" @click="handleSelect('cancel')">取消</div>
       <div class="bar-item approve" @click="handleSelect('select')">选择</div>
     </div>
+
+    <van-popup v-model="searchOrganShow" closeable round position="bottom" :style="{ height: '80%' }">
+      <select-organize :all-organize="true" :show-check-box="false" @handleSelect="onSelect" ></select-organize>
+    </van-popup>
   </div>
 </template>
 
 <script>
 import SelectHandleCard from "./SelectHandleCard.vue";
-import {getOrgRootTree, getUserList} from "../api";
+import {getOrgRootTree, getProcessType, getUserList} from "../api";
+import Tree from "./tree/Tree.vue";
+import SelectOrganize from "./SelectOrganize.vue";
 
 export default {
   name: "SelectHandle",
-  components: {SelectHandleCard},
+  components: {SelectOrganize, Tree, SelectHandleCard},
+  props: {
+    title: {
+      type: String,
+      default: ''
+    },
+    procType: {
+      type: String,
+      required: true
+    },
+    multiSelect: {  // 新增一个 prop 来控制是否开启多选模式
+      type: Boolean,
+      default: false
+    }
+  },
   data() {
     return {
+      searchOrganShow: false,
       searchFilterShow: false,
       searchFilterBadge: false,
       searchForm: {
         userId: '',
         userName: '',
+        permScopeList: '',
         organId: '',
         organTitle: '',
         directChild: '',
@@ -91,43 +113,64 @@ export default {
         rows: []
       },
       checkResult: [],  // 需要传递到子组件的 checkResult
-    }
+    };
+  },
+  mounted() {
+    this.initSearch();
   },
   methods: {
-    handleLoad() {
-      console.log("触发加载")
+    initSearch() {
       getOrgRootTree().then(res => {
         const result = res.data;
         if (result.code === 1) {
           this.searchForm.organId = result.data[0].organId;
           this.searchForm.organTitle = result.data[0].organName;
+        }
+        this.handleLoad()
+      })
+    },
+    handleLoad() {
+      console.log("触发加载")
+      const offset = this.personList.rows.length;
+      const limit = 10;
 
-          const offset = this.personList.rows.length;
-          const limit = 10;
-
-          getUserList(offset, limit, this.searchForm).then(res => {
-
-            const result = res.data;
-            if (result.code === "1") {
+      getProcessType(this.procType).then(res => {
 
-              //返回的数据添加到 personList 中
-              this.personList.rows = this.personList.rows.concat(result.data.rows);
-              this.personList.total = result.data.total;
+        const userArray = this.extractUsers(res.data.data.rows[0].permScope);
+        console.log(userArray)
+        if (userArray.length > 0) {
+          this.searchForm.permScopeList = userArray.join(',')
+        }
+        getUserList(offset, limit, this.searchForm).then(res => {
 
-            } else {
-              console.error('Failed to load data');
-            }
+          const result = res.data;
+          if (result.code === "1") {
+            //返回的数据添加到 personList 中
+            this.personList.rows = this.personList.rows.concat(result.data.rows);
+            this.personList.total = result.data.total;
+          }
 
-            this.loading = false;
-            this.finished = this.personList.rows.length >= this.personList.total;
+          this.loading = false;
+          this.finished = this.personList.rows.length >= this.personList.total;
 
-          }).catch(error => {
-            console.error('Error fetching data:', error);
-            this.loading = false;
-          });
-        }
+        }).catch(error => {
+          console.error('Error fetching data:', error);
+          this.loading = false;
+        });
+      }).catch(error => {
+        console.error(error)
       })
     },
+
+    extractUsers(permScope) {
+      const match = permScope.match(/U:([^,]+)/);
+      if (match && match[1]) {
+        return match[1].split(';');
+      } else {
+        return [];
+      }
+    },
+
     onSearch() {
       // 如果搜索弹框是打开的
       if (this.searchFilterShow) {
@@ -148,15 +191,7 @@ export default {
       }
     },
     resetSearch() {
-      // 遍历 searchForm 对象的每个属性，将其值置为空
-      for (let key in this.searchForm) {
-        // eslint-disable-next-line no-prototype-builtins
-        if (this.searchForm.hasOwnProperty(key)) {
-          if (key !== "organId" && key !== "organTitle") {
-            this.searchForm[key] = '';
-          }
-        }
-      }
+      this.initSearch()
     },
     resetAndLoadPersonList() {
       this.personList.total = 0;
@@ -174,6 +209,12 @@ export default {
     checkSearchForm() {
       this.searchFilterBadge = Object.values(this.searchForm).some(value => value !== '');
     },
+
+    onSelect(v) {
+      this.searchForm.organId = v.id;
+      this.searchForm.organTitle = v.title;
+      this.searchOrganShow = false;
+    },
   },
   watch: {
     // 监听 searchForm 的每一个字段的变化
@@ -265,6 +306,7 @@ export default {
   color: #fff;
   background: linear-gradient(90deg, #0096FF, #1677FF);
   border-radius: 9px;
+  margin: 0 20px;
 }
 
 .approve:active {