diff --git a/README.md b/README.md
index 034c063..a9c6529 100644
--- a/README.md
+++ b/README.md
@@ -5,6 +5,10 @@
 ## API文档
 
 [超掌柜收银机](https://app.apifox.com/project/5827475)
+账号，商户相关：<https://tapi.cashier.sxczgkj.cn/account/>
+订单，支付相关：<https://tapi.cashier.sxczgkj.cn/order/>
+商品，耗材相关：<https://tapi.cashier.sxczgkj.cn/product/>
+系统相关：<https://tapi.cashier.sxczgkj.cn/system/>
 
 ## 项目特色
 
diff --git a/package.json b/package.json
index fad664f..caa5836 100644
--- a/package.json
+++ b/package.json
@@ -70,6 +70,7 @@
     "qs": "^6.14.0",
     "sortablejs": "^1.15.6",
     "vue": "^3.5.13",
+    "vue-clipboard3": "^2.0.0",
     "vue-i18n": "^11.1.0",
     "vue-router": "^4.5.0"
   },
diff --git a/src/api/account/common.ts b/src/api/account/common.ts
new file mode 100644
index 0000000..babf297
--- /dev/null
+++ b/src/api/account/common.ts
@@ -0,0 +1,108 @@
+import request from "@/utils/request";
+const baseURL = "/account/admin/common";
+
+const CommonApi = {
+  /**
+   * 上传文件
+   *
+   * @param formData
+   */
+  upload(formData: FormData) {
+    return request<any, uploadResponse>({
+      url: `${baseURL}/upload`,
+      method: "post",
+      data: formData,
+      headers: {
+        "Content-Type": "multipart/form-data",
+      },
+    });
+  },
+  /**
+   * 上传文件
+   */
+  uploadFile(file: File) {
+    const formData = new FormData();
+    formData.append("file", file);
+    return request<any, FileInfo>({
+      url: `${baseURL}/upload`,
+      method: "post",
+      data: formData,
+      headers: {
+        "Content-Type": "multipart/form-data",
+      },
+    });
+  },
+  /**
+   * 下载文件
+   * @param url
+   * @param fileName
+   */
+  download(url: string, fileName?: string) {
+    return request({
+      url: url,
+      method: "get",
+      responseType: "blob",
+    }).then((res) => {
+      const blob = new Blob([res.data]);
+      const a = document.createElement("a");
+      const url = window.URL.createObjectURL(blob);
+      a.href = url;
+      a.download = fileName || "下载文件";
+      a.click();
+      window.URL.revokeObjectURL(url);
+    });
+  },
+  /**
+   * 发送验证码
+   */
+  sms(data: smsRequest) {
+    return request<any, smsResponse>({
+      url: `${baseURL}/sms`,
+      method: "post",
+      data: data,
+    });
+  },
+};
+
+export default CommonApi;
+
+export interface smsRequest {
+  /**
+   * 验证码类型
+   */
+  type: string;
+  [property: string]: any;
+}
+/**
+ * 是否成功
+ *
+ * CzgResult«Boolean»
+ */
+export interface smsResponse {
+  code?: number | null;
+  data?: boolean | null;
+  msg?: null | string;
+  [property: string]: any;
+}
+
+/**
+ * 文件API类型声明
+ */
+export interface FileInfo {
+  /** 文件名 */
+  name: string;
+  /** 文件路径 */
+  url: string;
+}
+
+/**
+ * 文件地址
+ *
+ * CzgResult«String»
+ */
+export interface uploadResponse {
+  code?: number | null;
+  data?: null | string;
+  msg?: null | string;
+  [property: string]: any;
+}
diff --git a/src/api/account/register.ts b/src/api/account/register.ts
new file mode 100644
index 0000000..a366cd4
--- /dev/null
+++ b/src/api/account/register.ts
@@ -0,0 +1,141 @@
+import request from "@/utils/request";
+const baseURL = "account/admin/";
+
+const RegisterApi = {
+  /** 获取当前用户菜单列表*/
+  getList(params: getListRequest) {
+    return request<any, getListResponse>({
+      url: `${baseURL}merchantRegister`,
+      method: "get",
+      params: params,
+    });
+  },
+  /**生成激活码 */
+  add(data: addRequest) {
+    return request<any, getListResponse>({
+      url: `${baseURL}merchantRegister`,
+      method: "post",
+      data: data,
+    });
+  },
+};
+
+export default RegisterApi;
+
+/** 请求激活码列表参数 */
+export interface getListRequest {
+  /**
+   * 结束时间
+   */
+  endTime?: string;
+  page: number;
+  size: number;
+  /**
+   * 开始时间
+   */
+  startTime?: string;
+  /**
+   * 状态 0未激活 1已激活
+   */
+  state?: number;
+  [property: string]: any;
+}
+
+/**
+ * 激活码列表
+ *
+ * CzgResult«Page«MerchantRegister»»
+ */
+export interface getListResponse {
+  code?: number | null;
+  data?: PageMerchantRegister;
+  msg?: null | string;
+  [property: string]: any;
+}
+
+/**
+ * Page«MerchantRegister»
+ */
+export interface PageMerchantRegister {
+  /**
+   * 每页数据数量最大限制。
+   */
+  maxPageSize?: number | null;
+  /**
+   * 是否优化分页查询 COUNT 语句。
+   */
+  optimizeCountQuery?: boolean | null;
+  /**
+   * 当前页码。
+   */
+  pageNumber?: number | null;
+  /**
+   * 每页数据数量。
+   */
+  pageSize?: number | null;
+  /**
+   * 当前页数据。
+   */
+  records?: MerchantRegister[] | null;
+  /**
+   * 总页数。
+   */
+  totalPage?: number | null;
+  /**
+   * 总数据数量。
+   */
+  totalRow?: number | null;
+  [property: string]: any;
+}
+
+/**
+ * 激活码 实体类。
+ *
+ * MerchantRegister
+ */
+export interface MerchantRegister {
+  /**
+   * 激活码金额
+   */
+  amount?: number | null;
+  /**
+   * 创建时间
+   */
+  createTime?: null | string;
+  id?: number | null;
+  /**
+   * 激活时长（月）
+   */
+  periodMonth?: number | null;
+  /**
+   * 激活码
+   */
+  registerCode?: null | string;
+  /**
+   * 店铺id
+   */
+  shopId?: null | string;
+  /**
+   * 状态0未使用1已使用
+   */
+  status?: number | null;
+  updateTime?: null | string;
+  [property: string]: any;
+}
+
+/**
+ * 激活码信息
+ *
+ * MerchantRegisterDTO
+ */
+export interface addRequest {
+  /**
+   * 生成数量
+   */
+  num: number | null;
+  /**
+   * 激活时长
+   */
+  periodMonth: number | null;
+  [property: string]: any;
+}
diff --git a/src/api/account/role.ts b/src/api/account/role.ts
new file mode 100644
index 0000000..faea2a6
--- /dev/null
+++ b/src/api/account/role.ts
@@ -0,0 +1,228 @@
+import request from "@/utils/request";
+const baseURL = "account/admin/role";
+
+const RoleApi = {
+  /** 获取当前用户菜单列表*/
+  getList(params: getListRequest) {
+    return request<any, getListResponse>({
+      url: `${baseURL}/list`,
+      method: "get",
+      params,
+    });
+  },
+  add(data: addRequest) {
+    return request<any, addResponse>({
+      url: `${baseURL}`,
+      method: "post",
+      data,
+    });
+  },
+  update(data: editRequest) {
+    return request<any, editResponse>({
+      url: `${baseURL}`,
+      method: "put",
+      data,
+    });
+  },
+  delete(data: delRequest) {
+    return request<any, delResponse>({
+      url: `${baseURL}`,
+      method: "put",
+      data,
+    });
+  },
+};
+
+export default RoleApi;
+
+/** getList start*/
+export interface getListRequest {
+  /**
+   * 结束时间
+   */
+  endTime?: string;
+  /**
+   * 角色名称或描述
+   */
+  key?: string;
+  page: number;
+  size: number;
+  /**
+   * 开始时间
+   */
+  startTime?: string;
+  [property: string]: any;
+}
+
+/**
+ * 分页参数
+ *
+ * CzgResult«Page«SysRole»»
+ */
+export interface getListResponse {
+  code?: number | null;
+  data?: PageSysRole;
+  msg?: null | string;
+  [property: string]: any;
+}
+
+/**
+ * Page«SysRole»
+ */
+export interface PageSysRole {
+  maxPageSize?: number | null;
+  optimizeCountQuery?: boolean | null;
+  pageNumber?: number | null;
+  pageSize?: number | null;
+  records?: SysRole[] | null;
+  totalPage?: number | null;
+  totalRow?: number | null;
+  [property: string]: any;
+}
+
+/**
+ * 角色表 实体类。
+ *
+ * SysRole
+ */
+export interface SysRole {
+  /**
+   * 创建日期
+   */
+  createTime?: null | string;
+  /**
+   * 创建者
+   */
+  createUserId?: number | null;
+  /**
+   * 描述
+   */
+  description?: null | string;
+  /**
+   * ID
+   */
+  id?: number | null;
+  /**
+   * 角色级别
+   */
+  level?: number | null;
+  /**
+   * 名称
+   */
+  name?: null | string;
+  /**
+   * 商户id
+   */
+  shopId?: number | null;
+  /**
+   * 更新时间
+   */
+  updateTime?: null | string;
+  /**
+   * 更新者
+   */
+  updateUserId?: number | null;
+  [property: string]: any;
+}
+
+/** getList end*/
+
+/** add start*/
+/**
+ * 角色信息
+ *
+ * RoleAddDTO
+ */
+export interface addRequest {
+  /**
+   * 描述
+   */
+  description?: null | string;
+  /**
+   * 角色等级
+   */
+  level?: number | null;
+  /**
+   * 菜单id集合
+   */
+  menuIdList: number[] | null;
+  /**
+   * 角色名称
+   */
+  name: null | string;
+  [property: string]: any;
+  id?: number | null;
+}
+/**
+ * 是否成功
+ *
+ * CzgResult«Boolean»
+ */
+export interface addResponse {
+  code?: number | null;
+  data?: boolean | null;
+  msg?: null | string;
+  [property: string]: any;
+}
+/**add end */
+
+/** edit start*/
+/**
+ * 角色信息
+ *
+ * RoleEditDTO
+ */
+export interface editRequest {
+  description?: null | string;
+  /**
+   * 角色id
+   */
+  id: number | null;
+  /**
+   * 角色等级
+   */
+  level?: number | null;
+  menuIdList: number[] | null;
+  /**
+   * 角色名称
+   */
+  name: null | string;
+  [property: string]: any;
+}
+/**
+ * 是否成功
+ *
+ * CzgResult«Boolean»
+ */
+export interface editResponse {
+  code?: number | null;
+  data?: boolean | null;
+  msg?: null | string;
+  [property: string]: any;
+}
+/** edit end */
+/** delete start*/
+/**
+ * 角色信息
+ *
+ * RoleRemoveDTO
+ */
+export interface delRequest {
+  /**
+   * 角色id
+   */
+  id: number | null;
+  [property: string]: any;
+}
+/**
+ * 是否成功
+ *
+ * CzgResult«Boolean»
+ */
+export interface delResponse {
+  code?: number | null;
+  data?: boolean | null;
+  msg?: null | string;
+  [property: string]: any;
+}
+/** delete end */
diff --git a/src/api/config.ts b/src/api/config.ts
new file mode 100644
index 0000000..5236bab
--- /dev/null
+++ b/src/api/config.ts
@@ -0,0 +1,10 @@
+// [超掌柜收银机](https://app.apifox.com/project/5827475)
+// 账号，商户相关：<https://tapi.cashier.sxczgkj.cn/account/>
+// 订单，支付相关：<https://tapi.cashier.sxczgkj.cn/order/>
+// 商品，耗材相关：<https://tapi.cashier.sxczgkj.cn/product/>
+// 系统相关：<https://tapi.cashier.sxczgkj.cn/system/>
+
+export const Account_BaseUrl = "account";
+export const Order_BaseUrl = "order";
+export const Product_BaseUrl = "product";
+export const System_BaseUrl = "system";
diff --git a/src/api/login.js b/src/api/login.js
deleted file mode 100644
index b2f6603..0000000
--- a/src/api/login.js
+++ /dev/null
@@ -1,58 +0,0 @@
-import request from "@/utils/request";
-
-export function login(data) {
-  return request({
-    url: "auth/login",
-    method: "post",
-    data,
-  });
-}
-
-export function getInfo() {
-  return request({
-    url: "auth/info",
-    method: "get",
-  });
-}
-
-export function changChildShop(data) {
-  return request({
-    url: "/api/tbShopInfo/changChildShop",
-    method: "post",
-    data,
-  });
-}
-
-export function getCodeImg(header) {
-  return request({
-    url: "auth/code",
-    method: "get",
-  });
-}
-export function getqueryChildShop(params) {
-  return request({
-    url: "api/tbShopInfo/queryChildShop",
-    method: "get",
-    params,
-  });
-}
-
-export function logout() {
-  return request({
-    url: "auth/logout",
-    method: "delete",
-  });
-}
-
-/**
- * 个人中心 修改密码
- * @param {*} data
- * @returns
- */
-export function updatePass(data) {
-  return request({
-    url: "/api/users/updatePass",
-    method: "post",
-    data,
-  });
-}
diff --git a/src/api/system/user.ts b/src/api/system/user.ts
index 1b4489d..fcd4c8d 100644
--- a/src/api/system/user.ts
+++ b/src/api/system/user.ts
@@ -230,7 +230,7 @@ export interface UserInfo {
   roles: string[];
 
   /** 权限 */
-  perms: string[];
+  promissionList: string[];
 
   /** 店铺id */
   shopId: number;
diff --git a/src/api/system/version.ts b/src/api/system/version.ts
new file mode 100644
index 0000000..b5df642
--- /dev/null
+++ b/src/api/system/version.ts
@@ -0,0 +1,52 @@
+import request from "@/utils/request";
+import { System_BaseUrl } from "@/api/config";
+const baseURL = System_BaseUrl + "/admin/version";
+
+const VersionApi = {
+  getList() {
+    return request<any, getListResponse>({
+      url: `${baseURL}/list`,
+      method: "get",
+    });
+  },
+  delete(id: string) {
+    return request<any>({
+      url: `${baseURL}/id`,
+      method: "delete",
+    });
+  },
+};
+
+export default VersionApi;
+
+export interface getListResponse {
+  /**
+   * 版本 id
+   */
+  id?: string;
+  /**
+   * 是否强制升级，0：不强制更新；1：强制更新
+   */
+  isForce?: number;
+  /**
+   * 更新内容
+   */
+  message?: string;
+  /**
+   * 渠道 ，pc 桌面端， manager_app 管理端， phone_book 电话机点餐
+   */
+  source?: string;
+  /**
+   * 类型，0 windows，1 安卓，2 iOS
+   */
+  type?: string;
+  /**
+   * 下载地址
+   */
+  url?: string;
+  /**
+   * 版本号
+   */
+  version?: string;
+  [property: string]: any;
+}
diff --git a/src/components/CURD/PageContent.vue b/src/components/CURD/PageContent.vue
index e8a408f..174913d 100644
--- a/src/components/CURD/PageContent.vue
+++ b/src/components/CURD/PageContent.vue
@@ -163,7 +163,9 @@
                       :preview-src-list="scope.row[col.prop]"
                       :initial-index="index"
                       :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>
@@ -923,8 +925,10 @@ function fetchPageData(formData: IObject = {}, isRestart = false) {
         if (props.contentConfig.parseData) {
           data = props.contentConfig.parseData(data);
         }
-        pagination.total = data.total;
-        pageData.value = data.list;
+        pagination.total = !props.contentConfig.resultListKey ? data.length : data.totalRow * 1;
+        pageData.value = props.contentConfig.resultListKey
+          ? data[props.contentConfig.resultListKey]
+          : data;
       } else {
         pageData.value = data;
       }
diff --git a/src/components/CURD/PageForm.vue b/src/components/CURD/PageForm.vue
index 199f404..87fea8e 100644
--- a/src/components/CURD/PageForm.vue
+++ b/src/components/CURD/PageForm.vue
@@ -21,9 +21,16 @@
               </span>
             </template>
             <!-- Input 输入框 -->
+            {{ item.type }}
+
             <template v-if="item.type === 'input' || item.type === undefined">
               <el-input v-model="formData[item.prop]" v-bind="item.attrs" />
             </template>
+            <!-- textarea 输入框 -->
+
+            <template v-else-if="item.type === 'textarea' || item.type === undefined">
+              <el-input v-model="formData[item.prop]" type="textarea" v-bind="item.attrs" />
+            </template>
             <!-- Select 选择器 -->
             <template v-else-if="item.type === 'select'">
               <el-select v-model="formData[item.prop]" v-bind="item.attrs">
@@ -131,7 +138,7 @@ prepareFuncs.forEach((func) => func());
 
 // 获取表单数据
 function getFormData(key?: string) {
-  return key === undefined ? formData : (formData[key] ?? undefined);
+  return key === undefined ? formData : formData[key] ?? undefined;
 }
 
 // 设置表单值
diff --git a/src/components/CURD/PageModal.vue b/src/components/CURD/PageModal.vue
index 87465d6..d20129b 100644
--- a/src/components/CURD/PageModal.vue
+++ b/src/components/CURD/PageModal.vue
@@ -39,6 +39,10 @@
                 <template v-if="item.type === 'input' || item.type === undefined">
                   <el-input v-model="formData[item.prop]" v-bind="item.attrs" />
                 </template>
+                <!-- textarea 输入框 -->
+                <template v-if="item.type === 'textarea' || item.type === undefined">
+                  <el-input v-model="formData[item.prop]" v-bind="item.attrs" />
+                </template>
                 <!-- Select 选择器 -->
                 <template v-else-if="item.type === 'select'">
                   <el-select v-model="formData[item.prop]" v-bind="item.attrs">
@@ -288,7 +292,7 @@ prepareFuncs.forEach((func) => func());
 
 // 获取表单数据
 function getFormData(key?: string) {
-  return key === undefined ? formData : (formData[key] ?? undefined);
+  return key === undefined ? formData : formData[key] ?? undefined;
 }
 
 // 设置表单值
diff --git a/src/components/CURD/types.ts b/src/components/CURD/types.ts
index 7ed66ed..6b009ab 100644
--- a/src/components/CURD/types.ts
+++ b/src/components/CURD/types.ts
@@ -55,6 +55,7 @@ export interface ISearchConfig {
 }
 
 export interface IContentConfig<T = any> {
+  resultListKey?: string;
   // 页面名称(参与组成权限标识,如sys:user:xxx)
   pageName: string;
   // table组件属性
@@ -218,6 +219,7 @@ export type IFormItems<T = any> = Array<{
   // 组件类型(如input,select,radio,custom等，默认input)
   type?:
     | "input"
+    | "textarea"
     | "select"
     | "radio"
     | "switch"
diff --git a/src/components/Upload/SingleImageUpload.vue b/src/components/Upload/SingleImageUpload.vue
index 3ce77c7..a8a3bd3 100644
--- a/src/components/Upload/SingleImageUpload.vue
+++ b/src/components/Upload/SingleImageUpload.vue
@@ -26,7 +26,7 @@
 
 <script setup lang="ts">
 import { UploadRawFile, UploadRequestOptions } from "element-plus";
-import FileAPI, { FileInfo } from "@/api/file";
+import CommonApi, { FileInfo, uploadResponse } from "@/api/account/common";
 
 const props = defineProps({
   /**
@@ -130,7 +130,7 @@ function handleUpload(options: UploadRequestOptions) {
       formData.append(key, props.data[key]);
     });
 
-    FileAPI.upload(formData)
+    CommonApi.upload(formData)
       .then((data) => {
         resolve(data);
       })
@@ -152,9 +152,9 @@ function handleDelete() {
  *
  * @param fileInfo 上传成功后的文件信息
  */
-const onSuccess = (fileInfo: FileInfo) => {
+const onSuccess = (fileInfo: string) => {
   ElMessage.success("上传成功");
-  modelValue.value = fileInfo.url;
+  modelValue.value = fileInfo;
 };
 
 /**
diff --git a/src/directive/permission/index.ts b/src/directive/permission/index.ts
index 6dd2995..e30a121 100644
--- a/src/directive/permission/index.ts
+++ b/src/directive/permission/index.ts
@@ -16,17 +16,18 @@ export const hasPerm: Directive = {
       );
     }
 
-    const { roles, perms } = useUserStore().userInfo;
-
+    const { roles } = useUserStore().userInfo;
+    const perms = useUserStore().promissionList;
     // 超级管理员拥有所有权限
-    if (roles.includes("ROOT")) {
-      return;
-    }
+    // if (roles.includes("ROOT")) {
+    //   return;
+    // }
 
     // 检查权限
-    const hasAuth = Array.isArray(requiredPerms)
-      ? requiredPerms.some((perm) => perms.includes(perm))
-      : perms.includes(requiredPerms);
+    // const hasAuth = Array.isArray(requiredPerms)
+    //   ? requiredPerms.some((perm) => perms.includes(perm))
+    //   : perms.includes(requiredPerms);
+    const hasAuth = true;
 
     // 如果没有权限，移除该元素
     if (!hasAuth && el.parentNode) {
diff --git a/src/enums/ResultEnum.ts b/src/enums/ResultEnum.ts
index 913b544..b596dd0 100644
--- a/src/enums/ResultEnum.ts
+++ b/src/enums/ResultEnum.ts
@@ -14,10 +14,10 @@ export const enum ResultEnum {
   /**
    * 访问令牌无效或过期
    */
-  ACCESS_TOKEN_INVALID = "A0230",
+  ACCESS_TOKEN_INVALID = 501,
 
   /**
    * 刷新令牌无效或过期
    */
-  REFRESH_TOKEN_INVALID = "A0231",
+  REFRESH_TOKEN_INVALID = 501,
 }
diff --git a/src/main.ts b/src/main.ts
index 72fec50..b14ea03 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -13,12 +13,12 @@ import "uno.css";
 import "default-passive-events";
 
 // vue-amp初始化
-import { initAMapApiLoader } from "@vuemap/vue-amap";
+// import { initAMapApiLoader } from "@vuemap/vue-amap";
 import "@vuemap/vue-amap/dist/style.css";
-initAMapApiLoader({
-  key: "6033c97e67bf2e9ceac306e1a3fa35f8",
-  securityJsCode: "0547b69252ef0ed14e11f5c4ac152f07",
-});
+// initAMapApiLoader({
+//   key: "6033c97e67bf2e9ceac306e1a3fa35f8",
+//   securityJsCode: "0547b69252ef0ed14e11f5c4ac152f07",
+// });
 
 const app = createApp(App);
 // 注册插件
diff --git a/src/plugins/permission.ts b/src/plugins/permission.ts
index 09096ce..b6bc278 100644
--- a/src/plugins/permission.ts
+++ b/src/plugins/permission.ts
@@ -74,15 +74,16 @@ function redirectToLogin(to: RouteLocationNormalized, next: NavigationGuardNext)
 
 /** 判断是否有权限 */
 export function hasAuth(value: string | string[], type: "button" | "role" = "button") {
-  const { roles, perms } = useUserStore().userInfo;
-
+  const { roles } = useUserStore().userInfo;
+  const perms = useUserStore().promissionList;
   // 超级管理员 拥有所有权限
-  if (type === "button" && roles.includes("ROOT")) {
-    return true;
-  }
+  // if (type === "button" && roles.includes("ROOT")) {
+  //   return true;
+  // }
+  return true;
 
-  const auths = type === "button" ? perms : roles;
-  return typeof value === "string"
-    ? auths.includes(value)
-    : value.some((perm) => auths.includes(perm));
+  // const auths = type === "button" ? perms : roles;
+  // return typeof value === "string"
+  //   ? auths.includes(value)
+  //   : value.some((perm) => auths.includes(perm));
 }
diff --git a/src/router/index.ts b/src/router/index.ts
index 8ca5344..5251083 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -150,6 +150,68 @@ export const constantRoutes: RouteRecordRaw[] = [
       },
     ],
   },
+  {
+    path: "/system",
+    component: Layout,
+    meta: {
+      title: "系统管理",
+      icon: "system",
+      alwaysShow: true,
+    },
+    children: [
+      {
+        path: "user",
+        component: () => import("@/views/admim/system/user/index.vue"),
+        name: "adminSysUser",
+        meta: {
+          title: "系统用户",
+          affix: false,
+          keepAlive: true,
+        },
+      },
+      {
+        path: "role",
+        component: () => import("@/views/admim/system/role/index.vue"),
+        name: "adminSysRole",
+        meta: {
+          title: "角色管理",
+          affix: false,
+          keepAlive: true,
+        },
+      },
+      {
+        path: "version",
+        component: () => import("@/views/admim/system/version/index.vue"),
+        name: "adminSysVersion",
+        meta: {
+          title: "版本管理",
+          affix: false,
+          keepAlive: true,
+        },
+      },
+    ],
+  },
+  {
+    path: "/register",
+    component: Layout,
+    meta: {
+      title: "激活码",
+      icon: "chain",
+      alwaysShow: true,
+    },
+    children: [
+      {
+        path: "index",
+        component: () => import("@/views/register/index.vue"),
+        name: "registerIndex",
+        meta: {
+          title: "激活码列表",
+          affix: false,
+          keepAlive: true,
+        },
+      },
+    ],
+  },
   {
     path: "/online-shop",
     component: Layout,
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index 95859d6..da9e44c 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -2,26 +2,29 @@ import { store } from "@/store";
 import { usePermissionStoreHook } from "@/store/modules/permission";
 import { useDictStoreHook } from "@/store/modules/dict";
 
-import AuthAPI, { type LoginFormData } from "@/api/account/login";
+import AuthAPI, { type loginRequest } from "@/api/account/login";
 import UserAPI, { type UserInfo } from "@/api/system/user";
 
 import { setToken, setRefreshToken, getRefreshToken, clearToken } from "@/utils/auth";
 
 export const useUserStore = defineStore("user", () => {
   const userInfo = useStorage<UserInfo>("userInfo", {} as UserInfo);
+  const promissionList = useStorage<string[]>("promissionList", [] as string[]);
+
   localStorage.setItem("shopId", "" + userInfo.value.shopId);
 
   /**
    * 登录
    *
-   * @param {LoginFormData}
+   * @param {loginRequest}
    * @returns
    */
-  function login(LoginFormData: LoginFormData) {
+  function login(loginRequest: loginRequest) {
     return new Promise<void>((resolve, reject) => {
-      AuthAPI.login(LoginFormData)
+      AuthAPI.login(loginRequest)
         .then((data) => {
           Object.assign(userInfo.value, { ...data.shopInfo });
+          promissionList.value = data.promissionList;
           const token = data.tokenInfo.tokenValue;
           setToken(token); // Bearer eyJhbGciOiJIUzI1NiJ9.xxx.xxx
           setRefreshToken(token);
@@ -110,6 +113,7 @@ export const useUserStore = defineStore("user", () => {
 
   return {
     userInfo,
+    promissionList,
     getUserInfo,
     login,
     logout,
diff --git a/src/styles/index.scss b/src/styles/index.scss
index f1f6a79..12058bd 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -29,3 +29,6 @@
 .amap-sug-result {
   z-index: 3000;
 }
+.head-container {
+  margin-bottom: 20px;
+}
diff --git a/src/utils/mapLoadUtil.ts b/src/utils/mapLoadUtil.ts
new file mode 100644
index 0000000..8843cb7
--- /dev/null
+++ b/src/utils/mapLoadUtil.ts
@@ -0,0 +1,10 @@
+import { initAMapApiLoader } from "@vuemap/vue-amap";
+export function initMapLoad() {
+  initAMapApiLoader({
+    key: "6033c97e67bf2e9ceac306e1a3fa35f8",
+    securityJsCode: "0547b69252ef0ed14e11f5c4ac152f07",
+    //Loca:{
+    //  version: '2.0.0'
+    //} // 如果需要使用loca组件库，需要加载Loca
+  });
+}
diff --git a/src/utils/request.ts b/src/utils/request.ts
index d70ed01..e1a9418 100644
--- a/src/utils/request.ts
+++ b/src/utils/request.ts
@@ -19,9 +19,9 @@ service.interceptors.request.use(
     const accessToken = getToken();
     // 如果 Authorization 设置为 no-auth，则不携带 Token，用于登录、刷新 Token 等接口
     if (config.headers.Authorization !== "no-auth" && accessToken) {
-      config.headers.Authorization = accessToken;
+      config.headers.token = accessToken;
     } else {
-      delete config.headers.Authorization;
+      delete config.headers.token;
     }
     return config;
   },
@@ -41,6 +41,19 @@ service.interceptors.response.use(
       return data ? data : response.data;
     }
 
+    if (code === ResultEnum.ACCESS_TOKEN_INVALID) {
+      ElNotification({
+        title: "提示",
+        message: "您的会话已过期，请重新登录",
+        type: "info",
+      });
+      useUserStoreHook()
+        .clearUserData()
+        .then(() => {
+          router.push("/login");
+        });
+      return;
+    }
     ElMessage.error(msg || "系统出错");
     return Promise.reject(new Error(msg || "Error"));
   },
diff --git a/src/utils/validate.js b/src/utils/validate.js
new file mode 100644
index 0000000..751f94f
--- /dev/null
+++ b/src/utils/validate.js
@@ -0,0 +1,167 @@
+/**
+ * Created by PanJiaChen on 16/11/18.
+ */
+
+/**
+ * @param {string} path
+ * @returns {Boolean}
+ */
+export function isExternal(path) {
+  return /^(https?:|mailto:|tel:)/.test(path)
+}
+
+/**
+ * @param {string} str
+ * @returns {Boolean}
+ */
+export function validUsername(str) {
+  const valid_map = ['admin', 'editor']
+  return valid_map.indexOf(str.trim()) >= 0
+}
+
+/**
+ * @param {string} url
+ * @returns {Boolean}
+ */
+export function validURL(url) {
+  const reg = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/
+  return reg.test(url)
+}
+
+/**
+ * @param {string} str
+ * @returns {Boolean}
+ */
+export function validLowerCase(str) {
+  const reg = /^[a-z]+$/
+  return reg.test(str)
+}
+
+/**
+ * @param {string} str
+ * @returns {Boolean}
+ */
+export function validUpperCase(str) {
+  const reg = /^[A-Z]+$/
+  return reg.test(str)
+}
+
+/**
+ * @param {string} str
+ * @returns {Boolean}
+ */
+export function validAlphabets(str) {
+  const reg = /^[A-Za-z]+$/
+  return reg.test(str)
+}
+
+/**
+ * @param {string} email
+ * @returns {Boolean}
+ */
+export function validEmail(email) {
+  const reg = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
+  return reg.test(email)
+}
+
+export function isvalidPhone(phone) {
+  const reg = /^1([38][0-9]|4[014-9]|[59][0-35-9]|6[2567]|7[0-8])\d{8}$/
+  return reg.test(phone)
+}
+
+/**
+ * @param {string} str
+ * @returns {Boolean}
+ */
+export function isString(str) {
+  if (typeof str === 'string' || str instanceof String) {
+    return true
+  }
+  return false
+}
+
+/**
+ * @param {Array} arg
+ * @returns {Boolean}
+ */
+export function isArray(arg) {
+  if (typeof Array.isArray === 'undefined') {
+    return Object.prototype.toString.call(arg) === '[object Array]'
+  }
+  return Array.isArray(arg)
+}
+
+/**
+ * 是否合法IP地址
+ * @param rule
+ * @param value
+ * @param callback
+ */
+export function validateIP(rule, value, callback) {
+  if (value === '' || value === undefined || value == null) {
+    callback()
+  } else {
+    const reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
+    if ((!reg.test(value)) && value !== '') {
+      callback(new Error('请输入正确的IP地址'))
+    } else {
+      callback()
+    }
+  }
+}
+
+/* 是否手机号码或者固话*/
+export function validatePhoneTwo(rule, value, callback) {
+  const reg = /^((0\d{2,3}-\d{7,8})|(1([38][0-9]|4[014-9]|[59][0-35-9]|6[2567]|7[0-8])\d{8}))$/
+  if (value === '' || value === undefined || value == null) {
+    callback()
+  } else {
+    if ((!reg.test(value)) && value !== '') {
+      callback(new Error('请输入正确的电话号码或者固话号码'))
+    } else {
+      callback()
+    }
+  }
+}
+
+/* 是否固话*/
+export function validateTelephone(rule, value, callback) {
+  const reg = /0\d{2}-\d{7,8}/
+  if (value === '' || value === undefined || value == null) {
+    callback()
+  } else {
+    if ((!reg.test(value)) && value !== '') {
+      callback(new Error('请输入正确的固话（格式：区号+号码,如010-1234567）'))
+    } else {
+      callback()
+    }
+  }
+}
+
+/* 是否手机号码*/
+export function validatePhone(rule, value, callback) {
+  const reg = /^1([38][0-9]|4[014-9]|[59][0-35-9]|6[2567]|7[0-8])\d{8}$/
+  if (value === '' || value === undefined || value == null) {
+    callback()
+  } else {
+    if ((!reg.test(value)) && value !== '') {
+      callback(new Error('请输入正确的电话号码'))
+    } else {
+      callback()
+    }
+  }
+}
+
+/* 是否身份证号码*/
+export function validateIdNo(rule, value, callback) {
+  const reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
+  if (value === '' || value === undefined || value == null) {
+    callback()
+  } else {
+    if ((!reg.test(value)) && value !== '') {
+      callback(new Error('请输入正确的身份证号码'))
+    } else {
+      callback()
+    }
+  }
+}
diff --git a/src/views/admim/system/role/index.vue b/src/views/admim/system/role/index.vue
new file mode 100644
index 0000000..9e4a38f
--- /dev/null
+++ b/src/views/admim/system/role/index.vue
@@ -0,0 +1,458 @@
+<template>
+  <div class="app-container">
+    <div class="search-bar">
+      <el-form ref="queryFormRef" :model="queryParams" :inline="true">
+        <el-form-item prop="keywords" label="关键字">
+          <el-input
+            v-model="queryParams.key"
+            placeholder="角色名称"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item>
+
+        <el-form-item>
+          <el-button type="primary" icon="search" @click="handleQuery">搜索</el-button>
+          <el-button icon="refresh" @click="handleResetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <el-card shadow="never">
+      <div class="mb-10px">
+        <el-button type="success" icon="plus" @click="handleOpenDialog()">新增</el-button>
+        <el-button type="danger" :disabled="ids.length === 0" icon="delete" @click="handleDelete()">
+          删除
+        </el-button>
+      </div>
+
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="roleList"
+        highlight-current-row
+        border
+        @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 fixed="right" label="操作" width="220">
+          <template #default="scope">
+            <el-button
+              type="primary"
+              size="small"
+              link
+              icon="position"
+              @click="handleOpenAssignPermDialog(scope.row)"
+            >
+              分配权限
+            </el-button>
+            <el-button
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog(scope.row)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete(scope.row.id)"
+            >
+              删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination
+        v-if="total > 0"
+        v-model:total="total"
+        v-model:page="queryParams.page"
+        v-model:limit="queryParams.size"
+        @pagination="handleQuery"
+      />
+    </el-card>
+
+    <!-- 角色表单弹窗 -->
+    <el-dialog
+      v-model="dialog.visible"
+      :title="dialog.title"
+      width="500px"
+      @close="handleCloseDialog"
+    >
+      <el-form ref="addRequestRef" :model="formData" :rules="rules" label-width="100px">
+        <el-form-item label="角色名称" prop="name">
+          <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>
+
+        <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="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>
+      </el-form>
+
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="handleSubmit">确 定</el-button>
+          <el-button @click="handleCloseDialog">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!-- 分配权限弹窗 -->
+    <el-drawer
+      v-model="assignPermDialogVisible"
+      :title="'【' + checkedRole.name + '】权限分配'"
+      size="500"
+    >
+      <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 #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="handleAssignPermSubmit">确 定</el-button>
+          <el-button @click="assignPermDialogVisible = false">取 消</el-button>
+        </div>
+      </template>
+    </el-drawer>
+  </div>
+</template>
+
+<script setup lang="ts">
+defineOptions({
+  name: "Role",
+  inheritAttrs: false,
+});
+
+import RoleApi, { SysRole, addRequest, getListRequest } from "@/api/account/role";
+import MenuAPI from "@/api/system/menu";
+
+const queryFormRef = ref();
+const addRequestRef = ref();
+const permTreeRef = ref();
+
+const loading = ref(false);
+const ids = ref<number[]>([]);
+const total = ref(0);
+
+const queryParams = reactive<getListRequest>({
+  page: 1,
+  size: 10,
+  key: "",
+});
+
+// 角色表格数据
+const roleList = ref<SysRole[]>();
+// 菜单权限下拉
+const menuPermOptions = ref<OptionType[]>([]);
+
+// 弹窗
+const dialog = reactive({
+  title: "",
+  visible: false,
+});
+// 角色表单
+const formData = reactive<addRequest>({
+  // sort: 1,
+  // status: 1,
+  id: null,
+  name: "",
+  level: 0,
+  menuIdList: [],
+  description: "",
+});
+
+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" }],
+});
+
+// 选中的角色
+interface CheckedRole {
+  id?: number;
+  name?: string;
+}
+const checkedRole = ref<CheckedRole>({});
+const assignPermDialogVisible = ref(false);
+
+const permKeywords = ref("");
+const isExpanded = ref(true);
+
+const parentChildLinked = ref(true);
+
+// 查询
+function handleQuery() {
+  loading.value = true;
+  RoleApi.getList(queryParams)
+    .then((data) => {
+      roleList.value = data.records;
+      total.value = data.totalRow;
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+}
+
+// 重置查询
+function handleResetQuery() {
+  queryFormRef.value.resetFields();
+  queryParams.page = 1;
+  queryParams.size = 10;
+  queryParams.key = "";
+  handleQuery();
+}
+
+// 行复选框选中
+function handleSelectionChange(selection: any) {
+  ids.value = selection.map((item: any) => item.id);
+}
+
+// 打开角色弹窗
+function handleOpenDialog(row: SysRole) {
+  dialog.visible = true;
+  if (row.id) {
+    dialog.title = "修改角色";
+    Object.assign(formData, row);
+  } else {
+    dialog.title = "新增角色";
+  }
+}
+
+// 提交角色表单
+function handleSubmit() {
+  addRequestRef.value.validate((valid: any) => {
+    if (valid) {
+      loading.value = true;
+      const roleId = formData.id;
+      if (roleId) {
+        RoleApi.update({ ...formData, id: formData.id ?? null })
+          .then(() => {
+            ElMessage.success("修改成功");
+            handleCloseDialog();
+            handleResetQuery();
+          })
+          .finally(() => (loading.value = false));
+      } else {
+        delete formData.id;
+        RoleApi.add(formData)
+          .then(() => {
+            ElMessage.success("新增成功");
+            handleCloseDialog();
+            handleResetQuery();
+          })
+          .finally(() => (loading.value = false));
+      }
+    }
+  });
+}
+
+// 关闭弹窗
+function handleCloseDialog() {
+  dialog.visible = false;
+
+  addRequestRef.value.resetFields();
+  addRequestRef.value.clearValidate();
+
+  formData.id = undefined;
+  formData.sort = 1;
+  formData.status = 1;
+}
+
+// 删除角色
+function handleDelete(roleId?: number) {
+  const roleIds = [roleId || ids.value].join(",");
+  if (!roleIds) {
+    ElMessage.warning("请勾选删除项");
+    return;
+  }
+
+  ElMessageBox.confirm("确认删除已选中的数据项?", "警告", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  }).then(
+    () => {
+      loading.value = true;
+      RoleApi.delete({ id: roleId ?? null })
+        .then(() => {
+          ElMessage.success("删除成功");
+          handleResetQuery();
+        })
+        .finally(() => (loading.value = false));
+    },
+    () => {
+      ElMessage.info("已取消删除");
+    }
+  );
+}
+
+// 打开分配菜单权限弹窗
+async function handleOpenAssignPermDialog(row: SysRole) {
+  const roleId = row.id;
+  if (roleId) {
+    assignPermDialogVisible.value = true;
+    loading.value = true;
+
+    checkedRole.value.id = roleId;
+    checkedRole.value.name = row.name as string;
+
+    // 获取所有的菜单
+    menuPermOptions.value = await MenuAPI.getOptions();
+
+    // 回显角色已拥有的菜单
+    // RoleApi.getRoleMenuIds(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;
+  if (roleId) {
+    const checkedMenuIds: number[] = permTreeRef
+      .value!.getCheckedNodes(false, true)
+      .map((node: any) => node.value);
+
+    loading.value = true;
+    RoleApi.updateRoleMenus(roleId, checkedMenuIds)
+      .then(() => {
+        ElMessage.success("分配权限成功");
+        assignPermDialogVisible.value = false;
+        handleResetQuery();
+      })
+      .finally(() => {
+        loading.value = false;
+      });
+  }
+}
+
+// 展开/收缩 菜单权限树
+function togglePermTree() {
+  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);
+});
+
+function handlePermFilter(
+  value: string,
+  data: {
+    [key: string]: any;
+  }
+) {
+  if (!value) return true;
+  return data.label.includes(value);
+}
+
+// 父子菜单节点是否联动
+function handleparentChildLinkedChange(val: any) {
+  parentChildLinked.value = val;
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
diff --git a/src/views/admim/system/user/index.vue b/src/views/admim/system/user/index.vue
new file mode 100644
index 0000000..41a40c8
--- /dev/null
+++ b/src/views/admim/system/user/index.vue
@@ -0,0 +1 @@
+<template></template>
\ No newline at end of file
diff --git a/src/views/admim/system/version/config/add.ts b/src/views/admim/system/version/config/add.ts
new file mode 100644
index 0000000..1c53e49
--- /dev/null
+++ b/src/views/admim/system/version/config/add.ts
@@ -0,0 +1,87 @@
+import UserAPI, { type UserForm } from "@/api/system/user";
+import type { IModalConfig } from "@/components/CURD/types";
+
+const modalConfig: IModalConfig<UserForm> = {
+  pageName: "sys:user",
+  dialog: {
+    title: "新增版本",
+    width: 800,
+    draggable: true,
+  },
+  form: {
+    labelWidth: 140,
+  },
+  formAction: UserAPI.add,
+  beforeSubmit(data) {
+    console.log("提交之前处理", data);
+  },
+  formItems: [
+    {
+      label: "渠道",
+      prop: "source",
+      rules: [{ required: true, message: "请选择渠道", trigger: "blur" }],
+      type: "select",
+      attrs: {
+        placeholder: "请选择渠道",
+      },
+      options: [
+        { label: "桌面端", value: "pc" },
+        { label: "管理端", value: "manager_app" },
+        { label: "电话机点餐", value: "phone_book " },
+      ],
+    },
+    {
+      label: "类型",
+      prop: "type",
+      rules: [{ required: true, message: "请选择类型", trigger: "blur" }],
+      type: "select",
+      attrs: {
+        placeholder: "请选择类型",
+      },
+      col: {
+        xs: 24,
+        sm: 12,
+      },
+      options: [
+        { label: "windows", value: 0 },
+        { label: "安卓", value: 1 },
+        { label: "iOS", value: 2 },
+      ],
+    },
+    {
+      type: "input",
+      label: "版本号",
+      prop: "version",
+      rules: [{ required: true, message: "请输入版本号", trigger: "blur" }],
+      attrs: {
+        placeholder: "请输入版本号",
+      },
+    },
+    {
+      type: "radio",
+      label: "是否强制更新",
+      prop: "isForce",
+      rules: [{ required: true, message: "请输入版本号", trigger: "blur" }],
+      attrs: {
+        placeholder: "请输入版本号",
+      },
+      initialValue: 0,
+      options: [
+        { label: "是", value: 1 },
+        { label: "否", value: 0 },
+      ],
+    },
+    {
+      type: "textarea",
+      label: "更新提示内容",
+      prop: "version",
+      rules: [{ required: true, message: "请输入版本号", trigger: "blur" }],
+      attrs: {
+        placeholder: "请输入版本号",
+      },
+    },
+  ],
+};
+
+// 如果有异步数据会修改配置的，推荐用reactive包裹，而纯静态配置的可以直接导出
+export default reactive(modalConfig);
diff --git a/src/views/admim/system/version/config/content.ts b/src/views/admim/system/version/config/content.ts
new file mode 100644
index 0000000..dde61a9
--- /dev/null
+++ b/src/views/admim/system/version/config/content.ts
@@ -0,0 +1,86 @@
+import VersionApi from "@/api/system/version";
+import RoleAPI from "@/api/system/role";
+import type { UserPageQuery } from "@/api/system/user";
+import type { IContentConfig } from "@/components/CURD/types";
+
+const contentConfig: IContentConfig<UserPageQuery> = {
+  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) {
+    return VersionApi.getList();
+  },
+  deleteAction: VersionApi.delete,
+  importsAction(data) {
+    // 模拟导入数据
+    console.log("importsAction", data);
+    return Promise.resolve();
+  },
+  exportsAction: async function (params) {
+    // 模拟获取到的是全量数据
+    const res = await VersionApi.getList(params);
+    console.log("exportsAction", res.list);
+    return res.list;
+  },
+  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: "source" },
+    {
+      label: "类型",
+      align: "center",
+      prop: "type",
+    },
+    { label: "版本号", align: "center", prop: "version" },
+
+    {
+      label: "是否强制升级",
+      align: "center",
+      prop: "isForce",
+      width: 120,
+      templet: "switch",
+      slotName: "isForce",
+    },
+    {
+      label: "下载地址",
+      align: "center",
+      prop: "url",
+      templet: "url",
+      slotName: "url",
+    },
+    {
+      label: "操作",
+      align: "center",
+      fixed: "right",
+      width: 280,
+      templet: "tool",
+      operat: [
+        {
+          icon: "Document",
+          name: "edit",
+          text: "编辑",
+        },
+        {
+          name: "delete",
+          icon: "delete",
+          text: "删除",
+        },
+        "edit",
+        "delete",
+      ],
+    },
+  ],
+};
+
+export default contentConfig;
diff --git a/src/views/admim/system/version/config/content2.ts b/src/views/admim/system/version/config/content2.ts
new file mode 100644
index 0000000..3da3999
--- /dev/null
+++ b/src/views/admim/system/version/config/content2.ts
@@ -0,0 +1,133 @@
+import type { IContentConfig } from "@/components/CURD/types";
+
+const contentConfig: IContentConfig = {
+  pageName: "sys:user",
+  table: {
+    showOverflowTooltip: true,
+  },
+  toolbar: [],
+  indexAction: function (params) {
+    // 模拟发起网络请求获取列表数据
+    console.log("indexAction:", params);
+    return Promise.resolve({
+      total: 2,
+      list: [
+        {
+          id: 1,
+          username: "tom",
+          avatar: "https://foruda.gitee.com/images/1723603502796844527/03cdca2a_716974.gif",
+          percent: 99,
+          price: 10,
+          url: "https://www.baidu.com",
+          icon: "el-icon-setting",
+          gender: 1,
+          status: 1,
+          status2: 1,
+          sort: 99,
+          createTime: 1715647982437,
+        },
+        {
+          id: 2,
+          username: "jerry",
+          avatar: "https://foruda.gitee.com/images/1723603502796844527/03cdca2a_716974.gif",
+          percent: 88,
+          price: 999,
+          url: "https://www.google.com",
+          icon: "el-icon-user",
+          gender: 0,
+          status: 0,
+          status2: 0,
+          sort: 0,
+          createTime: 1715648977426,
+        },
+      ],
+    });
+  },
+  modifyAction(data) {
+    // 模拟发起网络请求修改字段
+    // console.log("modifyAction:", data);
+    ElMessage.success(JSON.stringify(data));
+    return Promise.resolve(null);
+  },
+  cols: [
+    { type: "index", width: 50, align: "center" },
+    { label: "ID", align: "center", prop: "id", show: false },
+    { label: "文本", align: "center", prop: "username" },
+    { label: "图片", align: "center", prop: "avatar", templet: "image" },
+    {
+      label: "百分比",
+      align: "center",
+      prop: "percent",
+      templet: "percent",
+    },
+    {
+      label: "货币符",
+      align: "center",
+      prop: "price",
+      templet: "price",
+      priceFormat: "$",
+    },
+    { label: "链接", align: "center", prop: "url", width: 180, templet: "url" },
+    { label: "图标", align: "center", prop: "icon", templet: "icon" },
+    {
+      label: "列表值",
+      align: "center",
+      prop: "gender",
+      templet: "list",
+      selectList: { "0": "女", "1": "男" },
+    },
+    {
+      label: "自定义",
+      align: "center",
+      prop: "status",
+      templet: "custom",
+      slotName: "status",
+    },
+    {
+      label: "Switch",
+      align: "center",
+      prop: "status2",
+      templet: "switch",
+      activeValue: 1,
+      inactiveValue: 0,
+      activeText: "启用",
+      inactiveText: "禁用",
+    },
+    {
+      label: "输入框",
+      align: "center",
+      prop: "sort",
+      templet: "input",
+      inputType: "number",
+    },
+    {
+      label: "日期格式化",
+      align: "center",
+      prop: "createTime",
+      minWidth: 120,
+      templet: "date",
+      dateFormat: "YYYY/MM/DD HH:mm:ss",
+    },
+    {
+      label: "操作栏",
+      align: "center",
+      fixed: "right",
+      width: 220,
+      templet: "tool",
+      operat: [
+        {
+          name: "reset_pwd",
+          auth: "password:reset",
+          icon: "refresh-left",
+          text: "重置密码",
+          type: "primary",
+          render(row) {
+            return row.id === 1;
+          },
+        },
+      ],
+    },
+  ],
+};
+
+export default contentConfig;
diff --git a/src/views/admim/system/version/config/edit.ts b/src/views/admim/system/version/config/edit.ts
new file mode 100644
index 0000000..bbc0f61
--- /dev/null
+++ b/src/views/admim/system/version/config/edit.ts
@@ -0,0 +1,117 @@
+import UserAPI, { type UserForm } from "@/api/system/user";
+import type { IModalConfig } from "@/components/CURD/types";
+import { DeviceEnum } from "@/enums/DeviceEnum";
+import { useAppStore } from "@/store";
+
+const modalConfig: IModalConfig<UserForm> = {
+  pageName: "sys:user",
+  component: "drawer",
+  drawer: {
+    title: "修改用户",
+    size: useAppStore().device === DeviceEnum.MOBILE ? "80%" : 500,
+  },
+  pk: "id",
+  formAction: function (data) {
+    return UserAPI.update(data.id as number, data);
+  },
+  beforeSubmit(data) {
+    console.log("提交之前处理", data);
+  },
+  formItems: [
+    {
+      label: "用户名",
+      prop: "username",
+      rules: [{ required: true, message: "用户名不能为空", trigger: "blur" }],
+      type: "input",
+      attrs: {
+        placeholder: "请输入用户名",
+        readonly: true,
+      },
+    },
+    {
+      label: "用户昵称",
+      prop: "nickname",
+      rules: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
+      type: "input",
+      attrs: {
+        placeholder: "请输入用户昵称",
+      },
+    },
+    {
+      label: "所属部门",
+      prop: "deptId",
+      rules: [{ required: true, message: "所属部门不能为空", trigger: "blur" }],
+      type: "tree-select",
+      attrs: {
+        placeholder: "请选择所属部门",
+        data: [],
+        filterable: true,
+        "check-strictly": true,
+        "render-after-expand": false,
+      },
+    },
+    {
+      type: "custom",
+      label: "性别",
+      prop: "gender",
+      initialValue: 1,
+    },
+    {
+      label: "角色",
+      prop: "roleIds",
+      rules: [{ required: true, message: "用户角色不能为空", trigger: "blur" }],
+      type: "select",
+      attrs: {
+        placeholder: "请选择",
+        multiple: true,
+      },
+      options: [],
+      initialValue: [],
+    },
+    {
+      type: "input",
+      label: "手机号码",
+      prop: "mobile",
+      rules: [
+        {
+          pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+          message: "请输入正确的手机号码",
+          trigger: "blur",
+        },
+      ],
+      attrs: {
+        placeholder: "请输入手机号码",
+        maxlength: 11,
+      },
+    },
+    {
+      label: "邮箱",
+      prop: "email",
+      rules: [
+        {
+          pattern: /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/,
+          message: "请输入正确的邮箱地址",
+          trigger: "blur",
+        },
+      ],
+      type: "input",
+      attrs: {
+        placeholder: "请输入邮箱",
+        maxlength: 50,
+      },
+    },
+    {
+      label: "状态",
+      prop: "status",
+      type: "switch",
+      attrs: {
+        activeText: "正常",
+        inactiveText: "禁用",
+        activeValue: 1,
+        inactiveValue: 0,
+      },
+    },
+  ],
+};
+
+export default reactive(modalConfig);
diff --git a/src/views/admim/system/version/config/search.ts b/src/views/admim/system/version/config/search.ts
new file mode 100644
index 0000000..29cbdd9
--- /dev/null
+++ b/src/views/admim/system/version/config/search.ts
@@ -0,0 +1,21 @@
+import type { ISearchConfig } from "@/components/CURD/types";
+
+const searchConfig: ISearchConfig = {
+  pageName: "sys:user",
+  formItems: [
+    {
+      type: "input",
+      label: "版本号",
+      prop: "keywords",
+      attrs: {
+        placeholder: "请输入版本号",
+        clearable: true,
+        style: {
+          width: "200px",
+        },
+      },
+    },
+  ],
+};
+
+export default searchConfig;
diff --git a/src/views/admim/system/version/index.vue b/src/views/admim/system/version/index.vue
new file mode 100644
index 0000000..cd70192
--- /dev/null
+++ b/src/views/admim/system/version/index.vue
@@ -0,0 +1,167 @@
+<template>
+  <div class="app-container">
+    <!-- 列表 -->
+    <template v-if="isA">
+      <!-- 搜索 -->
+      <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 #gender="scope">
+          <DictLabel v-model="scope.row[scope.prop]" code="gender" />
+        </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"
+      >
+        <template #gender="scope">
+          <Dict v-model="scope.formData[scope.prop]" code="gender" />
+        </template>
+      </page-modal>
+
+      <!-- 编辑 -->
+      <page-modal
+        ref="editModalRef"
+        :modal-config="editModalConfig"
+        @submit-click="handleSubmitClick"
+      >
+        <template #gender="scope">
+          <Dict v-model="scope.formData[scope.prop]" code="gender" v-bind="scope.attrs" />
+        </template>
+      </page-modal>
+    </template>
+    <template v-else>
+      <page-content
+        ref="contentRef"
+        :content-config="contentConfig2"
+        @operat-click="handleOperatClick"
+      >
+        <template #status="scope">
+          <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
+            {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
+          </el-tag>
+        </template>
+      </page-content>
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts">
+import VersionApi from "@/api/system/version";
+import DeptAPI from "@/api/system/dept";
+import RoleAPI from "@/api/system/role";
+import type { IObject, IOperatData } from "@/components/CURD/types";
+import usePage from "@/components/CURD/usePage";
+import addModalConfig from "./config/add";
+import contentConfig from "./config/content";
+import contentConfig2 from "./config/content2";
+import editModalConfig from "./config/edit";
+import searchConfig from "./config/search";
+
+const {
+  searchRef,
+  contentRef,
+  addModalRef,
+  editModalRef,
+  handleQueryClick,
+  handleResetClick,
+  // handleAddClick,
+  // handleEditClick,
+  handleSubmitClick,
+  handleExportClick,
+  handleSearchClick,
+  handleFilterChange,
+} = usePage();
+
+// 新增
+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: IObject) {
+  editModalRef.value?.handleDisabled(false);
+  editModalRef.value?.setModalVisible();
+  // 根据id获取数据进行填充
+  const data = await VersionApi.getFormData(row.id);
+  editModalRef.value?.setFormData(data);
+}
+// 其他工具栏
+function handleToolbarClick(name: string) {
+  console.log(name);
+  if (name === "custom1") {
+    ElMessage.success("点击了自定义1按钮");
+  }
+}
+// 其他操作列
+async function handleOperatClick(data: IOperatData) {
+  console.log(data);
+  // 重置密码
+  if (data.name === "reset_pwd") {
+    ElMessageBox.prompt("请输入用户「" + data.row.username + "」的新密码", "重置密码", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+    }).then(({ value }) => {
+      if (!value || value.length < 6) {
+        ElMessage.warning("密码至少需要6位字符，请重新输入");
+        return false;
+      }
+      VersionApi.resetPassword(data.row.id, value).then(() => {
+        ElMessage.success("密码重置成功，新密码是：" + value);
+      });
+    });
+  } else if (data.name === "detail") {
+    // 禁用表单编辑
+    editModalRef.value?.handleDisabled(true);
+    // 打开抽屉
+    editModalRef.value?.setModalVisible();
+    // 修改抽屉标题
+    editModalConfig.drawer = { ...editModalConfig.drawer, title: "用户详情" };
+    // 加载部门下拉数据源
+    editModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions();
+    // 加载角色下拉数据源
+    editModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
+    // 根据id获取数据进行填充
+    const formData = await VersionApi.getFormData(data.row.id);
+    // 设置表单数据
+    editModalRef.value?.setFormData(formData);
+  }
+}
+
+// 切换示例
+const isA = ref(true);
+</script>
diff --git a/src/views/register/components/addActivationCode.vue b/src/views/register/components/addActivationCode.vue
new file mode 100644
index 0000000..e8d6a0f
--- /dev/null
+++ b/src/views/register/components/addActivationCode.vue
@@ -0,0 +1,99 @@
+<template>
+  <el-dialog title="生产激活码" v-model="dialogVisible" width="500px" @close="reset">
+    <el-form :model="form" :rules="rules" label-width="100px" label-position="left">
+      <el-form-item label="激活时长" prop="periodMonth">
+        <el-input-number
+          v-model="form.periodMonth"
+          controls-position="right"
+          :min="1"
+          :step="1"
+          step-strictly
+        ></el-input-number>
+      </el-form-item>
+      <el-form-item label="生产数量" prop="num">
+        <el-input-number
+          v-model="form.num"
+          controls-position="right"
+          :min="1"
+          :step="1"
+          step-strictly
+        ></el-input-number>
+      </el-form-item>
+      <!-- <el-form-item label="所属代理" prop="agent">
+                <el-input v-model="form.agent" placeholder="请输入完整的代理账号查找"></el-input>
+            </el-form-item> -->
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="close">取消</el-button>
+        <el-button type="primary" v-loading="loading" @click="tbMerchantRegisterPost">
+          生产激活码
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script>
+import RegisterApi from "@/api/account/register";
+
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      loading: false,
+      form: {
+        periodMonth: 1,
+        num: 1,
+        agent: "",
+      },
+      rules: {
+        periodMonth: [
+          {
+            required: true,
+            message: " ",
+            trigger: "blur",
+          },
+        ],
+        num: [
+          {
+            required: true,
+            message: " ",
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    async tbMerchantRegisterPost() {
+      try {
+        this.loading = true;
+        const res = await RegisterApi.add(this.form);
+        this.$emit("success", res);
+        this.close();
+        this.$notify({
+          title: "成功",
+          message: `添加成功`,
+          type: "success",
+        });
+        this.loading = false;
+      } catch (error) {
+        this.loading = false;
+        console.log(error);
+      }
+    },
+    show() {
+      this.dialogVisible = true;
+    },
+    close() {
+      this.dialogVisible = false;
+    },
+    reset() {
+      this.form.periodMonth = 1;
+      this.form.num = 1;
+      this.form.agent = "";
+    },
+  },
+};
+</script>
\ No newline at end of file
diff --git a/src/views/register/index.vue b/src/views/register/index.vue
index e69de29..f2eadac 100644
--- a/src/views/register/index.vue
+++ b/src/views/register/index.vue
@@ -0,0 +1,183 @@
+<template>
+  <div class="app-container">
+    <div class="head-container">
+      <div class="filter_wrap">
+        <!-- <el-input v-model="query.name" size="small" clearable placeholder="请输入完整的代理商账号查找" style="width: 250px"
+          @keyup.enter.native="getTableData" /> -->
+        <el-select v-model="query.type" placeholder="请选择类型" style="width: 200px">
+          <el-option label="快餐版" value="munchies" />
+          <el-option label="餐饮版" value="restaurant" />
+        </el-select>
+        <el-select v-model="query.state" placeholder="请选择状态" style="width: 200px">
+          <el-option label="待激活" :value="0" />
+          <el-option label="已使用" :value="1" />
+        </el-select>
+        <el-date-picker
+          v-model="query.createdAt"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          style="width: 400px"
+          @change="getTableData"
+        ></el-date-picker>
+        <el-button type="primary" @click="getTableData">查询</el-button>
+        <el-button @click="resetHandle">重置</el-button>
+      </div>
+    </div>
+    <div class="head-container">
+      <div class="filter_wrap">
+        <el-button type="primary" icon="plus" @click="$refs.addActivationCode.show()">
+          添加激活码
+        </el-button>
+        <el-button icon="download">导出Excel</el-button>
+      </div>
+    </div>
+    <div class="head-container">
+      <el-table :data="tableData.list" v-loading="tableData.loading">
+        <el-table-column label="激活码" prop="registerCode" width="500px">
+          <template v-slot="scope">
+            <el-tooltip content="点击复制">
+              <el-tag type="success" @click="copyHandle(scope.row.registerCode)">
+                <i class="el-icon-paperclip"></i>
+                {{ scope.row.registerCode }}
+              </el-tag>
+            </el-tooltip>
+          </template>
+        </el-table-column>
+        <el-table-column label="商户名称" prop="name"></el-table-column>
+        <el-table-column label="联系电话" prop="telephone"></el-table-column>
+        <el-table-column label="版本类型" prop="type">
+          <template v-slot="scope">
+            <span v-if="scope.row.type == 'munchies'">快餐版</span>
+            <span v-if="scope.row.type == 'restaurant'">餐饮版</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="激活时长" prop="periodYear"></el-table-column>
+        <el-table-column label="状态" prop="status">
+          <template v-slot="scope">
+            <el-tag type="info" v-if="scope.row.status == 0">待激活</el-tag>
+            <el-tag type="success" v-if="scope.row.status == 1">已使用</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="创建时间" prop="createdAt">
+          <template v-slot="scope">
+            {{ scope.row.createdAt && dayjs(scope.row.createdAt).format("YYYY-MM-DD HH:mm:ss") }}
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="head-container">
+      <!-- 分页 -->
+      <el-pagination
+        background
+        :total="tableData.total"
+        v-model:current-page="tableData.page"
+        v-model:page-size="tableData.size"
+        @current-change="paginationChange"
+        layout="total, sizes , prev, pager ,next, jumper"
+      ></el-pagination>
+    </div>
+    <addActivationCode ref="addActivationCode" @success="getTableData" />
+  </div>
+</template>
+
+<script>
+import dayjs from "dayjs";
+import RegisterApi from "@/api/account/register";
+import addActivationCode from "./components/addActivationCode.vue";
+import useClipboard from "vue-clipboard3";
+import { ElNotification } from "element-plus";
+const { toClipboard } = useClipboard();
+export default {
+  components: { addActivationCode },
+  data() {
+    return {
+      background: true,
+      dayjs,
+      query: {
+        name: "",
+        type: "",
+        state: "",
+        createdAt: [],
+      },
+      status: [
+        {
+          type: 1,
+          label: "开启",
+        },
+        {
+          type: 0,
+          label: "关闭",
+        },
+      ],
+      tableData: {
+        list: [],
+        page: 1,
+        size: 10,
+        loading: false,
+        total: 0,
+      },
+    };
+  },
+  mounted() {
+    this.getTableData();
+  },
+  methods: {
+    async copyHandle(text) {
+      try {
+        await toClipboard(text);
+        ElNotification({
+          title: "成功",
+          message: `复制成功`,
+          type: "success",
+        });
+        console.log("Copied to clipboard");
+      } catch (e) {
+        console.error(e);
+      }
+    },
+    // 重置查询
+    resetHandle() {
+      this.query.name = "";
+      this.query.account = "";
+      this.query.state = "";
+      this.getTableData();
+    },
+    // 分页回调
+    paginationChange(e) {
+      this.tableData.page = e;
+      this.getTableData();
+    },
+    async getTableData() {
+      this.tableData.loading = true;
+      try {
+        const res = await RegisterApi.getList({
+          page: this.tableData.page,
+          size: this.tableData.size,
+          type: this.query.type,
+          status: this.query.state,
+          createdAt: this.query.createdAt,
+        });
+        this.tableData.loading = false;
+        this.tableData.list = res.records;
+        this.tableData.total = res.totalRow * 1;
+      } catch (error) {
+        console.log(error);
+      }
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.shop_info {
+  display: flex;
+
+  .info {
+    flex: 1;
+    padding-left: 4px;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/shop/list/components/addShop.vue b/src/views/shop/list/components/addShop.vue
index a4c8f51..b43e6a9 100644
--- a/src/views/shop/list/components/addShop.vue
+++ b/src/views/shop/list/components/addShop.vue
@@ -6,7 +6,7 @@
   >
     <div style="height: 50vh; overflow-y: auto">
       <el-form
-        ref="form"
+        ref="refForm"
         :model="state.form"
         :rules="state.rules"
         label-width="120px"
@@ -16,14 +16,14 @@
           <el-input v-model="state.form.shopName" placeholder="请输入门店名称"></el-input>
         </el-form-item>
         <el-form-item label="店铺类型">
-          <el-radio-group v-model="state.form.type">
+          <el-radio-group v-model="state.form.shopType">
             <el-radio-button value="only">单店</el-radio-button>
             <el-radio-button value="chain">连锁店</el-radio-button>
             <el-radio-button value="join">加盟店</el-radio-button>
           </el-radio-group>
           <div class="tips">请谨慎修改！！！</div>
         </el-form-item>
-        <el-form-item label="主店账号" prop="mainId" v-if="state.form.type != 'only'">
+        <el-form-item label="主店账号" prop="mainId" v-if="state.form.shopType != 'only'">
           <el-select
             v-model="state.form.mainId"
             placeholder="请选择主店铺"
@@ -45,26 +45,10 @@
           <el-input v-model="state.form.chainName" placeholder="请输入连锁店扩展店名"></el-input>
         </el-form-item>
         <el-form-item label="门店logo" prop="logo">
-          <el-image
-            :src="state.form.logo || uploadImg"
-            fit="contain"
-            style="width: 80px; height: 80px"
-            @click="
-              state.showUpload = true;
-              state.uploadIndex = 1;
-            "
-          ></el-image>
+          <SingleImageUpload v-model="state.form.logo" />
         </el-form-item>
         <el-form-item label="门店照片">
-          <el-image
-            :src="state.form.coverImg || uploadImg"
-            fit="contain"
-            style="width: 80px; height: 80px"
-            @click="
-              state.showUpload = true;
-              state.uploadIndex = 2;
-            "
-          ></el-image>
+          <SingleImageUpload v-model="state.form.frontImg" />
         </el-form-item>
         <el-form-item label="经营模式">
           <el-radio-group v-model="state.form.registerType">
@@ -73,7 +57,7 @@
           </el-radio-group>
           <div class="tips">请谨慎修改！！！</div>
         </el-form-item>
-        <el-form-item label="管理方式" v-if="state.form.type != 'only'">
+        <el-form-item label="管理方式" v-if="state.form.shopType != 'only'">
           <el-radio-group v-model="state.form.tube_type">
             <el-radio-button value="0">不可直接管理</el-radio-button>
             <el-radio-button value="1">直接管理</el-radio-button>
@@ -87,17 +71,17 @@
           </el-radio-group>
         </el-form-item>
         <el-form-item label="激活码">
-          <el-input v-model="state.form.registerCode" placeholder="请输入激活码"></el-input>
+          <el-input v-model="state.form.activateCode" placeholder="请输入激活码"></el-input>
           <div class="tips">注：输入有效激活码表示添加的同时直接激活该店铺。</div>
         </el-form-item>
-        <el-form-item label="登录账号" prop="account">
-          <el-input v-model="state.form.account" placeholder="请输入登录账号"></el-input>
+        <el-form-item label="登录账号" prop="accountName">
+          <el-input v-model="state.form.accountName" placeholder="请输入登录账号"></el-input>
         </el-form-item>
         <el-form-item label="登录密码" prop="password" v-if="!state.form.id">
           <el-input
             type="password"
             show-password
-            v-model="state.form.password"
+            v-model="state.form.accountPwd"
             placeholder="请输入登录密码"
           ></el-input>
         </el-form-item>
@@ -117,7 +101,7 @@
                     <el-input-number v-model="form.takeaway_money" placeholder="0.00" controls-position="right"
                         :min="0"></el-input-number>
                 </el-form-item> -->
-        <el-form-item label="店铺经度" prop="provinces">
+        <el-form-item label="店铺经度" prop="lat">
           <el-row>
             <el-col :span="9" v-if="state.form.provinces">
               <el-input
@@ -168,46 +152,48 @@
     >
       <div class="map_box">
         <div class="map">
-          <el-amap ref="map" :center="state.amapOptions.center">
+          <el-amap ref="map" :center="state.amapOptions.center" @init="mapInit">
             <el-amap-marker :position="state.amapOptions.center"></el-amap-marker>
-            <el-amap-search-box
-              :visible="true"
-              @select="onSearchResult"
-              @choose="onSearchResult"
-              city="西安"
-            ></el-amap-search-box>
           </el-amap>
         </div>
-      </div>
-    </el-dialog>
-    <el-dialog
-      v-model="state.showUpload"
-      :close-on-click-modal="false"
-      append-to-body
-      width="500px"
-      @close="state.showUpload = false"
-    >
-      <el-upload
-        :before-remove="handleBeforeRemove"
-        :on-success="handleSuccess"
-        :on-error="handleError"
-        :file-list="state.fileList"
-        :headers="headers"
-        :action="qiNiuUploadApi"
-        class="upload-demo"
-        multiple
-      >
-        <el-button size="small" type="primary">点击上传</el-button>
-        <template #tip>
-          <div style="display: block" class="el-upload__tip">请勿上传违法文件，且文件不超过15M</div>
-        </template>
-      </el-upload>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="doSubmit">确认</el-button>
-          <el-button @click="uploadClose">取消</el-button>
+        <div class="search_box">
+          <el-input
+            v-model="state.searchOption.keyword"
+            placeholder="请输入关键字"
+            @focus="state.searchOption.focus = true"
+            @blur="autoCompleteSearchBlur"
+            @input="autoCompleteSearch(state.searchOption.keyword)"
+          >
+            <template #append>
+              <el-button type="primary" @click="placeSearchSearch(state.searchOption.keyword)">
+                搜索
+              </el-button>
+            </template>
+          </el-input>
+          <div class="list" v-if="state.searchOption.focus && state.searchOption.show">
+            <div
+              class="item"
+              @click="autoCompleteListClick(item)"
+              v-for="item in state.autoCompleteList"
+              :key="item.id"
+            >
+              {{ item.name }}
+            </div>
+          </div>
         </div>
-      </template>
+
+        <div class="search_wrap">
+          <div class="item" v-for="item in state.locationSearchList" :key="item.id">
+            <div class="left">
+              <div class="name">{{ item.name }}-{{ item.address }}</div>
+              <div class="location">经纬度：{{ item.location.lng }},{{ item.location.lat }}</div>
+            </div>
+            <div class="btn">
+              <el-button type="primary" @click="selectLocationHandle(item)">选择</el-button>
+            </div>
+          </div>
+        </div>
+      </div>
     </el-dialog>
 
     <template #footer>
@@ -225,6 +211,9 @@
 <script setup>
 import { getToken } from "@/utils/auth";
 import uploadImg from "@/assets/images/upload.png";
+import { ElAmap } from "@vuemap/vue-amap";
+import { initMapLoad } from "@/utils/mapLoadUtil";
+import { ElNotification } from "element-plus";
 // { geocode, ShopApi.getList }
 import ShopApi from "@/api/account/shop";
 const validateLogo = (rule, value, callback) => {
@@ -248,13 +237,13 @@ const state = reactive({
     id: "",
     shopName: "",
     mainId: "",
-    type: "only",
+    shopType: "only",
     tube_type: "0",
     registerType: "restaurant",
     profiles: "release",
-    registerCode: "",
-    account: "",
-    password: "",
+    activateCode: "",
+    accountName: "",
+    accountPwd: "",
     phone: "",
     supportDeviceNumber: 1,
     lat: "",
@@ -263,7 +252,7 @@ const state = reactive({
     detail: "",
     status: 1,
     logo: "",
-    coverImg: "",
+    frontImg: "",
     provinces: "",
     cities: "",
     districts: "",
@@ -285,7 +274,7 @@ const state = reactive({
         trigger: "blur",
       },
     ],
-    provinces: [
+    lat: [
       {
         required: true,
         message: "请选择坐标",
@@ -299,14 +288,14 @@ const state = reactive({
         trigger: "change",
       },
     ],
-    account: [
+    accountName: [
       {
         required: true,
         message: " ",
         trigger: "change",
       },
     ],
-    password: [
+    accountPwd: [
       {
         required: true,
         message: " ",
@@ -322,7 +311,11 @@ const state = reactive({
   searchOption: {
     city: "西安",
     citylimit: false,
+    keyword: "",
+    show: false,
+    focus: false,
   },
+  autoCompleteList: [],
   locationSearchList: [],
   amapOptions: {
     center: [108.946465, 34.347984],
@@ -331,6 +324,9 @@ const state = reactive({
   shopListLoading: false,
   shopList: [],
 });
+onBeforeMount(async () => {
+  const res = await initMapLoad();
+});
 onMounted(() => {
   state.resetForm = { ...state.form };
 });
@@ -352,39 +348,33 @@ async function getTableData(query = "") {
     console.log(error);
   }
 }
-function onSearchResult(res) {
-  console.log("res");
-  console.log(res);
-  state.locationSearchList = res;
-  state.amapOptions.center = [res[0].lng, res[0].lat];
-}
+
 // 确认地址选择
 async function selectLocationHandle(item) {
   console.log(item);
-  state.form.lng = item.lng;
-  state.form.lat = item.lat;
+  state.form.lng = item.location.lng;
+  state.form.lat = item.location.lat;
   state.form.address = item.address;
   state.showLocation = false;
 
-  const position = `${item.lng},${item.lat}`;
-  const res = JSON.parse(await geocode({ location: position }));
-  console.log(res);
+  const position = `${item.location.lng},${item.location.lat}`;
 
-  state.form.provinces = res.addressComponent.province;
-  state.form.cities = res.addressComponent.city;
-  state.form.districts = res.addressComponent.district;
+  state.form.provinces = item.pname;
+  state.form.cities = item.cityname;
+  state.form.districts = item.adname;
 }
 const emits = defineEmits(["close", "success"]);
+const refForm = ref(null);
 // 保存
 function submitHandle() {
-  state.$refs.form.validate(async (valid) => {
+  refForm.value.validate(async (valid) => {
     if (valid) {
       state.formLoading = true;
       try {
-        await ShopApi.getListPost(state.form, state.form.id ? "put" : "post");
+        state.form.id ? await ShopApi.edit(state.form) : await ShopApi.add(state.form);
         emits("success");
         state.formLoading = false;
-        $notify({
+        ElNotification({
           title: "成功",
           message: `${state.form.id ? "编辑" : "添加"}成功`,
           type: "success",
@@ -404,38 +394,7 @@ function handleSuccess(response, file, fileList) {
   console.log("上传成功", response);
   state.files = response.data;
 }
-function handleBeforeRemove(file, fileList) {
-  for (let i = 0; i < state.files.length; i++) {
-    if (state.files[i].uid === file.uid) {
-      crudQiNiu.del([state.files[i].id]).then((res) => {});
-      return true;
-    }
-  }
-}
-function handlePictureCardPreview(file) {
-  state.dialogImageUrl = file.url;
-  state.dialogVisible = true;
-}
-// 监听上传失败
-function handleError(e, file, fileList) {
-  const msg = JSON.parse(e.message);
-  state.crud.notify(msg.message, CRUD.NOTIFICATION_TYPE.ERROR);
-}
-// 刷新列表数据
-function doSubmit() {
-  state.fileList = [];
-  state.showUpload = false;
-  switch (state.uploadIndex) {
-    case 1:
-      state.form.logo = state.files[0];
-      break;
-    case 2:
-      state.form.coverImg = state.files[0];
-      break;
-    default:
-      break;
-  }
-}
+
 function show(obj) {
   getTableData();
   state.dialogVisible = true;
@@ -447,12 +406,80 @@ function show(obj) {
 function close() {
   state.dialogVisible = false;
 }
-function uploadClose() {
-  state.showUpload = false;
-}
 function reset() {
   state.form = { ...state.resetForm };
 }
+
+let ElMap = undefined;
+let placeSearch = undefined;
+let autoComplete = undefined;
+let PlaceSearchIndex = 1;
+
+function autoCompleteSearchBlur() {
+  setTimeout(() => {
+    state.searchOption.show = false;
+  }, 200);
+}
+
+function autoCompleteSearch(keyword) {
+  if (keyword === "") {
+    state.autoCompleteList = [];
+    return;
+  }
+  autoComplete.search(keyword, function (status, result) {
+    if (status === "complete" && result.info === "OK") {
+      // 搜索成功时，result即是对应的匹配数据
+      console.log(result);
+      state.searchOption.show = true;
+      state.autoCompleteList = result.tips;
+    }
+  });
+}
+function autoCompleteListClick(item) {
+  console.log(item);
+  state.searchOption.keyword = item.name;
+  state.autoCompleteList = [];
+  placeSearchSearch(item.name);
+}
+function placeSearchSearch(keyword) {
+  PlaceSearchIndex = 1;
+  if (keyword === "") {
+    state.locationSearchList = [];
+    return;
+  }
+  //  关键字查询
+  placeSearch.search(keyword, (status, result) => {
+    console.log(status);
+    console.log(result);
+    state.locationSearchList = result.poiList.pois;
+  });
+}
+function mapInit(map) {
+  map.plugin(["AMap.PlaceSearch", "AMap.AutoComplete", "AMap.ToolBar"], () => {
+    const toolBar = new AMap.ToolBar();
+    map.addControl(toolBar);
+    // 注意：输入提示插件2.0版本需引入AMap.AutoComplete，而1.4版本应使用AMap.Autocomplete
+    // 实例化AutoComplete
+    var autoOptions = {
+      city: "西安",
+    };
+    autoComplete = new AMap.AutoComplete(autoOptions);
+
+    //构造地点查询类
+    placeSearch = new AMap.PlaceSearch({
+      pageSize: 10, // 单页显示结果条数
+      pageIndex: PlaceSearchIndex, // 页码
+      city: "西安", // 兴趣点城市
+      citylimit: true, //是否强制限制在设置的城市内搜索
+      map: map, // 展现结果的地图实例
+      // panel: "search_wrap", // 结果列表将在此容器中进行展示。
+      autoFitView: true, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
+    });
+  });
+
+  ElMap = map;
+}
+
 defineExpose({
   show,
   close,
@@ -473,6 +500,20 @@ defineExpose({
     position: absolute;
     top: 10px;
     left: 10px;
+    z-index: 3000;
+    .list {
+      background-color: #fff;
+      .item {
+        height: 40px;
+        line-height: 40px;
+        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
+        padding: 0 10px;
+        cursor: pointer;
+        &:hover {
+          background-color: #eee;
+        }
+      }
+    }
   }
 
   .search_wrap {
diff --git a/src/views/shop/list/index.vue b/src/views/shop/list/index.vue
index f282cc5..63c3b23 100644
--- a/src/views/shop/list/index.vue
+++ b/src/views/shop/list/index.vue
@@ -4,7 +4,7 @@
       <el-row :gutter="20">
         <el-col :span="3">
           <el-input
-            v-model="query.name"
+            v-model="state.query.name"
             clearable
             placeholder="请输入店铺名称"
             style="width: 100%"
@@ -14,7 +14,7 @@
         </el-col>
         <el-col :span="3">
           <el-input
-            v-model="query.account"
+            v-model="state.query.account"
             clearable
             placeholder="请输入商户号"
             style="width: 100%"
@@ -23,11 +23,11 @@
           />
         </el-col>
         <el-col :span="3">
-          <el-select v-model="query.status" placeholder="请选择店铺状态" style="width: 100%">
+          <el-select v-model="state.query.status" placeholder="请选择店铺状态" style="width: 100%">
             <el-option
               :label="item.label"
               :value="item.type"
-              v-for="item in status"
+              v-for="item in state.status"
               :key="item.type"
             />
           </el-select>
@@ -39,12 +39,10 @@
       </el-row>
     </div>
     <div class="head-container">
-      <el-button type="primary" icon="el-icon-plus" @click="$refs.addShop.show()">
-        添加店铺
-      </el-button>
+      <el-button type="primary" icon="plus" @click="addShopShow">添加店铺</el-button>
     </div>
     <div class="head-container">
-      <el-table :data="tableData.list" v-loading="tableData.loading">
+      <el-table :data="state.tableData.list" v-loading="state.tableData.loading">
         <el-table-column label="店铺信息" width="200">
           <template v-slot="scope">
             <div class="shop_info">
@@ -52,9 +50,11 @@
                 :src="scope.row.logo"
                 style="width: 50px; height: 50px; border-radius: 4px; background-color: #efefef"
               >
-                <div class="img_error" slot="error">
-                  <i class="icon el-icon-document-delete"></i>
-                </div>
+                <template #error>
+                  <div class="img_error">
+                    <i class="icon el-icon-document-delete"></i>
+                  </div>
+                </template>
               </el-image>
               <div class="info">
                 <span>{{ scope.row.shopName }}</span>
@@ -102,11 +102,18 @@
         </el-table-column>
         <el-table-column label="操作" width="150">
           <template v-slot="scope">
-            <el-link icon="edit" @click="$refs.addShop.show(scope.row)">编辑</el-link>
+            <el-link @click="addShopShow(scope.row)">
+              <el-icon><Edit /></el-icon>
+              编辑
+            </el-link>
             <el-dropdown @command="dropdownClick">
-              <el-link icon="arrow-down">更多</el-link>
-              <el-dropdown-menu>
-                <template #dropdown>
+              <el-link>
+                更多
+                <el-icon><ArrowDown /></el-icon>
+              </el-link>
+
+              <template #dropdown>
+                <el-dropdown-menu>
                   <el-dropdown-item :command="{ row: scope.row, command: 1 }">
                     三方配置
                   </el-dropdown-item>
@@ -114,8 +121,8 @@
                   <el-dropdown-item :command="3">前往店铺</el-dropdown-item>
                   <el-dropdown-item :command="4">重置密码</el-dropdown-item>
                   <el-dropdown-item divided :command="5">删除</el-dropdown-item>
-                </template>
-              </el-dropdown-menu>
+                </el-dropdown-menu>
+              </template>
             </el-dropdown>
           </template>
         </el-table-column>
@@ -123,98 +130,98 @@
     </div>
     <div class="head-container">
       <el-pagination
-        :total="tableData.total"
-        v-model:current-page="tableData.page"
-        :page-size="tableData.size"
+        :total="state.tableData.total"
+        v-model:current-page="state.tableData.page"
+        v-model:page-size="state.tableData.size"
+        :page-sizes="[10, 20, 30, 50, 100]"
         @current-change="paginationChange"
-        layout="total, sizes, prev, pager, next, jumper"
+        layout="total, sizes , prev, pager ,next, jumper "
       ></el-pagination>
     </div>
-    <addShop ref="addShop" @success="getTableData" />
-    <detailModal ref="detailModal" />
+    <addShop ref="refAddShop" @success="getTableData" />
+    <detailModal ref="refDetailModal" />
   </div>
 </template>
 
-<script>
+<script setup>
 import dayjs from "dayjs";
 import ShopApi from "@/api/account/shop";
-
+import { ElNotification } from "element-plus";
 import addShop from "./components/addShop.vue";
 import detailModal from "./components/detailModal.vue";
-export default {
-  components: { addShop, detailModal },
-  data() {
-    return {
-      dayjs,
-      query: {
-        name: "",
-        account: "",
-        status: "",
-      },
-      status: [
-        {
-          type: 1,
-          label: "开启",
-        },
-        {
-          type: 0,
-          label: "关闭",
-        },
-      ],
-      tableData: {
-        list: [],
-        page: 1,
-        size: 10,
-        loading: false,
-        total: 0,
-      },
-    };
+
+const refAddShop = ref(null);
+function addShopShow(row) {
+  refAddShop.value.show(row);
+}
+const state = reactive({
+  query: {
+    name: "",
+    account: "",
+    status: "",
   },
-  mounted() {
-    this.getTableData();
+  status: [
+    {
+      type: 1,
+      label: "开启",
+    },
+    {
+      type: 0,
+      label: "关闭",
+    },
+  ],
+  tableData: {
+    list: [],
+    page: 1,
+    size: 10,
+    loading: false,
+    total: 0,
   },
-  methods: {
-    dropdownClick(e) {
-      switch (e.command) {
-        case 1:
-          this.$refs.detailModal.show(e.row);
-          break;
-        default:
-          break;
-      }
-    },
-    // 重置查询
-    resetHandle() {
-      this.query.name = "";
-      this.query.account = "";
-      this.query.status = "";
-      this.getTableData();
-    },
-    // 分页回调
-    paginationChange(e) {
-      this.tableData.page = e;
-      this.getTableData();
-    },
-    // 获取商家列表
-    async getTableData() {
-      this.tableData.loading = true;
-      try {
-        const res = await ShopApi.getList({
-          page: this.tableData.page,
-          size: this.tableData.size,
-          shopName: this.query.name,
-          account: this.query.account,
-          status: this.query.status,
-        });
-        this.tableData.loading = false;
-        this.tableData.list = res.records;
-        this.tableData.total = res.totalRow;
-      } catch (error) {
-        console.log(error);
-      }
-    },
-  },
-};
+});
+onMounted(() => {
+  getTableData();
+});
+
+const refDetailModal = ref(null);
+function dropdownClick(e) {
+  switch (e.command) {
+    case 1:
+      refDetailModal.value.show(e.row);
+      break;
+    default:
+      break;
+  }
+}
+// 重置查询
+function resetHandle() {
+  state.query.name = "";
+  state.query.account = "";
+  state.query.status = "";
+  getTableData();
+}
+// 分页回调
+function paginationChange(e) {
+  state.tableData.page = e;
+  getTableData();
+}
+// 获取商家列表
+async function getTableData() {
+  state.tableData.loading = true;
+  try {
+    const res = await ShopApi.getList({
+      page: state.tableData.page,
+      size: state.tableData.size,
+      shopName: state.query.name,
+      account: state.query.account,
+      status: state.query.status,
+    });
+    state.tableData.loading = false;
+    state.tableData.list = res.records;
+    state.tableData.total = res.totalRow * 1;
+  } catch (error) {
+    console.log(error);
+  }
+}
 </script>
 
 <style scoped lang="scss">
@@ -229,4 +236,8 @@ export default {
     padding-left: 4px;
   }
 }
+.el-link {
+  min-height: 23px;
+  margin: 0 5px;
+}
 </style>
\ No newline at end of file