医院详情页部门/职位增加修改modal

src/components/RightPage/RightPage.vue

@@ -14,7 +14,7 @@
       </div>
       <div class="d-flex align-center">
         <a-input-search style="width: 260px" class="mr-4" placeholder="搜索部门/职位/角色" @change="onChange" />
-        <a-button type="primary" icon="plus">新建部门</a-button>
+        <a-button type="primary" icon="plus" @click="createDepartment">新建部门</a-button>
       </div>
     </div>
     <div class="right-box flex-1 hos-box hos-shadow white">
@@ -32,11 +32,15 @@
         @editDepartmentModal="editDepartmentModal"
       />
     </div>
-    <a-modal :visible="visible" title="添加部门/职位" @cancel="visible = false" @ok="handleOk">
-      添加部门/职位
+    <a-modal :visible="visible" title="添加部门" @cancel="visible = false" @ok="addDepartment">
+      <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>
       {{ addId }}
     </a-modal>
-    <a-modal :visible="visible2" title="修改部门信息" @cancel="visible2 = false" @ok="handleOk"> 修改部门信息 </a-modal>
+    <a-modal :visible="visible2" title="修改部门信息" @cancel="visible2 = false" @ok="handleOk"> </a-modal>
     <a-modal :visible="visible1" title="添加成员" @cancel="visible1 = false" @ok="handleOk">
       添加成员
       {{ addId }}
@@ -74,17 +78,35 @@
     </a-modal>
     <a-modal :visible="positionModal" title="修改职位信息" @cancel="positionModal = false" @ok="handleOk">
       修改职位信息
-      {{ positionInfo.pname }}
+      <span v-if="positionInfo">{{ positionInfo.pname }}</span>
     </a-modal>
     <a-modal :visible="departmentModal" title="修改部门信息" @cancel="departmentModal = false" @ok="handleOk">
       修改部门信息
-      {{ departmentInfo.departmentName }}
+      <span v-if="departmentInfo">{{ departmentInfo.departmentName }}</span>
+    </a-modal>
+    <!-- 添加部门/职位 -->
+    <a-modal :visible="visibleAddPosition" title="添加部门/职位" @cancel="visibleAddPosition = false" @ok="addPosition">
+      <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+        <a-form-item label="添加类型">
+          <a-select :value="addType" placeholder="修改类型" allow-clear @change="selectAddType">
+            <a-select-option value="department">部门</a-select-option>
+            <a-select-option value="position">职位</a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item label="部门名称" v-if="addType === 'department'">
+          <a-input v-model="departmentName" placeholder="部门名称" />
+        </a-form-item>
+        <a-form-item label="职位名称" v-else>
+          <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 } from 'config/api';
+import { queryHospitalInfo, editHospitalInfo, queryHospitalById, addDepartment, addPosition } from 'config/api';
 import TreeNode from './TreeNode.vue';
 
 export default {
@@ -103,6 +125,7 @@ export default {
       roleModal: false,
       positionModal: false,
       departmentModal: false,
+      visibleAddPosition: false,
       addId: '',
       hospitalName: '',
       areaId: [],
@@ -114,6 +137,12 @@ export default {
       changeRoleId: '',
       positionInfo: null,
       departmentInfo: null,
+      addType: 'department',
+      departmentName: '',
+      oid: '',
+      parentId: '',
+      departmentId: '',
+      positionName: '',
     };
   },
   computed: { ...mapState('home', ['hospitalInfo', 'level', 'area']) },
@@ -141,6 +170,64 @@ export default {
       this.changeRoleId = id;
       this.roleModal = true;
     },
+    //新建职位/子部门
+    async addPosition() {
+      if (this.addType === 'department') {
+        try {
+          const params = { param: { oid: this.hospitalInfo.id, departmentName: this.departmentName, parentId: this.addId } };
+          const res = await addDepartment(params);
+          const { code, msg, data } = res.data;
+          if (code === 200) {
+            this.$message.success('添加成功');
+            this.visibleAddPosition = false;
+            this.getHospitalInfo();
+          } else {
+            this.$message.warning(msg);
+          }
+        } catch (e) {
+          this.$message.warning(error);
+        }
+      } else {
+        try {
+          const params = { param: { departmentId: this.addId, positionName: this.positionName } };
+          const res = await addPosition(params);
+          const { code, msg, data } = res.data;
+          if (code === 200) {
+            this.$message.success('添加成功');
+            this.visibleAddPosition = false;
+            this.getHospitalInfo();
+          } else {
+            this.$message.warning(msg);
+          }
+        } catch (e) {
+          this.$message.warning(error);
+        }
+      }
+    },
+    //新建部门
+    createDepartment() {
+      this.visible = true;
+    },
+    async addDepartment() {
+      try {
+        const params = { param: { oid: this.hospitalInfo.id, departmentName: this.departmentName } };
+        const res = await addDepartment(params);
+        const { code, msg, data } = res.data;
+        if (code === 200) {
+          this.$message.success('添加成功');
+          this.visible = false;
+          this.getHospitalInfo();
+        } else {
+          this.$message.warning(msg);
+        }
+      } catch (e) {
+        this.$message.warning(error);
+      }
+    },
+    selectAddType(e) {
+      console.log(e);
+      this.addType = e;
+    },
     // 医院数据回显
     async queryHospitalById() {
       try {
@@ -238,7 +325,7 @@ export default {
     // 添加部门/职位modal框
     showAddItem(id) {
       this.addId = id;
-      this.visible = true;
+      this.visibleAddPosition = true;
     },
     // 修改部门/职位modal框
     showEditItem(item) {

src/config/api.js

@@ -28,3 +28,8 @@ 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);