refactor(shopAdmin): 重构管理员页面

- 新增 SuperAdmin 和 Admin 组件
- 优化管理员列表展示逻辑
- 添加超级管理员单独展示区域
-调整新建按钮文字为"添加"
- 移除不必要的注释代码

src/api/system/user/model/index.ts

@@ -152,6 +152,7 @@ export interface UserParam extends PageParam {
   sexName?: string;
   roleId?: string;
   isAdmin?: number;
+  isSuperAdmin?: boolean;
   showProfile?: boolean;
   isStaff?: boolean;
   templateId?: number;

src/views/shop/shopAdmin/components/admin.vue

@@ -1,368 +1,42 @@
 <template>
-
+  <a-card title="项目成员" style="margin-bottom: 20px">
-  <!-- 表格 -->
+    <template #extra>
-  <ele-pro-table
+      <a-space>
-    ref="tableRef"
+        <a-button>编辑</a-button>
-    row-key="userId"
+        <a-button type="primary">添加</a-button>
-    :columns="columns"
+      </a-space>
-    :datasource="datasource"
-    :where="defaultWhere"
-    :toolbar="false"
-    :needPage="false"
-    cache-key="proSystemUserTable"
-  >
-    <template #bodyCell="{ column, record }">
-      <template v-if="column.key === 'avatar'">
-        <a-avatar
-          :size="30"
-          :src="`${record.avatar}`"
-          style="margin-right: 4px"
-        >
-          <template #icon>
-            <UserOutlined/>
-          </template>
-        </a-avatar>
-      </template>
-      <template v-if="column.key === 'nickname'">
-        <span>{{ record.nickname }}</span>
-      </template>
-      <template v-if="column.key === 'mobile'">
-        <span v-if="hasRole('superAdmin')">{{ record.phone }}</span>
-        <span v-else>{{ record.mobile }}</span>
-      </template>
-      <template v-if="column.key === 'roles'">
-        <a-tag v-for="item in record.roles" :key="item.roleId" color="blue">
-          {{ item.roleName }}
-        </a-tag>
-      </template>
-      <template v-if="column.key === 'platform'">
-        <WechatOutlined v-if="record.platform === 'MP-WEIXIN'"/>
-        <Html5Outlined v-if="record.platform === 'H5'"/>
-        <ChromeOutlined v-if="record.platform === 'WEB'"/>
-      </template>
-      <template v-if="column.key === 'balance'">
-            <span class="ele-text-success">
-              ￥{{ formatNumber(record.balance) }}
-            </span>
-      </template>
-      <template v-if="column.key === 'expendMoney'">
-            <span class="ele-text-warning">
-              ￥{{ formatNumber(record.expendMoney) }}
-            </span>
-      </template>
-      <template v-if="column.key === 'isAdmin'">
-        <a-tag v-if="record.isAdmin">是</a-tag>
-        <a-tag v-else>否</a-tag>
-        <!--            <a-switch-->
-        <!--              :checked="record.isAdmin == 1"-->
-        <!--              @change="updateIsAdmin(record)"-->
-        <!--            />-->
-      </template>
-      <template v-if="column.key === 'action'">
-        <div>
-          <a @click="openEdit(record)">修改</a>
-          <a-divider type="vertical"/>
-          <!--              <a @click="resetPsw(record)">重置</a>-->
-          <!--              <a-divider type="vertical" />-->
-          <a-popconfirm
-            placement="topRight"
-            title="确定要删除此用户吗？"
-            @confirm="remove(record)"
-          >
-            <a class="ele-text-danger">删除</a>
-          </a-popconfirm>
-        </div>
-      </template>
     </template>
-  </ele-pro-table>
+    <template v-for="(item,_) in list" class="bg-gray-50 rounded-lg w-80 p-4 flex justify-between items-center">
+      <a-space>
+        <a-avatar size="large" :src="item.avatar"/>
+        <div class="text-gray-400 flex flex-col">
+          <span>{{ item.nickname }}</span>
+          <span>{{ item.createTime }}</span>
+        </div>
+      </a-space>
+    </template>
+  </a-card>
 </template>
 
 <script lang="ts" setup>
-import {createVNode, ref, reactive} from 'vue';
+import {ref, onMounted} from 'vue';
-import {message, Modal} from 'ant-design-vue/es';
 import {
-  PlusOutlined,
+  listUsers
-  DeleteOutlined,
-  UploadOutlined,
-  EditOutlined,
-  UserOutlined,
-  Html5Outlined,
-  ChromeOutlined,
-  WechatOutlined,
-  ExclamationCircleOutlined
-} from '@ant-design/icons-vue';
-import type {EleProTable} from 'ele-admin-pro/es';
-import type {
-  DatasourceFunction,
-  ColumnItem
-} from 'ele-admin-pro/es/ele-pro-table/types';
-import {messageLoading, formatNumber} from 'ele-admin-pro/es';
-import UserEdit from './components/user-edit.vue';
-import UserImport from './components/user-import.vue';
-import UserInfo from './components/user-info.vue';
-import {toDateString} from 'ele-admin-pro';
-import {
-  pageUsers,
-  removeUser,
-  removeUsers,
-  updateUserPassword,
-  updateUser
 } from '@/api/system/user';
-import type {User, UserParam} from '@/api/system/user/model';
+import {User} from "@/api/system/user/model";
-import {toTreeData, uuid} from 'ele-admin-pro';
-import {listRoles} from '@/api/system/role';
-import {listOrganizations} from '@/api/system/organization';
-import {Organization} from '@/api/system/organization/model';
-import {hasRole} from '@/utils/permission';
-import {getPageTitle} from "@/utils/common";
-import Extra from "./components/Extra.vue";
 
-// 加载状态
+const list = ref<User[]>([]);
-const loading = ref(true);
-// 树形数据
-const data = ref<Organization[]>([]);
-// 树展开的key
-const expandedRowKeys = ref<number[]>([]);
-// 树选中的key
-const selectedRowKeys = ref<number[]>([]);
-// 表格选中数据
-const selection = ref<User[]>([]);
-// 当前编辑数据
-const current = ref<User | null>(null);
-// 是否显示编辑弹窗
-const showEdit = ref(false);
-// 是否显示用户详情
-const showInfo = ref(false);
-// 是否显示用户导入弹窗
-const showImport = ref(false);
-const userType = ref<number>();
-const searchText = ref('');
 
-// 加载角色
+const reload = async () => {
-const roles = ref<any[]>([]);
+  const data = await listUsers({
-const filters = () => {
+    isAdmin: 1
-  listRoles().then((result) => {
-    result.map((d) => {
-      roles.value.push({
-        text: d.roleName,
-        value: d.roleId
-      });
-    });
   });
-};
+  if (data.length > 0) {
-filters();
+    list.value = data;
-// 加载机构
-listOrganizations()
-  .then((list) => {
-    loading.value = false;
-    const eks: number[] = [];
-    list.forEach((d) => {
-      d.key = d.organizationId;
-      d.value = d.organizationId;
-      d.title = d.organizationName;
-      if (typeof d.key === 'number') {
-        eks.push(d.key);
-      }
-    });
-    expandedRowKeys.value = eks;
-    data.value = toTreeData({
-      data: list,
-      idField: 'organizationId',
-      parentIdField: 'parentId'
-    });
-    if (list.length) {
-      if (typeof list[0].key === 'number') {
-        selectedRowKeys.value = [list[0].key];
-      }
-      // current.value = list[0];
-    } else {
-      selectedRowKeys.value = [];
-      // current.value = null;
-    }
-  })
-  .catch((e) => {
-    loading.value = false;
-    message.error(e.message);
-  });
-
-// 表格实例
-const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
-// 表格列配置
-const columns = ref<ColumnItem[]>([
-  {
-    title: 'ID',
-    dataIndex: 'userId',
-    width: 90,
-    showSorterTooltip: false
-  },
-  {
-    title: '头像',
-    key: 'avatar',
-    dataIndex: 'avatar',
-    align: 'center',
-    width: 90
-  },
-  {
-    title: '手机号码',
-    dataIndex: 'mobile',
-    align: 'center',
-    key: 'mobile',
-    showSorterTooltip: false
-  },
-  {
-    title: '注册时间',
-    dataIndex: 'createTime',
-    sorter: true,
-    showSorterTooltip: false,
-    ellipsis: true,
-    customRender: ({text}) => toDateString(text, 'yyyy-MM-dd')
-  },
-  {
-    title: '操作',
-    key: 'action',
-    width: 120,
-    fixed: 'right',
-    align: 'center'
   }
-]);
+}
 
-// 默认搜索条件
+onMounted(() => {
-const defaultWhere = reactive({
-  username: '',
-  nickname: ''
-});
-
-// 表格数据源
-const datasource: DatasourceFunction = ({
-                                          page,
-                                          limit,
-                                          where,
-                                          orders,
-                                          filters
-                                        }) => {
-  where = {};
-  where.roleId = filters.roles;
-  where.keywords = searchText.value;
-  where.isAdmin = 1;
-  return pageUsers({page, limit, ...where, ...orders});
-};
-
-/* 搜索 */
-const reload = (where?: UserParam) => {
-  selection.value = [];
-  tableRef?.value?.reload({where});
-};
-
-/* 打开编辑弹窗 */
-const openEdit = (row?: User) => {
-  current.value = row ?? null;
-  showEdit.value = true;
-};
-
-/* 打开用户详情弹窗 */
-const openInfo = (row?: User) => {
-  current.value = row ?? null;
-  showInfo.value = true;
-};
-
-/* 打开编辑弹窗 */
-const openImport = () => {
-  showImport.value = true;
-};
-
-const handleTabs = (e) => {
-  userType.value = Number(e.target.value);
   reload();
-};
+})
-
-/* 删除单个 */
-const remove = (row: User) => {
-  const hide = messageLoading('请求中..', 0);
-  removeUser(row.userId)
-    .then((msg) => {
-      hide();
-      message.success(msg);
-      reload();
-    })
-    .catch((e) => {
-      hide();
-      message.error(e.message);
-    });
-};
-
-/* 批量删除 */
-const removeBatch = () => {
-  if (!selection.value.length) {
-    message.error('请至少选择一条数据');
-    return;
-  }
-  Modal.confirm({
-    title: '提示',
-    content: '确定要删除选中的用户吗?',
-    icon: createVNode(ExclamationCircleOutlined),
-    maskClosable: true,
-    onOk: () => {
-      const hide = messageLoading('请求中..', 0);
-      removeUsers(selection.value.map((d) => d.userId))
-        .then((msg) => {
-          hide();
-          message.success(msg);
-          reload();
-        })
-        .catch((e) => {
-          hide();
-          message.error(e.message);
-        });
-    }
-  });
-};
-
-/* 重置用户密码 */
-const resetPsw = (row: User) => {
-  Modal.confirm({
-    title: '提示',
-    content: '确定要重置此用户的密码吗?',
-    icon: createVNode(ExclamationCircleOutlined),
-    maskClosable: true,
-    onOk: () => {
-      const hide = message.loading('请求中..', 0);
-      const password = uuid(8);
-      updateUserPassword(row.userId, password)
-        .then((msg) => {
-          hide();
-          message.success(msg + '，新密码：' + password);
-        })
-        .catch((e) => {
-          hide();
-          message.error(e.message);
-        });
-    }
-  });
-};
-
-/* 修改用户状态 */
-const updateIsAdmin = (row: User) => {
-  row.isAdmin = !row.isAdmin;
-  updateUser(row)
-    .then((msg) => {
-      message.success(msg);
-    })
-    .catch((e) => {
-      message.error(e.message);
-    });
-};
-
-/* 自定义行属性 */
-const customRow = (record: User) => {
-  return {
-    // 行点击事件
-    onClick: () => {
-      // console.log(record);
-    },
-    // 行双击事件
-    onDblclick: () => {
-      openEdit(record);
-    }
-  };
-};
 </script>

src/views/shop/shopAdmin/components/super-admin.vue

@@ -0,0 +1,41 @@
+<template>
+  <a-card title="管理员" style="margin-bottom: 20px">
+    <div class="title flex flex-col">
+      <div class="text-gray-400 pb-2">系统所有者，拥有全部权限</div>
+    </div>
+    <div v-if="item" class="bg-gray-50 rounded-lg w-80 p-4 flex justify-between items-center">
+      <a-space>
+        <a-avatar size="large" :src="item.avatar"/>
+        <div class="text-gray-400 flex flex-col">
+          <span>{{ item.nickname }}</span>
+          <span>{{ item.createTime }}</span>
+        </div>
+      </a-space>
+      <a>更换</a>
+    </div>
+  </a-card>
+</template>
+
+<script lang="ts" setup>
+import {ref, onMounted} from 'vue';
+import {
+  listUsers
+} from '@/api/system/user';
+import {User} from "@/api/system/user/model";
+
+const item = ref<User>();
+
+const reload = async () => {
+  const list = await listUsers({
+    isSuperAdmin: true
+  });
+  console.log(list)
+  if (list.length > 0) {
+    item.value = list[0];
+  }
+}
+
+onMounted(() => {
+  reload();
+})
+</script>

src/views/shop/shopAdmin/index.vue

@@ -1,16 +1,6 @@
 <template>
   <a-page-header :title="getPageTitle()" @back="() => $router.go(-1)">
-<!--    <a-card title="超级管理员" style="margin-bottom: 20px">-->
+    <SuperAdmin/>
-<!--      <Admin />-->
-<!--    </a-card>-->
-<!--    <a-card title="项目成员" style="margin-bottom: 20px">-->
-<!--      <template #extra>-->
-<!--        <a-button class="ele-btn-icon" @click="openEdit()">-->
-<!--          <span>添加</span>-->
-<!--        </a-button>-->
-<!--      </template>-->
-<!--      <Admin />-->
-<!--    </a-card>-->
     <a-card :bordered="false">
       <!-- 表格 -->
       <ele-pro-table
@@ -30,7 +20,7 @@
               <template #icon>
                 <plus-outlined/>
               </template>
-              <span>新建</span>
+              <span>添加</span>
             </a-button>
             <a-input-search
               allow-clear
@@ -154,6 +144,8 @@ import {Organization} from '@/api/system/organization/model';
 import {hasRole} from '@/utils/permission';
 import {getPageTitle, push} from "@/utils/common";
 import router from "@/router";
+import SuperAdmin from './components/super-admin.vue';
+import Admin from './components/admin.vue';
 
 // 加载状态
 const loading = ref(true);
@@ -413,7 +405,7 @@ const customRow = (record: User) => {
 
 const query = async () => {
   const info = await listRoles({})
-  if(info){
+  if (info) {
     roles.value = info
   }
 }

src/views/shop/shopCoupon/components/shopCouponEdit.vue

@@ -308,10 +308,7 @@ const form = reactive<ShopCoupon>({
   sortNumber: 100,
   status: 0, // 默认显示
   deleted: 0,
-  userId: undefined,
   tenantId: undefined,
-  createTime: undefined,
-  updateTime: undefined,
   totalCount: -1, // 默认无限制
   issuedCount: 0,
   limitPerUser: -1, // 默认无限制