优化角色选择

src/pages/system/list/staff.vue

@@ -52,7 +52,7 @@
                     <el-input v-model.trim="teacherForm.userName" placeholder="请输入员工姓名"></el-input>
                 </el-form-item>
                 <el-form-item prop="roleValue" label="账号角色">
-                    <el-select v-model="teacherForm.roleValue" @change="roleChange" multiple placeholder="请选择" style="width: 100%">
+                    <el-select v-model="teacherForm.roleValue" @change="roleChange" @remove-tag="roleRemove" multiple style="width: 100%">
                         <el-option
                             v-for="item in roleList"
                             :key="item.id"
@@ -401,17 +401,16 @@ export default {
                 }
             }
         },
-        roleChange(value) { // 切换角色
-            // console.log(value);
+        roleChange(value) { // 处理切换角色
             if (value.length) {
-                this.teacherForm.roleAndDeptList.splice(0);
+                let ids = this.teacherForm.roleAndDeptList.map(e => e.roleId);
                 this.roleList.forEach(i => {
                     let obj = {
                         roleId: "",
                         roleName: "",
                         cascaderValue: []
                     };
-                    if (value.includes(i.id)) {
+                    if (value.includes(i.id) && !ids.includes(i.id)) {
                         obj.roleId = i.id;
                         obj.roleName = i.roleName;
                         this.teacherForm.roleAndDeptList.push(obj);
@@ -421,6 +420,12 @@ export default {
                 this.teacherForm.roleAndDeptList.splice(0);
             }
         },
+        roleRemove(value) { // 处理移除角色
+            let index = this.teacherForm.roleAndDeptList.findIndex(i => i.roleId === value);
+            if (index !== -1) {
+                this.teacherForm.roleAndDeptList.splice(index, 1);
+            }
+        },
         async saveSure(teacherForm) {
             this.$refs[teacherForm].validate((valid) => {
                 if (valid) {