From 3ce64b2d8959c23ed85773771cf2efb887b56502 Mon Sep 17 00:00:00 2001
From: lhl <analsak@163.com>
Date: Mon, 25 Aug 2025 13:52:31 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E6=9D=83=E9=99=90=E4=BF=AE=E6=94=B9ack?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/permissions/userPermission.vue | 387 ++++++++++++++++---------------
 1 file changed, 199 insertions(+), 188 deletions(-)

diff --git a/src/views/permissions/userPermission.vue b/src/views/permissions/userPermission.vue
index 171921c..38a67b2 100644
--- a/src/views/permissions/userPermission.vue
+++ b/src/views/permissions/userPermission.vue
@@ -1,7 +1,7 @@
 <script setup>
-import {computed, onMounted, ref} from 'vue'
-import {ElMessage, ElMessageBox} from 'element-plus'
-import {InfoFilled} from '@element-plus/icons-vue'
+import { computed, onMounted, ref } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { InfoFilled } from '@element-plus/icons-vue'
 import _ from 'lodash'
 import request from '@/util/http'
 import API from '@/util/http'
@@ -26,27 +26,37 @@ const getObj = ref({
   pageNum: 1,
   pageSize: 10
 })
-
+// 修改状态确认
+const ackVisible = ref(false)
+const currentStatusRow = ref(null)
+const statusLoading = ref({})
+const showStatusConfirm = (row, targetStatus) => {
+  currentStatusRow.value = {
+    ...row,// 当前行数据
+    targetStatus// 目标状态
+  }
+  ackVisible.value = true
+}
 // 规则
 const addUserRules = {
   account: [
-    {required: true, message: '请输入OA号', trigger: 'blur'},
-    {pattern: /^\d+$/, message: 'OA号必须为数字', trigger: 'blur'},
-    {max: 20, message: '长度不能超过20位', trigger: 'blur'}
+    { required: true, message: '请输入OA号', trigger: 'blur' },
+    { pattern: /^\d+$/, message: 'OA号必须为数字', trigger: 'blur' },
+    { max: 20, message: '长度不能超过20位', trigger: 'blur' }
   ],
   name: [
-    {required: true, message: '请输入用户名', trigger: 'blur'},
-    {max: 20, message: '长度不能超过20位', trigger: 'blur'}
+    { required: true, message: '请输入用户名', trigger: 'blur' },
+    { max: 20, message: '长度不能超过20位', trigger: 'blur' }
   ],
   market: [
-    {required: true, message: '请选择所属地区', trigger: 'change'}
+    { required: true, message: '请选择所属地区', trigger: 'change' }
   ],
   permission: [
-    {required: true, message: '请选择角色名称', trigger: 'change'}
+    { required: true, message: '请选择角色名称', trigger: 'change' }
   ],
   postiton: [
-    {required: true, message: '请输入职位', trigger: 'blur'},
-    {max: 20, message: '长度不能超过20位', trigger: 'blur'}
+    { required: true, message: '请输入职位', trigger: 'blur' },
+    { max: 20, message: '长度不能超过20位', trigger: 'blur' }
   ],
   machineIds: [
     {
@@ -93,7 +103,7 @@ const adminData = ref({})
 // todo 之后优化掉
 const getAdminData = async function () {
   try {
-    const result = await API({url: '/admin/userinfo', data: {}})
+    const result = await API({ url: '/admin/userinfo', data: {} })
     adminData.value = result
     // console.log('请求成功', result)
     console.log('管理员用户信息', adminData.value)
@@ -214,8 +224,8 @@ const getArea = async function () {
 
       return allChildren.map(child => {
         const grandchildren = child.children && child.children.length
-            ? transformTree([child]) // 递归处理子节点
-            : null;
+          ? transformTree([child]) // 递归处理子节点
+          : null;
 
         return {
           value: child.name,
@@ -320,7 +330,7 @@ const permissionList = ref([])
 
 const getRoles = async function () {
   try {
-    const res = await API({url: '/role/selectAll'})
+    const res = await API({ url: '/role/selectAll' })
     permissionList.value = res.data.map(item => ({
       label: item.roleName,
       value: item.id
@@ -436,7 +446,7 @@ const getUserLists = async function (selectedRoleId) {
     parentRoleTip.value = '';
     const parentRes = await request({
       url: '/role/selectFather',
-      data: {id: selectedRoleId}  // 用选中的角色ID请求
+      data: { id: selectedRoleId }  // 用选中的角色ID请求
     });
     const parentId = parentRes.data.fatherId;
     const parentName = parentRes.data.parentName;
@@ -454,7 +464,7 @@ const getUserLists = async function (selectedRoleId) {
     // }
     const res = await API({
       url: '/menu/tree',
-      data: {id: roleId}
+      data: { id: roleId }
     })
     data.value = processTreeData(res.data)
     permissionEditObj.value.checkedKeys = collectIds(res.data) || [];
@@ -469,11 +479,11 @@ const getUserLists = async function (selectedRoleId) {
 //编辑用户表单校验
 const editAdminRules = {
   market: [
-    {required: true, message: '请选择所属地区', trigger: 'change'}
+    { required: true, message: '请选择所属地区', trigger: 'change' }
   ],
   postiton: [
-    {required: true, message: '请输入职位', trigger: ['blur', 'change']},
-    {max: 20, message: '长度不能超过20位', trigger: ['blur', 'change']}
+    { required: true, message: '请输入职位', trigger: ['blur', 'change'] },
+    { max: 20, message: '长度不能超过20位', trigger: ['blur', 'change'] }
   ],
   machineIds: [
     {
@@ -494,7 +504,7 @@ const editAdminRules = {
 };
 // 编辑用户权限提交
 const permissionEdit = async function () {
-  let {adminName: userName, roleName: oldRole, roleId: newRoleId} = permissionEditObj.value;
+  let { adminName: userName, roleName: oldRole, roleId: newRoleId } = permissionEditObj.value;
   if (oldRole == null) {
     oldRole = '暂未分配角色'
   }
@@ -510,15 +520,15 @@ const permissionEdit = async function () {
       });
     });
     await ElMessageBox.confirm(
-        `确认修改权限角色？<br>您正在将【${userName}】的权限角色从【${oldRole}】修改为【${newRole}】<br>变更后，该用户的可操作权限将同步更新为新角色配置，涉及数据访问、功能操作等权限变化，请谨慎确认。`,
-        '警告',
-        {
-          confirmButtonText: '确认',
-          cancelButtonText: '取消',
-          type: "warning",
-          lockScroll: false,
-          dangerouslyUseHTMLString: true //允许解析 HTML 标签
-        }
+      `确认修改权限角色？<br>您正在将【${userName}】的权限角色从【${oldRole}】修改为【${newRole}】<br>变更后，该用户的可操作权限将同步更新为新角色配置，涉及数据访问、功能操作等权限变化，请谨慎确认。`,
+      '警告',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: "warning",
+        lockScroll: false,
+        dangerouslyUseHTMLString: true //允许解析 HTML 标签
+      }
     )
     const result = await request({
       url: '/permission/updateAdmin',
@@ -537,12 +547,12 @@ const permissionEdit = async function () {
     console.log('编辑最后提交数据', permissionEditObj.value);
     if (result.code === 200) {
       await ElMessageBox.alert(
-          `用户${userName}的权限角色已更改为【${newRole}】`,
-          '成功',
-          {
-            confirmButtonText: '确定',
-            type: 'success' // 设置为 success 类型
-          }
+        `用户${userName}的权限角色已更改为【${newRole}】`,
+        '成功',
+        {
+          confirmButtonText: '确定',
+          type: 'success' // 设置为 success 类型
+        }
       );
       getPermission();
       closeUserEditVisible();
@@ -584,13 +594,16 @@ const delConfirm = async function () {
 }
 // 禁用启用用户权限
 const editStatus = async function (row) {
+const { id, account, targetStatus, ...restRow } = currentStatusRow.value
+
   try {
-    console.log(row)
+    statusLoading.value[id] = true
 
+    console.log(row)
     permissionEditObj.value = {}
-    permissionEditObj.value.id = row.id
-    permissionEditObj.value.account = row.account
-    permissionEditObj.value.adminStatus = row.adminStatus
+    permissionEditObj.value.id = id
+    permissionEditObj.value.account = account
+    permissionEditObj.value.adminStatus = targetStatus
     console.log('修改用户权限状态', permissionEditObj.value)
 
     const result = await request({
@@ -598,9 +611,12 @@ const editStatus = async function (row) {
       data: permissionEditObj.value
     })
     console.log('请求成功2', result)
-    ElMessage.success(
+    if (result.code === 200) {
+      ElMessage.success(
         permissionEditObj.value.adminStatus === 1 ? '启用成功' : '禁用成功'
-    )
+      )
+      statusLoading.value[id] = false
+    }
     permissionEditObj.value = {}
     getPermission()
   } catch (error) {
@@ -652,8 +668,8 @@ const handleMarketChangeAddUser = (value) => {
   if (Array.isArray(value) && value.length > 0) {
     // 提取所有选中项的最后一级
     const selectedMarkets = value
-        .map(path => Array.isArray(path) && path.length > 0 ? path[path.length - 1] : null)
-        .filter(Boolean);
+      .map(path => Array.isArray(path) && path.length > 0 ? path[path.length - 1] : null)
+      .filter(Boolean);
 
     // 检查是否包含总部
     const hasHeadquarters = selectedMarkets.includes('总部');
@@ -676,8 +692,8 @@ const handleMarketChangeEditUser = (value) => {
   if (Array.isArray(value) && value.length > 0) {
     // 提取所有选中项的最后一级
     const selectedMarkets = value
-        .map(path => Array.isArray(path) && path.length > 0 ? path[path.length - 1] : null)
-        .filter(Boolean);
+      .map(path => Array.isArray(path) && path.length > 0 ? path[path.length - 1] : null)
+      .filter(Boolean);
 
     // 检查是否包含总部
     const hasHeadquarters = selectedMarkets.includes('总部');
@@ -881,158 +897,142 @@ onMounted(async function () {
 
 <template>
   <div>
-        <el-card style="margin-bottom: 20px;margin-top:10px">
-          <div class="head-card">
-            <div class="head-card-element">
-              <el-text class="mx-1" size="large">OA号：</el-text>
-              <el-input v-model="admin.account" style="width: 240px" placeholder="请输入OA号" clearable/>
-            </div>
-            <div class="head-card-element" style="margin-left: 50px">
-              <el-text class="mx-1" size="large">所属地区：</el-text>
-              <el-cascader
-                  v-model="admin.market"
-                  :options="marketsTree"
-                  placeholder="请选择所属地区"
-                  clearable
-                  style="width:180px"
-                  @change="handleMarketChange"
-              />
+    <el-card style="margin-bottom: 20px;margin-top:10px">
+      <div class="head-card">
+        <div class="head-card-element">
+          <el-text class="mx-1" size="large">OA号：</el-text>
+          <el-input v-model="admin.account" style="width: 240px" placeholder="请输入OA号" clearable />
+        </div>
+        <div class="head-card-element" style="margin-left: 50px">
+          <el-text class="mx-1" size="large">所属地区：</el-text>
+          <el-cascader v-model="admin.market" :options="marketsTree" placeholder="请选择所属地区" clearable style="width:180px"
+            @change="handleMarketChange" />
 
-            </div>
-            <div class="head-card-element" style="margin-left: 50px">
-              <el-text class="mx-1" size="large">职位名称：</el-text>
-              <el-select v-model="admin.postiton" placeholder="请选择职位名称" style="width: 240px" clearable>
-                <el-option v-for="item in postiton" :key="item" :label="item" :value="item"/>
-              </el-select>
-            </div>
+        </div>
+        <div class="head-card-element" style="margin-left: 50px">
+          <el-text class="mx-1" size="large">职位名称：</el-text>
+          <el-select v-model="admin.postiton" placeholder="请选择职位名称" style="width: 240px" clearable>
+            <el-option v-for="item in postiton" :key="item" :label="item" :value="item" />
+          </el-select>
+        </div>
 
-            <div class="head-card-btn">
-              <el-button type="success" @click="reset()">重置</el-button>
-              <el-button type="primary" @click="search()">查询</el-button>
-            </div>
-          </div>
-        </el-card>
-        <el-card>
-          <!-- 展示表单 -->
-          <div class="add-item">
-            <el-button style="color: #048efb; border: 1px solid #048efb" @click="userAddInit()">新增用户</el-button>
-          </div>
+        <div class="head-card-btn">
+          <el-button type="success" @click="reset()">重置</el-button>
+          <el-button type="primary" @click="search()">查询</el-button>
+        </div>
+      </div>
+    </el-card>
+    <el-card>
+      <!-- 展示表单 -->
+      <div class="add-item">
+        <el-button style="color: #048efb; border: 1px solid #048efb" @click="userAddInit()">新增用户</el-button>
+      </div>
 
-          <div>
-            <el-table :data="tableData" style="width: 100%" show-overflow-tooltip>
-              <el-table-column type="index" label="序号" width="100px" fixed="left">
-                <template #default="scope">
-                  <span>{{
-                      scope.$index + 1 + (getObj.pageNum - 1) * getObj.pageSize
-                    }}</span>
-                </template>
-              </el-table-column>
-
-              <el-table-column prop="account" label="OA号"/>
-              <el-table-column prop="name" label="姓名"/>
-              <el-table-column prop="market" label="所属地区"/>
-              <el-table-column prop="postiton" label="职位"/>
-              <el-table-column prop="roleName" label="部门权限">
-              </el-table-column>
-              <el-table-column prop="remark" label="备注"/>
-              <el-table-column prop="operation" label="操作" width="280px">
-                <template #default="scope">
-                  <el-button type="warning" text @click="resetPassword(scope.row)">
-                    重置密码
+      <div>
+        <el-table :data="tableData" style="width: 100%" show-overflow-tooltip>
+          <el-table-column type="index" label="序号" width="100px" fixed="left">
+            <template #default="scope">
+              <span>{{
+                scope.$index + 1 + (getObj.pageNum - 1) * getObj.pageSize
+              }}</span>
+            </template>
+          </el-table-column>
+
+          <el-table-column prop="account" label="OA号" />
+          <el-table-column prop="name" label="姓名" />
+          <el-table-column prop="market" label="所属地区" />
+          <el-table-column prop="postiton" label="职位" />
+          <el-table-column prop="roleName" label="部门权限">
+          </el-table-column>
+          <el-table-column prop="remark" label="备注" />
+          <el-table-column prop="operation" label="操作" width="280px">
+            <template #default="scope">
+              <el-button type="warning" text @click="resetPassword(scope.row)">
+                重置密码
+              </el-button>
+              <el-button type="primary" text @click="permissionEditInit(scope.row)"
+                :disabled="scope.row.adminStatus === 0 || scope.row.account === adminData.account">
+                修改权限
+              </el-button>
+              <el-popconfirm title="确定将此用户删除吗？" @confirm="delConfirm">
+                <template #reference>
+                  <el-button type="danger" text @click="del(scope.row)"
+                    :disabled="scope.row.adminStatus === 0 || scope.row.account === adminData.account">
+                    删除
                   </el-button>
-                  <el-button type="primary" text @click="permissionEditInit(scope.row)"
-                             :disabled="scope.row.adminStatus === 0 || scope.row.account === adminData.account">
-                    修改权限
+                </template>
+                <template #actions="{ confirm, cancel }">
+                  <el-button size="small" @click="cancel">取消</el-button>
+                  <el-button type="primary" size="small" @click="confirm">
+                    确定
                   </el-button>
-                  <el-popconfirm title="确定将此用户删除吗？" @confirm="delConfirm">
-                    <template #reference>
-                      <el-button type="danger" text @click="del(scope.row)"
-                                 :disabled="scope.row.adminStatus === 0 || scope.row.account === adminData.account">
-                        删除
-                      </el-button>
-                    </template>
-                    <template #actions="{ confirm, cancel }">
-                      <el-button size="small" @click="cancel">取消</el-button>
-                      <el-button type="primary" size="small" @click="confirm">
-                        确定
-                      </el-button>
-                    </template>
-                  </el-popconfirm>
                 </template>
-              </el-table-column>
-              <el-table-column prop="adminStatus" label="状态">
-                <template #default="scope">
-                  <el-switch v-model="scope.row.adminStatus" :active-value="1" :inactive-value="0" size="large"
-                             :disabled="scope.row.account === adminData.account" @change="editStatus(scope.row)" style="
+              </el-popconfirm>
+            </template>
+          </el-table-column>
+          <el-table-column prop="adminStatus" label="状态">
+            <template #default="scope">
+              <el-switch :model-value="scope.row.adminStatus" :active-value="1" :inactive-value="0" size="large"
+                :disabled="scope.row.account === adminData.account || statusLoading[scope.row.id]"
+                @change="(targetStatus) => showStatusConfirm(scope.row, targetStatus)" style="
                     --el-switch-on-color: #13ce66;
                     --el-switch-off-color: #ff4949;
-                  " active-text="启用" inactive-text="禁用" inline-prompt/>
-                </template>
-              </el-table-column>
-            </el-table>
-          </div>
+                  " active-text="启用" inactive-text="禁用" inline-prompt />
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
 
-          <!-- 分页 -->
-          <div class="pagination" style="margin-top: 20px">
-            <el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]"
-                           layout="total, sizes, prev, pager, next, jumper" :total="total"
-                           @size-change="handlePageSizeChange"
-                           @current-change="handleCurrentChange"></el-pagination>
-          </div>
-        </el-card>
+      <!-- 分页 -->
+      <div class="pagination" style="margin-top: 20px">
+        <el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]"
+          layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePageSizeChange"
+          @current-change="handleCurrentChange"></el-pagination>
+      </div>
+    </el-card>
   </div>
 
   <!-- 新增用户权限 -->
   <el-dialog v-model="userAddVisible" title="新增用户权限" width="800px" :close-on-click-modal="false"
-             @close="handleDialogClose">
+    @close="handleDialogClose">
     <template #footer>
       <el-form ref="Ref" :rules="addUserRules" :model="addAdmin" label-width="auto"
-               style="max-width: 600px; align-items: center">
+        style="max-width: 600px; align-items: center">
         <el-form-item prop="account" label="OA号:" required clearable>
-          <el-input v-model="addAdmin.account" placeholder="请输入OA号" style="width: 220px"/>
+          <el-input v-model="addAdmin.account" placeholder="请输入OA号" style="width: 220px" />
         </el-form-item>
 
         <el-form-item prop="name" label="用户名:" required clearable>
-          <el-input v-model="addAdmin.name" placeholder="请输入用户名" style="width: 220px"/>
+          <el-input v-model="addAdmin.name" placeholder="请输入用户名" style="width: 220px" />
         </el-form-item>
 
         <el-form-item prop="market" label="所属地区:" required clearable>
-          <el-cascader
-              v-model="addAdmin.market"
-              :options="marketsTree"
-              placeholder="请选择所属地区"
-              clearable
-              collapse-tags
-              collapse-tags-tooltip
-              style="width:220px"
-              @change="handleMarketChangeAddUser"
-              :max-collapse-tags="2"
-              :props="addUserProps"
-
-          />
+          <el-cascader v-model="addAdmin.market" :options="marketsTree" placeholder="请选择所属地区" clearable collapse-tags
+            collapse-tags-tooltip style="width:220px" @change="handleMarketChangeAddUser" :max-collapse-tags="2"
+            :props="addUserProps" />
         </el-form-item>
         <el-form-item prop="permission" label="角色名称:" required>
           <el-select v-model="addAdmin.permission" placeholder="请选择角色名称" style="width: 220px" clearable>
             <el-option v-for="item in permissionList" :key="item.value" :label="item.label"
-                       :value="item.value"></el-option>
+              :value="item.value"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item prop="postiton" label="职位:" required>
-          <el-input v-model="addAdmin.postiton" placeholder="请输入职位" style="width: 220px" clearable/>
+          <el-input v-model="addAdmin.postiton" placeholder="请输入职位" style="width: 220px" clearable />
         </el-form-item>
         <el-form-item prop="machineIds" label="机器码:" required>
           <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 10px;">
             <!-- 动态添加的机器码输入框 -->
             <div v-for="(item, index) in addAdmin.machineIds" :key="index">
               <el-input v-model="addAdmin.machineIds[index]" placeholder="请输入机器码"
-                        style="width: 220px; margin-right: 10px;"/>
+                style="width: 220px; margin-right: 10px;" />
             </div>
             <el-button type="primary" @click="addMachineIdInput">添加</el-button>
           </div>
         </el-form-item>
         <el-form-item prop="remark" label="备注">
           <el-input v-model="addAdmin.remark" style="width: 300px" :rows="2" maxlength="100" show-word-limit
-                    type="textarea"/>
+            type="textarea" />
         </el-form-item>
       </el-form>
 
@@ -1048,50 +1048,38 @@ onMounted(async function () {
   <!-- 这是编辑用户权限弹窗 -->
   <el-dialog v-model="userEditVisible" title="编辑用户权限" width="800px" :close-on-click-modal="false">
     <el-form ref="Ref" :rules="editAdminRules" :model="permissionEditObj" label-width="auto"
-             style="max-width: 600px; align-items: center">
+      style="max-width: 600px; align-items: center">
       <el-form-item prop="account" label="用户账号:" clearable>
-        <el-input v-model="permissionEditObj.account" placeholder="请输入OA号" style="width: 220px" disabled/>
+        <el-input v-model="permissionEditObj.account" placeholder="请输入OA号" style="width: 220px" disabled />
       </el-form-item>
       <el-form-item prop="name" label="用户名称:">
-        <el-input v-model="permissionEditObj.adminName" placeholder="请输入用户名" style="width: 220px" disabled/>
+        <el-input v-model="permissionEditObj.adminName" placeholder="请输入用户名" style="width: 220px" disabled />
       </el-form-item>
       <el-form-item prop="market" label="所属地区:" clearable>
-        <el-cascader
-            v-model="permissionEditObj.market"
-            :options="marketsTree"
-            placeholder="请选择所属地区"
-            clearable
-            collapse-tags
-            collapse-tags-tooltip
-            style="width:220px"
-            @change="handleMarketChangeEditUser"
-            :max-collapse-tags="2"
-            :props="editUserProps"
-
-        />
+        <el-cascader v-model="permissionEditObj.market" :options="marketsTree" placeholder="请选择所属地区" clearable
+          collapse-tags collapse-tags-tooltip style="width:220px" @change="handleMarketChangeEditUser"
+          :max-collapse-tags="2" :props="editUserProps" />
       </el-form-item>
       <el-form-item prop="postiton" label="职位:">
-        <el-input v-model="permissionEditObj.postiton" placeholder="请输入职位" style="width: 220px" clearable/>
+        <el-input v-model="permissionEditObj.postiton" placeholder="请输入职位" style="width: 220px" clearable />
       </el-form-item>
       <el-form-item prop="roleName" label="角色名称:">
-        <el-select v-model="permissionEditObj.roleId" placeholder="请选择角色" style="width: 220px"
-                   @change="getUserLists">
+        <el-select v-model="permissionEditObj.roleId" placeholder="请选择角色" style="width: 220px" @change="getUserLists">
           <el-option v-for="item in permissionList" :key="item.value" :label="item.label"
-                     :value="item.value"></el-option>
+            :value="item.value"></el-option>
         </el-select>
       </el-form-item>
       <el-form-item prop="parentName" label="上级角色:">
         <el-select v-model="permissionEditObj.parentId" placeholder="无上级角色" :disabled="!!parentRoleTip"
-                   style="width: 220px">
-          <el-option v-if="parentRoleTip" :key="0" :label="parentRoleTip" :value="null" disabled/>
+          style="width: 220px">
+          <el-option v-if="parentRoleTip" :key="0" :label="parentRoleTip" :value="null" disabled />
           <el-option v-else v-for="item in permissionList" :key="item.value" :label="item.label" disabled
-                     :value="item.value"></el-option>
+            :value="item.value"></el-option>
         </el-select>
       </el-form-item>
       <el-form-item prop="permissionSelect" label="权限列表:">
         <el-tree v-if="data.length > 0" :data="data" :disabled="true" show-checkbox node-key="id"
-                 :props="{ label: 'menuName', children: 'children' }"
-                 :default-checked-keys="permissionEditObj.checkedKeys">
+          :props="{ label: 'menuName', children: 'children' }" :default-checked-keys="permissionEditObj.checkedKeys">
         </el-tree>
         <div v-else style="display: flex; align-items: center; gap: 8px;">
           <span style="color: #999;">暂无数据</span>
@@ -1102,7 +1090,7 @@ onMounted(async function () {
           <!-- 动态添加的机器码输入框 -->
           <div v-for="(item, index) in permissionEditObj.machineIds" :key="index">
             <el-input v-model="permissionEditObj.machineIds[index]" placeholder=""
-                      style="width: 220px; margin-right: 10px;"/>
+              style="width: 220px; margin-right: 10px;" />
           </div>
           <el-button type="primary" @click="UseraddMachineIdInput">添加</el-button>
         </div>
@@ -1122,11 +1110,11 @@ onMounted(async function () {
 
   <!-- 重置密码确认弹窗 -->
   <el-dialog v-model="resetConfirmVisible" width="500px" :close-on-click-modal="false"
-             :before-close="cancelResetPassword">
+    :before-close="cancelResetPassword">
     <el-row>
       <el-col :span="4" style="margin-top: 20px">
         <el-icon class="dialog-icon" color="#10AEFF" size="50">
-          <InfoFilled/>
+          <InfoFilled />
         </el-icon>
       </el-col>
       <el-col :span="20">
@@ -1143,7 +1131,30 @@ onMounted(async function () {
     </template>
   </el-dialog>
 
-
+  <el-dialog v-model="ackVisible" :title="currentStatusRow?.adminStatus === 1 ? '确认禁用' : '确认启用'" width="300px"
+    :close-on-click-modal="false"
+    @close="() => { if (currentStatusRow) currentStatusRow.adminStatus = currentStatusRow.adminStatus === 1 ? 0 : 1 }">
+    <div class="status-confirm-content">
+      确定要{{ currentStatusRow?.adminStatus === 1 ? '禁用' : '启用' }}该用户吗？
+      <br>
+    </div>
+    <template #footer>
+      <div style="display: flex;">
+        <el-button @click="() => {
+          currentStatusRow.adminStatus = currentStatusRow.adminStatus === 1 ? 0 : 1
+          ackVisible = false
+        }">
+          取消
+        </el-button>
+        <el-button type="primary" @click="() => {
+          editStatus(currentStatusRow)
+          ackVisible = false
+        }">
+          确认
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
 </template>
 
 <style scoped>

From 509ba436d85fac272f4a23ca281b166b9a5e96d7 Mon Sep 17 00:00:00 2001
From: lhl <analsak@163.com>
Date: Mon, 25 Aug 2025 16:01:47 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E5=B7=A5=E4=BD=9C=E5=8F=B0=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/workspace/index.vue | 61 +++++++++++++++++++++++++------------------
 1 file changed, 35 insertions(+), 26 deletions(-)

diff --git a/src/views/workspace/index.vue b/src/views/workspace/index.vue
index cc076c9..dcafe21 100644
--- a/src/views/workspace/index.vue
+++ b/src/views/workspace/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="top">
-    <el-card style="width:20%" class="center-card">数据总览</el-card>
+    <el-card style="width:10vw" class="center-card">数据总览</el-card>
     <span class="text">
       最后更新时间：{{
         workDataUpdateTime && workDataUpdateTime !== '1970-01-01 08:00:00' ? workDataUpdateTime : '该地区暂无数据'
@@ -115,7 +115,7 @@
   </div>
 
   <div class="graph">
-    <el-card style="width:100%;">
+    <el-card style="width:84vw;">
       <div>
         <el-tabs v-model="activeTab" @tab-change="handleTabChange">
           <el-tab-pane label="金币充值" name="recharge"></el-tab-pane>
@@ -123,29 +123,29 @@
         </el-tabs>
       </div>
       <div class="condition">
-        <div style="display:flex;">合计&nbsp;&nbsp;
-          <span>永久金币：</span> {{ activeTab === 'recharge' ? sumRechargePermanent / 100 : sumConsumePermanent / 100 }}&nbsp;&nbsp;
-          <span>免费金币：</span> {{ activeTab === 'recharge' ? sumRechargeFree / 100 : sumConsumeFree / 100 }}&nbsp;&nbsp;
-          <span>任务金币：</span> {{ activeTab === 'recharge' ? sumRechargeTask / 100 : sumConsumeTask / 100 }}&nbsp;&nbsp;
+        <div class="stats">合计&nbsp;&nbsp;
+          <span>永久金币:</span> {{ activeTab === 'recharge' ? sumRechargePermanent / 100 : sumConsumePermanent / 100 }}&nbsp;&nbsp;
+          <span>免费金币:</span> {{ activeTab === 'recharge' ? sumRechargeFree / 100 : sumConsumeFree / 100 }}&nbsp;&nbsp;
+          <span>任务金币:</span> {{ activeTab === 'recharge' ? sumRechargeTask / 100 : sumConsumeTask / 100 }}&nbsp;&nbsp;
           <div v-if="activeTab === 'consume'">合计 {{ sumConsume / 100 }}</div>
         </div>
-        <div  style="margin-left:auto;margin-right: 0.5%;">
-          <el-button @click="getYes()" :type="activeTimeRange === 'yes' ? 'primary' : ''">昨天
+        <div>
+          <el-button @click="getYes()" size="small" :type="activeTimeRange === 'yes' ? 'primary' : ''">昨天
           </el-button>
-          <el-button @click="getToday()" :type="activeTimeRange === 'today' ? 'primary' : ''">今天
+          <el-button @click="getToday()" size="small" :type="activeTimeRange === 'today' ? 'primary' : ''">今天
           </el-button>
-          <el-button @click="getWeek()" :type="activeTimeRange === 'week' ? 'primary' : ''">本周
+          <el-button @click="getWeek()" size="small" :type="activeTimeRange === 'week' ? 'primary' : ''">本周
           </el-button>
-          <el-button @click="getMonth()" :type="activeTimeRange === 'month' ? 'primary' : ''">本月
+          <el-button @click="getMonth()" size="small" :type="activeTimeRange === 'month' ? 'primary' : ''">本月
           </el-button>
-          <el-button @click="getYear()" :type="activeTimeRange === 'year' ? 'primary' : ''">本年
+          <el-button @click="getYear()" size="small" :type="activeTimeRange === 'year' ? 'primary' : ''">本年
           </el-button>
         </div>
         <div>
-          <el-date-picker v-model="dateRange" type="datetimerange" range-separator="→" start-placeholder="开始时间"
-            end-placeholder="结束时间" format="YYYY-MM-DD HH:mm:ss" style="width:20vw" value-format="YYYY-MM-DD HH:mm:ss"
+          <el-date-picker size="small" v-model="dateRange" type="datetimerange" range-separator="→" start-placeholder="开始时间"
+            end-placeholder="结束时间" format="YYYY-MM-DD HH:mm:ss" style="width:20vw;margin-left:0.5vw;" value-format="YYYY-MM-DD HH:mm:ss"
             :default-time="defaultTime" :disabled-date="disabledDate" @change="handleDatePickerChange"/>
-          <el-button type="primary" style="margin-left: 5px" @click="getChartData">查询</el-button>
+          <el-button type="primary" size="small" style="margin-left: 0.5vw" @click="getChartData">查询</el-button>
         </div>
       </div>
 
@@ -807,13 +807,13 @@ onUnmounted(() => {
 
 <style scoped>
 .top {
-  height: 5.5%;
-  width:100%;
+  height: 5.5vh;
+  width:80vw;
   display: flex;
-  margin-bottom: 0.2%;
+  margin-bottom: 0.5vh;
   .text{
-    margin-left:0.2%;
-    width:50%;
+    margin-left:2vw;
+    width:20vw;
     display: flex; 
     align-items: center; 
     font-size: 18px;
@@ -821,7 +821,8 @@ onUnmounted(() => {
 }
 
 .card {
-  height: 28%;
+  height: 28vh;
+  margin-bottom: 0.5vh;
   display: flex;
   justify-content: center;
 }
@@ -836,21 +837,29 @@ onUnmounted(() => {
     height: 1%;
     display: flex;
     align-items: center;
+    .stats{
+      display:flex;
+      align-items:center;
+      width:35vw;
+      font-size: 15px;
+    }
   }
 
   .graph-content {
     flex: 1;
     height: auto;
     display: flex;
+    background-color: antiquewhite;
 
     .left {
       width: 70%;
       height: auto;
+      background-color: aquamarine;
     }
 
     .right {
       flex: 1;
-      padding: 0.5% 2%;
+      padding: 0.5vw 2vh;
     }
   }
 }
@@ -862,21 +871,21 @@ onUnmounted(() => {
 }
 
 .margin-bottom {
-  margin-bottom: 0.5%;
+  margin-bottom: 0.5vh;
 }
 
 .card-item {
   width: 25%;
-  height: 98%;
+  height: 28vh;
   display: flex;
   flex-direction: column;
   justify-content: center;
-  margin-right: 0.25%;
+  margin-right: 0.25vw;
 }
 
 .card-title {
   font-weight: bold;
-  margin-bottom: 10px;
+  margin-bottom: 1vh;
   display: flex;
   justify-content: center;
   align-items: center;