用户选择多角色支持

src/modules/base/components/SelectUserDialog.vue

@@ -41,18 +41,22 @@
             ref="UserTree"
             :data="userTree"
             node-key="id"
+            :default-checked-keys="selectedUserIds"
             :props="defaultProps"
-            @check-change="userChange"
           >
             <span class="custom-tree-node" slot-scope="{ node, data }">
-              <el-checkbox v-if="data.isUser" v-model="node.checked">
+              <el-checkbox
+                v-if="data.isUser"
+                v-model="node.checked"
+                @change="checked => userChange(checked, data)"
+              >
                 {{ node.label }}
               </el-checkbox>
               <span v-else>{{ node.label }}</span>
               <el-checkbox
                 v-if="!data.isUser && canSelectAll && data.children.length"
                 v-model="data.selected"
-                @change="val => selectNodeAll(val, data)"
+                @change="checked => selectNodeAll(checked, data)"
               ></el-checkbox>
             </span>
           </el-tree>
@@ -80,7 +84,9 @@
     </p>
 
     <div slot="footer">
-      <el-button type="primary" @click="submit">确认</el-button>
+      <el-button type="primary" :disabled="!selectValid" @click="submit"
+        >确认</el-button
+      >
       <el-button @click="cancel">取消</el-button>
     </div>
   </el-dialog>
@@ -117,6 +123,7 @@ export default {
       userTree: [],
       userList: [],
       selectedUsers: [],
+      selectedRoleUserIds: [],
       selectedUserIds: [],
       selectValid: true,
       defaultProps: {
@@ -134,6 +141,7 @@ export default {
       let roleUserMap = {};
       const parseUser = list => {
         return list.map(item => {
+          // org
           let nitem = {
             id: item.id,
             label: item.name,
@@ -145,27 +153,36 @@ export default {
           if (item["children"] && item["children"].length) {
             nitem.children = [...nitem.children, ...parseUser(item.children)];
           }
+          // user
           if (item["sysUserList"] && item["sysUserList"].length) {
             const users = item.sysUserList.map(user => {
               const nuser = {
                 id: user.id,
+                userId: user.id,
                 label: user.realName,
                 name: user.realName,
                 orgName: item.name,
                 selected: false,
                 isUser: true
               };
-              if (!roleUserMap[user.roleId]) {
-                roleUserMap[user.roleId] = {
-                  id: user.roleId,
-                  label: user.roleName,
-                  selected: false,
-                  children: []
-                };
+              if (user.roleResultList && user.roleResultList.length) {
+                user.roleResultList.forEach(urole => {
+                  if (!roleUserMap[urole.roleId]) {
+                    roleUserMap[urole.roleId] = {
+                      id: urole.roleId,
+                      label: urole.roleName,
+                      selected: false,
+                      isUser: false,
+                      children: []
+                    };
+                  }
+
+                  let ruser = { ...nuser };
+                  ruser.id = `${ruser.id}_${this.$randomCode()}`;
+                  ruser.label = `${ruser.name}(${ruser.orgName})`;
+                  roleUserMap[urole.roleId].children.push(ruser);
+                });
               }
-              let ruser = { ...nuser };
-              ruser.label = `${ruser.name}(${ruser.orgName})`;
-              roleUserMap[user.roleId].children.push(ruser);
               return nuser;
             });
             nitem.children = [...nitem.children, ...users];
@@ -185,7 +202,11 @@ export default {
           if (item["children"] && item["children"].length) {
             fetchUser(item.children);
           } else {
-            if (item.isUser) userList.push({ ...item });
+            if (item.isUser) {
+              let nitem = { ...item };
+              nitem.label = `${nitem.name}(${nitem.orgName})`;
+              userList.push(nitem);
+            }
           }
         });
       };
@@ -195,19 +216,14 @@ export default {
     },
     labelChange() {
       if (!this.filterLabel) {
-        this.userTree = this.orgUsers;
+        this.switchUserType(this.userType);
       } else {
         const escapeRegexpString = (value = "") =>
           String(value).replace(/[|\\{}()[\]^$+*?.]/g, "\\$&");
         const reg = new RegExp(escapeRegexpString(this.filterLabel), "i");
 
-        this.userTree = this.userList
-          .filter(item => reg.test(item.name))
-          .map(item => {
-            let nitme = { ...item };
-            nitme.label = `${nitme.name}(${nitme.orgName})`;
-            return nitme;
-          });
+        this.userTree = this.userList.filter(item => reg.test(item.name));
+        this.$refs.UserTree.setCheckedKeys(this.selectedUserIds);
       }
     },
     checkValid() {
@@ -217,7 +233,8 @@ export default {
     },
     visibleChange() {
       this.filterLabel = "";
-      this.switchUserType(this.userType);
+      this.userType = "org";
+      this.userTree = this.orgUsers;
       this.selectedUsers = this.users.map(user => {
         const luser = this.userList.find(item => item.id === user.id);
         return {
@@ -244,7 +261,7 @@ export default {
           if (item.children && item.children.length) {
             getUserIds(item.children);
           } else {
-            if (item.isUser) userIds.push(item.id);
+            if (item.isUser) userIds.push(item.userId);
           }
         });
       };
@@ -261,13 +278,38 @@ export default {
           }
         }
       });
-      this.$refs.UserTree.setCheckedKeys(this.selectedUserIds);
+      if (this.userType === "role") {
+        this.updateSelectRoleUserIds();
+      } else {
+        this.$refs.UserTree.setCheckedKeys(this.selectedUserIds);
+      }
+      this.updateSelectedUsersFromUserIds();
     },
     switchUserType(type) {
       this.userType = type;
       this.userTree = type === "org" ? this.orgUsers : this.roleUsers;
+
+      if (type === "role") {
+        this.updateSelectRoleUserIds();
+      }
+    },
+    updateSelectRoleUserIds() {
+      let selectedRoleUserIds = [];
+      this.roleUsers.forEach(role => {
+        role.children.forEach(user => {
+          if (this.selectedUserIds.includes(user.userId))
+            selectedRoleUserIds.push(user.id);
+        });
+      });
+      this.selectedRoleUserIds = selectedRoleUserIds;
+      this.$refs.UserTree.setCheckedKeys(selectedRoleUserIds);
+    },
+    updateSelectedUsersFromUserIds() {
+      this.selectedUsers = this.userList.filter(user =>
+        this.selectedUserIds.includes(user.id)
+      );
     },
-    userChange() {
+    userChange(checked, curUser) {
       if (this.filterLabel) {
         let prevSelectUserIds = this.selectedUsers.map(item => item.id);
         const prevUserListSelectUserIds = this.userTree
@@ -292,7 +334,12 @@ export default {
           };
           this.selectedUsers.push(nuser);
         });
-      } else {
+        this.selectedUserIds = this.selectedUsers.map(item => item.id);
+        this.checkValid();
+        return;
+      }
+
+      if (this.userType === "org") {
         const selectedUsers = this.$refs.UserTree.getCheckedNodes(true);
         this.selectedUsers = selectedUsers.map(user => {
           const nuser = {
@@ -302,16 +349,34 @@ export default {
           };
           return nuser;
         });
+        this.selectedUserIds = this.selectedUsers.map(item => item.id);
+        this.checkValid();
+        return;
+      }
+
+      if (this.userType === "role") {
+        if (checked) {
+          if (!this.selectedUserIds.includes(curUser.userId))
+            this.selectedUserIds.push(curUser.userId);
+        } else {
+          this.selectedUserIds = this.selectedUserIds.filter(
+            userid => userid !== curUser.userId
+          );
+        }
+        this.updateSelectRoleUserIds();
+        this.updateSelectedUsersFromUserIds();
+        this.checkValid();
       }
-      // console.log(this.selectedUsers);
-      this.selectedUserIds = this.selectedUsers.map(item => item.id);
-      this.checkValid();
     },
     toDeleteUser(user) {
       const pos = this.selectedUsers.findIndex(item => item.id === user.id);
       this.selectedUsers.splice(pos, 1);
       this.selectedUserIds = this.selectedUsers.map(item => item.id);
-      this.$refs.UserTree.setCheckedKeys(this.selectedUserIds);
+      if (this.userType === "role") {
+        this.updateSelectRoleUserIds();
+      } else {
+        this.$refs.UserTree.setCheckedKeys(this.selectedUserIds);
+      }
       this.checkValid();
     },
     submit() {

src/modules/exam/components/createExamAndPrintTask/InfoExamTask.vue

@@ -417,7 +417,9 @@ export default {
     examChange(val) {
       console.log(val);
       this.examTask.examModel = val.examModel;
-      this.updateTaskInfo({ infoExamTask: this.examTask });
+      this.examTaskDetail.cardId = "";
+      this.cards = [];
+      this.getCardList();
     },
     teachingRoomChange() {
       this.examTask.courseCode = "";