From 3546af0d5bc680e6393519f660c30a00af50cdb6 Mon Sep 17 00:00:00 2001
From: aBin <binbin0314@126.com>
Date: Fri, 7 Jan 2022 18:38:22 +0800
Subject: [PATCH] =?UTF-8?q?=E5=85=B3=E8=81=94=E8=A7=92=E8=89=B2=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/RightPage/RightPage.vue    | 149 ++++++++++++++--------
 src/components/RightPage/TreeNode.vue     |  64 ++++------
 src/components/RightPage/TreeNodeCopy.vue |  54 +++-----
 src/config/api.js                         |  16 ++-
 4 files changed, 151 insertions(+), 132 deletions(-)

diff --git a/src/components/RightPage/RightPage.vue b/src/components/RightPage/RightPage.vue
index bc6c334..f9caf56 100644
--- a/src/components/RightPage/RightPage.vue
+++ b/src/components/RightPage/RightPage.vue
@@ -24,13 +24,10 @@
         v-if="treeData.length"
         :tree-data="treeData"
         @showAddItem="showAddItem"
-        @showEditItem="showEditItem"
-        @showAddMember="showAddMember"
-        @showEditMember="showEditMember"
         @changeRole="changeRole"
         @editPositionModal="editPositionModal"
         @editDepartmentModal="editDepartmentModal"
-        @getHospitalInfo = "getHospitalInfo"
+        @getHospitalInfo="getHospitalInfo"
       />
     </div>
     <a-modal :visible="visible" title="添加部门" @cancel="visible = false" @ok="addDepartment">
@@ -41,18 +38,13 @@
       </a-form>
       {{ addId }}
     </a-modal>
-    <a-modal :visible="editDepartmentVisible" title="aaa"  @cancel="editDepartmentVisible = false" @ok="editDepartment">
+    <a-modal :visible="editDepartmentVisible" title="修改部门信息" @cancel="editDepartmentVisible = false" @ok="editDepartment">
       <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
         <a-form-item label="部门名称">
           <a-input v-model="departmentName" placeholder="部门名称" />
         </a-form-item>
       </a-form>
     </a-modal>
-    <a-modal :visible="visible1" title="添加成员" @cancel="visible1 = false" @ok="handleOk">
-      添加成员
-      {{ addId }}
-    </a-modal>
-    <a-modal :visible="visible3" title="修改成员信息" @cancel="visible3 = false" @ok="handleOk"> 修改成员信息 </a-modal>
     <a-modal :visible="visible4" title="修改医院信息" @cancel="visible4 = false" @ok="editHospInfoApi">
       <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
         <a-form-item label="省">
@@ -80,8 +72,29 @@
       </a-form>
     </a-modal>
     <a-modal :visible="roleModal" title="修改关联角色" @cancel="roleModal = false" @ok="handleOk">
-      关联角色信息
-      {{ changeRoleId }}
+      <div>
+        <h2>已选角色:</h2>
+        <template v-if="changeRoleInfo.roleList">
+          <a-tag
+            class="my-2 mx-2"
+            color="#2db7f5"
+            closable
+            v-for="tagItem in changeRoleInfo.roleList"
+            :key="tagItem.rId"
+            @close="chooseRole(tagItem.rid, 1, tagItem.rname)"
+          >
+            {{ tagItem.rname }}
+          </a-tag>
+        </template>
+      </div>
+      <div>
+        <h2>可选角色:</h2>
+        <template v-if="roleList.length">
+          <a-tag class="my-2 mx-2" v-for="tagItem in roleList" :key="tagItem.typeId" @click="chooseRole(tagItem.typeId, 0, tagItem.name)">
+            {{ tagItem.name }}
+          </a-tag>
+        </template>
+      </div>
     </a-modal>
     <a-modal :visible="positionModal" title="修改职位信息" @cancel="positionModal = false" @ok="editPosition">
       <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
@@ -89,8 +102,6 @@
           <a-input v-model="positionName" placeholder="职位名称" />
         </a-form-item>
       </a-form>
-
-      <span v-if="positionInfo">{{ positionInfo.pname }}</span>
     </a-modal>
     <!-- 添加部门/职位 -->
     <a-modal :visible="visibleAddPosition" title="添加部门/职位" @cancel="visibleAddPosition = false" @ok="addPosition">
@@ -108,13 +119,22 @@
           <a-input v-model="positionName" placeholder="职位名称" />
         </a-form-item>
       </a-form>
-      {{ addId }}
     </a-modal>
   </div>
 </template>
 <script>
 import { mapState } from 'vuex';
-import { queryHospitalInfo, editHospitalInfo, queryHospitalById, addDepartment, addPosition, updateDepartment, updatePosition } from 'config/api';
+import { bindPositionType } from 'config/api';
+
+import {
+  queryHospitalInfo,
+  editHospitalInfo,
+  queryHospitalById,
+  addDepartment,
+  addPosition,
+  updateDepartment,
+  updatePosition,
+} from 'config/api';
 import TreeNode from './TreeNode.vue';
 
 export default {
@@ -126,9 +146,6 @@ export default {
       treeData: [],
       isSelect: '',
       visible: false,
-      visible1: false,
-      visible2: false,
-      visible3: false,
       visible4: false,
       roleModal: false,
       positionModal: false,
@@ -143,7 +160,7 @@ export default {
       cityId: '',
       countyId: '',
       id: '',
-      changeRoleId: '',
+      changeRoleInfo: {},
       positionInfo: null,
       departmentInfo: null,
       addType: 'department',
@@ -154,7 +171,7 @@ export default {
       positionName: '',
     };
   },
-  computed: { ...mapState('home', ['hospitalInfo', 'level', 'area']) },
+  computed: { ...mapState('home', ['hospitalInfo', 'level', 'area', 'roleList']) },
   watch: {
     hospitalInfo() {
       this.getHospitalInfo();
@@ -164,6 +181,51 @@ export default {
     this.getHospitalInfo();
   },
   methods: {
+    // 添加关联角色
+    // type: 0(增加) 1(删除)
+    async chooseRole(id, type, name) {
+      try {
+        let positionTypeIdList = [];
+        let newRoleArr = [];
+        for (let i = 0; i < this.changeRoleInfo.roleList.length; i++) {
+          positionTypeIdList.push(this.changeRoleInfo.roleList[i].rid);
+        }
+        if (type === 0) {
+          positionTypeIdList.push(id);
+        } else if (type === 1) {
+          positionTypeIdList = positionTypeIdList.filter(item => {
+            return item !== id;
+          });
+        }
+        for (let i = 0; i < this.roleList.length; i++) {
+          for (let j = 0; j < positionTypeIdList.length; j++) {
+            if (this.roleList[i].typeId === positionTypeIdList[j]) {
+              const obj = {
+                rid: this.roleList[i].typeId,
+                rname: this.roleList[i].name,
+              };
+              newRoleArr.push(obj);
+            }
+          }
+        }
+        const params = {
+          param: {
+            positionId: this.changeRoleInfo.pid,
+            positionTypeIdList,
+          },
+        };
+        const res = await bindPositionType(params);
+        const { code, msg } = res.data;
+        if (code === 200) {
+          this.changeRoleInfo.roleList = [...newRoleArr];
+        } else {
+          this.$message.warning('添加错误:', msg);
+        }
+      } catch (error) {
+        this.$message.warning('添加错误:', error);
+      }
+      console.log(id);
+    },
     // 显示修改部门的modal框
     editDepartmentModal(item) {
       this.departmentInfo = item;
@@ -174,17 +236,17 @@ export default {
     //修改部门信息
     async editDepartment() {
       try {
-        const params = { param: {did: this.departmentInfo.did , departmentName: this.departmentName}};
+        const params = { param: { did: this.departmentInfo.did, departmentName: this.departmentName } };
         const res = await updateDepartment(params);
-        const { code, msg, data} = res.data;
+        const { code, msg, data } = res.data;
         if (code === 200) {
           this.editDepartmentVisible = false;
           this.$message.success('修改成功');
           this.getHospitalInfo();
-        }else {
+        } else {
           this.$message.warning(msg);
         }
-      }catch (e) {
+      } catch (e) {
         this.$message.warning(e);
       }
     },
@@ -198,23 +260,23 @@ export default {
     // 修改职位信息
     async editPosition() {
       try {
-        const params = { param: {positionId: this.positionInfo.pid, positionName: this.positionName}};
+        const params = { param: { positionId: this.positionInfo.pid, positionName: this.positionName } };
         const res = await updatePosition(params);
-        const {code, msg, data} = res.data;
+        const { code, msg, data } = res.data;
         if (code === 200) {
-            this.$message.success('修改成功');
-            this.positionModal = false;
-            this.getHospitalInfo();
-        }else {
-          this.$message.warning(msg)
+          this.$message.success('修改成功');
+          this.positionModal = false;
+          this.getHospitalInfo();
+        } else {
+          this.$message.warning(msg);
         }
-      }catch (e) {
+      } catch (e) {
         this.$message.error(e);
       }
     },
     // 显示关联角色modal框
-    changeRole(id) {
-      this.changeRoleId = id;
+    changeRole(item) {
+      this.changeRoleInfo = item;
       this.roleModal = true;
     },
     //新建职位/子部门
@@ -365,7 +427,7 @@ export default {
         this.$message.error('医院详情查询失败:', error);
       }
     },
-    // 添加职位/角色
+    // 关联角色信息点击确定
     handleOk() {
       this.visible = false;
     },
@@ -374,21 +436,6 @@ export default {
       this.addId = id;
       this.visibleAddPosition = true;
     },
-    // 修改部门/职位modal框
-    showEditItem(item) {
-      console.log('item: ', item);
-      this.visible2 = true;
-    },
-    // 添加成员modal框
-    showAddMember(id) {
-      this.addId = id;
-      this.visible1 = true;
-    },
-    // 修改成员modal框
-    showEditMember(item) {
-      console.log('item: ', item);
-      this.visible3 = true;
-    },
     // 搜索部门/职位/角色
     onChange(e) {
       const value = e.target.value;
diff --git a/src/components/RightPage/TreeNode.vue b/src/components/RightPage/TreeNode.vue
index 7b77834..82d1589 100644
--- a/src/components/RightPage/TreeNode.vue
+++ b/src/components/RightPage/TreeNode.vue
@@ -21,18 +21,14 @@
             <div class="d-flex flex-row justify-space-between align-center" slot="title">
               <div>
                 {{ itemA.pname }}
-                <a-tag color="blue" class="ml-2" v-for="tag in itemA.roleList" :key="tag.rid" @click="changeRole(itemA.pid)">
-                  {{ tag.rname }}
-                </a-tag>
+                <template v-if="itemA.roleList.length">
+                  <a-tag color="blue" class="ml-2" v-for="tag in itemA.roleList" :key="tag.rid" @click="changeRole(itemA)">
+                    {{ tag.rname }}
+                  </a-tag>
+                </template>
+                <a-tag v-else @click="changeRole(itemA)">关联角色</a-tag>
               </div>
               <div>
-                <!-- <a-icon
-                class="mr-2"
-                :style="{ fontSize: '20px' }"
-                v-if="isSelect === item.did + itemA.pid"
-                type="plus"
-                @click="showAddMember(itemA.did)"
-              ></a-icon> -->
                 <a-popover v-model="itemA.show" placement="topRight" trigger="click">
                   <a-icon class="mr-2" :style="{ fontSize: '20px' }" v-if="isSelect === item.did + itemA.pid" type="more" />
                   <template slot="content">
@@ -68,14 +64,19 @@
                 type="plus"
                 @click="showAddItem(item.did)"
               ></a-icon>
-              <!-- <a-icon class="mr-2" :style="{ fontSize: '20px' }" v-if="isSelect === item.did" type="m
-            ore" @click="showEditItem(item)" /> -->
+
               <a-popover v-model="item.departmentIsShow" placement="topRight" trigger="click">
                 <a-icon class="mr-2" :style="{ fontSize: '20px' }" v-if="isSelect === item.did" type="more" />
                 <template slot="content">
                   <div class="d-flex align-center">
                     <a-button type="primary" class="mr-2" @click="editDepartmentModal(item)"> 修改 </a-button>
-                    <a-popconfirm placement="left" title="确定删除此数据吗?1234565" ok-text="删除" cancel-text="取消" @confirm="delpartment(item)">
+                    <a-popconfirm
+                      placement="left"
+                      title="确定删除此数据吗?1234565"
+                      ok-text="删除"
+                      cancel-text="取消"
+                      @confirm="delpartment(item)"
+                    >
                       <a-button type="danger"> 删除 </a-button>
                     </a-popconfirm>
                   </div>
@@ -89,13 +90,10 @@
             v-if="item.sonDepartment"
             :tree-data="item.sonDepartment"
             @showAddItem="showAddItem"
-            @showEditItem="showEditItem"
-            @showAddMember="showAddMember"
-            @showEditMember="showEditMember"
             @changeRole="changeRole"
             @editPositionModal="editPositionModal"
             @editDepartmentModal="editDepartmentModal"
-            @getHospitalInfo = "getHospitalInfo"
+            @getHospitalInfo="getHospitalInfo"
           />
         </a-tree-node>
       </template>
@@ -161,16 +159,16 @@ export default {
     async delpartment(item) {
       console.log('item: ', item);
       try {
-        const params = { param: {did: item.did}};
+        const params = { param: { did: item.did } };
         const res = await delDepartment(params);
-        const { code, msg, data} = res.data;
+        const { code, msg, data } = res.data;
         if (code === 200) {
           this.$message.success('删除成功');
           this.getHospitalInfo();
-        }else {
+        } else {
           this.$message.warning(msg);
         }
-      }catch (e) {
+      } catch (e) {
         this.$message.warning(e);
       }
     },
@@ -181,40 +179,30 @@ export default {
     async delPositionInfo(item) {
       console.log('item: ', item);
       try {
-        const params = { param: {positionId: item.pid}};
+        const params = { param: { positionId: item.pid } };
         const res = await delPosition(params);
-        const { code, msg, data} = res.data;
+        const { code, msg, data } = res.data;
         if (code === 200) {
           this.$message.success('删除成功');
           this.getHospitalInfo();
-        }else {
+        } else {
           this.$message.warning(msg);
         }
-      }catch (e) {
+      } catch (e) {
         this.$message.warning(e);
       }
     },
     // 显示修改关联角色
-    changeRole(id) {
-      this.$emit('changeRole', id);
+    changeRole(item) {
+      this.$emit('changeRole', item);
     },
     onSelect(selectedKeys, info) {
-      console.log('selected', selectedKeys, info);
       this.isSelect = selectedKeys[0];
     },
     showAddItem(id) {
       this.$emit('showAddItem', id);
     },
-    showEditItem(item) {
-      this.$emit('showEditItem', item);
-    },
-    showAddMember(id) {
-      this.$emit('showAddMember', id);
-    },
-    showEditMember(item) {
-      this.visible = true;
-      // this.$emit('showEditMember', item);
-    },
+
     onExpand(expandedKeys) {
       this.expandedKeys = expandedKeys;
       this.autoExpandParent = false;
diff --git a/src/components/RightPage/TreeNodeCopy.vue b/src/components/RightPage/TreeNodeCopy.vue
index e1a496c..aed65f6 100644
--- a/src/components/RightPage/TreeNodeCopy.vue
+++ b/src/components/RightPage/TreeNodeCopy.vue
@@ -21,18 +21,14 @@
             <div class="d-flex flex-row justify-space-between align-center" slot="title">
               <div>
                 {{ itemA.pname }}
-                <a-tag color="blue" class="ml-2" v-for="tag in itemA.roleList" :key="tag.rid" @click="changeRole(itemA.pid)">
-                  {{ tag.rname }}
-                </a-tag>
+                <template v-if="itemA.roleList.length">
+                  <a-tag color="blue" class="ml-2" v-for="tag in itemA.roleList" :key="tag.rid" @click="changeRole(itemA)">
+                    {{ tag.rname }}
+                  </a-tag>
+                </template>
+                <a-tag v-else @click="changeRole(itemA)">关联角色</a-tag>
               </div>
               <div>
-                <!-- <a-icon
-                class="mr-2"
-                :style="{ fontSize: '20px' }"
-                v-if="isSelect === item.did + itemA.pid"
-                type="plus"
-                @click="showAddMember(itemA.did)"
-              ></a-icon> -->
                 <a-popover v-model="itemA.show" placement="topRight" trigger="click">
                   <a-icon class="mr-2" :style="{ fontSize: '20px' }" v-if="isSelect === item.did + itemA.pid" type="more" />
                   <template slot="content">
@@ -68,8 +64,6 @@
                 type="plus"
                 @click="showAddItem(item.did)"
               ></a-icon>
-              <!-- <a-icon class="mr-2" :style="{ fontSize: '20px' }" v-if="isSelect === item.did" type="m
-            ore" @click="showEditItem(item)" /> -->
               <a-popover v-model="item.departmentIsShow" placement="topRight" trigger="click">
                 <a-icon class="mr-2" :style="{ fontSize: '20px' }" v-if="isSelect === item.did" type="more" />
                 <template slot="content">
@@ -89,13 +83,10 @@
             v-if="item.sonDepartment"
             :tree-data="item.sonDepartment"
             @showAddItem="showAddItem"
-            @showEditItem="showEditItem"
-            @showAddMember="showAddMember"
-            @showEditMember="showEditMember"
             @changeRole="changeRole"
             @editPositionModal="editPositionModal"
             @editDepartmentModal="editDepartmentModal"
-            @getHospitalInfo = "getHospitalInfo"
+            @getHospitalInfo="getHospitalInfo"
           />
         </a-tree-node>
       </template>
@@ -161,16 +152,16 @@ export default {
     async delpartment(item) {
       console.log('item: ', item);
       try {
-        const params = { param: {did: item.did}};
+        const params = { param: { did: item.did } };
         const res = await delDepartment(params);
-        const { code, msg, data} = res.data;
+        const { code, msg, data } = res.data;
         if (code === 200) {
           this.$message.success('删除成功');
           this.getHospitalInfo();
-        }else {
+        } else {
           this.$message.warning(msg);
         }
-      }catch (e) {
+      } catch (e) {
         this.$message.warning(e);
       }
     },
@@ -181,40 +172,29 @@ export default {
     async delPositionInfo(item) {
       console.log('item: ', item);
       try {
-        const params = { param: {positionId: item.pid}};
+        const params = { param: { positionId: item.pid } };
         const res = await delPosition(params);
-        const { code, msg, data} = res.data;
+        const { code, msg, data } = res.data;
         if (code === 200) {
           this.$message.success('删除成功');
           this.getHospitalInfo();
-        }else {
+        } else {
           this.$message.warning(msg);
         }
-      }catch (e) {
+      } catch (e) {
         this.$message.warning(e);
       }
     },
     // 显示修改关联角色
-    changeRole(id) {
-      this.$emit('changeRole', id);
+    changeRole(item) {
+      this.$emit('changeRole', item);
     },
     onSelect(selectedKeys, info) {
-      console.log('selected', selectedKeys, info);
       this.isSelect = selectedKeys[0];
     },
     showAddItem(id) {
       this.$emit('showAddItem', id);
     },
-    showEditItem(item) {
-      this.$emit('showEditItem', item);
-    },
-    showAddMember(id) {
-      this.$emit('showAddMember', id);
-    },
-    showEditMember(item) {
-      this.visible = true;
-      // this.$emit('showEditMember', item);
-    },
     onExpand(expandedKeys) {
       this.expandedKeys = expandedKeys;
       this.autoExpandParent = false;
diff --git a/src/config/api.js b/src/config/api.js
index 5823358..244b7df 100644
--- a/src/config/api.js
+++ b/src/config/api.js
@@ -28,20 +28,24 @@ export const queryHospitalById = params => axios.post(`${management}/queryHospit
 
 // 查询可绑定角色列表;
 export const queryPositionType = params => axios.post(`${management}/queryPositionType`, params);
-//添加部门
+
+// 添加部门
 export const addDepartment = params => axios.post(`${management}/addDepartment`, params);
 
-//添加职位
+// 添加职位
 export const addPosition = params => axios.post(`${management}/addPosition`, params);
 
-//修改部门
+// 修改部门
 export const updateDepartment = params => axios.post(`${management}/updateDepartment`, params);
 
-//修改职位
+// 修改职位
 export const updatePosition = params => axios.post(`${management}/updatePosition`, params);
 
-//删除部门
+// 删除部门
 export const delDepartment = params => axios.post(`${management}/delDepartment`, params);
 
-//删除职位
+// 删除职位
 export const delPosition = params => axios.post(`${management}/delPosition`, params);
+
+// 关联角色
+export const bindPositionType = params => axios.post(`${management}/bindPositionType`, params);