From 964aab217d7fcdac2a3d8f895d0285afee28e696 Mon Sep 17 00:00:00 2001
From: YeMingfei666 <1619116647@qq.com>
Date: Mon, 17 Feb 2025 18:31:33 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=8F=9C=E5=8D=95?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E9=A1=B5=E9=9D=A2=EF=BC=8C=E8=A7=92=E8=89=B2?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E9=A1=B5=E9=9D=A2=EF=BC=8C=E4=BF=AE=E6=94=B9?=
 =?UTF-8?q?=E5=90=8E=E5=8F=B0=E8=BF=94=E5=9B=9E=E7=9A=84=E8=B7=AF=E7=94=B1?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E9=80=82=E9=85=8D=E9=A1=B9=E7=9B=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/account/menu.ts                       |   4 +-
 src/api/account/role.ts                       |  18 +-
 src/api/system/user.ts                        |   2 +-
 src/store/modules/permission.ts               |  47 +++--
 src/utils/request.ts                          |  12 +-
 src/views/admim/system/menu/index.vue         | 190 +++++++-----------
 .../admim/system/role/components/menus.vue    | 128 ++++++++++++
 src/views/admim/system/role/index.vue         | 133 ++++++------
 src/views/login/index.vue                     |  57 ++++--
 9 files changed, 382 insertions(+), 209 deletions(-)
 create mode 100644 src/views/admim/system/role/components/menus.vue

diff --git a/src/api/account/menu.ts b/src/api/account/menu.ts
index a4b5197..ba291ef 100644
--- a/src/api/account/menu.ts
+++ b/src/api/account/menu.ts
@@ -21,7 +21,7 @@ const MenuApi = {
     return request<any, MenuVO>({
       url: `${baseURL}/detail`,
       method: "get",
-      data: { id }
+      params: { id }
     });
   },
   add(data: addRequest) {
@@ -195,7 +195,7 @@ export interface editRequest {
   /**
    * 上级菜单，不传递则为顶级菜单
    */
-  pid?: number;
+  pid: number | string | null;
   title: string;
   [property: string]: any;
 }
diff --git a/src/api/account/role.ts b/src/api/account/role.ts
index faea2a6..52007cd 100644
--- a/src/api/account/role.ts
+++ b/src/api/account/role.ts
@@ -17,20 +17,29 @@ const RoleApi = {
       data,
     });
   },
-  update(data: editRequest) {
-    return request<any, editResponse>({
+  update(id: number | string | null, data: editRequest) {
+    const requestData = { ...data, id };
+    return request<any>({
       url: `${baseURL}`,
       method: "put",
-      data,
+      data: requestData,
     });
   },
   delete(data: delRequest) {
     return request<any, delResponse>({
       url: `${baseURL}`,
-      method: "put",
+      method: "delete",
       data,
     });
   },
+  // 获取角色对应的菜单id
+  getMenu(id: number) {
+    return request<any>({
+      url: `${baseURL}/menu`,
+      method: "get",
+      params: { id },
+    });
+  },
 };
 
 export default RoleApi;
@@ -226,3 +235,4 @@ export interface delResponse {
   [property: string]: any;
 }
 /** delete end */
+
diff --git a/src/api/system/user.ts b/src/api/system/user.ts
index fcd4c8d..e893e3d 100644
--- a/src/api/system/user.ts
+++ b/src/api/system/user.ts
@@ -216,7 +216,7 @@ export default UserAPI;
 export interface UserInfo {
   /** 用户ID */
   userId?: number;
-
+  id?: number | string;
   /** 用户名 */
   username?: string;
 
diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts
index 56f133d..c18d156 100644
--- a/src/store/modules/permission.ts
+++ b/src/store/modules/permission.ts
@@ -4,6 +4,7 @@ import { store } from "@/store";
 import router from "@/router";
 
 import MenuAPI, { type RouteVO } from "@/api/account/menu";
+const isTest = true//是否是本地调试
 const modules = import.meta.glob("../../views/**/**.vue");
 const Layout = () => import("@/layout/index.vue");
 
@@ -16,6 +17,8 @@ export const usePermissionStore = defineStore("permission", () => {
   // 路由是否加载完成
   const isRoutesLoaded = ref(false);
 
+
+
   /**
    * 获取后台动态路由数据，解析并注册到全局路由
    *
@@ -25,12 +28,18 @@ export const usePermissionStore = defineStore("permission", () => {
     return new Promise<RouteRecordRaw[]>((resolve, reject) => {
       MenuAPI.getRoutes()
         .then((data) => {
-          // const dynamicRoutes = parseDynamicRoutes(data);
-          // routes.value = [...constantRoutes, ...dynamicRoutes];
-          // isRoutesLoaded.value = true;
-          // resolve(dynamicRoutes);
-          isRoutesLoaded.value = true;
-          resolve(constantRoutes);
+          if (!isTest) {
+            const dynamicRoutes = parseDynamicRoutes(data.filter(v => v.type == 0));
+            routes.value = [...constantRoutes, ...dynamicRoutes];
+            console.log(routes.value);
+            isRoutesLoaded.value = true;
+            resolve(dynamicRoutes);
+          } else {
+
+            isRoutesLoaded.value = true;
+            resolve(constantRoutes);
+          }
+
         })
         .catch((error) => {
           reject(error);
@@ -55,7 +64,9 @@ export const usePermissionStore = defineStore("permission", () => {
    */
   const resetRouter = () => {
     // 清空本地存储的路由和菜单数据
-    // routes.value = [];
+    if (!isTest) {
+      routes.value = [];
+    }
     routes.value = constantRoutes;
     mixedLayoutLeftRoutes.value = [];
     // 从 Vue Router 中移除所有动态注册的路由
@@ -90,21 +101,33 @@ export const usePermissionStore = defineStore("permission", () => {
  */
 const parseDynamicRoutes = (rawRoutes: RouteVO[]): RouteRecordRaw[] => {
   const parsedRoutes: RouteRecordRaw[] = [];
-
   rawRoutes.forEach((route) => {
-    const normalizedRoute = { ...route } as RouteRecordRaw;
+    console.log(route.path)
+    const normalizedRoute = {
+      path: route.path,
+      meta: {
+        title: route.title,
+        icon: route.icon,
+        keepAlive: route.cache,
+        alwaysShow: route.path && route.path.startsWith('/') ? true : false,
+        hidden: route.hidden,
+      },
+      children: route.children,
+      component: route.component,
+    } as RouteRecordRaw;
 
     // 处理组件路径
     normalizedRoute.component =
-      normalizedRoute.component?.toString() === "Layout"
+      !normalizedRoute.component
         ? Layout
         : modules[`../../views/${normalizedRoute.component}.vue`] ||
-          modules["../../views/error-page/404.vue"];
-
+        modules["../../views/error-page/404.vue"];
     // 递归解析子路由
     if (normalizedRoute.children) {
+      // normalizedRoute.redirect = (!normalizedRoute.redirect && route.children.length <= 1) ? normalizedRoute.children[0].path : normalizedRoute.path
       normalizedRoute.children = parseDynamicRoutes(route.children);
     }
+    console.log(normalizedRoute)
 
     parsedRoutes.push(normalizedRoute);
   });
diff --git a/src/utils/request.ts b/src/utils/request.ts
index e1a9418..983887d 100644
--- a/src/utils/request.ts
+++ b/src/utils/request.ts
@@ -4,7 +4,6 @@ import { useUserStoreHook } from "@/store/modules/user";
 import { ResultEnum } from "@/enums/ResultEnum";
 import { getToken } from "@/utils/auth";
 import router from "@/router";
-
 // 创建 axios 实例
 const service = axios.create({
   baseURL: import.meta.env.VITE_APP_BASE_API,
@@ -23,6 +22,7 @@ service.interceptors.request.use(
     } else {
       delete config.headers.token;
     }
+    config.headers.shopId = useUserStoreHook().userInfo.id;
     return config;
   },
   (error) => Promise.reject(error)
@@ -37,6 +37,16 @@ service.interceptors.response.use(
     }
 
     const { code, data, msg } = response.data;
+    if (data) {
+      // 处理后台返回分页相关数据为字符串类型时，elementui组件警告
+      const kes = ['pageNumber', 'pageSize', 'totalPage', 'totalRow'];
+      const keys = Object.keys(data);
+      for (let i of kes) {
+        if (keys.includes(i)) {
+          data[i] = data[i] * 1;
+        }
+      }
+    }
     if (code === ResultEnum.SUCCESS || code === undefined || code === null) {
       return data ? data : response.data;
     }
diff --git a/src/views/admim/system/menu/index.vue b/src/views/admim/system/menu/index.vue
index 34b74c6..e0e91f9 100644
--- a/src/views/admim/system/menu/index.vue
+++ b/src/views/admim/system/menu/index.vue
@@ -48,47 +48,67 @@
 
         <el-table-column label="图标" align="center" width="80">
           <template #default="scope">
-            <div v-if="scope.row.icon" :class="`i-svg:${scope.row.icon}`" />
+            <template v-if="scope.row.icon && scope.row.icon.startsWith('el-icon')">
+              <el-icon style="vertical-align: -0.15em">
+                <component :is="scope.row.icon.replace('el-icon-', '')" />
+              </el-icon>
+            </template>
+            <template v-else-if="scope.row.icon">
+              <svg-icon :icon-class="scope.row.icon" />
+            </template>
+          </template>
+        </el-table-column>
+        <el-table-column label="类型" align="center" width="80">
+          <template #default="scope">
+            <el-tag
+              v-if="scope.row.type === MenuTypeEnum.MENU && scope.row.path.startsWith('/')"
+              type="warning"
+            >
+              目录
+            </el-tag>
+            <el-tag
+              v-if="scope.row.type === MenuTypeEnum.MENU && !scope.row.path.startsWith('/')"
+              type="success"
+            >
+              菜单
+            </el-tag>
+            <el-tag v-if="scope.row.type === MenuTypeEnum.BUTTON" type="danger">按钮</el-tag>
+            <el-tag v-if="scope.row.type === MenuTypeEnum.EXTLINK" type="info">外链</el-tag>
           </template>
         </el-table-column>
         <el-table-column label="排序" align="left" width="150" prop="menuSort" />
-        <el-table-column label="权限标识" align="center" width="200" prop="perm" />
+        <el-table-column label="路由路径" align="left" width="250" prop="path" />
         <el-table-column label="组件路径" align="left" width="250" prop="component" />
         <el-table-column label="外链" align="left" width="80" prop="iFrame">
           <template #default="scope">
             {{ scope.row.iFrame ? "是" : "否" }}
           </template>
         </el-table-column>
-        <el-table-column label="缓存" align="left" width="80" prop="iFrame">
+        <el-table-column label="缓存" align="left" width="80" prop="cache">
           <template #default="scope">
-            {{ scope.row.iFrame ? "是" : "否" }}
+            {{ scope.row.cache ? "是" : "否" }}
           </template>
         </el-table-column>
         <el-table-column label="可见" align="left" width="80" prop="iFrame">
           <template #default="scope">
-            {{ scope.row.iFrame ? "是" : "否" }}
+            {{ scope.row.hidden ? "否" : "是" }}
           </template>
         </el-table-column>
-        <el-table-column label="商家可用" align="left" width="80" prop="iFrame">
+        <el-table-column label="创建日期" align="left" prop="createTime">
           <template #default="scope">
-            {{ scope.row.iFrame ? "是" : "否" }}
-          </template>
-        </el-table-column>
-        <el-table-column label="商家可用" align="left" width="80" prop="iFrame">
-          <template #default="scope">
-            {{ scope.row.iFrame ? "是" : "否" }}
+            {{ scope.row.createTime }}
           </template>
         </el-table-column>
         <el-table-column fixed="right" align="center" label="操作" width="220">
           <template #default="scope">
             <el-button
-              v-if="scope.row.type == 'MENU' || scope.row.type == 'MENU'"
+              v-if="scope.row.type == 0"
               v-hasPerm="['sys:menu:add']"
               type="primary"
               link
               size="small"
               icon="plus"
-              @click.stop="handleOpenDialog(scope.row.id)"
+              @click.stop="handleOpenDialog(scope.row.menuId)"
             >
               新增
             </el-button>
@@ -99,7 +119,7 @@
               link
               size="small"
               icon="edit"
-              @click.stop="handleOpenDialog(undefined, scope.row.id)"
+              @click.stop="handleOpenDialog(undefined, scope.row.menuId)"
             >
               编辑
             </el-button>
@@ -109,7 +129,7 @@
               link
               size="small"
               icon="delete"
-              @click.stop="handleDelete(scope.row.id)"
+              @click.stop="handleDelete(scope.row.menuId)"
             >
               删除
             </el-button>
@@ -144,10 +164,10 @@
         </el-form-item>
 
         <el-form-item v-if="formData.iFrame == 1" label="外链地址" prop="path">
-          <el-input v-model="formData.routePath" placeholder="请输入外链完整路径" />
+          <el-input v-model="formData.path" placeholder="请输入外链完整路径" />
         </el-form-item>
 
-        <el-form-item v-if="formData.type == MenuTypeEnum.MENU" prop="routeName">
+        <el-form-item v-if="formData.type == MenuTypeEnum.MENU" prop="name">
           <template #label>
             <div class="flex-y-center">
               路由名称
@@ -161,10 +181,10 @@
               </el-tooltip>
             </div>
           </template>
-          <el-input v-model="formData.routeName" placeholder="User" />
+          <el-input v-model="formData.name" placeholder="User" />
         </el-form-item>
 
-        <el-form-item v-if="formData.type == MenuTypeEnum.MENU" prop="routePath">
+        <el-form-item v-if="formData.type == MenuTypeEnum.MENU" prop="path">
           <template #label>
             <div class="flex-y-center">
               路由路径
@@ -181,10 +201,10 @@
           </template>
           <el-input
             v-if="formData.type == MenuTypeEnum.MENU"
-            v-model="formData.routePath"
+            v-model="formData.path"
             placeholder="system"
           />
-          <el-input v-else v-model="formData.routePath" placeholder="user" />
+          <el-input v-else v-model="formData.path" placeholder="user" />
         </el-form-item>
 
         <el-form-item v-if="formData.type == MenuTypeEnum.MENU" prop="component">
@@ -208,85 +228,10 @@
           </el-input>
         </el-form-item>
 
-        <el-form-item v-if="formData.type == MenuTypeEnum.MENU">
-          <template #label>
-            <div class="flex-y-center">
-              路由参数
-              <el-tooltip placement="bottom" effect="light">
-                <template #content>
-                  组件页面使用 `useRoute().query.参数名` 获取路由参数值。
-                </template>
-                <el-icon class="ml-1 cursor-pointer">
-                  <QuestionFilled />
-                </el-icon>
-              </el-tooltip>
-            </div>
-          </template>
-
-          <div v-if="!formData.params || formData.params.length === 0">
-            <el-button type="success" plain @click="formData.params = [{ key: '', value: '' }]">
-              添加路由参数
-            </el-button>
-          </div>
-
-          <div v-else>
-            <div v-for="(item, index) in formData.params" :key="index">
-              <el-input v-model="item.key" placeholder="参数名" style="width: 100px" />
-
-              <span class="mx-1">=</span>
-
-              <el-input v-model="item.value" placeholder="参数值" style="width: 100px" />
-
-              <el-icon
-                v-if="formData.params.indexOf(item) === formData.params.length - 1"
-                class="ml-2 cursor-pointer color-[var(--el-color-success)]"
-                style="vertical-align: -0.15em"
-                @click="formData.params.push({ key: '', value: '' })"
-              >
-                <CirclePlusFilled />
-              </el-icon>
-              <el-icon
-                class="ml-2 cursor-pointer color-[var(--el-color-danger)]"
-                style="vertical-align: -0.15em"
-                @click="formData.params.splice(formData.params.indexOf(item), 1)"
-              >
-                <DeleteFilled />
-              </el-icon>
-            </div>
-          </div>
-        </el-form-item>
-
         <el-form-item v-if="formData.type !== MenuTypeEnum.BUTTON" prop="hidden" label="显示状态">
           <el-radio-group v-model="formData.hidden">
-            <el-radio :value="1">显示</el-radio>
-            <el-radio :value="0">隐藏</el-radio>
-          </el-radio-group>
-        </el-form-item>
-
-        <el-form-item
-          v-if="formData.type === MenuTypeEnum.MENU || formData.type === MenuTypeEnum.MENU"
-        >
-          <template #label>
-            <div class="flex-y-center">
-              始终显示
-              <el-tooltip placement="bottom" effect="light">
-                <template #content>
-                  选择“是”，即使目录或菜单下只有一个子节点，也会显示父节点。
-                  <br />
-                  选择“否”，如果目录或菜单下只有一个子节点，则只显示该子节点，隐藏父节点。
-                  <br />
-                  如果是叶子节点，请选择“否”。
-                </template>
-                <el-icon class="ml-1 cursor-pointer">
-                  <QuestionFilled />
-                </el-icon>
-              </el-tooltip>
-            </div>
-          </template>
-
-          <el-radio-group v-model="formData.alwaysShow">
-            <el-radio :value="1">是</el-radio>
-            <el-radio :value="0">否</el-radio>
+            <el-radio :value="1">隐藏</el-radio>
+            <el-radio :value="0">显示</el-radio>
           </el-radio-group>
         </el-form-item>
 
@@ -307,8 +252,12 @@
         </el-form-item>
 
         <!-- 权限标识 -->
-        <el-form-item v-if="formData.type == MenuTypeEnum.BUTTON" label="权限标识" prop="perm">
-          <el-input v-model="formData.perm" placeholder="sys:user:add" />
+        <el-form-item
+          v-if="formData.type == MenuTypeEnum.BUTTON"
+          label="权限标识"
+          prop="permission"
+        >
+          <el-input v-model="formData.permission" placeholder="sys:user:add" />
         </el-form-item>
 
         <el-form-item v-if="formData.type !== MenuTypeEnum.BUTTON" label="图标" prop="icon">
@@ -360,7 +309,7 @@ const menuOptions = ref<OptionType[]>([]);
 }
 const initialeditRequestData = ref<editRequest>({
   id: "",
-  pid: 0,
+  pid: "",
   hidden: 0,
   menuSort: 1,
   type: 0, // 默认菜单
@@ -376,12 +325,12 @@ const initialeditRequestData = ref<editRequest>({
 const formData = ref({ ...initialeditRequestData.value });
 // 表单验证规则
 const rules = reactive({
-  pid: [{ required: true, message: "请选择父级菜单", trigger: "blur" }],
+  pid: [{ required: false, message: "请选择父级菜单", trigger: "blur" }],
   title: [{ required: true, message: "请输入菜单名称", trigger: "blur" }],
   type: [{ required: true, message: "请选择菜单类型", trigger: "blur" }],
-  routeName: [{ required: true, message: "请输入路由名称", trigger: "blur" }],
-  routePath: [{ required: true, message: "请输入路由路径", trigger: "blur" }],
-  component: [{ required: true, message: "请输入组件路径", trigger: "blur" }],
+  name: [{ required: false, message: "请输入路由名称", trigger: "blur" }],
+  path: [{ required: true, message: "请输入路由路径", trigger: "blur" }],
+  component: [{ required: false, message: "请输入组件路径", trigger: "blur" }],
   hidden: [{ required: true, message: "请选择显示状态", trigger: "change" }],
 });
 
@@ -440,10 +389,19 @@ function handleOpenDialog(pid?: string, menuId?: string) {
     .then(() => {
       dialog.visible = true;
       if (menuId) {
+        console.log(menuId);
         dialog.title = "编辑菜单";
         MenuAPI.get(menuId).then((data) => {
-          initialeditRequestData.value = { ...data };
-          formData.value = data;
+          console.log(data);
+          initialeditRequestData.value = {
+            ...data,
+          };
+          formData.value = {
+            ...data,
+            cache: data.cache ? 1 : 0,
+            hidden: data.hidden ? 1 : 0,
+            pid: !pid ? "0" : data.pid,
+          };
         });
       } else {
         dialog.title = "新增菜单";
@@ -462,7 +420,7 @@ function handleMenuTypeChange() {
         formData.value.component = "";
       } else {
         // 其他情况，保留原有的组件路径
-        formData.value.routePath = initialeditRequestData.value.routePath;
+        formData.value.path = initialeditRequestData.value.path;
         formData.value.component = initialeditRequestData.value.component;
       }
     }
@@ -475,20 +433,26 @@ function handleMenuTypeChange() {
 function handleSubmit() {
   editRequestRef.value.validate((isValid: boolean) => {
     if (isValid) {
-      const menuId = formData.value.id;
+      const menuId = formData.value.menuId;
+      const submitFormData = {
+        ...formData.value,
+        cache: formData.value.cache ? 1 : 0,
+        hidden: formData.value.hidden ? 1 : 0,
+        pid: formData.value.pid == 0 ? null : formData.value.pid,
+      };
       if (menuId) {
         //修改时父级菜单不能为当前菜单
         if (formData.value.pid == menuId) {
           ElMessage.error("父级菜单不能为当前菜单");
           return;
         }
-        MenuAPI.edit(menuId, formData.value).then(() => {
+        MenuAPI.edit(menuId, submitFormData).then(() => {
           ElMessage.success("修改成功");
           handleCloseDialog();
           handleQuery();
         });
       } else {
-        MenuAPI.add(formData.value).then(() => {
+        MenuAPI.add(submitFormData).then(() => {
           ElMessage.success("新增成功");
           handleCloseDialog();
           handleQuery();
@@ -532,7 +496,7 @@ function resetForm() {
   editRequestRef.value.clearValidate();
   formData.value = {
     id: "",
-    pid: 0,
+    pid: "",
     hidden: 0,
     menuSort: 1,
     type: 0, // 默认菜单
diff --git a/src/views/admim/system/role/components/menus.vue b/src/views/admim/system/role/components/menus.vue
new file mode 100644
index 0000000..947326b
--- /dev/null
+++ b/src/views/admim/system/role/components/menus.vue
@@ -0,0 +1,128 @@
+<template>
+  <div class="flex-x-between">
+    <el-input v-model="permKeywords" clearable class="w-[150px]" placeholder="菜单菜单名称">
+      <template #prefix>
+        <Search />
+      </template>
+    </el-input>
+
+    <div class="flex-center ml-5">
+      <el-button type="primary" size="small" plain @click="togglePermTree">
+        <template #icon>
+          <Switch />
+        </template>
+        {{ isExpanded ? "收缩" : "展开" }}
+      </el-button>
+      <el-checkbox v-model="parentChildLinked" class="ml-5" @change="handleparentChildLinkedChange">
+        父子联动
+      </el-checkbox>
+
+      <el-tooltip placement="bottom">
+        <template #content>
+          如果只需勾选菜单菜单，不需要勾选子菜单或者按钮菜单，请关闭父子联动
+        </template>
+        <el-icon class="ml-1 color-[--el-color-primary] inline-block cursor-pointer">
+          <QuestionFilled />
+        </el-icon>
+      </el-tooltip>
+    </div>
+  </div>
+
+  <el-tree
+    ref="permTreeRef"
+    node-key="value"
+    show-checkbox
+    :data="menuPermOptions"
+    :filter-node-method="handlePermFilter"
+    :default-expand-all="true"
+    :check-strictly="!parentChildLinked"
+    class="mt-5"
+  >
+    <template #default="{ data }">
+      {{ data.label }}
+    </template>
+  </el-tree>
+</template>
+
+<script setup>
+import MenuAPI from "@/api/account/menu";
+
+const modelValue = defineModel("modelValue", {
+  type: Array,
+  required: true,
+  default: () => [],
+});
+const permKeywords = ref("");
+const isExpanded = ref(true);
+const parentChildLinked = ref(true);
+const permTreeRef = ref();
+// 展开/收缩 菜单菜单树
+function togglePermTree() {
+  isExpanded.value = !isExpanded.value;
+  if (permTreeRef.value) {
+    Object.values(permTreeRef.value.store.nodesMap).forEach((node) => {
+      if (isExpanded.value) {
+        node.expand();
+      } else {
+        node.collapse();
+      }
+    });
+  }
+}
+function handlePermFilter(value, data) {
+  if (!value) return true;
+  return data.label.includes(value);
+}
+
+// 父子菜单节点是否联动
+function handleparentChildLinkedChange(val) {
+  parentChildLinked.value = val;
+}
+
+// 菜单菜单下拉
+const menuPermOptions = ref([]);
+
+function returnMenu(menu) {
+  return menu.map((v) => {
+    return {
+      ...v,
+      label: v.title,
+      value: v.menuId,
+      children: v.children ? returnMenu(v.children) : [],
+    };
+  });
+}
+// 获取所有的菜单
+async function getMenuPermOptions() {
+  let arr = await MenuAPI.getList();
+  menuPermOptions.value = returnMenu(arr);
+}
+getMenuPermOptions();
+
+onMounted(() => {
+  console.log(modelValue.value);
+});
+
+watch(
+  () => modelValue.value,
+  (newval) => {}
+);
+
+function getPerms() {
+  return permTreeRef.value.getCheckedKeys();
+}
+function reset() {
+  permTreeRef.value.setCheckedKeys([]);
+}
+function setChecked(checkedMenuIds) {
+  checkedMenuIds.forEach((menuId) => {
+    console.log(menuId);
+    permTreeRef.value.setChecked(menuId, true, false);
+  });
+}
+defineExpose({
+  getPerms,
+  setChecked,
+  reset,
+});
+</script>
\ No newline at end of file
diff --git a/src/views/admim/system/role/index.vue b/src/views/admim/system/role/index.vue
index 04c9bb7..9d2ba79 100644
--- a/src/views/admim/system/role/index.vue
+++ b/src/views/admim/system/role/index.vue
@@ -35,18 +35,10 @@
         @selection-change="handleSelectionChange"
       >
         <el-table-column type="selection" width="55" align="center" />
-        <el-table-column label="角色名称" prop="name" min-width="100" />
-        <el-table-column label="角色编码" prop="code" width="150" />
-
-        <el-table-column label="状态" align="center" width="100">
-          <template #default="scope">
-            <el-tag v-if="scope.row.status === 1" type="success">正常</el-tag>
-            <el-tag v-else type="info">禁用</el-tag>
-          </template>
-        </el-table-column>
-
-        <el-table-column label="排序" align="center" width="80" prop="sort" />
-
+        <el-table-column label="角色名称" prop="name" />
+        <el-table-column label="角色级别" prop="level" />
+        <el-table-column label="描述" prop="description" />
+        <el-table-column label="创建日期" prop="createTime" />
         <el-table-column fixed="right" label="操作" width="220">
           <template #default="scope">
             <el-button
@@ -56,7 +48,7 @@
               icon="position"
               @click="handleOpenAssignPermDialog(scope.row)"
             >
-              分配权限
+              分配菜单
             </el-button>
             <el-button
               type="primary"
@@ -101,33 +93,24 @@
           <el-input v-model="formData.name" placeholder="请输入角色名称" />
         </el-form-item>
 
-        <el-form-item label="角色编码" prop="code">
-          <el-input v-model="formData.code" placeholder="请输入角色编码" />
+        <el-form-item label="角色等级" prop="level">
+          <el-input-number placeholder="角色等级" v-model="formData.level"></el-input-number>
         </el-form-item>
 
-        <el-form-item label="数据权限" prop="dataScope">
+        <!-- <el-form-item label="数据菜单" prop="dataScope">
           <el-select v-model="formData.dataScope">
             <el-option :key="0" label="全部数据" :value="0" />
             <el-option :key="1" label="部门及子部门数据" :value="1" />
             <el-option :key="2" label="本部门数据" :value="2" />
             <el-option :key="3" label="本人数据" :value="3" />
           </el-select>
+        </el-form-item> -->
+        <el-form-item label="描述" prop="description">
+          <el-input type="textarea" v-model="formData.description" placeholder="描述" />
         </el-form-item>
 
-        <el-form-item label="状态" prop="status">
-          <el-radio-group v-model="formData.status">
-            <el-radio :label="1">正常</el-radio>
-            <el-radio :label="0">停用</el-radio>
-          </el-radio-group>
-        </el-form-item>
-
-        <el-form-item label="排序" prop="sort">
-          <el-input-number
-            v-model="formData.sort"
-            controls-position="right"
-            :min="0"
-            style="width: 100px"
-          />
+        <el-form-item label="菜单分配" prop="menuIdList">
+          <menuSelect ref="refmenuSelect" v-model="formData.menuIdList"></menuSelect>
         </el-form-item>
       </el-form>
 
@@ -139,14 +122,14 @@
       </template>
     </el-dialog>
 
-    <!-- 分配权限弹窗 -->
+    <!-- 分配菜单弹窗 -->
     <el-drawer
       v-model="assignPermDialogVisible"
-      :title="'【' + checkedRole.name + '】权限分配'"
+      :title="'【' + checkedRole.name + '】菜单分配'"
       size="500"
     >
       <div class="flex-x-between">
-        <el-input v-model="permKeywords" clearable class="w-[150px]" placeholder="菜单权限名称">
+        <el-input v-model="permKeywords" clearable class="w-[150px]" placeholder="菜单菜单名称">
           <template #prefix>
             <Search />
           </template>
@@ -169,7 +152,7 @@
 
           <el-tooltip placement="bottom">
             <template #content>
-              如果只需勾选菜单权限，不需要勾选子菜单或者按钮权限，请关闭父子联动
+              如果只需勾选菜单菜单，不需要勾选子菜单或者按钮菜单，请关闭父子联动
             </template>
             <el-icon class="ml-1 color-[--el-color-primary] inline-block cursor-pointer">
               <QuestionFilled />
@@ -207,12 +190,13 @@ defineOptions({
   name: "Role",
   inheritAttrs: false,
 });
-
+import menuSelect from "./components/menus.vue";
 import RoleApi, { SysRole, addRequest, getListRequest } from "@/api/account/role";
 import MenuAPI, { type RouteVO } from "@/api/account/menu";
 
 const queryFormRef = ref();
 const addRequestRef = ref();
+const refmenuSelect = ref();
 const permTreeRef = ref();
 
 const loading = ref(false);
@@ -227,7 +211,7 @@ const queryParams = reactive<getListRequest>({
 
 // 角色表格数据
 const roleList = ref<SysRole[]>();
-// 菜单权限下拉
+// 菜单菜单下拉
 const menuPermOptions = ref<RouteVO[]>([]);
 
 // 弹窗
@@ -248,9 +232,7 @@ const formData = reactive<addRequest>({
 
 const rules = reactive({
   name: [{ required: true, message: "请输入角色名称", trigger: "blur" }],
-  code: [{ required: true, message: "请输入角色编码", trigger: "blur" }],
-  dataScope: [{ required: true, message: "请选择数据权限", trigger: "blur" }],
-  status: [{ required: true, message: "请选择状态", trigger: "blur" }],
+  level: [{ required: false, message: "请输入角色等级", trigger: "blur" }],
 });
 
 // 选中的角色
@@ -294,11 +276,19 @@ function handleSelectionChange(selection: any) {
 }
 
 // 打开角色弹窗
-function handleOpenDialog(row: SysRole) {
+async function handleOpenDialog(row: SysRole) {
   dialog.visible = true;
-  if (row.id) {
+  if (row && row.id) {
     dialog.title = "修改角色";
+    //获取角色菜单列表
+    const data = await RoleApi.getMenu(row.id);
     Object.assign(formData, row);
+    console.log(data);
+    formData.menuIdList = data;
+    setTimeout(() => {
+      refmenuSelect.value.setChecked(data);
+    }, 100);
+    console.log(formData);
   } else {
     dialog.title = "新增角色";
   }
@@ -308,10 +298,11 @@ function handleOpenDialog(row: SysRole) {
 function handleSubmit() {
   addRequestRef.value.validate((valid: any) => {
     if (valid) {
+      const checkedMenuIds: number[] = refmenuSelect.value.getPerms();
       loading.value = true;
       const roleId = formData.id;
       if (roleId) {
-        RoleApi.update({ ...formData, id: formData.id ?? null })
+        RoleApi.update(roleId, { ...formData, menuIdList: checkedMenuIds })
           .then(() => {
             ElMessage.success("修改成功");
             handleCloseDialog();
@@ -320,7 +311,8 @@ function handleSubmit() {
           .finally(() => (loading.value = false));
       } else {
         delete formData.id;
-        RoleApi.add(formData)
+
+        RoleApi.add({ ...formData, menuIdList: checkedMenuIds })
           .then(() => {
             ElMessage.success("新增成功");
             handleCloseDialog();
@@ -338,7 +330,7 @@ function handleCloseDialog() {
 
   addRequestRef.value.resetFields();
   addRequestRef.value.clearValidate();
-
+  refmenuSelect.value.reset();
   formData.id = undefined;
   formData.sort = 1;
   formData.status = 1;
@@ -378,7 +370,7 @@ interface typeRoute extends RouteVO {
   children: typeRoute[];
 }
 
-function returnMenu(menu: RouteVO[]): typeRoute[] {
+function returnMenu(menu) {
   return menu.map((v) => {
     return {
       ...v,
@@ -389,7 +381,13 @@ function returnMenu(menu: RouteVO[]): typeRoute[] {
   });
 }
 
-// 打开分配菜单权限弹窗
+// 获取所有的菜单
+async function getMenuPermOptions() {
+  let arr = await MenuAPI.getList({});
+  menuPermOptions.value = returnMenu(arr);
+}
+getMenuPermOptions();
+// 打开分配菜单菜单弹窗
 async function handleOpenAssignPermDialog(row: SysRole) {
   const roleId = row.id;
   if (roleId) {
@@ -399,34 +397,31 @@ async function handleOpenAssignPermDialog(row: SysRole) {
     checkedRole.value.id = roleId;
     checkedRole.value.name = row.name as string;
 
-    // 获取所有的菜单
-    let arr: RouteVO[] = await MenuAPI.getRoutes();
-    menuPermOptions.value = returnMenu(arr);
-
     // 回显角色已拥有的菜单
-    // RoleApi.getRoleMenuIds(roleId)
-    //   .then((data) => {
-    //     const checkedMenuIds = data;
-    //     checkedMenuIds.forEach((menuId) => permTreeRef.value!.setChecked(menuId, true, false));
-    //   })
-    //   .finally(() => {
-    //     loading.value = false;
-    //   });
+    RoleApi.getMenu(roleId)
+      .then((data) => {
+        const checkedMenuIds = data;
+        checkedMenuIds.forEach((menuId) => permTreeRef.value!.setChecked(menuId, true, false));
+      })
+      .finally(() => {
+        loading.value = false;
+      });
   }
 }
 
-// 分配菜单权限提交
+// 分配菜单菜单提交
 function handleAssignPermSubmit() {
   const roleId = checkedRole.value.id;
+  const name = checkedRole.value.name;
   if (roleId) {
     const checkedMenuIds: number[] = permTreeRef
       .value!.getCheckedNodes(false, true)
       .map((node: any) => node.value);
 
     loading.value = true;
-    RoleApi.updateRoleMenus(roleId, checkedMenuIds)
+    RoleApi.update(roleId, { name, menuIdList: checkedMenuIds })
       .then(() => {
-        ElMessage.success("分配权限成功");
+        ElMessage.success("分配菜单成功");
         assignPermDialogVisible.value = false;
         handleResetQuery();
       })
@@ -436,7 +431,7 @@ function handleAssignPermSubmit() {
   }
 }
 
-// 展开/收缩 菜单权限树
+// 展开/收缩 菜单菜单树
 function togglePermTree() {
   isExpanded.value = !isExpanded.value;
   if (permTreeRef.value) {
@@ -449,8 +444,20 @@ function togglePermTree() {
     });
   }
 }
+function editTogglePermTree() {
+  isExpanded.value = !isExpanded.value;
+  if (permTreeRef.value) {
+    Object.values(permTreeRef.value.store.nodesMap).forEach((node: any) => {
+      if (isExpanded.value) {
+        node.expand();
+      } else {
+        node.collapse();
+      }
+    });
+  }
+}
 
-// 权限筛选
+// 菜单筛选
 watch(permKeywords, (val) => {
   permTreeRef.value!.filter(val);
 });
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 364c15d..89b71b5 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -1,7 +1,13 @@
 <template>
   <div class="login" :style="'background-image:url(' + Background + ');'">
-    <el-form ref="loginForm" :model="state.loginForm" :rules="state.loginRules" label-position="left" label-width="0px"
-      class="login-form">
+    <el-form
+      ref="loginForm"
+      :model="state.loginForm"
+      :rules="state.loginRules"
+      label-position="left"
+      label-width="0px"
+      class="login-form"
+    >
       <h3 class="title">银收客后台管理</h3>
       <el-form-item>
         <el-radio-group v-model="state.loginForm.loginType">
@@ -10,19 +16,39 @@
         </el-radio-group>
       </el-form-item>
       <el-form-item prop="merchantName" v-if="state.loginForm.loginType == 'staff'">
-        <el-input v-model="state.loginForm.merchantName" type="text" auto-complete="off" placeholder="商户号"></el-input>
+        <el-input
+          v-model="state.loginForm.merchantName"
+          type="text"
+          auto-complete="off"
+          placeholder="商户号"
+        ></el-input>
       </el-form-item>
       <el-form-item prop="username">
-        <el-input v-model="state.loginForm.username" type="text" auto-complete="off" placeholder="账号"></el-input>
+        <el-input
+          v-model="state.loginForm.username"
+          type="text"
+          auto-complete="off"
+          placeholder="账号"
+        ></el-input>
       </el-form-item>
       <el-form-item prop="password">
-        <el-input v-model="state.loginForm.password" type="password" auto-complete="off" placeholder="密码"
-          @keyup.enter="handleLogin"></el-input>
+        <el-input
+          v-model="state.loginForm.password"
+          type="password"
+          auto-complete="off"
+          placeholder="密码"
+          @keyup.enter="handleLogin"
+        ></el-input>
       </el-form-item>
       <el-form-item prop="code">
         <div class="code_wrap">
-          <el-input v-model="state.loginForm.code" auto-complete="off" placeholder="验证码" style="width: 63%"
-            @keyup.enter="handleLogin"></el-input>
+          <el-input
+            v-model="state.loginForm.code"
+            auto-complete="off"
+            placeholder="验证码"
+            style="width: 63%"
+            @keyup.enter="handleLogin"
+          ></el-input>
           <div class="login-code">
             <img :src="state.codeUrl" @click="getCode" />
           </div>
@@ -30,8 +56,13 @@
       </el-form-item>
 
       <el-form-item style="width: 100%">
-        <el-button :loading="state.loading" size="default" type="primary" style="width: 100%"
-          @click.prevent="handleLogin">
+        <el-button
+          :loading="state.loading"
+          size="default"
+          type="primary"
+          style="width: 100%"
+          @click.prevent="handleLogin"
+        >
           <span v-if="!state.loading">登 录</span>
           <span v-else>登 录 中...</span>
         </el-button>
@@ -61,8 +92,8 @@ const state = reactive({
   codeUrl: "",
   cookiePass: "",
   loginForm: {
-    username: "",
-    password: "",
+    username: "admin",
+    password: "12345",
     // rememberMe: false,
     code: "",
     uuid: "",
@@ -152,7 +183,7 @@ function handleLogin() {
         .then(async (res) => {
           // await userStore.getUserInfo();
           const { path, queryParams } = parseRedirect();
-          console.log(res, 'Denglv返回');
+          console.log(res, "Denglv返回");
           router.push({ path: path, query: queryParams });
         })
         .catch(() => {

From ef45206230e6b5c0e7c9924ea392b78aacf85139 Mon Sep 17 00:00:00 2001
From: YeMingfei666 <1619116647@qq.com>
Date: Tue, 18 Feb 2025 15:27:07 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E5=A2=9E=E5=87=8F=E7=94=A8=E6=88=B7?=
 =?UTF-8?q?=E5=88=97=E8=A1=A8=E9=A1=B5=E9=9D=A2=EF=BC=8C=E4=BF=AE=E6=94=B9?=
 =?UTF-8?q?crud=E9=83=A8=E5=88=86=E4=BB=A3=E7=A0=81=EF=BC=8C=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9=E5=BA=97=E9=93=BA=E5=88=97=E8=A1=A8=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E4=B8=89=E6=96=B9=E9=85=8D=E7=BD=AE=E5=BC=B9?=
 =?UTF-8?q?=E7=AA=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/account/shopMerchant.ts               |  55 ++++
 src/api/account/shopUser.ts                   | 160 ++++++++++
 src/components/CURD/PageContent.vue           | 296 +++++++++++++-----
 src/components/CURD/PageModal.vue             |   7 +-
 src/components/CURD/types.ts                  |   6 +
 src/router/index.ts                           |   2 +-
 src/utils/request.ts                          |   3 +-
 .../shop/list/components/detailModal.vue      |  61 ++--
 src/views/shop/list/index.vue                 |  13 +-
 src/views/user/active.vue                     |   1 +
 src/views/user/index.vue                      |   0
 src/views/user/list/config/add.ts             | 135 ++++++++
 src/views/user/list/config/config.ts          |  46 +++
 src/views/user/list/config/content.ts         | 106 +++++++
 src/views/user/list/config/edit-money.ts      | 145 +++++++++
 src/views/user/list/config/edit.ts            | 136 ++++++++
 src/views/user/list/config/search.ts          |  35 +++
 src/views/user/list/index.vue                 | 169 ++++++++++
 18 files changed, 1271 insertions(+), 105 deletions(-)
 create mode 100644 src/api/account/shopMerchant.ts
 create mode 100644 src/api/account/shopUser.ts
 delete mode 100644 src/views/user/index.vue
 create mode 100644 src/views/user/list/config/add.ts
 create mode 100644 src/views/user/list/config/config.ts
 create mode 100644 src/views/user/list/config/content.ts
 create mode 100644 src/views/user/list/config/edit-money.ts
 create mode 100644 src/views/user/list/config/edit.ts
 create mode 100644 src/views/user/list/config/search.ts
 create mode 100644 src/views/user/list/index.vue

diff --git a/src/api/account/shopMerchant.ts b/src/api/account/shopMerchant.ts
new file mode 100644
index 0000000..25418b9
--- /dev/null
+++ b/src/api/account/shopMerchant.ts
@@ -0,0 +1,55 @@
+import request from "@/utils/request";
+import { Account_BaseUrl } from "@/api/config";
+const baseURL = Account_BaseUrl + "/admin/shopMerchant";
+const API = {
+  get(shopId: string | number) {
+    return request({
+      url: `${baseURL}`,
+      method: "get",
+      headers: {
+        shopId: shopId
+      }
+    });
+  },
+  edit(shopId: string | number, data: shopMerchantType) {
+    return request({
+      url: `${baseURL}`,
+      method: "put",
+      data: data,
+      headers: {
+        shopId: shopId
+      }
+    });
+  }
+}
+export default API;
+/**
+ * ShopMerchantEditDTO
+ */
+export interface shopMerchantType {
+  /**
+   * 支付宝appid
+   */
+  alipaySmallAppid: null | string;
+  /**
+   * 商户应用id
+   */
+  appId: null | string;
+  /**
+   * 商户秘钥
+   */
+  appSecret: null | string;
+  /**
+   * 支付密码
+   */
+  payPassword: null | string;
+  /**
+   * 支付系统商户id
+   */
+  storeId: null | string;
+  /**
+   * 微信appid
+   */
+  wechatSmallAppid: null | string;
+  [property: string]: any;
+}
\ No newline at end of file
diff --git a/src/api/account/shopUser.ts b/src/api/account/shopUser.ts
new file mode 100644
index 0000000..4831704
--- /dev/null
+++ b/src/api/account/shopUser.ts
@@ -0,0 +1,160 @@
+import request from "@/utils/request";
+import { Account_BaseUrl } from "@/api/config";
+const baseURL = Account_BaseUrl + "/admin/shopUser";
+const API = {
+  // 获取店铺用户概述信息
+  getSummary(data: getSummaryRequest) {
+    return request({
+      url: `${baseURL}/summary`,
+      method: "get",
+      params: data
+    });
+  },
+  getList(data: getListRequest) {
+    return request({
+      url: `${baseURL}`,
+      method: "get",
+      params: data
+    });
+  },
+  edit(shopId: string | number, data: editRequest) {
+    return request({
+      url: `${baseURL}`,
+      method: "put",
+      data: data,
+      headers: {
+        shopId: shopId
+      }
+    });
+  },
+  // 店铺用户余额修改
+  editMoney(shopId: string | number, data: editMoneyRequest) {
+    return request({
+      url: `${baseURL}/money`,
+      method: "put",
+      data: data,
+      headers: {
+        shopId: shopId
+      }
+    });
+  },
+  add(shopId: string | number, data: addRequest) {
+    return request({
+      url: `${baseURL}`,
+      method: "post",
+      data: data,
+      headers: {
+        shopId: shopId
+      }
+    });
+  }
+}
+export default API;
+
+export interface getSummaryRequest {
+  /**
+   * 0 非vip 1 vip
+   */
+  isVip?: number;
+  [property: string]: any;
+}
+export interface getListRequest {
+  /**
+   * 0 非vip 1 vip
+   */
+  isVip?: number;
+  /**
+   * 昵称或手机号
+   */
+  key?: string;
+  [property: string]: any;
+}
+
+/**
+ * ShopUserEditDTO
+ */
+export interface editRequest {
+  /**
+   * 生日
+   */
+  birthDay?: null | string;
+  /**
+   * 对应shopUserid
+   */
+  id: number | null;
+  /**
+   * 昵称
+   */
+  nickName?: null | string;
+  /**
+   * 性别 0女 1男
+   */
+  sex?: number | null;
+  [property: string]: any;
+}
+
+/**
+ * ShopUserMoneyEditDTO
+ */
+export interface editMoneyRequest {
+  /**
+   * 对应shopUserid
+   */
+  id: number | null;
+  /**
+   * 浮动金额
+   */
+  money: number | null;
+  /**
+   * 备注
+   */
+  remark?: null | string;
+  /**
+   * 0减少 1增加
+   */
+  type: number | null;
+  [property: string]: any;
+}
+
+/**
+ * ShopUserAddDTO
+ */
+export interface addRequest {
+  /**
+   * 账户积分
+   */
+  accountPoints?: number | null;
+  /**
+   * 钱包余额
+   */
+  amount?: number | null;
+  /**
+   * 会员生日
+   */
+  birthDay?: null | string;
+  /**
+   * 用户头像
+   */
+  headImg?: null | string;
+  /**
+   * 是否会员，
+   */
+  isVip?: number | null;
+  /**
+   * 用户昵称
+   */
+  nickName: null | string;
+  /**
+   * 电话号码
+   */
+  phone: null | string;
+  /**
+   * 0-女 1男
+   */
+  sex?: number | null;
+  /**
+   * 用户Id
+   */
+  userId: number | null;
+  [property: string]: any;
+}
\ No newline at end of file
diff --git a/src/components/CURD/PageContent.vue b/src/components/CURD/PageContent.vue
index 12193bd..ec86d1e 100644
--- a/src/components/CURD/PageContent.vue
+++ b/src/components/CURD/PageContent.vue
@@ -8,37 +8,58 @@
           <template v-if="typeof item === 'string'">
             <!-- 新增 -->
             <template v-if="item === 'add'">
-              <el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]" type="success" icon="plus"
-                @click="handleToolbar(item)">
+              <el-button
+                v-hasPerm="[`${contentConfig.pageName}:${item}`]"
+                type="success"
+                icon="plus"
+                @click="handleToolbar(item)"
+              >
                 新增
               </el-button>
             </template>
             <!-- 删除 -->
             <template v-else-if="item === 'delete'">
-              <el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]" type="danger" icon="delete"
-                :disabled="removeIds.length === 0" @click="handleToolbar(item)">
+              <el-button
+                v-hasPerm="[`${contentConfig.pageName}:${item}`]"
+                type="danger"
+                icon="delete"
+                :disabled="removeIds.length === 0"
+                @click="handleToolbar(item)"
+              >
                 删除
               </el-button>
             </template>
             <!-- 导入 -->
             <template v-else-if="item === 'import'">
-              <el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]" type="default" icon="upload"
-                @click="handleToolbar(item)">
+              <el-button
+                v-hasPerm="[`${contentConfig.pageName}:${item}`]"
+                type="default"
+                icon="upload"
+                @click="handleToolbar(item)"
+              >
                 导入
               </el-button>
             </template>
             <!-- 导出 -->
             <template v-else-if="item === 'export'">
-              <el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]" type="default" icon="download"
-                @click="handleToolbar(item)">
+              <el-button
+                v-hasPerm="[`${contentConfig.pageName}:${item}`]"
+                type="default"
+                icon="download"
+                @click="handleToolbar(item)"
+              >
                 导出
               </el-button>
             </template>
           </template>
           <!-- 其他 -->
           <template v-else-if="typeof item === 'object'">
-            <el-button v-hasPerm="[`${contentConfig.pageName}:${item.auth}`]" :icon="item.icon"
-              :type="item.type ?? 'default'" @click="handleToolbar(item.name)">
+            <el-button
+              v-hasPerm="[`${contentConfig.pageName}:${item.auth}`]"
+              :icon="item.icon"
+              :type="item.type ?? 'default'"
+              @click="handleToolbar(item.name)"
+            >
               {{ item.text }}
             </el-button>
           </template>
@@ -67,36 +88,68 @@
             </template>
             <!-- 导出 -->
             <template v-else-if="item === 'exports'">
-              <el-button v-hasPerm="[`${contentConfig.pageName}:export`]" icon="download" circle title="导出"
-                @click="handleToolbar(item)" />
+              <el-button
+                v-hasPerm="[`${contentConfig.pageName}:export`]"
+                icon="download"
+                circle
+                title="导出"
+                @click="handleToolbar(item)"
+              />
             </template>
             <!-- 导入 -->
             <template v-else-if="item === 'imports'">
-              <el-button v-hasPerm="[`${contentConfig.pageName}:import`]" icon="upload" circle title="导入"
-                @click="handleToolbar(item)" />
+              <el-button
+                v-hasPerm="[`${contentConfig.pageName}:import`]"
+                icon="upload"
+                circle
+                title="导入"
+                @click="handleToolbar(item)"
+              />
             </template>
             <!-- 搜索 -->
             <template v-else-if="item === 'search'">
-              <el-button v-hasPerm="[`${contentConfig.pageName}:query`]" icon="search" circle title="搜索"
-                @click="handleToolbar(item)" />
+              <el-button
+                v-hasPerm="[`${contentConfig.pageName}:query`]"
+                icon="search"
+                circle
+                title="搜索"
+                @click="handleToolbar(item)"
+              />
             </template>
           </template>
           <!-- 其他 -->
           <template v-else-if="typeof item === 'object'">
             <template v-if="item.auth">
-              <el-button v-hasPerm="[`${contentConfig.pageName}:${item.auth}`]" :icon="item.icon" circle
-                :title="item.title" @click="handleToolbar(item.name)" />
+              <el-button
+                v-hasPerm="[`${contentConfig.pageName}:${item.auth}`]"
+                :icon="item.icon"
+                circle
+                :title="item.title"
+                @click="handleToolbar(item.name)"
+              />
             </template>
             <template v-else>
-              <el-button :icon="item.icon" circle :title="item.title" @click="handleToolbar(item.name)" />
+              <el-button
+                :icon="item.icon"
+                circle
+                :title="item.title"
+                @click="handleToolbar(item.name)"
+              />
             </template>
           </template>
         </template>
       </div>
     </div>
     <!-- 列表 -->
-    <el-table ref="tableRef" v-loading="loading" v-bind="contentConfig.table" :data="pageData" :row-key="pk"
-      @selection-change="handleSelectionChange" @filter-change="handleFilterChange">
+    <el-table
+      ref="tableRef"
+      v-loading="loading"
+      v-bind="contentConfig.table"
+      :data="pageData"
+      :row-key="pk"
+      @selection-change="handleSelectionChange"
+      @filter-change="handleFilterChange"
+    >
       <template v-for="col in cols" :key="col">
         <el-table-column v-if="col.show" v-bind="col">
           <template #default="scope">
@@ -105,15 +158,24 @@
               <template v-if="col.prop">
                 <template v-if="Array.isArray(scope.row[col.prop])">
                   <template v-for="(item, index) in scope.row[col.prop]" :key="item">
-                    <el-image :src="item" :preview-src-list="scope.row[col.prop]" :initial-index="index"
-                      :preview-teleported="true" :style="`width: ${col.imageWidth ?? 40}px; height: ${col.imageHeight ?? 40
-                        }px`" />
+                    <el-image
+                      :src="item"
+                      :preview-src-list="scope.row[col.prop]"
+                      :initial-index="index"
+                      :preview-teleported="true"
+                      :style="`width: ${col.imageWidth ?? 40}px; height: ${
+                        col.imageHeight ?? 40
+                      }px`"
+                    />
                   </template>
                 </template>
                 <template v-else>
-                  <el-image :src="scope.row[col.prop]" :preview-src-list="[scope.row[col.prop]]"
+                  <el-image
+                    :src="scope.row[col.prop]"
+                    :preview-src-list="[scope.row[col.prop]]"
                     :preview-teleported="true"
-                    :style="`width: ${col.imageWidth ?? 40}px; height: ${col.imageHeight ?? 40}px`" />
+                    :style="`width: ${col.imageWidth ?? 40}px; height: ${col.imageHeight ?? 40}px`"
+                  />
                 </template>
               </template>
             </template>
@@ -135,20 +197,30 @@
             <template v-else-if="col.templet === 'switch'">
               <template v-if="col.prop">
                 <!-- pageData.length>0: 解决el-switch组件会在表格初始化的时候触发一次change事件 -->
-                <el-switch v-model="scope.row[col.prop]" :active-value="col.activeValue ?? 1"
-                  :inactive-value="col.inactiveValue ?? 0" :inline-prompt="true" :active-text="col.activeText ?? ''"
-                  :inactive-text="col.inactiveText ?? ''" :validate-event="false"
-                  :disabled="!hasAuth(`${contentConfig.pageName}:modify`)" @change="
+                <el-switch
+                  v-model="scope.row[col.prop]"
+                  :active-value="col.activeValue ?? 1"
+                  :inactive-value="col.inactiveValue ?? 0"
+                  :inline-prompt="true"
+                  :active-text="col.activeText ?? ''"
+                  :inactive-text="col.inactiveText ?? ''"
+                  :validate-event="false"
+                  :disabled="!hasAuth(`${contentConfig.pageName}:modify`)"
+                  @change="
                     pageData.length > 0 && handleModify(col.prop, scope.row[col.prop], scope.row)
-                    " />
+                  "
+                />
               </template>
             </template>
             <!-- 生成输入框组件 -->
             <template v-else-if="col.templet === 'input'">
               <template v-if="col.prop">
-                <el-input v-model="scope.row[col.prop]" :type="col.inputType ?? 'text'"
+                <el-input
+                  v-model="scope.row[col.prop]"
+                  :type="col.inputType ?? 'text'"
                   :disabled="!hasAuth(`${contentConfig.pageName}:modify`)"
-                  @blur="handleModify(col.prop, scope.row[col.prop], scope.row)" />
+                  @blur="handleModify(col.prop, scope.row[col.prop], scope.row)"
+                />
               </template>
             </template>
             <!-- 格式化为价格 -->
@@ -180,7 +252,7 @@
                 {{
                   scope.row[col.prop]
                     ? useDateFormat(scope.row[col.prop], col.dateFormat ?? "YYYY-MM-DD HH:mm:ss")
-                      .value
+                        .value
                     : ""
                 }}
               </template>
@@ -191,32 +263,68 @@
                 <template v-if="typeof item === 'string'">
                   <!-- 编辑/删除 -->
                   <template v-if="item === 'edit' || item === 'delete'">
-                    <el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]"
-                      :type="item === 'edit' ? 'primary' : 'danger'" :icon="item" size="small" link @click="
+                    <el-button
+                      v-hasPerm="[`${contentConfig.pageName}:${item}`]"
+                      :type="item === 'edit' ? 'primary' : 'danger'"
+                      :icon="item"
+                      size="small"
+                      link
+                      @click="
                         handleOperat({
                           name: item,
                           row: scope.row,
                           column: scope.column,
                           $index: scope.$index,
                         })
-                        ">
+                      "
+                    >
                       {{ item === "edit" ? "编辑" : "删除" }}
                     </el-button>
                   </template>
                 </template>
                 <!-- 其他 -->
                 <template v-else-if="typeof item === 'object'">
-                  <el-button v-if="item.render === undefined || item.render(scope.row)" v-bind="item.auth ? { 'v-hasPerm': [`${contentConfig.pageName}:${item.auth}`] } : {}
-                    " :icon="item.icon" :type="item.type ?? 'primary'" size="small" link @click="
-                      handleOperat({
-                        name: item.name,
-                        row: scope.row,
-                        column: scope.column,
-                        $index: scope.$index,
-                      })
-                      ">
-                    {{ item.text }}
-                  </el-button>
+                  <el-dropdown>
+                    <el-button
+                      v-if="item.render === undefined || item.render(scope.row)"
+                      v-bind="
+                        item.auth ? { 'v-hasPerm': [`${contentConfig.pageName}:${item.auth}`] } : {}
+                      "
+                      :icon="item.icon"
+                      :type="item.type ?? 'primary'"
+                      size="small"
+                      link
+                      @click="
+                        handleOperat({
+                          name: item.name,
+                          row: scope.row,
+                          column: scope.column,
+                          $index: scope.$index,
+                        })
+                      "
+                    >
+                      {{ item.text }}
+                    </el-button>
+                    <template #dropdown v-if="item.options && item.options.length > 0">
+                      <el-dropdown-menu>
+                        <el-dropdown-item
+                          @click="
+                            handleOperat({
+                              name: item.name,
+                              row: scope.row,
+                              column: scope.column,
+                              $index: scope.$index,
+                              command: opt.command ? opt.command : '',
+                            })
+                          "
+                          v-for="opt in item.options"
+                          :key="opt.value"
+                        >
+                          {{ opt.label }}
+                        </el-dropdown-item>
+                      </el-dropdown-menu>
+                    </template>
+                  </el-dropdown>
                 </template>
               </template>
             </template>
@@ -232,18 +340,33 @@
     <template v-if="showPagination">
       <el-scrollbar>
         <div class="mt-[12px]">
-          <el-pagination v-bind="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
+          <el-pagination
+            v-bind="pagination"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+          />
         </div>
       </el-scrollbar>
     </template>
     <!-- 导出弹窗 -->
-    <el-dialog v-model="exportsModalVisible" :align-center="true" title="导出数据" width="600px" style="padding-right: 0"
-      @close="handleCloseExportsModal">
+    <el-dialog
+      v-model="exportsModalVisible"
+      :align-center="true"
+      title="导出数据"
+      width="600px"
+      style="padding-right: 0"
+      @close="handleCloseExportsModal"
+    >
       <!-- 滚动 -->
       <el-scrollbar max-height="60vh">
         <!-- 表单 -->
-        <el-form ref="exportsFormRef" label-width="auto" style="padding-right: var(--el-dialog-padding-primary)"
-          :model="exportsFormData" :rules="exportsFormRules">
+        <el-form
+          ref="exportsFormRef"
+          label-width="auto"
+          style="padding-right: var(--el-dialog-padding-primary)"
+          :model="exportsFormData"
+          :rules="exportsFormRules"
+        >
           <el-form-item label="文件名" prop="filename">
             <el-input v-model="exportsFormData.filename" clearable />
           </el-form-item>
@@ -253,10 +376,16 @@
           <el-form-item label="数据源" prop="origin">
             <el-select v-model="exportsFormData.origin">
               <el-option label="当前数据 (当前页的数据)" :value="ExportsOriginEnum.CURRENT" />
-              <el-option label="选中数据 (所有选中的数据)" :value="ExportsOriginEnum.SELECTED"
-                :disabled="selectionData.length <= 0" />
-              <el-option label="全量数据 (所有分页的数据)" :value="ExportsOriginEnum.REMOTE"
-                :disabled="contentConfig.exportsAction === undefined" />
+              <el-option
+                label="选中数据 (所有选中的数据)"
+                :value="ExportsOriginEnum.SELECTED"
+                :disabled="selectionData.length <= 0"
+              />
+              <el-option
+                label="全量数据 (所有分页的数据)"
+                :value="ExportsOriginEnum.REMOTE"
+                :disabled="contentConfig.exportsAction === undefined"
+              />
             </el-select>
           </el-form-item>
           <el-form-item label="字段" prop="fields">
@@ -277,17 +406,35 @@
       </template>
     </el-dialog>
     <!-- 导入弹窗 -->
-    <el-dialog v-model="importModalVisible" :align-center="true" title="导入数据" width="600px" style="padding-right: 0"
-      @close="handleCloseImportModal">
+    <el-dialog
+      v-model="importModalVisible"
+      :align-center="true"
+      title="导入数据"
+      width="600px"
+      style="padding-right: 0"
+      @close="handleCloseImportModal"
+    >
       <!-- 滚动 -->
       <el-scrollbar max-height="60vh">
         <!-- 表单 -->
-        <el-form ref="importFormRef" label-width="auto" style="padding-right: var(--el-dialog-padding-primary)"
-          :model="importFormData" :rules="importFormRules">
+        <el-form
+          ref="importFormRef"
+          label-width="auto"
+          style="padding-right: var(--el-dialog-padding-primary)"
+          :model="importFormData"
+          :rules="importFormRules"
+        >
           <el-form-item label="文件名" prop="files">
-            <el-upload ref="uploadRef" v-model:file-list="importFormData.files" class="w-full"
+            <el-upload
+              ref="uploadRef"
+              v-model:file-list="importFormData.files"
+              class="w-full"
               accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
-              :drag="true" :limit="1" :auto-upload="false" :on-exceed="handleFileExceed">
+              :drag="true"
+              :limit="1"
+              :auto-upload="false"
+              :on-exceed="handleFileExceed"
+            >
               <el-icon class="el-icon--upload"><upload-filled /></el-icon>
               <div class="el-upload__text">
                 <span>将文件拖到此处，或</span>
@@ -296,8 +443,13 @@
               <template #tip>
                 <div class="el-upload__tip">
                   *.xlsx / *.xls
-                  <el-link v-if="contentConfig.importTemplate" type="primary" icon="download" :underline="false"
-                    @click="handleDownloadTemplate">
+                  <el-link
+                    v-if="contentConfig.importTemplate"
+                    type="primary"
+                    icon="download"
+                    :underline="false"
+                    @click="handleDownloadTemplate"
+                  >
                     下载模板
                   </el-link>
                 </div>
@@ -309,7 +461,11 @@
       <!-- 弹窗底部操作按钮 -->
       <template #footer>
         <div style="padding-right: var(--el-dialog-padding-primary)">
-          <el-button type="primary" :disabled="importFormData.files.length === 0" @click="handleImportSubmit">
+          <el-button
+            type="primary"
+            :disabled="importFormData.files.length === 0"
+            @click="handleImportSubmit"
+          >
             确 定
           </el-button>
           <el-button @click="handleCloseImportModal">取 消</el-button>
@@ -780,10 +936,10 @@ function fetchPageData(formData: IObject = {}, isRestart = false) {
     .indexAction(
       showPagination
         ? {
-          [request.pageName]: pagination.currentPage,
-          [request.limitName]: pagination.pageSize,
-          ...formData,
-        }
+            [request.pageName]: pagination.currentPage,
+            [request.limitName]: pagination.pageSize,
+            ...formData,
+          }
         : formData
     )
     .then((data) => {
diff --git a/src/components/CURD/PageModal.vue b/src/components/CURD/PageModal.vue
index a6121a2..925ef05 100644
--- a/src/components/CURD/PageModal.vue
+++ b/src/components/CURD/PageModal.vue
@@ -94,7 +94,10 @@
                 <template v-else-if="item.type === 'date-picker'">
                   <el-date-picker v-model="formData[item.prop]" v-bind="item.attrs" />
                 </template>
-
+                <!-- 图片上传 -->
+                <template v-else-if="item.type === 'UpImage'">
+                  <SingleImageUpload v-model="formData[item.prop]" />
+                </template>
                 <!-- Text 文本 -->
                 <template v-else-if="item.type === 'text'">
                   <el-text v-bind="item.attrs">
@@ -284,6 +287,7 @@ const props = defineProps<{
 // 自定义事件
 const emit = defineEmits<{
   submitClick: [];
+  formDataChange: [string, any];
 }>();
 const pk = props.modalConfig.pk ?? "id";
 const modalVisible = ref(false);
@@ -303,6 +307,7 @@ for (const item of formItems) {
       watch(
         () => formData[item.prop],
         (newValue, oldValue) => {
+          emit("formDataChange", item.prop, newValue);
           item.watch && item.watch(newValue, oldValue, formData, formItems);
         }
       );
diff --git a/src/components/CURD/types.ts b/src/components/CURD/types.ts
index 7433d01..5df3f1a 100644
--- a/src/components/CURD/types.ts
+++ b/src/components/CURD/types.ts
@@ -24,6 +24,7 @@ export interface IOperatData {
   row: IObject;
   column: IObject;
   $index: number;
+  command?: string | number;
 }
 
 export interface ISearchConfig {
@@ -185,6 +186,11 @@ export interface IContentConfig<T = any> {
         text: string;
         type?: "primary" | "success" | "warning" | "danger" | "info";
         render?: (row: IObject) => boolean;
+        options?: {
+          label: string;
+          command: string | number,
+          value?: any;
+        }[];
       }
     >;
     // filter值拼接符
diff --git a/src/router/index.ts b/src/router/index.ts
index 3aabe52..a7acc7e 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -463,7 +463,7 @@ export const constantRoutes: RouteRecordRaw[] = [
     children: [
       {
         path: "index",
-        component: () => import("@/views/user/index.vue"),
+        component: () => import("@/views/user/list/index.vue"),
         name: "userIndex",
         meta: {
           title: "用户列表",
diff --git a/src/utils/request.ts b/src/utils/request.ts
index 983887d..424ced4 100644
--- a/src/utils/request.ts
+++ b/src/utils/request.ts
@@ -15,6 +15,7 @@ const service = axios.create({
 // 请求拦截器
 service.interceptors.request.use(
   (config: InternalAxiosRequestConfig) => {
+    console.log(config);
     const accessToken = getToken();
     // 如果 Authorization 设置为 no-auth，则不携带 Token，用于登录、刷新 Token 等接口
     if (config.headers.Authorization !== "no-auth" && accessToken) {
@@ -22,7 +23,7 @@ service.interceptors.request.use(
     } else {
       delete config.headers.token;
     }
-    config.headers.shopId = useUserStoreHook().userInfo.id;
+    config.headers.shopId = config.headers.shopId || useUserStoreHook().userInfo.id;
     return config;
   },
   (error) => Promise.reject(error)
diff --git a/src/views/shop/list/components/detailModal.vue b/src/views/shop/list/components/detailModal.vue
index 7f83760..42e69d0 100644
--- a/src/views/shop/list/components/detailModal.vue
+++ b/src/views/shop/list/components/detailModal.vue
@@ -3,13 +3,16 @@
     <el-tabs v-model="activeName">
       <el-tab-pane label="聚合支付" name="pay">
         <el-form ref="form" :model="form" label-width="120px" label-position="left">
+          <el-form-item label="店铺id">
+            <el-input v-model="form.storeId" placeholder="请输入店铺id"></el-input>
+          </el-form-item>
           <el-form-item label="商户号">
             <el-input v-model="form.appId" placeholder="请输入商户号"></el-input>
           </el-form-item>
           <el-form-item label="商户密钥">
             <el-input
               type="textarea"
-              v-model="form.appToken"
+              v-model="form.appSecret"
               placeholder="请输入商户密钥"
             ></el-input>
           </el-form-item>
@@ -17,7 +20,10 @@
             <el-input v-model="form.payPassword" placeholder="请输入支付密码"></el-input>
           </el-form-item>
           <el-form-item label="微信appid">
-            <el-input v-model="form.smallAppid" placeholder="请输入微信小程序appid"></el-input>
+            <el-input
+              v-model="form.wechatSmallAppid"
+              placeholder="请输入微信小程序appid"
+            ></el-input>
           </el-form-item>
           <el-form-item label="支付宝appid">
             <el-input
@@ -31,32 +37,33 @@
                     <el-form-item label="支付宝商户密钥">
                         <el-input v-model="form.alipayAppToken" placeholder="请输入支付宝商户密钥"></el-input>
                     </el-form-item> -->
-          <el-form-item label="店铺id">
-            <el-input v-model="form.storeId" placeholder="请输入店铺id"></el-input>
-          </el-form-item>
+
           <el-form-item label="状态">
             <el-radio-group v-model="form.status">
-              <el-radio :label="1">启用</el-radio>
-              <el-radio :label="-1">禁用</el-radio>
+              <el-radio :value="1">启用</el-radio>
+              <el-radio :value="-1">禁用</el-radio>
             </el-radio-group>
           </el-form-item>
         </el-form>
       </el-tab-pane>
     </el-tabs>
-    <div slot="footer" class="dialog-footer">
-      <el-button @click="close">取消</el-button>
-      <el-button type="primary" @click="submitHandle" :loading="formLoading">
-        <span v-if="!formLoading">保存</span>
-        <span v-else>保存中...</span>
-      </el-button>
-    </div>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="close">取消</el-button>
+        <el-button type="primary" @click="submitHandle" :loading="formLoading">
+          <span v-if="!formLoading">保存</span>
+          <span v-else>保存中...</span>
+        </el-button>
+      </div>
+    </template>
   </el-dialog>
 </template>
 
 <script>
 // import { tbMerchantThirdApply, tbMerchantThirdApplyPut } from "@/api/shop";
 import ShopApi from "@/api/account/shop";
-
+import shopMerchantApi from "@/api/account/shopMerchant";
+import { ElNotification } from "element-plus";
 export default {
   data() {
     return {
@@ -64,12 +71,12 @@ export default {
       activeName: "pay",
       formLoading: false,
       form: {
-        appToken: "",
+        appSecret: "",
         id: "",
         payPassword: "",
         status: 1,
         appId: "",
-        smallAppid: "",
+        wechatSmallAppid: "",
         storeId: "",
         alipaySmallAppid: "",
         alipayAppToken: "",
@@ -82,12 +89,12 @@ export default {
     async submitHandle() {
       this.formLoading = true;
       try {
-        await tbMerchantThirdApplyPut(this.form);
+        await shopMerchantApi.edit(this.form.id, this.form);
         this.$emit("success");
         this.formLoading = false;
-        this.$notify({
+        ElNotification({
           title: "成功",
-          message: `提交成功`,
+          message: `修改成功`,
           type: "success",
         });
         this.close();
@@ -100,7 +107,7 @@ export default {
       this.dialogVisible = false;
     },
     reset() {
-      this.form.appToken = "";
+      this.form.appSecret = "";
       this.form.id = "";
       this.form.payPassword = "";
       this.form.status = 1;
@@ -108,14 +115,16 @@ export default {
     },
     // 详情（配置三方支付）
     async getDetail(id) {
+      console.log(id);
       try {
-        const res = await tbMerchantThirdApply(id);
-        this.form.appToken = res.appToken;
+        const res = await shopMerchantApi.get(id);
+        this.form.appSecret = res.appSecret;
         this.form.payPassword = res.payPassword;
         this.form.status = res.status;
         this.form.appId = res.appId;
-        this.form.smallAppid = res.smallAppid;
+        this.form.wechatSmallAppid = res.wechatSmallAppid;
         this.form.alipaySmallAppid = res.alipaySmallAppid;
+        this.form.merchantName = res.merchantName;
         //this.form.alipayAppToken = res.alipayAppToken
         //this.form.alipayAppId = res.alipayAppId
         this.form.storeId = res.storeId;
@@ -126,8 +135,8 @@ export default {
     },
     show(obj) {
       if (obj && obj.id) {
-        this.form.id = obj.merchantId;
-        this.getDetail(obj.merchantId);
+        this.form.id = obj.id;
+        this.getDetail(obj.id);
       }
     },
   },
diff --git a/src/views/shop/list/index.vue b/src/views/shop/list/index.vue
index 63c3b23..ff016c9 100644
--- a/src/views/shop/list/index.vue
+++ b/src/views/shop/list/index.vue
@@ -184,12 +184,13 @@ onMounted(() => {
 
 const refDetailModal = ref(null);
 function dropdownClick(e) {
-  switch (e.command) {
-    case 1:
-      refDetailModal.value.show(e.row);
-      break;
-    default:
-      break;
+  console.log(e);
+  if (e.command == 1) {
+    refDetailModal.value.show(e.row);
+    return;
+  }
+  if (e == 5) {
+    return;
   }
 }
 // 重置查询
diff --git a/src/views/user/active.vue b/src/views/user/active.vue
index e69de29..41a40c8 100644
--- a/src/views/user/active.vue
+++ b/src/views/user/active.vue
@@ -0,0 +1 @@
+<template></template>
\ No newline at end of file
diff --git a/src/views/user/index.vue b/src/views/user/index.vue
deleted file mode 100644
index e69de29..0000000
diff --git a/src/views/user/list/config/add.ts b/src/views/user/list/config/add.ts
new file mode 100644
index 0000000..14aaa5b
--- /dev/null
+++ b/src/views/user/list/config/add.ts
@@ -0,0 +1,135 @@
+import shopUserApi, { type addRequest } from "@/api/account/shopUser";
+import type { IModalConfig } from "@/components/CURD/types";
+
+const modalConfig: IModalConfig<addRequest> = {
+  pageName: "sys:user",
+  dialog: {
+    title: "添加用户",
+    width: 800,
+    draggable: true,
+  },
+  form: {
+    labelWidth: 140,
+  },
+  formAction: function (data: addRequest) {
+    return shopUserApi.add(data.shopid, data);
+  },
+  beforeSubmit(data) {
+    console.log("提交之前处理", data);
+  },
+  formItems: [
+    {
+      label: "用户头像",
+      prop: "headImg",
+      rules: [{ required: false, message: "请选择用户头像", trigger: "blur" }],
+      type: "UpImage",
+      attrs: {
+        placeholder: "请选择用户头像",
+      },
+
+    },
+    {
+      label: "用户昵称",
+      prop: "nickName",
+      rules: [{ required: true, message: "请输入用户昵称", trigger: "blur" }],
+      type: "input",
+      attrs: {
+        placeholder: "请输入用户昵称",
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    {
+      type: "input",
+      label: "手机号码",
+      prop: "phone",
+      rules: [
+        {
+          required: true,
+          pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+          message: "请输入正确的手机号码",
+          trigger: "blur",
+        },
+      ],
+      attrs: {
+        placeholder: "请输入手机号码",
+        maxlength: 11,
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    {
+      label: "会员生日",
+      prop: "birthDay",
+      rules: [{ required: false, message: "请选择会员生日", trigger: "blur" }],
+      type: "date-picker",
+      attrs: {
+        placeholder: "请选择会员生日",
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    {
+      type: "radio",
+      label: "性别",
+      prop: "sex",
+      rules: [{ required: false, message: "请选择性别", trigger: "blur" }],
+      attrs: {
+        placeholder: "请选择性别",
+      },
+      initialValue: '',
+      options: [
+        { label: '男', value: 1 },
+        { label: '女', value: 0 },
+      ],
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    {
+      label: "账户积分",
+      prop: "accountPoints",
+      rules: [{ required: false, message: "请输入账户积分", trigger: "blur" }],
+      type: "input-number",
+      attrs: {
+        placeholder: "请输入账户积分",
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    {
+      label: "钱包余额",
+      prop: "amount",
+      rules: [{ required: false, message: "请输入钱包余额", trigger: "blur" }],
+      type: "input-number",
+      attrs: {
+        placeholder: "请输入钱包余额",
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    {
+      type: "radio",
+      label: "是否会员",
+      prop: "isVip",
+      options: [
+        { label: '是', value: 1 },
+        { label: '否', value: 0 },
+      ],
+    },
+  ],
+};
+
+// 如果有异步数据会修改配置的，推荐用reactive包裹，而纯静态配置的可以直接导出
+export default reactive(modalConfig);
diff --git a/src/views/user/list/config/config.ts b/src/views/user/list/config/config.ts
new file mode 100644
index 0000000..87d75d4
--- /dev/null
+++ b/src/views/user/list/config/config.ts
@@ -0,0 +1,46 @@
+export const isVipOptions: statusOptions[] = [
+  { label: "全部", value: "" },
+  { label: "非会员", value: "0" },
+  { label: "会员", value: "1" },
+
+];
+
+export type optionsType = "isVip";
+
+export function returnOptions(type: optionsType) {
+  if (type === "isVip") {
+    return isVipOptions;
+  }
+}
+
+export function returnOptionsLabel(optionsType: optionsType, value: string | number) {
+  const options = returnOptions(optionsType);
+  if (!options) {
+    return "";
+  }
+  const option = options.find((item) => item.value === value);
+  return option ? option.label : "";
+}
+
+export interface options {
+  label: string;
+  value: string | number;
+  [property: string]: any;
+}
+export interface statusOptions extends options {
+}
+
+export type payTypeValue =
+  | ""
+  | "cash"
+  | "bank"
+  | "scanCode"
+  | "deposit"
+  | "vipPay"
+  | "arrears"
+  | "virtual"
+  | "arrears";
+
+export interface payTypeOptions extends options {
+  value: payTypeValue;
+}
diff --git a/src/views/user/list/config/content.ts b/src/views/user/list/config/content.ts
new file mode 100644
index 0000000..bd9ed55
--- /dev/null
+++ b/src/views/user/list/config/content.ts
@@ -0,0 +1,106 @@
+import shopUserApi, { type getListRequest } from "@/api/account/shopUser";
+import type { IContentConfig } from "@/components/CURD/types";
+
+const contentConfig: IContentConfig<any> = {
+  pageName: "sys:user",
+  table: {
+    border: true,
+    highlightCurrentRow: true,
+  },
+  pagination: {
+    background: true,
+    layout: "prev,pager,next,jumper,total,sizes",
+    pageSize: 20,
+    pageSizes: [10, 20, 30, 50],
+  },
+  indexAction: function (params: getListRequest) {
+    return shopUserApi.getList(params);
+  },
+  // deleteAction: shopUserApi.delete,
+  // modifyAction: function (data) {
+  //   // return shopUserApi.edit(data);
+  // },
+  pk: "id",
+  toolbar: ["add"],
+  defaultToolbar: ["refresh", "filter", "search"],
+  cols: [
+    { type: "selection", width: 50, align: "center" },
+    { label: "id", align: "center", prop: "id", width: 100, show: true },
+    {
+      label: "用户",
+      align: "center",
+      prop: "user",
+      templet: "custom",
+      slotName: "user",
+    },
+    {
+      label: "性别",
+      align: "center",
+      prop: "sex",
+      templet: "custom",
+      slotName: "gender",
+    },
+    {
+      label: "会员",
+      align: "center",
+      prop: "isVip",
+      templet: "custom",
+      slotName: "bol",
+    },
+    {
+      label: "手机号",
+      align: "center",
+      prop: "phone",
+      width: 140,
+      templet: "custom",
+      slotName: "mobile",
+    },
+    {
+      label: "余额",
+      align: "center",
+      prop: "amount",
+    },
+    {
+      label: "积分",
+      align: "center",
+      prop: "accountPoints",
+    },
+    {
+      label: "消费累计",
+      align: "center",
+      prop: "consumeAmount",
+    },
+    {
+      label: "消费次数累计",
+      align: "center",
+      prop: "consumeAmount",
+    },
+    {
+      label: "注册时间",
+      align: "center",
+      prop: "createTime",
+    },
+    {
+      label: "操作",
+      align: "center",
+      fixed: "right",
+      width: 180,
+      templet: "tool",
+      operat: [
+        {
+          name: "edit",
+          text: "编辑",
+        },
+        {
+          name: "more",
+          text: "更多",
+          options: [
+            { label: '增减余额', command: 'change-money' }
+          ]
+        },
+      ],
+    },
+  ],
+};
+
+export default contentConfig;
diff --git a/src/views/user/list/config/edit-money.ts b/src/views/user/list/config/edit-money.ts
new file mode 100644
index 0000000..6f31cbe
--- /dev/null
+++ b/src/views/user/list/config/edit-money.ts
@@ -0,0 +1,145 @@
+import shopUserApi, { type editMoneyRequest } from "@/api/account/shopUser";
+import type { IModalConfig } from "@/components/CURD/types";
+import { min } from "lodash";
+
+// 增减或者减少余额的类型
+export interface optuions {
+  label: string;
+  value: string | number;
+}
+export const addOptions: optuions[] = [
+  { label: '增加充值', value: 'adminIn' },
+  { label: '增加消费退款', value: 'adminRefund' },
+]
+export const reduceOptions: optuions[] = [
+  { label: '扣除消费', value: 'adminOut' },
+  { label: '扣除充值退款', value: 'adminInOut' },
+]
+
+
+const modalConfig: IModalConfig<editMoneyRequest> = {
+  pageName: "sys:user",
+  dialog: {
+    title: "增减余额",
+    width: 800,
+    draggable: true,
+  },
+  pk: "id",
+  form: {
+    labelWidth: 140,
+  },
+  formAction: function (data) {
+    return shopUserApi.editMoney(data.shopid, data);
+  },
+  beforeSubmit(data) {
+    console.log("提交之前处理", data);
+  },
+  formItems: [
+    {
+      label: "用户昵称",
+      prop: "nickName",
+      rules: [{ required: false, message: "请输入用户昵称", trigger: "blur" }],
+      type: "input",
+      disabled: true,
+      attrs: {
+        placeholder: "请输入用户昵称",
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    {
+      label: "钱包余额",
+      prop: "amount",
+      disabled: true,
+      rules: [{ required: false, message: "", trigger: "blur" }],
+      type: "input",
+      attrs: {
+        placeholder: "",
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    {
+      type: "radio",
+      label: "增减余额",
+      prop: "type",
+      rules: [{ required: true, message: "增减余额", trigger: "blur" }],
+      initialValue: 1,
+      options: [
+        { label: '增加', value: 1 },
+        { label: '减少', value: 0 },
+      ],
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+      watch() {
+
+      }
+    },
+    {
+      label: "金额",
+      prop: "money",
+      rules: [{ required: false, message: "请输入要增加或者减少的金额", trigger: "blur" }],
+      type: "input-number",
+      attrs: {
+        placeholder: "请输入要增加或者减少的金额",
+        min: 0,
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+      initialValue: 0
+    },
+    {
+      label: "类型",
+      prop: "bizEnum",
+      rules: [{ required: true, message: "请选择类型", trigger: "blur" }],
+      type: "radio-button",
+      attrs: {
+        placeholder: "请选择类型",
+      },
+      options: addOptions,
+    },
+    {
+      label: "备注",
+      prop: "remark",
+      rules: [{ required: false, message: "请输入备注", trigger: "blur" }],
+      type: "textarea",
+      attrs: {
+        placeholder: "请输入备注",
+      },
+    },
+    // {
+    //   label: "钱包余额",
+    //   prop: "amount",
+    //   rules: [{ required: false, message: "请输入钱包余额", trigger: "blur" }],
+    //   type: "input-number",
+    //   attrs: {
+    //     placeholder: "请输入钱包余额",
+    //   },
+    //   col: {
+    //     xs: 24,
+    //     sm: 12,
+    //   },
+    // },
+    // {
+    //   type: "radio",
+    //   label: "是否会员",
+    //   prop: "isVip",
+    //   options: [
+    //     { label: '是', value: 1 },
+    //     { label: '否', value: 0 },
+    //   ],
+    // },
+  ],
+};
+
+
+// 如果有异步数据会修改配置的，推荐用reactive包裹，而纯静态配置的可以直接导出
+export default reactive(modalConfig);
diff --git a/src/views/user/list/config/edit.ts b/src/views/user/list/config/edit.ts
new file mode 100644
index 0000000..0407712
--- /dev/null
+++ b/src/views/user/list/config/edit.ts
@@ -0,0 +1,136 @@
+import shopUserApi, { type editRequest } from "@/api/account/shopUser";
+import type { IModalConfig } from "@/components/CURD/types";
+
+const modalConfig: IModalConfig<editRequest> = {
+  pageName: "sys:user",
+  dialog: {
+    title: "修改用户",
+    width: 800,
+    draggable: true,
+  },
+  pk: "id",
+  form: {
+    labelWidth: 140,
+  },
+  formAction: function (data: editRequest) {
+    return shopUserApi.edit(data.shopid, data);
+  },
+  beforeSubmit(data) {
+    console.log("提交之前处理", data);
+  },
+  formItems: [
+    // {
+    //   label: "用户头像",
+    //   prop: "headImg",
+    //   rules: [{ required: false, message: "请选择用户头像", trigger: "blur" }],
+    //   type: "UpImage",
+    //   attrs: {
+    //     placeholder: "请选择用户头像",
+    //   },
+
+    // },
+    {
+      label: "用户昵称",
+      prop: "nickName",
+      rules: [{ required: false, message: "请输入用户昵称", trigger: "blur" }],
+      type: "input",
+      attrs: {
+        placeholder: "请输入用户昵称",
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    // {
+    //   type: "input",
+    //   label: "手机号码",
+    //   prop: "phone",
+    //   rules: [
+    //     {
+    //       required: true,
+    //       pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+    //       message: "请输入正确的手机号码",
+    //       trigger: "blur",
+    //     },
+    //   ],
+    //   attrs: {
+    //     placeholder: "请输入手机号码",
+    //     maxlength: 11,
+    //   },
+    //   col: {
+    //     xs: 24,
+    //     sm: 12,
+    //   },
+    // },
+    {
+      label: "会员生日",
+      prop: "birthDay",
+      rules: [{ required: false, message: "请选择会员生日", trigger: "blur" }],
+      type: "date-picker",
+      attrs: {
+        placeholder: "请选择会员生日",
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    {
+      type: "radio",
+      label: "性别",
+      prop: "sex",
+      rules: [{ required: false, message: "请选择性别", trigger: "blur" }],
+      attrs: {
+        placeholder: "请选择性别",
+      },
+      initialValue: '',
+      options: [
+        { label: '男', value: 1 },
+        { label: '女', value: 0 },
+      ],
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+    },
+    // {
+    //   label: "账户积分",
+    //   prop: "accountPoints",
+    //   rules: [{ required: false, message: "请输入账户积分", trigger: "blur" }],
+    //   type: "input-number",
+    //   attrs: {
+    //     placeholder: "请输入账户积分",
+    //   },
+    //   col: {
+    //     xs: 24,
+    //     sm: 12,
+    //   },
+    // },
+    // {
+    //   label: "钱包余额",
+    //   prop: "amount",
+    //   rules: [{ required: false, message: "请输入钱包余额", trigger: "blur" }],
+    //   type: "input-number",
+    //   attrs: {
+    //     placeholder: "请输入钱包余额",
+    //   },
+    //   col: {
+    //     xs: 24,
+    //     sm: 12,
+    //   },
+    // },
+    // {
+    //   type: "radio",
+    //   label: "是否会员",
+    //   prop: "isVip",
+    //   options: [
+    //     { label: '是', value: 1 },
+    //     { label: '否', value: 0 },
+    //   ],
+    // },
+  ],
+};
+
+// 如果有异步数据会修改配置的，推荐用reactive包裹，而纯静态配置的可以直接导出
+export default reactive(modalConfig);
diff --git a/src/views/user/list/config/search.ts b/src/views/user/list/config/search.ts
new file mode 100644
index 0000000..7986e8d
--- /dev/null
+++ b/src/views/user/list/config/search.ts
@@ -0,0 +1,35 @@
+import type { ISearchConfig } from "@/components/CURD/types";
+import { isVipOptions } from "./config";
+const searchConfig: ISearchConfig = {
+  pageName: "sys:user",
+  inline: true,
+  isExpandable: false,
+  formItems: [
+    {
+      type: "radio-button",
+      label: "是否会员",
+      prop: "isVip",
+      attrs: {
+        placeholder: "请选择",
+        clearable: true,
+      },
+      options: isVipOptions,
+    },
+
+    {
+      type: "input",
+      label: "昵称或手机号",
+      prop: "key",
+      attrs: {
+        placeholder: "请输入昵称或手机号",
+        clearable: true,
+        style: {
+          width: "200px",
+        },
+      },
+    },
+
+  ],
+};
+
+export default searchConfig;
diff --git a/src/views/user/list/index.vue b/src/views/user/list/index.vue
new file mode 100644
index 0000000..dae1f6f
--- /dev/null
+++ b/src/views/user/list/index.vue
@@ -0,0 +1,169 @@
+<template>
+  <div class="app-container">
+    <!-- 列表 -->
+    <!-- 搜索 -->
+    <page-search
+      ref="searchRef"
+      :search-config="searchConfig"
+      @query-click="handleQueryClick"
+      @reset-click="handleResetClick"
+    />
+    <!-- 列表 -->
+    <page-content
+      ref="contentRef"
+      :content-config="contentConfig"
+      @add-click="handleAddClick"
+      @edit-click="handleEditClick"
+      @export-click="handleExportClick"
+      @search-click="handleSearchClick"
+      @toolbar-click="handleToolbarClick"
+      @operat-click="handleOperatClick"
+      @filter-change="handleFilterChange"
+    >
+      <template #status="scope">
+        <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
+          {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
+        </el-tag>
+      </template>
+      <template #options="scope">
+        {{ returnOptionsLabel(scope.prop, scope.row[scope.prop]) }}
+      </template>
+      <template #bol="scope">
+        {{ scope.row[scope.prop] ? "是" : "否" }}
+      </template>
+      <template #gender="scope">
+        <el-tag
+          :type="
+            scope.row[scope.prop] == null
+              ? 'info'
+              : scope.row[scope.prop] == 1
+              ? 'success'
+              : 'warning'
+          "
+        >
+          {{ scope.row[scope.prop] === null ? "未知" : scope.row[scope.prop] == 1 ? "男" : "女" }}
+        </el-tag>
+      </template>
+      <template #user="scope">
+        <div class="flex align-center">
+          <el-avatar :src="scope.row.headImg" />
+          <el-tag>{{ scope.row.nickName }}</el-tag>
+        </div>
+      </template>
+      <template #link="scope">
+        <el-link>{{ scope.row[scope.prop] }}</el-link>
+      </template>
+      <template #mobile="scope">
+        <el-text>{{ scope.row[scope.prop] }}</el-text>
+        <copy-button
+          v-if="scope.row[scope.prop]"
+          :text="scope.row[scope.prop]"
+          style="margin-left: 2px"
+        />
+      </template>
+    </page-content>
+
+    <!-- 新增 -->
+    <page-modal
+      ref="addModalRef"
+      :modal-config="addModalConfig"
+      @submit-click="handleSubmitClick"
+    ></page-modal>
+
+    <!-- 编辑 -->
+    <page-modal
+      ref="editModalRef"
+      :modal-config="editModalConfig"
+      @submit-click="handleSubmitClick"
+    ></page-modal>
+    <!-- 用户余额修改 -->
+    <page-modal
+      ref="editMoneyModalRef"
+      :modal-config="editMoneyModalConfig"
+      @formDataChange="formDataChange"
+      @submit-click="handleSubmitClick"
+    ></page-modal>
+  </div>
+</template>
+
+<script setup >
+import usePage from "@/components/CURD/usePage";
+import addModalConfig from "./config/add";
+import contentConfig from "./config/content";
+import editModalConfig from "./config/edit";
+import editMoneyModalConfig, { addOptions, reduceOptions } from "./config/edit-money";
+import searchConfig from "./config/search";
+import { returnOptionsLabel } from "./config/config";
+const editMoneyModalRef = ref(null);
+const {
+  searchRef,
+  contentRef,
+  addModalRef,
+  editModalRef,
+  handleQueryClick,
+  handleResetClick,
+  // handleAddClick,
+  // handleEditClick,
+  handleSubmitClick,
+  handleExportClick,
+  handleSearchClick,
+  handleFilterChange,
+} = usePage();
+
+// 修改金额表单类型
+function formDataChange(type, val) {
+  if (type == "type") {
+    if (val == 1) {
+      editMoneyModalConfig.formItems[4].options = addOptions;
+    } else {
+      editMoneyModalConfig.formItems[4].options = reduceOptions;
+    }
+  }
+}
+
+// 新增
+async function handleAddClick() {
+  addModalRef.value?.setModalVisible();
+  // 加载部门下拉数据源
+  // addModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions();
+  // 加载角色下拉数据源
+  // addModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
+}
+// 编辑
+async function handleEditClick(row) {
+  editModalRef.value?.handleDisabled(false);
+  editModalRef.value?.setModalVisible();
+  // 根据id获取数据进行填充
+  // const data = await VersionApi.getFormData(row.id);
+  editModalRef.value?.setFormData({ ...row, headImg: row.headImg ? [row.headImg] : "" });
+}
+
+// 其他工具栏
+function handleToolbarClick(name) {
+  console.log(name);
+  if (name === "custom1") {
+    ElMessage.success("点击了自定义1按钮");
+  }
+}
+
+// 其他操作列
+async function handleOperatClick(data) {
+  const row = data.row;
+  if (data.name == "more") {
+    if (data.command === "change-money") {
+      editMoneyModalRef.value.setModalVisible();
+      editMoneyModalRef.value.setFormData({ ...row, headImg: row.headImg ? [row.headImg] : "" });
+      return;
+    }
+    return;
+  }
+}
+
+// 切换示例
+const isA = ref(true);
+</script>
+<style scoped>
+.align-center {
+  align-items: center;
+}
+</style>