【修改】新增子账号禁止账号输入系统自动生成

src/views/setting/sub_account.vue

@@ -6,7 +6,14 @@
     <div class="mymain-container">
       <div class="btn-group clearfix">
         <div class="fl">
-          <el-button v-if="checkBtnRole('add')" size="small" type="primary" icon="el-icon-plus" @click="addOrEdit('add')">新增账号</el-button>
+          <el-button
+            v-if="checkBtnRole('add')"
+            size="small"
+            type="primary"
+            icon="el-icon-plus"
+            @click="addOrEdit('add')"
+            >新增账号</el-button
+          >
         </div>
         <!--        <div class="fr">-->
         <!--          <ImportButton :im-url="'stock/importToll'" @importSuccess="getList" />-->
@@ -14,23 +21,40 @@
       </div>
 
       <div class="table">
-        <el-table v-loading="listLoading" :data="dataList" element-loading-text="Loading" border fit highlight-current-row stripe>
+        <el-table
+          v-loading="listLoading"
+          :data="dataList"
+          element-loading-text="Loading"
+          border
+          fit
+          highlight-current-row
+          stripe
+        >
           <el-table-column align="left" label="序号" type="index" width="50" />
           <el-table-column align="left" label="账号" prop="userName" />
           <el-table-column align="left" label="创建时间" prop="createTime" />
-          <el-table-column align="left" label="最后登录时间" prop="lastLoginTime" />
+          <el-table-column
+            align="left"
+            label="最后登录时间"
+            prop="lastLoginTime"
+          />
           <el-table-column align="left" label="主帐号" prop="isMaster">
             <template slot-scope="scope">
-
               <el-tag v-if="scope.row.isMaster" type="success">是</el-tag>
               <el-tag v-else type="danger">否</el-tag>
             </template>
           </el-table-column>
           <el-table-column align="center" label="操作" width="180">
             <template slot-scope="scope">
-              <el-button type="text" @click="addOrEdit('edit',scope.row)">修改</el-button>
-              <el-button v-if="checkBtnRole('detail')" type="text" @click="setMenuRole(scope.row.adminUserId,'role')">设置权限</el-button>
-
+              <el-button type="text" @click="addOrEdit('edit', scope.row)"
+                >修改</el-button
+              >
+              <el-button
+                v-if="checkBtnRole('detail')"
+                type="text"
+                @click="setMenuRole(scope.row.adminUserId, 'role')"
+                >设置权限</el-button
+              >
             </template>
           </el-table-column>
         </el-table>
@@ -52,7 +76,15 @@
     </div>
 
     <!-- 设置权限 -->
-    <el-dialog title="设置权限" :visible.sync="roleFormVisible" :show-close="false" width="40%" :close-on-click-modal="false" custom-class="tree-dialog" top="50px">
+    <el-dialog
+      title="设置权限"
+      :visible.sync="roleFormVisible"
+      :show-close="false"
+      width="40%"
+      :close-on-click-modal="false"
+      custom-class="tree-dialog"
+      top="50px"
+    >
       <el-tree
         ref="tree"
         :data="menuRoleList"
@@ -67,29 +99,63 @@
         <span slot-scope="{ node, data }" class="custom-tree-node">
           <span>{{ node.label }}</span>
           <span v-if="data.type < 3">
-            <el-button type="text" size="mini" @click="() => quickSelection(data)">一键全选</el-button>
-            <el-button type="text" size="mini" style="color: #f56c6c" @click="() => quickCancel(data)">一键取消</el-button>
+            <el-button
+              type="text"
+              size="mini"
+              @click="() => quickSelection(data)"
+              >一键全选</el-button
+            >
+            <el-button
+              type="text"
+              size="mini"
+              style="color: #f56c6c"
+              @click="() => quickCancel(data)"
+              >一键取消</el-button
+            >
           </span>
         </span>
       </el-tree>
       <div slot="footer" class="dialog-footer">
-        <el-button @click="roleFormVisible = false">{{ editId != 1 ? '取 消':'关 闭' }}</el-button>
-        <el-button v-if="editId != 1" type="primary" @click="submitRoleForm('role')">确 定</el-button>
+        <el-button @click="roleFormVisible = false">{{
+          editId != 1 ? "取 消" : "关 闭"
+        }}</el-button>
+        <el-button
+          v-if="editId != 1"
+          type="primary"
+          @click="submitRoleForm('role')"
+          >确 定</el-button
+        >
       </div>
     </el-dialog>
     <el-dialog
       :visible.sync="dialogVisible"
       :close-on-click-modal="false"
       width="45%"
-      :title="'add'===addFormType?'新增':'修改'"
+      :title="'add' === addFormType ? '新增' : '修改'"
       @close="cancelAddForm"
     >
-      <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="100px" class="demo-ruleForm">
-        <el-form-item v-if="addFormType!=='edit'" label="账号" prop="account">
-          <el-input v-model="ruleForm.account" type="text" autocomplete="off" />
+      <el-form
+        ref="ruleForm"
+        :model="ruleForm"
+        :rules="rules"
+        label-width="100px"
+        class="demo-ruleForm"
+      >
+        <el-form-item v-if="addFormType !== 'edit'" label="账号" prop="account">
+          <el-input
+            v-model="ruleForm.account"
+            type="text"
+            autocomplete="off"
+            disabled
+            placeholder="系统自动生成"
+          />
         </el-form-item>
         <el-form-item label="密码" prop="password">
-          <el-input v-model="ruleForm.password" type="password" autocomplete="off" />
+          <el-input
+            v-model="ruleForm.password"
+            type="password"
+            autocomplete="off"
+          />
         </el-form-item>
       </el-form>
 
@@ -103,7 +169,7 @@
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
+import { mapGetters } from "vuex";
 import {
   addSubAccount,
   deleteRole,
@@ -112,8 +178,8 @@ import {
   getAccountList,
   getMenuList,
   getRoleChecked,
-  setMenuRole
-} from '@/api/setting'
+  setMenuRole,
+} from "@/api/setting";
 
 export default {
   data() {
@@ -126,48 +192,37 @@ export default {
       listTotal: 0, // 列表总数
 
       editId: null,
-      addFormType: 'add',
+      addFormType: "add",
       addFormVisible: false,
       addForm: {
-        name: '' // 角色名
+        name: "", // 角色名
       },
       addFormRules: {
-        name: [
-          { required: true, message: '请输入角色名', trigger: 'blur' }
-        ]
+        name: [{ required: true, message: "请输入角色名", trigger: "blur" }],
       },
 
       roleFormVisible: false,
 
       menuRoleList: [],
       defaultProps: {
-        children: 'children',
-        label: 'moduleName'
+        children: "children",
+        label: "moduleName",
       },
       dialogVisible: false,
       ruleForm: {
-        account: '',
-        password: ''
+        account: "",
+        password: "",
       },
       rules: {
-        account: [
-          { required: true, message: '请输入账号', trigger: 'blur' }
-        ],
-        password: [
-          { required: true, message: '请输入密码', trigger: 'blur' }
-        ]
-      }
-    }
+        password: [{ required: true, message: "请输入密码", trigger: "blur" }],
+      },
+    };
   },
   computed: {
-    ...mapGetters([
-      'userid',
-      'name',
-      'customerId'
-    ])
+    ...mapGetters(["userid", "name", "customerId"]),
   },
   created() {
-    this.getList()
+    this.getList();
   },
   methods: {
     // 查询按钮权限
@@ -176,67 +231,67 @@ export default {
       // if(!btnRole) {return true}
       // let index = btnRole.indexOf(value);
       // return index >= 0 ? true : false;
-      return true
+      return true;
     },
 
     getList() {
-      this.listLoading = true
+      this.listLoading = true;
       const params = {
         pageNum: this.currentPage,
         pageSize: this.pageSize,
         customerId: this.customerId,
-         isMaster:false
-      }
-      getAccountList(params).then(res => {
-        this.dataList = res.data.records
-        this.listTotal = res.data.total
-        this.listLoading = false
-      })
+        isMaster: false,
+      };
+      getAccountList(params).then((res) => {
+        this.dataList = res.data.records;
+        this.listTotal = res.data.total;
+        this.listLoading = false;
+      });
     },
 
     // 更改每页数量
     handleSizeChange(val) {
-      this.pageSize = val
-      this.currentPage = 1
-      this.getList()
+      this.pageSize = val;
+      this.currentPage = 1;
+      this.getList();
     },
 
     // 更改当前页
     handleCurrentChange(val) {
-      this.currentPage = val
-      this.getList()
+      this.currentPage = val;
+      this.getList();
     },
 
     // 操作 - 删除
     handleDelete(id) {
-      deleteRole({ adminRoleId: id }).then(res => {
-        this.getList()
-        this.$successMsg()
-      })
+      deleteRole({ adminRoleId: id }).then((res) => {
+        this.getList();
+        this.$successMsg();
+      });
     },
 
     // 新增编辑
     addOrEdit(type, row) {
-      this.addFormType = type
-      this.dialogVisible = true
-      if (type === 'edit') {
+      this.addFormType = type;
+      this.dialogVisible = true;
+      if (type === "edit") {
         this.$nextTick(() => {
           this.ruleForm = {
             account: row.userName,
-            password: '',
-            adminUserId: row.adminUserId
-          }
-        })
+            password: "",
+            adminUserId: row.adminUserId,
+          };
+        });
       }
     },
 
     // 取消 新增编辑
     cancelAddForm() {
-      this.dialogVisible = false
+      this.dialogVisible = false;
       this.$nextTick(() => {
-        this.$refs.tree.setCheckedKeys([])
-      })
-      this.$refs.ruleForm.resetFields()
+        this.$refs.tree.setCheckedKeys([]);
+      });
+      this.$refs.ruleForm.resetFields();
     },
 
     // 提交 新增编辑
@@ -245,121 +300,120 @@ export default {
         const params = {
           userName: this.ruleForm.account,
           password: this.ruleForm.password,
-          adminModuleIds: ''
+          adminModuleIds: "",
           // adminModuleIds:this.$refs.tree ? this.$refs.tree.getCheckedKeys().join(',') :
-        }
+        };
         if (valid) {
-          if (this.addFormType === 'edit') {
-            params.adminUserId = this.ruleForm.adminUserId
-            editSubAccount(params).then(res => {
-              this.cancelAddForm()
-              this.getList()
-              this.$successMsg('编辑成功')
-            })
+          if (this.addFormType === "edit") {
+            params.adminUserId = this.ruleForm.adminUserId;
+            editSubAccount(params).then((res) => {
+              this.cancelAddForm();
+              this.getList();
+              this.$successMsg("编辑成功");
+            });
           } else {
-            addSubAccount(params).then(res => {
-              this.cancelAddForm()
-              this.getList()
-              this.$successMsg('新增成功')
-            })
+            addSubAccount(params).then((res) => {
+              this.cancelAddForm();
+              this.getList();
+              this.$successMsg("新增成功");
+            });
           }
         }
-      })
+      });
     },
 
     // 设置权限 - 获取列表
     setMenuRole(id, type) {
-      this.roleFormVisible = true
-      this.editId = id
-      getMenuList({ adminUserId: this.userid }).then(res => {
-        this.menuRoleList = res.data
-      })
-      getRoleChecked({ adminUserId: id }).then(res => {
-        this.$refs.tree.setCheckedKeys(res.data)
-      })
+      this.roleFormVisible = true;
+      this.editId = id;
+      getMenuList({ adminUserId: this.userid }).then((res) => {
+        this.menuRoleList = res.data;
+      });
+      getRoleChecked({ adminUserId: id }).then((res) => {
+        this.$refs.tree.setCheckedKeys(res.data);
+      });
     },
 
     // 设置权限 - 提交数据
     submitRoleForm(type) {
       const params = {
-        adminModuleIds: this.$refs.tree.getCheckedKeys().join(','),
-        adminRoleId: this.editId
-      }
-      setMenuRole(params).then(res => {
-        this.getList()
-        this.$successMsg()
-      })
-
-      this.roleFormVisible = false
+        adminModuleIds: this.$refs.tree.getCheckedKeys().join(","),
+        adminRoleId: this.editId,
+      };
+      setMenuRole(params).then((res) => {
+        this.getList();
+        this.$successMsg();
+      });
+
+      this.roleFormVisible = false;
     },
 
     // 一键全选
     quickSelection(data) {
-      const nowChecked = this.$refs.tree.getCheckedKeys()
-      const thisId = data.moduleId
-      let childId = []
+      const nowChecked = this.$refs.tree.getCheckedKeys();
+      const thisId = data.moduleId;
+      let childId = [];
       if (data.children.length) {
-        childId = this.familyTree(data.children)
+        childId = this.familyTree(data.children);
       }
 
-      const setChecked = nowChecked.concat([thisId]).concat(childId)
+      const setChecked = nowChecked.concat([thisId]).concat(childId);
 
-      this.$refs.tree.setCheckedKeys(setChecked)
+      this.$refs.tree.setCheckedKeys(setChecked);
     },
 
     // 一键取消
     quickCancel(data) {
-      const nowChecked = this.$refs.tree.getCheckedKeys()
-      const thisId = data.moduleId
-      let childId = []
+      const nowChecked = this.$refs.tree.getCheckedKeys();
+      const thisId = data.moduleId;
+      let childId = [];
       if (data.children.length) {
-        childId = this.familyTree(data.children)
+        childId = this.familyTree(data.children);
       }
 
-      const setChecked = nowChecked
+      const setChecked = nowChecked;
       if (setChecked.indexOf(thisId) >= 0) {
-        setChecked.splice(setChecked.indexOf(thisId), 1)
+        setChecked.splice(setChecked.indexOf(thisId), 1);
       }
 
       if (childId.length) {
         for (var i = 0; i < childId.length; i++) {
           if (setChecked.indexOf(childId[i]) >= 0) {
-            setChecked.splice(setChecked.indexOf(childId[i]), 1)
+            setChecked.splice(setChecked.indexOf(childId[i]), 1);
           }
         }
       }
 
-      this.$refs.tree.setCheckedKeys(setChecked)
+      this.$refs.tree.setCheckedKeys(setChecked);
     },
 
     // 递归子id
     familyTree(arr) {
-      var temp = []
-      var forFn = function(list) {
+      var temp = [];
+      var forFn = function (list) {
         for (var i = 0; i < list.length; i++) {
-          var item = list[i]
+          var item = list[i];
           if (item.children) {
-            temp.push(item.moduleId)
-            forFn(item.children)
+            temp.push(item.moduleId);
+            forFn(item.children);
           }
         }
-      }
-      forFn(arr)
-      return temp
+      };
+      forFn(arr);
+      return temp;
     },
 
     changeStatus(id, status) {
       editRole({
         adminRoleId: id,
-        visitSysStatus: status
-      }).then(res => {
-        this.getList()
-        this.$successMsg('编辑成功')
-      })
-    }
-
-  }
-}
+        visitSysStatus: status,
+      }).then((res) => {
+        this.getList();
+        this.$successMsg("编辑成功");
+      });
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
@@ -370,7 +424,7 @@ export default {
       max-height: calc(100vh - 140px - 54px - 70px);
       overflow-y: scroll;
       padding: 0 30px;
-      >.el-tree-node {
+      > .el-tree-node {
         padding: 15px 0;
         border: 1px dashed #ddd;
         margin-bottom: 15px;