From d40830188d3edef72e5683b4c64cbd0642bc32e6 Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Wed, 18 Dec 2024 12:01:46 +0800
Subject: [PATCH] =?UTF-8?q?feat(AppSystemAccount):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E8=B4=A6=E5=8F=B7=E7=AE=A1=E7=90=86=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 添加禁用/启用账号功能
- 编辑账号信息
- 优化账号列表展示
- 移除不必要的功能
- 调整表单验证规则
---
 .../AppSystemAccount/AppSystemAccount.vue     | 109 +++++++++---------
 1 file changed, 54 insertions(+), 55 deletions(-)

diff --git a/project/xumu/AppSystemAccount/AppSystemAccount.vue b/project/xumu/AppSystemAccount/AppSystemAccount.vue
index 7c17d52a..88abea26 100644
--- a/project/xumu/AppSystemAccount/AppSystemAccount.vue
+++ b/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>
@@ -9,15 +9,15 @@
         </template>
         <template #right>
           <el-input size="small" placeholder="搜索姓名、手机号" v-model="search.condition" clearable
-            @change="page.pageNum = 1, getTableData()" />
+                    @change="page.pageNum=1, getTableData()"/>
         </template>
       </ai-search-bar>
       <ai-table :tableData="tableData" :total="page.total" :current.sync="page.pageNum" :size.sync="page.pageSize"
-        @getList="getTableData" :col-configs="colConfigs" :dict="dict" @selection-change="v => ids = v.map(e => e.id)">
+                @getList="getTableData" :col-configs="colConfigs" :dict="dict" @selection-change="v => ids = v.map(e => e.id)">
         <el-table-column slot="name" label="姓名" width="180px">
           <el-row type="flex" align="middle" slot-scope="{row}">
             <el-image class="avatar" :src="row.avatar" :preview-src-list="[row.avatar]">
-              <el-image slot="error" src="https://cdn.cunwuyun.cn/dvcp/h5/defaultAvatar.png" alt="" />
+              <el-image slot="error" src="https://cdn.cunwuyun.cn/dvcp/h5/defaultAvatar.png" alt=""/>
             </el-image>
             <div>{{ row.name }}</div>
           </el-row>
@@ -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,35 +34,36 @@
       </ai-table>
     </ai-page>
     <!--添加账号、功能分配-->
-    <ai-dialog :title="dialogTitle" :visible.sync="dialog" width="600px" @open="initDialogData"
-      @onConfirm="updateAccount" @closed="dialogForm = {}">
-      <el-form ref="updateAccountForm" :model="dialogForm" :rules="rules" size="small" label-width="120px">
-        <el-form-item required label="姓名" prop="name">
-          <el-input v-model.trim="dialogForm.name" placeholder="请输入..." clearable :maxLength="15" />
+    <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" 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="phone">
-          <el-input v-model.trim="dialogForm.phone" placeholder="请输入..." clearable :maxLength="11" :disabled="isEdit" />
+        <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="unitName" :rules="[{ required: true, message: '请输入所属单位' }]">
-          <el-input v-model.trim="dialogForm.unitName" placeholder="请输入所属单位" clearable />
+        <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 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 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 label="手机号码" prop="phone">
+          <el-input v-model.trim="dialogForm.phone" placeholder="请输入..." clearable :maxLength="11"/>
+        </el-form-item>
       </el-form>
     </ai-dialog>
   </section>
 </template>
 
 <script>
-import { mapState } from "vuex";
+import {mapState} from "vuex";
 
 export default {
   name: "AppSystemAccount",
@@ -90,21 +91,24 @@ export default {
     colConfigs() {
       return [
         // {type: 'selection', align: 'center'},
-        { label: "姓名", slot: "name" },
-        { label: "手机号", prop: "phone", align: 'center' },
-        { label: "所属单位", prop: "unitName", align: 'center' },
-        { label: "公众号", prop: "wxMpNames", align: 'center' },
-        { label: "角色", prop: "roleName", align: 'center' },
-        { slot: "options" }
+        {label: "账号", slot: "username"},
+        {label: "姓名", slot: "name"},
+        {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: "请填写姓名" }],
-        password: [{ required: true, message: '请输入密码' }],
-        unitName: [{ required: true, message: "请选择所属单位" }],
-        roleId: [{ required: true, message: "请选择角色" }],
-        phone: [{ required: true, message: "请输入手机号码" }]
+        username: [{required: true, message: "请输入账号"}],
+        name: [{required: true, message: "请输入姓名"}],
+        password: [{required: true, message: '请输入密码'}],
+        areaId: [{required: true, message: "请选择行政区划"}],
+        roleId: [{required: true, message: "请选择角色"}],
+        // phone: [{required: true, message: "请输入手机号码"}]
       }
     },
     rootArea: v => v.user.info.areaId
@@ -112,13 +116,12 @@ export default {
   data() {
     return {
       accountRoles: [],
-      page: { pageNum: 1, pageSize: 10, total: 0 },
+      page: {pageNum: 1, pageSize: 10, total: 0},
       dialog: false,
       dialogForm: {},
       tableData: [],
-      search: { condition: "" },
+      search: {condition: ""},
       ids: [],
-      isShow: false,
       form: {
         appids: [],
         userId: ''
@@ -128,7 +131,7 @@ export default {
   methods: {
     getTableData() {
       this.instance.post("/admin/user/page", null, {
-        params: { ...this.page, ...this.search }
+        params: {...this.page, ...this.search}
       }).then(res => {
         if (res?.data) {
           this.tableData = res.data?.records
@@ -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()
             }
@@ -178,7 +168,7 @@ export default {
     },
     batchAllot() {
       this.dialog = true
-      this.dialogForm = { areaId: this.user.info.areaId, ids: this.ids }
+      this.dialogForm = {areaId: this.user.info.areaId, ids: this.ids}
     },
     appAllot(row) {
       this.dialog = true
@@ -206,7 +196,7 @@ export default {
     handleDelete(ids) {
       this.$confirm("是否要删除该账号?").then(() => {
         this.instance.post("/admin/user/del", null, {
-          params: { ids }
+          params: {ids}
         }).then(res => {
           if (res?.code == 0) {
             this.getTableData();
@@ -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()
   }
 }