后台用户关联单位

src/views/sys/user-detail.vue

@@ -8,49 +8,50 @@
     :visible.sync="showDialog"
     :title="title"
     :modal-append-to-body="false"
-    style="text-align:left;"
+    style="text-align: left"
     @close="closeDialog"
     :close-on-click-modal="false"
   >
     <div class="user-panel" v-loading="loading">
-      <el-form ref="form" :model="formModel" :rules="ruleValidate" :label-width="'100px'">
+      <el-form
+        ref="form"
+        :model="formModel"
+        :rules="ruleValidate"
+        :label-width="'100px'"
+      >
         <el-form-item label="用户名" prop="userName">
-          <el-input v-model="formModel.userName" placeholder="请输入用户名" style="width:300px"></el-input>
+          <el-input
+            v-model="formModel.userName"
+            placeholder="请输入用户名"
+            style="width: 300px"
+          ></el-input>
         </el-form-item>
         <el-form-item label="真实名称" prop="realName">
-          <el-input v-model="formModel.realName" placeholder="请输入真实名称" style="width:300px"></el-input>
+          <el-input
+            v-model="formModel.realName"
+            placeholder="请输入真实名称"
+            style="width: 300px"
+          ></el-input>
         </el-form-item>
-        <el-form-item v-show="ruleValidate.password[0].required" label="密码" prop="password">
+        <el-form-item
+          v-show="ruleValidate.password[0].required"
+          label="密码"
+          prop="password"
+        >
           <el-input
             type="password"
             v-model="formModel.password"
             placeholder="请输入密码"
-            style="width:300px"
+            style="width: 300px"
           ></el-input>
         </el-form-item>
-        <el-form-item label="所属单位" prop="companyId">
-          <!-- <el-select v-model="formModel.companyId" filterable placeholder="请选择" style="width:300px">
-            <el-option
-              v-for="company in companyResult"
-              :key="company.id"
-              :label="company.name"
-              :value="company.id"
-            ></el-option>
-          </el-select> -->
-          <el-select-tree
-          size="mediumn"
-          :options="companyResult"
-          v-model="formModel.companyId"
-          width="300px"
-        ></el-select-tree>
-        </el-form-item>
         <el-form-item label="分配角色" prop="roles">
           <el-select
             v-model="formModel.roles"
             filterable
             multiple
             placeholder="请选择"
-            style="width:300px"
+            style="width: 300px"
           >
             <el-option
               v-for="role in roleList"
@@ -62,11 +63,38 @@
           <!-- <el-transfer v-model="formModel.roles" :data="roleList" 
           :props="{key: 'id',label: 'description'}" :titles="['所有角色','已分配角色']"></el-transfer>-->
         </el-form-item>
+        <el-form-item label="所属单位" prop="companyId">
+          <el-select-tree
+            size="mini"
+            :props="props"
+            :options="companyResult"
+            v-model="formModel.companyId"
+            height="200"
+          ></el-select-tree>
+        </el-form-item>
+        <el-form-item label="关联其他单位" prop="otherCompanyIds">
+          <el-select
+            v-model="formModel.otherCompanyIds"
+            filterable
+            multiple
+            placeholder="请选择"
+            style="width: 100%"
+          >
+            <el-option
+              v-for="company in companyResult"
+              :key="company.id"
+              :label="company.name"
+              :value="company.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
       </el-form>
     </div>
     <span slot="footer" class="dialog-footer">
       <el-button @click="closeDialog">取 消</el-button>
-      <el-button type="primary" @click="handleSubmit" :loading="submitting">确 定</el-button>
+      <el-button type="primary" @click="handleSubmit" :loading="submitting"
+        >确 定</el-button
+      >
     </span>
   </el-dialog>
 </template>
@@ -74,37 +102,58 @@
 import Constant from "@/constant";
 import userApi from "@/api/sys/user";
 import roleApi from "@/api/sys/role";
+import companyInfoApi from "@/api/base/companyInfo";
 import SelectTree from "@/components/SelectTree";
 
 export default {
-  props: ["businessKey", "title", "companyResult"],
+  props: ["businessKey", "title"],
   data() {
     return {
       showPwd: true,
       ruleValidate: {
         userName: [
-          { required: true, message: "用户名不能为空", trigger: "blur" }
+          { required: true, message: "用户名不能为空", trigger: "blur" },
         ],
         realName: [
-          { required: true, message: "真实名称不能为空", trigger: "blur" }
+          { required: true, message: "真实名称不能为空", trigger: "blur" },
         ],
         companyId: [
-          { required: true, message: "单位不能为空", trigger: "blur" }
+          { required: true, message: "单位不能为空", trigger: "blur" },
         ],
         password: [
-          { required: true, message: "密码不能为空", trigger: "blur" }
+          { required: true, message: "密码不能为空", trigger: "blur" },
         ],
         roles: [
-          { required: true, message: "分配角色不能为空", trigger: "blur" }
-        ]
+          { required: true, message: "分配角色不能为空", trigger: "blur" },
+        ],
       },
       roleList: [],
       formModel: {},
       showDialog: true,
       loading: false,
-      submitting: false
+      submitting: false,
+      companyResult: [],
+      treeData: [],
+      props: {
+        // 配置项（必选）
+        value: "id",
+        label: "name",
+        children: "children",
+      },
     };
   },
+  created() {
+    var self = this;
+
+    companyInfoApi.treeList().then(function (response) {
+      var jsonData = response.data;
+      if (jsonData.result) {
+        if (jsonData.data != null && jsonData.data != "") {
+          self.companyResult = jsonData.data;
+        }
+      }
+    });
+  },
   methods: {
     closeDialog() {
       this.$emit("close", false);
@@ -112,30 +161,35 @@ export default {
     handleSubmit() {
       var self = this;
 
-      this.$refs["form"].validate(valid => {
+      this.$refs["form"].validate((valid) => {
         if (valid) {
-          (function() {
+          (function () {
             var id = self.formModel.id;
 
+            // var otherCompany = self.formModel.otherCompany;
+            // if(otherCompany != "" && otherCompany != null){
+            //   self.formModel.otherCompanyId = otherCompany.join(",");
+            // }
+
             if (id == null || id.length == 0) {
               return userApi.add(self.formModel);
             } else {
               return userApi.update(self.formModel);
             }
-          })().then(function(response) {
+          })().then(function (response) {
             var jsonData = response.data;
 
             if (jsonData.result) {
               self.$message({
                 message: "保存成功!",
-                type: "success"
+                type: "success",
               });
 
-              self.$emit("close",true);
+              self.$emit("close", true);
             } else {
               self.$message({
                 message: jsonData.message + "",
-                type: "warning"
+                type: "warning",
               });
 
               self.$emit("close", false);
@@ -143,18 +197,18 @@ export default {
           });
         }
       });
-    }
+    },
   },
   async mounted() {
     var self = this;
     self.loading = true;
 
     // 不需要先加载列表值，再加载选中值了
-    await roleApi.selectAll().then(response => {
+    await roleApi.selectAll().then((response) => {
       this.roleList = response.data.data;
     });
 
-    (function() {
+    (function () {
       if (self.businessKey != null && self.businessKey.length > 0) {
         self.ruleValidate.password[0].required = false;
         return userApi.edit(self.businessKey);
@@ -163,7 +217,7 @@ export default {
         return userApi.create();
       }
     })()
-      .then(response => {
+      .then((response) => {
         var jsonData = response.data;
 
         if (jsonData.result) {
@@ -175,13 +229,13 @@ export default {
 
         self.loading = false;
       })
-      .catch(error => {
+      .catch((error) => {
         self.$message.error(error + "");
         self.loading = false;
       });
   },
   components: {
-    "el-select-tree": SelectTree
-  }
+    "el-select-tree": SelectTree,
+  },
 };
 </script>