feat(AppSystemAccount): 优化账号管理功能

- 添加禁用/启用账号功能
- 编辑账号信息
- 优化账号列表展示
- 移除不必要的功能
- 调整表单验证规则

project/xumu/AppSystemAccount/AppSystemAccount.vue

@@ -1,7 +1,7 @@
 <template>
   <section class="AppSystemAccount">
     <ai-page title="账号管理">
-      <ai-area-tree :root-id="rootArea" slot="left" v-model="search.areaId" range="3" />
+      <ai-area-tree :root-id="rootArea" slot="left" v-model="search.areaId" range="3" @input="page.pageNum=1,getTableData()"/>
       <ai-search-bar>
         <template #left>
           <el-button type="primary" icon="iconfont iconAdd" @click="dialog = true">添加</el-button>
@@ -25,8 +25,8 @@
         <el-table-column slot="options" align="center" label="操作" fixed="right" width="180px">
           <template slot-scope="{ row }">
             <div class="table-options">
-              <el-button type="text" @click="appAllot(row)">功能分配</el-button>
-              <el-button type="text" @click="chooseWechat(row.id)">公众号</el-button>
+              <el-button type="text" @click="changeEnable(row)">{{ row.status == 1 ? '禁用' : '启用' }}</el-button>
+              <el-button type="text" @click="appAllot(row)">编辑</el-button>
               <el-button type="text" @click="handleDelete(row.id)">删除</el-button>
             </div>
           </template>
@@ -34,27 +34,28 @@
       </ai-table>
     </ai-page>
     <!--添加账号、功能分配-->
-    <ai-dialog :title="dialogTitle" :visible.sync="dialog" width="600px" @open="initDialogData"
+    <ai-dialog :title="dialogTitle" :visible.sync="dialog" width="60vw" @open="initDialogData"
                @onConfirm="updateAccount" @closed="dialogForm = {}">
-      <el-form ref="updateAccountForm" :model="dialogForm" :rules="rules" size="small" label-width="120px">
+      <el-form ref="updateAccountForm" :model="dialogForm" :rules="rules" size="small" label-width="120px" class="grid">
+        <el-form-item required label="行政区划" prop="areaId">
+          <ai-area-get v-model.trim="dialogForm.areaId" placeholder="请选择" :instance="instance"/>
+        </el-form-item>
+        <el-form-item required label="账户" prop="username">
+          <el-input v-model.trim="dialogForm.username" placeholder="请输入..." clearable :maxLength="15"/>
+        </el-form-item>
+        <el-form-item required label="账号密码" prop="password" v-if="!isEdit" :rules="[{ required: true, message: '请输入密码' }]">
+          <el-input v-model.trim="dialogForm.password" placeholder="请输入密码" clearable :minlength="6"/>
+        </el-form-item>
+        <el-form-item required label="角色" prop="roleId">
+          <el-select placeholder="请选择角色" :value="dialogForm.roleId" filterable v-model="dialogForm.roleId" clearable>
+            <el-option v-for="(op, i) in accountRoles" :key="i" :label="op.name" :value="op.id"/>
+          </el-select>
+        </el-form-item>
         <el-form-item required label="姓名" prop="name">
           <el-input v-model.trim="dialogForm.name" placeholder="请输入..." clearable :maxLength="15"/>
         </el-form-item>
-        <el-form-item required label="手机号码" prop="phone">
-          <el-input v-model.trim="dialogForm.phone" placeholder="请输入..." clearable :maxLength="11" :disabled="isEdit" />
-        </el-form-item>
-        <el-form-item required label="账号密码" prop="password" v-if="!isEdit"
-          :rules="[{ required: true, message: '请输入密码' }]">
-          <el-input v-model.trim="dialogForm.password" placeholder="请输入密码" clearable :minlength="6" />
-        </el-form-item>
-        <el-form-item required label="所属单位" prop="unitName" :rules="[{ required: true, message: '请输入所属单位' }]">
-          <el-input v-model.trim="dialogForm.unitName" placeholder="请输入所属单位" clearable />
-        </el-form-item>
-        <el-form-item required label="角色" prop="roleId">
-          <el-select size="small" placeholder="请选择角色" :value="dialogForm.roleId" filterable v-model="dialogForm.roleId"
-            clearable>
-            <el-option v-for="(op, i) in accountRoles" :key="i" :label="op.name" :value="op.id" />
-          </el-select>
+        <el-form-item label="手机号码" prop="phone">
+          <el-input v-model.trim="dialogForm.phone" placeholder="请输入..." clearable :maxLength="11"/>
         </el-form-item>
       </el-form>
     </ai-dialog>
@@ -90,21 +91,24 @@ export default {
     colConfigs() {
       return [
         // {type: 'selection', align: 'center'},
+        {label: "账号", slot: "username"},
         {label: "姓名", slot: "name"},
-        { label: "手机号", prop: "phone", align: 'center' },
-        { label: "所属单位", prop: "unitName", align: 'center' },
-        { label: "公众号", prop: "wxMpNames", align: 'center' },
+        {label: "联系方式", prop: "phone", align: 'center'},
         {label: "角色", prop: "roleName", align: 'center'},
+        {label: "状态", prop: "status", align: 'center', dict: "enable"},
+        {label: "认证状态", prop: "authStatus", align: 'center', dict: "authStatus"},
+        {label: "配置状态", prop: "configStatus", align: 'center', dict: "configStatus"},
         {slot: "options"}
       ]
     },
     rules() {
       return {
-        name: [{ required: true, message: "请填写姓名" }],
+        username: [{required: true, message: "请输入账号"}],
+        name: [{required: true, message: "请输入姓名"}],
         password: [{required: true, message: '请输入密码'}],
-        unitName: [{ required: true, message: "请选择所属单位" }],
+        areaId: [{required: true, message: "请选择行政区划"}],
         roleId: [{required: true, message: "请选择角色"}],
-        phone: [{ required: true, message: "请输入手机号码" }]
+        // phone: [{required: true, message: "请输入手机号码"}]
       }
     },
     rootArea: v => v.user.info.areaId
@@ -118,7 +122,6 @@ export default {
       tableData: [],
       search: {condition: ""},
       ids: [],
-      isShow: false,
       form: {
         appids: [],
         userId: ''
@@ -136,18 +139,6 @@ export default {
         }
       })
     },
-
-    chooseWechat(id) {
-      this.form.userId = id
-      this.instance.post(`/api/sysuserwxmp/list?size=1000&userId=${id}`).then(res => {
-        if (res.code == 0) {
-          this.form.appids = res.data.records.map(v => v.appId)
-        }
-      })
-
-      this.isShow = true
-    },
-
     onConfirm() {
       this.$refs.form.validate((valid) => {
         if (valid) {
@@ -157,7 +148,6 @@ export default {
             if (res.code == 0) {
               this.getTableData()
               this.$message.success('提交成功！')
-              this.isShow = false
 
               this.getList()
             }
@@ -215,11 +205,20 @@ export default {
         })
       }).catch(() => 0)
     },
-    handleAreaSelect(v) {
-      this.dialogForm.areaName = v?.[0]?.label
+    changeEnable(row) {
+      const {status, id} = row
+      this.$confirm(`是否要${status == 1 ? '禁用' : '启用'}该账号?`).then(() => {
+        this.instance.post("/user/update-status", null, {params: {id}}).then(res => {
+          if (res?.code == 0) {
+            this.$message.success(`${status == 1 ? '禁用' : '启用'}成功!`)
+            this.getTableData()
+          }
+        })
+      })
     }
   },
   created() {
+    this.dict.load("enable", "authStatus", "configStatus")
     this.getTableData()
   }
 }