添加用户的时候，同时添加对应的MQ用户信息

王勇
src/views/nav1/user.vue
--- a/src/views/nav1/user.vue
查看文件 @b4e37c4
+++ b/src/views/nav1/user.vue
查看文件 @b4e37c4
@@ -132,8 +132,8 @@
         </el-dialog>
         <!--新增界面-->
-        <el-dialog title="新增" :visible.sync="addFormVisible" :close-on-click-modal="false">
-            <el-form :model="addForm" label-width="120px" :rules="addFormRules" ref="addForm">
+        <el-dialog title="新增用户" :visible.sync="addFormVisible" :close-on-click-modal="false">
+            <el-form :model="addForm" label-width="150px" :rules="addFormRules" ref="addForm">
                 <el-form-item label="账号" prop="username">
                     <el-input v-model="addForm.username" clearable style="width:400px"
                               aria-placeholder="用户名长度在5-11位,支持英文和数字"></el-input>
@@ -144,33 +144,15 @@
                 <el-form-item label="姓名" prop="realname">
                     <el-input v-model="addForm.realname" clearable style="width:400px"></el-input>
                 </el-form-item>
-
-                <el-form-item label="服务器：" prop="serverId">
-                    <el-select v-model="addForm.serverId" prefix-icon="el-icon-search" clearable
-                               style="width:400px" size="medium" filterable
-                               @change="user_addChange"
-                               placeholder="请选择服务器">
-                        <el-option
-                                v-for="item in (user_config.serverList)"
-                                :key="item.id"
-                                :label="item.serverName"
-                                :value="item.serverName">
-                        </el-option>
-                    </el-select>
-                </el-form-item>
-
-                <el-form-item label="虚拟主机：" prop="virtualHostId">
-                    <el-select v-model="addForm.virtualHostId" prefix-icon="el-icon-search" clearable
-                               style="width:400px" size="medium" filterable
-                               :disabled="addForm.serverId===''"
-                               placeholder="请选择虚拟主机">
-                        <el-option
-                                v-for="item in (user_config.virtualHostList)"
-                                :key="item.id"
-                                :label="item.virtualHostName"
-                                :value="item.virtualHostName">
-                        </el-option>
-                    </el-select>
+                <el-form-item label="选择用户关系：">
+                    <br/>
+                    <el-tree style="width:270px"
+                             :data="user_config.server_hostList"
+                             :props="user_config.defaultParams"
+                             ref="tree"
+                             node-key="id"
+                             show-checkbox highlight-current default-expand-all>
+                    </el-tree>
                 </el-form-item>
                 <el-form-item label="电话" prop="mobilephone">
@@ -227,16 +209,17 @@
     import {getUserList, removeUser, batchRemoveUser, editUser, addUser, setUserRole} from '../../api/user';
     import {getList} from '../../api/role_api';
     import moment from 'moment'
-    import {getHostList, getServerList, insertUserInfo} from "../../api/message_bus";
+    import {getServerAndHostList, insertUserInfo} from "../../api/message_bus";
     export default {
         data() {
             return {
                 user_config: {
-                    // 服务器列表
-                    serverList: [],
-                    // 虚拟主机列表
-                    virtualHostList: [],
+                    server_hostList: [],
+                    defaultParams: {
+                        label: 'aliasName',
+                        children: 'aliasList'
+                    }
                 },
                 filters: {
                     userName: '',
@@ -323,7 +306,7 @@
             }
         },
         methods: {
-            //性别显示转换
+            // 性别显示转换
             formatSex: function (row, column) {
                 return row.sex == 1 ? '男' : row.sex == 0 ? '女' : '未知';
             },
@@ -334,7 +317,7 @@
                 this.pageNum = val;
                 this.getUsers();
             },
-            //获取用户列表
+            // 获取用户列表
             getUsers: function () {
                 let para = {
                     pageNum: this.pageNum,
@@ -429,8 +412,6 @@
             },
             //显示新增界面，每次点开初始化数据
             handleAdd: function () {
-                // 刷新一下服务器列表
-                this.selectServerList();
                 this.addFormVisible = true;
                 this.addForm = {
                     username: '',
@@ -492,11 +473,11 @@
 //							para.birth = (!para.birth || para.birth == '') ? '' : util.formatDate.format(new Date(para.birth), 'yyyy-MM-dd');
                             // 添加MQ用户信息
+                            this.addForm.virtualHostId = this.$refs.tree.getCheckedKeys().join();
                             const params = {
                                 username: this.addForm.username,
                                 password: this.addForm.password,
                                 realName: this.addForm.realname,
-                                serverId: this.addForm.serverId,
                                 virtualHostId: this.addForm.virtualHostId,
                             }
                             insertUserInfo(params).then((response) => {
@@ -594,46 +575,28 @@
 //                console.log(data, checked, indeterminate);
                 console.log(this.roleIds);
             },
-            /**
-             * 获取服务器列表
-             */
-            selectServerList() {
-                getServerList().then((response) => {
-                    let res = response.data;
-                    if (res.code !== '200') {
-                        return this.$message.error("服务器信息获取失败");
-                    }
-                    // 获取服务器列表数据
-                    this.user_config.serverList = res.data;
-                }).catch(error => {
-                    this.$message.error(error.toString());
-                });
-            },
-
-            user_addChange(value) {
-                // 现将对应的虚拟主机的ID清空
-                this.addForm.virtualHostId = undefined;
-                // 根据服务器ID，获取出对应的虚拟主机的列表
-                this.selectHostList(value);
-            },
             /**
-             * 获取虚拟主机列表
+             * 选择用户关系
+             * MQ服务器与虚拟主机（1：n）的列表
              */
-            selectHostList(serverId) {
-                getHostList(serverId).then((response) => {
+            selectUserRelation() {
+                getServerAndHostList().then((response) => {
                     let res = response.data;
                     if (res.code !== '200') {
-                        return;
+                        return this.$message.error('获取服务器与虚拟主机信息，失败！');
                     }
-                    this.user_config.virtualHostList = res.data;
+                    // 获取列表数据
+                    this.user_config.server_hostList = res.data;
                 }).catch(error => {
                     this.$message.error(error.toString());
                 });
             },
+
         },
         mounted() {
             this.getUsers();
+            this.selectUserRelation();
         },
         computed: {
             hideShow() {//当图片多于一张的时候，就隐藏上传框