用户增加上级机构

src/views/system/user/index.vue

@@ -58,10 +58,10 @@
 
             <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
               <el-table-column type="selection" width="50" align="center" />
-              <el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
-              <el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
-              <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
-              <el-table-column label="机构&科室" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
+              <el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[0].visible" :show-overflow-tooltip="true" />
+              <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
+              <el-table-column label="机构&科室" align="center" key="deptName" prop="dept.deptName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
+              <el-table-column label="上级机构&科室" align="center" key="topdeptName" prop="topdept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
               <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
               <el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
                 <template slot-scope="scope">
@@ -105,7 +105,7 @@
           </el-col>
           <el-col :span="12">
             <el-form-item label="机构&科室" prop="deptId">
-              <treeselect v-model="form.deptId" :options="enabledDeptOptions" :show-count="true" placeholder="请选择机构&科室" />
+              <treeselect v-model="form.deptId" :options="enabledDeptOptions"  :show-count="true" @select="handleSelect" placeholder="请选择机构&科室" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -116,10 +116,8 @@
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="角色">
-              <el-select v-model="form.roleIds" multiple placeholder="请选择角色">
-                <el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId" :disabled="item.status == 1"></el-option>
-              </el-select>
+            <el-form-item label="上级机构&科室">
+              <el-input v-model="form.topDeptName" :disabled="true"/>
             </el-form-item>
           </el-col>
         </el-row>
@@ -143,6 +141,13 @@
               </el-radio-group>
             </el-form-item>
           </el-col>
+          <el-col :span="12">
+            <el-form-item label="角色">
+              <el-select v-model="form.roleIds" multiple placeholder="请选择角色">
+                <el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId" :disabled="item.status == 1"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
         </el-row>
         <el-row>
           <el-col :span="24">
@@ -253,10 +258,10 @@ export default {
       },
       // 列信息
       columns: [
-        { key: 0, label: `用户编号`, visible: true },
-        { key: 1, label: `用户名称`, visible: true },
-        { key: 2, label: `用户昵称`, visible: true },
-        { key: 3, label: `机构&科室`, visible: true },
+        { key: 0, label: `用户名称`, visible: true },
+        { key: 1, label: `用户昵称`, visible: true },
+        { key: 2, label: `机构&科室`, visible: true },
+        { key: 3, label: `上级机构&科室`, visible: true },
         { key: 4, label: `手机号码`, visible: true },
         { key: 5, label: `状态`, visible: true },
         { key: 6, label: `创建时间`, visible: true }
@@ -296,6 +301,10 @@ export default {
     this.getDeptTree()
   },
   methods: {
+    handleSelect(node, instanceId) {
+      this.form.topDeptName = node.parentName;
+      
+    },
     /** 查询用户列表 */
     getList() {
       this.loading = true
@@ -311,8 +320,24 @@ export default {
       deptTreeSelect().then(response => {
         this.deptOptions = response.data
         this.enabledDeptOptions = this.filterDisabledDept(JSON.parse(JSON.stringify(response.data)))
+       
+        if(this.enabledDeptOptions[0].children){
+          this.enabledDeptOptions[0].children.forEach(element => {
+            this.setchildren(this.enabledDeptOptions[0],element)
+
+          });
+        }
       })
     },
+    setchildren(item,node){
+      node.parentId = item.id;
+      node.parentName = item.label;
+      if(node.children){
+        node.children.forEach(element => {
+          this.setchildren(node,element);
+        });
+      }
+    },
     // 过滤禁用的机构&科室
     filterDisabledDept(deptList) {
       return deptList.filter(dept => {
@@ -411,8 +436,10 @@ export default {
     handleUpdate(row) {
       this.reset()
       const userId = row.userId || this.ids
+      console.log(row)
       getUser(userId).then(response => {
         this.form = response.data
+        this.form.topDeptName = row.topdept.deptName;
         this.roleOptions = response.roles
         this.$set(this.form, "roleIds", response.roleIds)
         this.open = true