commit c25fda368f62d4c3e2eeaa3e759e6ddeee4223dc
Author: Mr_gzy <guozy0816@gmail.com>
Date:   Thu Apr 3 10:53:57 2025 +0800

    初始化项目

diff --git a/.env.development b/.env.development
new file mode 100644
index 0000000..f38f4f6
--- /dev/null
+++ b/.env.development
@@ -0,0 +1,8 @@
+# 页面标题
+VITE_APP_TITLE = 枝点品牌方管理系统
+
+# 开发环境配置
+VITE_APP_ENV = 'development'
+
+# 枝点品牌方管理系统/开发环境
+VITE_APP_BASE_API = '/dev-api'
diff --git a/.env.production b/.env.production
new file mode 100644
index 0000000..14d48fd
--- /dev/null
+++ b/.env.production
@@ -0,0 +1,11 @@
+# 页面标题
+VITE_APP_TITLE = 枝点品牌方管理系统
+
+# 生产环境配置
+VITE_APP_ENV = 'production'
+
+# 枝点品牌方管理系统/生产环境
+VITE_APP_BASE_API = '/prod-api'
+
+# 是否在打包时开启压缩，支持 gzip 和 brotli
+VITE_BUILD_COMPRESS = gzip
\ No newline at end of file
diff --git a/.env.staging b/.env.staging
new file mode 100644
index 0000000..9f83f8f
--- /dev/null
+++ b/.env.staging
@@ -0,0 +1,11 @@
+# 页面标题
+VITE_APP_TITLE = 枝点品牌方管理系统
+
+# 生产环境配置
+VITE_APP_ENV = 'staging'
+
+# 枝点品牌方管理系统/生产环境
+VITE_APP_BASE_API = '/stage-api'
+
+# 是否在打包时开启压缩，支持 gzip 和 brotli
+VITE_BUILD_COMPRESS = gzip
\ No newline at end of file
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..8564f29
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,20 @@
+The MIT License (MIT)
+
+Copyright (c) 2018 RuoYi
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
\ No newline at end of file
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..99bda70
--- /dev/null
+++ b/README.md
@@ -0,0 +1,109 @@
+<p align="center">
+	<img alt="logo" src="https://oscimg.oschina.net/oscnet/up-d3d0a9303e11d522a06cd263f3079027715.png">
+</p>
+<h1 align="center" style="margin: 30px 0 30px; font-weight: bold;">RuoYi v3.8.8</h1>
+<h4 align="center">基于SpringBoot+Vue3前后端分离的Java快速开发框架</h4>
+<p align="center">
+	<a href="https://gitee.com/y_project/RuoYi-Vue/stargazers"><img src="https://gitee.com/y_project/RuoYi-Vue/badge/star.svg?theme=dark"></a>
+	<a href="https://gitee.com/y_project/RuoYi-Vue"><img src="https://img.shields.io/badge/RuoYi-v3.8.8-brightgreen.svg"></a>
+	<a href="https://gitee.com/y_project/RuoYi-Vue/blob/master/LICENSE"><img src="https://img.shields.io/github/license/mashape/apistatus.svg"></a>
+</p>
+
+## 平台简介
+
+* 本仓库为前端技术栈 [Vue3](https://v3.cn.vuejs.org) + [Element Plus](https://element-plus.org/zh-CN) + [Vite](https://cn.vitejs.dev) 版本。
+* 配套后端代码仓库地址[RuoYi-Vue](https://gitee.com/y_project/RuoYi-Vue) 或 [RuoYi-Vue-fast](https://github.com/yangzongzhuan/RuoYi-Vue-fast) 版本。
+* 前端技术栈（[Vue2](https://cn.vuejs.org) + [Element](https://github.com/ElemeFE/element) + [Vue CLI](https://cli.vuejs.org/zh)），请移步[RuoYi-Vue](https://gitee.com/y_project/RuoYi-Vue/tree/master/ruoyi-ui)。
+* 阿里云折扣场：[点我进入](http://aly.ruoyi.vip)，腾讯云秒杀场：[点我进入](http://txy.ruoyi.vip)&nbsp;&nbsp;
+* 阿里云优惠券：[点我领取](https://www.aliyun.com/minisite/goods?userCode=brki8iof&share_source=copy_link)，腾讯云优惠券：[点我领取](https://cloud.tencent.com/redirect.php?redirect=1025&cps_key=198c8df2ed259157187173bc7f4f32fd&from=console)&nbsp;&nbsp;
+
+## 前端运行
+
+```bash
+# 克隆项目
+git clone https://github.com/yangzongzhuan/RuoYi-Vue3.git
+
+# 进入项目目录
+cd RuoYi-Vue3
+
+# 安装依赖
+yarn --registry=https://registry.npmmirror.com
+
+# 启动服务
+yarn dev
+
+# 构建测试环境 yarn build:stage
+# 构建生产环境 yarn build:prod
+# 前端访问地址 http://localhost:80
+```
+
+## 内置功能
+
+1.  用户管理：用户是系统操作者，该功能主要完成系统用户配置。
+2.  部门管理：配置系统组织机构（公司、部门、小组），树结构展现支持数据权限。
+3.  岗位管理：配置系统用户所属担任职务。
+4.  菜单管理：配置系统菜单，操作权限，按钮权限标识等。
+5.  角色管理：角色菜单权限分配、设置角色按机构进行数据范围权限划分。
+6.  字典管理：对系统中经常使用的一些较为固定的数据进行维护。
+7.  参数管理：对系统动态配置常用参数。
+8.  通知公告：系统通知公告信息发布维护。
+9.  操作日志：系统正常操作日志记录和查询；系统异常信息日志记录和查询。
+10. 登录日志：系统登录日志记录查询包含登录异常。
+11. 在线用户：当前系统中活跃用户状态监控。
+12. 定时任务：在线（添加、修改、删除)任务调度包含执行结果日志。
+13. 代码生成：前后端代码的生成（java、html、xml、sql）支持CRUD下载 。
+14. 系统接口：根据业务代码自动生成相关的api接口文档。
+15. 服务监控：监视当前系统CPU、内存、磁盘、堆栈等相关信息。
+16. 缓存监控：对系统的缓存信息查询，命令统计等。
+17. 在线构建器：拖动表单元素生成相应的HTML代码。
+18. 连接池监视：监视当前系统数据库连接池状态，可进行分析SQL找出系统性能瓶颈。
+
+## 在线体验
+
+- admin/admin123  
+- 陆陆续续收到一些打赏，为了更好的体验已用于演示服务器升级。谢谢各位小伙伴。
+
+演示地址：http://vue.ruoyi.vip  
+文档地址：http://doc.ruoyi.vip
+
+## 演示图
+
+<table>
+    <tr>
+        <td><img src="https://oscimg.oschina.net/oscnet/cd1f90be5f2684f4560c9519c0f2a232ee8.jpg"/></td>
+        <td><img src="https://oscimg.oschina.net/oscnet/1cbcf0e6f257c7d3a063c0e3f2ff989e4b3.jpg"/></td>
+    </tr>
+    <tr>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-8074972883b5ba0622e13246738ebba237a.png"/></td>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-9f88719cdfca9af2e58b352a20e23d43b12.png"/></td>
+    </tr>
+    <tr>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-39bf2584ec3a529b0d5a3b70d15c9b37646.png"/></td>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-936ec82d1f4872e1bc980927654b6007307.png"/></td>
+    </tr>
+	<tr>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-b2d62ceb95d2dd9b3fbe157bb70d26001e9.png"/></td>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-d67451d308b7a79ad6819723396f7c3d77a.png"/></td>
+    </tr>	 
+    <tr>
+        <td><img src="https://oscimg.oschina.net/oscnet/5e8c387724954459291aafd5eb52b456f53.jpg"/></td>
+        <td><img src="https://oscimg.oschina.net/oscnet/644e78da53c2e92a95dfda4f76e6d117c4b.jpg"/></td>
+    </tr>
+	<tr>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-8370a0d02977eebf6dbf854c8450293c937.png"/></td>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-49003ed83f60f633e7153609a53a2b644f7.png"/></td>
+    </tr>
+	<tr>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-d4fe726319ece268d4746602c39cffc0621.png"/></td>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-c195234bbcd30be6927f037a6755e6ab69c.png"/></td>
+    </tr>
+    <tr>
+        <td><img src="https://oscimg.oschina.net/oscnet/b6115bc8c31de52951982e509930b20684a.jpg"/></td>
+        <td><img src="https://oscimg.oschina.net/oscnet/up-5e4daac0bb59612c5038448acbcef235e3a.png"/></td>
+    </tr>
+</table>
+
+
+## 枝点品牌方前后端分离交流群
+
+QQ群： [![加入QQ群](https://img.shields.io/badge/已满-937441-blue.svg)](https://jq.qq.com/?_wv=1027&k=5bVB1og) [![加入QQ群](https://img.shields.io/badge/已满-887144332-blue.svg)](https://jq.qq.com/?_wv=1027&k=5eiA4DH) [![加入QQ群](https://img.shields.io/badge/已满-180251782-blue.svg)](https://jq.qq.com/?_wv=1027&k=5AxMKlC) [![加入QQ群](https://img.shields.io/badge/已满-104180207-blue.svg)](https://jq.qq.com/?_wv=1027&k=51G72yr) [![加入QQ群](https://img.shields.io/badge/已满-186866453-blue.svg)](https://jq.qq.com/?_wv=1027&k=VvjN2nvu) [![加入QQ群](https://img.shields.io/badge/已满-201396349-blue.svg)](https://jq.qq.com/?_wv=1027&k=5vYAqA05) [![加入QQ群](https://img.shields.io/badge/已满-101456076-blue.svg)](https://jq.qq.com/?_wv=1027&k=kOIINEb5) [![加入QQ群](https://img.shields.io/badge/已满-101539465-blue.svg)](https://jq.qq.com/?_wv=1027&k=UKtX5jhs) [![加入QQ群](https://img.shields.io/badge/已满-264312783-blue.svg)](https://jq.qq.com/?_wv=1027&k=EI9an8lJ) [![加入QQ群](https://img.shields.io/badge/已满-167385320-blue.svg)](https://jq.qq.com/?_wv=1027&k=SWCtLnMz) [![加入QQ群](https://img.shields.io/badge/已满-104748341-blue.svg)](https://jq.qq.com/?_wv=1027&k=96Dkdq0k) [![加入QQ群](https://img.shields.io/badge/已满-160110482-blue.svg)](https://jq.qq.com/?_wv=1027&k=0fsNiYZt) [![加入QQ群](https://img.shields.io/badge/已满-170801498-blue.svg)](https://jq.qq.com/?_wv=1027&k=7xw4xUG1) [![加入QQ群](https://img.shields.io/badge/已满-108482800-blue.svg)](https://jq.qq.com/?_wv=1027&k=eCx8eyoJ) [![加入QQ群](https://img.shields.io/badge/已满-101046199-blue.svg)](https://jq.qq.com/?_wv=1027&k=SpyH2875) [![加入QQ群](https://img.shields.io/badge/已满-136919097-blue.svg)](https://jq.qq.com/?_wv=1027&k=tKEt51dz) [![加入QQ群](https://img.shields.io/badge/已满-143961921-blue.svg)](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=0vBbSb0ztbBgVtn3kJS-Q4HUNYwip89G&authKey=8irq5PhutrZmWIvsUsklBxhj57l%2F1nOZqjzigkXZVoZE451GG4JHPOqW7AW6cf0T&noverify=0&group_code=143961921) [![加入QQ群](https://img.shields.io/badge/已满-174951577-blue.svg)](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=ZFAPAbp09S2ltvwrJzp7wGlbopsc0rwi&authKey=HB2cxpxP2yspk%2Bo3WKTBfktRCccVkU26cgi5B16u0KcAYrVu7sBaE7XSEqmMdFQp&noverify=0&group_code=174951577) [![加入QQ群](https://img.shields.io/badge/已满-161281055-blue.svg)](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=Fn2aF5IHpwsy8j6VlalNJK6qbwFLFHat&authKey=uyIT%2B97x2AXj3odyXpsSpVaPMC%2Bidw0LxG5MAtEqlrcBcWJUA%2FeS43rsF1Tg7IRJ&noverify=0&group_code=161281055) [![加入QQ群](https://img.shields.io/badge/已满-138988063-blue.svg)](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=XIzkm_mV2xTsUtFxo63bmicYoDBA6Ifm&authKey=dDW%2F4qsmw3x9govoZY9w%2FoWAoC4wbHqGal%2BbqLzoS6VBarU8EBptIgPKN%2FviyC8j&noverify=0&group_code=138988063) [![加入QQ群](https://img.shields.io/badge/151450850-blue.svg)](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=DkugnCg68PevlycJSKSwjhFqfIgrWWwR&authKey=pR1Pa5lPIeGF%2FFtIk6d%2FGB5qFi0EdvyErtpQXULzo03zbhopBHLWcuqdpwY241R%2F&noverify=0&group_code=151450850) 点击按钮入群。
\ No newline at end of file
diff --git a/bin/build.bat b/bin/build.bat
new file mode 100644
index 0000000..ecbb454
--- /dev/null
+++ b/bin/build.bat
@@ -0,0 +1,12 @@
+@echo off
+echo.
+echo [��Ϣ] ���Web���̣�����dist�ļ���
+echo.
+
+%~d0
+cd %~dp0
+
+cd ..
+yarn build:prod
+
+pause
\ No newline at end of file
diff --git a/bin/package.bat b/bin/package.bat
new file mode 100644
index 0000000..f5b24e0
--- /dev/null
+++ b/bin/package.bat
@@ -0,0 +1,12 @@
+@echo off
+echo.
+echo [��Ϣ] ��װWeb���̣�����node_modules�ļ���
+echo.
+
+%~d0
+cd %~dp0
+
+cd ..
+yarn --registry=https://registry.npmmirror.com
+
+pause
\ No newline at end of file
diff --git a/bin/run-web.bat b/bin/run-web.bat
new file mode 100644
index 0000000..d2fe397
--- /dev/null
+++ b/bin/run-web.bat
@@ -0,0 +1,12 @@
+@echo off
+echo.
+echo [��Ϣ] ʹ�� Vite �������� Web ���̡�
+echo.
+
+%~d0
+cd %~dp0
+
+cd ..
+yarn dev
+
+pause
\ No newline at end of file
diff --git a/html/ie.html b/html/ie.html
new file mode 100644
index 0000000..052ffcd
--- /dev/null
+++ b/html/ie.html
@@ -0,0 +1,46 @@
+
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8" />
+    <title>请升级您的浏览器</title>
+    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" >
+    <meta name="renderer" content="webkit">
+    <base target="_blank" />
+    <style type="text/css">
+        html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}
+        a{text-decoration:none;color:#0072c6;}a:hover{text-decoration:none;color:#004d8c;}
+        body{width:960px;margin:0 auto;padding:10px;font-size:14px;line-height:24px;color:#454545;font-family:'Microsoft YaHei UI','Microsoft YaHei',DengXian,SimSun,'Segoe UI',Tahoma,Helvetica,sans-serif;overflow-y:scroll}
+        h1{font-size:40px;line-height:80px;font-weight:100;margin-bottom:10px;}
+        h2{font-size:20px;line-height:25px;font-weight:100;margin:10px 0;}
+        em{color:red}
+        p{margin-bottom:10px;}
+        hr{margin:20px 0;border:0;border-top:1px solid #dadada}
+        span{display:block;font-size:12px;line-height:12px;}
+        .clean{clear:both;}
+        .browser{padding:10px 10px;}
+        .browser li{width:auto;padding:0 80px;margin-top:30px;height:34px;line-height:22px;float:left;list-style:none;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAADMCAYAAAAWCXEwAAAACXBIWXMAAAsTAAALEwEAmpwYAAAKTWlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVN3WJP3Fj7f92UPVkLY8LGXbIEAIiOsCMgQWaIQkgBhhBASQMWFiApWFBURnEhVxILVCkidiOKgKLhnQYqIWotVXDjuH9yntX167+3t+9f7vOec5/zOec8PgBESJpHmomoAOVKFPDrYH49PSMTJvYACFUjgBCAQ5svCZwXFAADwA3l4fnSwP/wBr28AAgBw1S4kEsfh/4O6UCZXACCRAOAiEucLAZBSAMguVMgUAMgYALBTs2QKAJQAAGx5fEIiAKoNAOz0ST4FANipk9wXANiiHKkIAI0BAJkoRyQCQLsAYFWBUiwCwMIAoKxAIi4EwK4BgFm2MkcCgL0FAHaOWJAPQGAAgJlCLMwAIDgCAEMeE80DIEwDoDDSv+CpX3CFuEgBAMDLlc2XS9IzFLiV0Bp38vDg4iHiwmyxQmEXKRBmCeQinJebIxNI5wNMzgwAABr50cH+OD+Q5+bk4eZm52zv9MWi/mvwbyI+IfHf/ryMAgQAEE7P79pf5eXWA3DHAbB1v2upWwDaVgBo3/ldM9sJoFoK0Hr5i3k4/EAenqFQyDwdHAoLC+0lYqG9MOOLPv8z4W/gi372/EAe/tt68ABxmkCZrcCjg/1xYW52rlKO58sEQjFu9+cj/seFf/2OKdHiNLFcLBWK8ViJuFAiTcd5uVKRRCHJleIS6X8y8R+W/QmTdw0ArIZPwE62B7XLbMB+7gECiw5Y0nYAQH7zLYwaC5EAEGc0Mnn3AACTv/mPQCsBAM2XpOMAALzoGFyolBdMxggAAESggSqwQQcMwRSswA6cwR28wBcCYQZEQAwkwDwQQgbkgBwKoRiWQRlUwDrYBLWwAxqgEZrhELTBMTgN5+ASXIHrcBcGYBiewhi8hgkEQcgIE2EhOogRYo7YIs4IF5mOBCJhSDSSgKQg6YgUUSLFyHKkAqlCapFdSCPyLXIUOY1cQPqQ28ggMor8irxHMZSBslED1AJ1QLmoHxqKxqBz0XQ0D12AlqJr0Rq0Hj2AtqKn0UvodXQAfYqOY4DRMQ5mjNlhXIyHRWCJWBomxxZj5Vg1Vo81Yx1YN3YVG8CeYe8IJAKLgBPsCF6EEMJsgpCQR1hMWEOoJewjtBK6CFcJg4Qxwicik6hPtCV6EvnEeGI6sZBYRqwm7iEeIZ4lXicOE1+TSCQOyZLkTgohJZAySQtJa0jbSC2kU6Q+0hBpnEwm65Btyd7kCLKArCCXkbeQD5BPkvvJw+S3FDrFiOJMCaIkUqSUEko1ZT/lBKWfMkKZoKpRzame1AiqiDqfWkltoHZQL1OHqRM0dZolzZsWQ8ukLaPV0JppZ2n3aC/pdLoJ3YMeRZfQl9Jr6Afp5+mD9HcMDYYNg8dIYigZaxl7GacYtxkvmUymBdOXmchUMNcyG5lnmA+Yb1VYKvYqfBWRyhKVOpVWlX6V56pUVXNVP9V5qgtUq1UPq15WfaZGVbNQ46kJ1Bar1akdVbupNq7OUndSj1DPUV+jvl/9gvpjDbKGhUaghkijVGO3xhmNIRbGMmXxWELWclYD6yxrmE1iW7L57Ex2Bfsbdi97TFNDc6pmrGaRZp3mcc0BDsax4PA52ZxKziHODc57LQMtPy2x1mqtZq1+rTfaetq+2mLtcu0W7eva73VwnUCdLJ31Om0693UJuja6UbqFutt1z+o+02PreekJ9cr1Dund0Uf1bfSj9Rfq79bv0R83MDQINpAZbDE4Y/DMkGPoa5hpuNHwhOGoEctoupHEaKPRSaMnuCbuh2fjNXgXPmasbxxirDTeZdxrPGFiaTLbpMSkxeS+Kc2Ua5pmutG003TMzMgs3KzYrMnsjjnVnGueYb7ZvNv8jYWlRZzFSos2i8eW2pZ8ywWWTZb3rJhWPlZ5VvVW16xJ1lzrLOtt1ldsUBtXmwybOpvLtqitm63Edptt3xTiFI8p0in1U27aMez87ArsmuwG7Tn2YfYl9m32zx3MHBId1jt0O3xydHXMdmxwvOuk4TTDqcSpw+lXZxtnoXOd8zUXpkuQyxKXdpcXU22niqdun3rLleUa7rrStdP1o5u7m9yt2W3U3cw9xX2r+00umxvJXcM970H08PdY4nHM452nm6fC85DnL152Xlle+70eT7OcJp7WMG3I28Rb4L3Le2A6Pj1l+s7pAz7GPgKfep+Hvqa+It89viN+1n6Zfgf8nvs7+sv9j/i/4XnyFvFOBWABwQHlAb2BGoGzA2sDHwSZBKUHNQWNBbsGLww+FUIMCQ1ZH3KTb8AX8hv5YzPcZyya0RXKCJ0VWhv6MMwmTB7WEY6GzwjfEH5vpvlM6cy2CIjgR2yIuB9pGZkX+X0UKSoyqi7qUbRTdHF09yzWrORZ+2e9jvGPqYy5O9tqtnJ2Z6xqbFJsY+ybuIC4qriBeIf4RfGXEnQTJAntieTE2MQ9ieNzAudsmjOc5JpUlnRjruXcorkX5unOy553PFk1WZB8OIWYEpeyP+WDIEJQLxhP5aduTR0T8oSbhU9FvqKNolGxt7hKPJLmnVaV9jjdO31D+miGT0Z1xjMJT1IreZEZkrkj801WRNberM/ZcdktOZSclJyjUg1plrQr1zC3KLdPZisrkw3keeZtyhuTh8r35CP5c/PbFWyFTNGjtFKuUA4WTC+oK3hbGFt4uEi9SFrUM99m/ur5IwuCFny9kLBQuLCz2Lh4WfHgIr9FuxYji1MXdy4xXVK6ZHhp8NJ9y2jLspb9UOJYUlXyannc8o5Sg9KlpUMrglc0lamUycturvRauWMVYZVkVe9ql9VbVn8qF5VfrHCsqK74sEa45uJXTl/VfPV5bdra3kq3yu3rSOuk626s91m/r0q9akHV0IbwDa0b8Y3lG19tSt50oXpq9Y7NtM3KzQM1YTXtW8y2rNvyoTaj9nqdf13LVv2tq7e+2Sba1r/dd3vzDoMdFTve75TsvLUreFdrvUV99W7S7oLdjxpiG7q/5n7duEd3T8Wej3ulewf2Re/ranRvbNyvv7+yCW1SNo0eSDpw5ZuAb9qb7Zp3tXBaKg7CQeXBJ9+mfHvjUOihzsPcw83fmX+39QjrSHkr0jq/dawto22gPaG97+iMo50dXh1Hvrf/fu8x42N1xzWPV56gnSg98fnkgpPjp2Snnp1OPz3Umdx590z8mWtdUV29Z0PPnj8XdO5Mt1/3yfPe549d8Lxw9CL3Ytslt0utPa49R35w/eFIr1tv62X3y+1XPK509E3rO9Hv03/6asDVc9f41y5dn3m978bsG7duJt0cuCW69fh29u0XdwruTNxdeo94r/y+2v3qB/oP6n+0/rFlwG3g+GDAYM/DWQ/vDgmHnv6U/9OH4dJHzEfVI0YjjY+dHx8bDRq98mTOk+GnsqcTz8p+Vv9563Or59/94vtLz1j82PAL+YvPv655qfNy76uprzrHI8cfvM55PfGm/K3O233vuO+638e9H5ko/ED+UPPR+mPHp9BP9z7nfP78L/eE8/sl0p8zAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAC7ESURBVHja5Lx5dFRV1rBfgHwYRQQVtB26ZWhtabtfeUGxGxFbUGZF8RMHGkVbRkekVYiKisicVhE0gEwBokgDAhEMMSSQkAECwcxkrlRSqVTqJqnxzs/vj5t7qUyAvr9e37fWV2vtleSm6p6n9t5nn733OVU2RaUaEP5PiqJSbeMXPBTA5/Xhzk9Vnd9vo3HFx21E2LYJX9IRgh6npvyCe9uaqS4K4C3IpXHFx9S99CTuJ8Z0KLVjRlA7ZgTuJ8ZgXxmJL+kIlwAkXBQk6HFq9pWRVA8fSvXwodYgdS892a6EA1UNvouqwXdR99KTeAtyfz2IL+kI1cOHYh9wqwVwKWJqpXbMCOv19gG3Imzb1JF2OgZxfr/NukH4jcNVfyEAE8IU+4BbKet1PfaVke3BtA/i/H6b8aIBt7a4mWmaC0nr55vmqRp8F5V33Mm5LhHtwbQF8SUdsSDCb1I1+K42g1xIWgOYYh9wK+e6RCBs29QxSIWus37aJM51iWjx4so77mwD1d5AHQ1eecedlN9yuyVlva6nrNf14Q7cEmRn4W7u3T2E9ME3UX7L7W1uZg5Weced1s3sA2613ql5LXzQjuRclwjcT4wxTXQeRHC7GLdnHPeensiCVwa3e0PznZk3EbZtwluQa0kofz8NcVNxr++Ce30XnNuv61Bcu7viXt8Fvyu7JYipjfGHxzD+8Bh2j+7fAiZcC+Y0zPDIbCyD6DyV6DyVeDcIQR2C39J4oieNJ3oSOnkVcnZ35Ozu6MVdDHF0N6S4C43OqJYg/0ydzb27hzDx0FjuPT2R+asfa6OVsl7X40s6QoWus/CQk6fWZPHChhxe3lbMCxtyrN9TyxSQSwidvMoC0XK6tRGybPjSRmOuNUKVo4Zxe8YxIu4+Jh4ay/jDY7j39MQWWjnXJYLGFR9Toes8tSaLiavTrIHDxfxfapkCwW8hy9YuhCmhk1fR1FRnaCS1NM4yy8RDYy2tjIkZRXq/HtYsCnqc2sJDTkYsTrU00J6YkEJQR7M/eEGY0MmrcOenqjZA2JmyzTJLuJiOe65LBHUvPUmGR2bE4lQmrk7jqTVZHcrE1WkMWpRIdJ4KnpUXBCHLRl3e16EWIOEaMU00/vAY9na/gsYVH/NdgYe+8w9bMBeSQYsSWXjICcFvL2ga+dhlFwcJ10rjio/ZklprgbSWiavTWvzdd/5hXt5W/OtATC201sq9u4eQ+PVijmSW0nf+YQYtSmTQosR2gUYsTmXQokT6zj9saeRCpmkJ0hxD2gOZeGgsI+Lu45+ps7FXlFmDmDDtSd/5h+k7/zCpZQpa9cwOQciyIR+77LyzFhXlMyZmFOP2jLP8orVWRsTdR2ppHFtSa+k6ZZM1WHvSdcomwyxySceayO4OWTY88TdirygzUkWf18eL2//RQiutYcwYE/Q4tagDOUQ8uo6uUzbRZ3qMJV2nbCLi0XU8tSbrolNXzu6OfOyylgEN4NOkaO5acw/j9ozr0ET37h5imehIZimPL91rAfSZHsOQBfuISS7E7vaTETeX0MmrOoQInbwK+dhlNKWsahni0zPSuGvNPW1M1BrI1NrOwt0WkCn2ijJSS+MYt2ccuQk3oxd36RCi8URPY+HLT1VbgGiSzPsx71laCddMe2Yygf6ZOtuScXvG0XfJn/n8YL+LQnjibyQ34WZ8Xl/bfKSoKL+FVi4EYwKZcu/uIQzaPoExMaPQcrq1ADFX33AI1+6u1OV9HVI6ShU/TYqm75I/dwjTHtDEQ2MZt2ccg7ZPaGGScIDWEBlxc42UoSMQ00StYdoDCgcbtH0Cbx+8p40ZTIBwiFM7RmB3+y+exZvT2YRpDdR6ZoVrw1xRWwN44m/Euf06A6Ki7NLrmnDNmH7TEdSg7RP4/GA/yLK1GdwEKNzSk1M7RlDlqPl1JefOlG2MXTGmXaAxMaMsB/XE34h4tH+7ANlrB7T2iV8OAlDlqOH9mPcsIBPKlF3R16Ad7GwlxoVberYAKCrKv1ghfmkg5sPldLIzZVsLqLErxpC9doAlp3aMICNurlGyVpRdSAu/HqS1Q58rd1JUlI87P1UtKsrHXlGG3e1HCOoov+x2wiX3RxT+o49L1IgutXxVUCfDIxNfLraQDI+M3e3/NdCXbhohqBNfLrIsVzZqmoT6dmXG0SBLTrmJLxd/CVRLECXcDGFaSC1TmHE0yKg4B0P2uxiy38WoOAePHaptAfHYoVqG7HcxcGc5o+IcfFfgsbQUPoYoSa213BbE78oGucTSwpJTbobFFjNgbQHdvi6g8/Z6Om+vZ8h+VxsQE7T/97UMWFvA+Og0UvIryfDIZBQ4CeXvt8a5IAhAY/RImlJWUaHrPHaolhuXFXHN+8e58qNcbomq5P6t3xG973WePLzPgnnsUG0LiP7f1zJwZzk3LisyctfSOFxOJ4lfLzYToQubxu/KpmpWBFWzInguOokrP8ql7/zDRMxLpFfUabasHwlZNnITbmbgznI6b6+3Bu7/fa2lrW5fF9Ar6jQD1hYwLLaYx5fupdi+EiGok748koa4qa010xKkKWUV2UM7kd6vB7tH9yfpnUFkLzQiZOGWnmgHO9N4oie9ok5bA4YPbkqvqNNc8/5xIuYl8tSaLOLLRXambENXF+PxNJD0ziAanVHhYaEliH1lJD/1iqD0qSsIzu2M/N550TZ3QjvYmS3rR1qDtwdhgpgwnabGMj46zRjQsxJdXYw7P1X1pY0GuaRjkMKxPah5qxuV8y6nct7l1LzVDfdyo6miHexM+ou9mblwKfdv/Y77t37HNe8fbwMQDhIxL5FOU2PZklqLJjUYdU7wWxBuN+ricBAF0KQG6pcNovZpw0fCQao/MEBcu7tSOLYHjnu7EZzbmeDczqyfNokrP8ptMXi4XDnzAJ0n72TIgn1oUoMB4VlpgIjj24I0payi9KkrqHj+Ssth2wM5c38f8p68D2nbHKRtc3h86d42A/eZHsOVMw9Y0nXKJmxDvyS1NA70z8Gz0qh5hNvbzpr6ZYMofzyiBUwLkOVdjfR/eVcao0dSl/d1aHx0GhHzEi0TXDnzAJ2mxtJpaixdp2yypM/0GLrcs5D3Y94ztNDsK7qjuxmzDBBz2rYGqZoVQc1b3dr4yfppk+g8eWeLd91aAxGPrqPbyKV0G7mUiEfXMWdz+nmQ0Jsgn1AbT/SkMXrkeZC6vK9DpU9d0S5I5bzLqf6gq6UV7WBn5q9+zDJBuEQ8us4SE6LLPQvpcs9CjmSW4ndlo1XPNBxWLiE34WbSX+wNapEBEsrfT/njERSO7WGBmDA1b3Wj9KkrSO/Xg1WjBjJl/CT+8sQ8a0BT/eGDhwN0uWchXe94ia07YkE+oSLc3gxyQt2yfiSrRg0E+YRqgRSO7UHh2B4UT7ragqmcdznFk67mp14ROO7txpTxk7AN/bLFgN1GLsU29EvrejiACdG59xQjKgu3GzVP9UwIvcmCVwYb102NmBHVBDFNVDUrgjP39yF98E0E5xox5Dcj5lsDhwOYQObg4dK59xR2RV8D4njEo/0NIEd3dkVfgy9t9HkfMTWSO6pXG63kjupF8aSrqXj+SoJzO1M573KmjJ/Eb0bM5y9PzGPBK4Mp3GKUEFvWj+Q3I+a3AOjcewp/eWKesUQ0T1mz2att7oSU9+F5EE2SqXvpSbKHdrIGNmHCoapmRVgh33LezZ3QNncyloGDnVnwyuA2IFvWj0Q+dplREzu6Wy0r9/KubVvg9pWRpPfrwZn7+1haMSHCxdSM/J4RWWufjiC9Xw/m9PgtN9w0uo1JbrhpNI0njAXTrAIbT/TEvb4LjdEj2641vqQjpPfrQfrgm1qYKHxKlz51BbmjerFj4G2WtAYwtWDKglcGG2ZoXrldu43AWDUrAmnbnLaRVZMayHvyPn7qZThoa38pfeoKap+OIDi3M6tGDeSGm0a3GTT82g03jeaGm0bj3H4d8rHLrN0I93LDpDsG3kb68si2a425hfZTrwjSB9/UBiZcM+YM6ghoyvhJpL/Ym+yFhknc67tYQVF+z3gjc3r8Fuf32zpOFTMeHXpRGDNfMYF2j+7PqlEDWTVqIOkv9rZ8SNvcCff6LlTOu9yK1Okv9mZOj9+S8ehQNKmBDhs17vxU9adeES1gwoHKH49oFyhcwhfKynmXWzOu4vkryR7aieyhnQjl7+84QzNNJGzbxN7uV1gw7WmntYZaLw2mmNdrn44ge2gnztzfx9od7zBnDa9t0pdHtgsTDhRustaaCndwEyLj0aG481PVS9r3FSUJj6eBrConMZHvnodpntrh2gkHCgcLl/TBN7G3+xXGLMlIo0LXjU7ixeoaUZIQ3C7OlTtJya8kJvJddgy8DctvWgGFaylcHPd2Y2/3K5jT47esGjWQrTtiyapy4nI6jUrvUmpfUytFRfmkZ6SxdUcs66dNYsfA2ywNtQBrJeb/dgy8jZjId/kx4YgF4fP6Ln1L3uyhhWvnSGYpOw6lEBP5LuunTWLDAw+x4YGHrAi74YGHWD9tEuunTSIm8l227ohtAyBK0i8/pNDagTVJxuf1YXf7OVfuJKvKMF16RhrpGWkcySwlJb+SrCqn1awRgjqaJP9nO0b/Zxo1v+ahS0ZqKJ9QCX5rJMyhN42aRj6h/udB5BKjiAp+i64uNrJ2M0Vs3rUiy4aU92G42X49iCYZDZjUMoX4ctFIcILfGgVU6E0LwEyCxKP98aWNxpc2GvFof+RjlyHlfdjxWnOxh93tJya5kIWHnDx2qJbnopP4NCmaYvtKC0LL6WYkQps70RA3laaUVbjzU1V7RRn2ijK8BbkWUJsM7VIAog7k8MyuPKtD1AJA/9zQQpYN9/oubFk/kpkLl7J4a0KbtrdZa/vSRrfMWS8GcSSzlGd25TH5VIjptTpR9T5SS+OMsrHZD3RHd7SDnTm1YwSzY2KsTtL46DSei07iSGZpm/tKeR8a5gnf0+vI8zfE5zAstpjptTrvifBJeeZ5LTQDkGXDtbsr0fte59mjDmaWaUyv1ZlZpvH3XJlRcQ6Grj5OTHJhy/t7VhrpwMVAog7kMCrOwcs+nZWaccak2L7S0oLpC6d2jGDJiUyWN8E6FVZqsLwJ5ruwYO5O9jFoUSIb4nPOT+/gtxf3kZjkQobFFreAaHRGGZoQbm+hhWd25fHsUQevHilgbo7bAmoNM2S/i6Grj3Mks9Tolcgn1Hb39MzHuXInw9edZrJd4z3xPISuLrYgCrf0ZOuOWKLzVFLLFDIKmlfr5EJmHMxhfoWvDczkUyELxl5RduFUUZNkIvdm8+BpkZd9eocQPyYc6XDnocpRQ+TebObmuFmptdTK5FMhBqwt4K1vMi4cWTMKnIyKczDZrvFJeWaHEBdrbVc5aphxMIflTR1rJaPA2TFI1IEc7k72tZwdYRCLtyZc6h4MMcmF7WrlwRSRAWsLiNyb3T6Iz+vjmV15jIpztIHwxN/I7JgY4svFS47CHk9DG62Y5hm4s5zx0Wntb0CnlikMiy3m06ToFpFSO9iZnSnbeGZXHkcyS8kocF6SHMksZc7m9AuaJyW/si3IltRaZsfEGNM09KZVs2bEzWV5EyzLlXn1SEG7MuNgTruy5JS73dlzd7IvPMi1BIlJLmRnyjbLJFawar7ZHi5NdrSS9jRyd7KPXlGnzQDXyjSlcYY2mk1SuKUnS05kslI7f9M9/HKgdaoh74nn/cR02NV7M9t2A9A/t/qf2uZOvB/zHvNdxk3Mm0bV+36VzK8wxHTWVutPmEbkE6q1hjQ3/yefCvGeeB7k1SPGlLsUeeubDOtnezJnczpvfZPBuXJnGEjzAqSri9FyulG4pSf3b/3OCvErNQNmxsEczpU70ST5kuWXJc9yiZXemQ3du5N9TK/VedmnW1qZm+M+v3r+gpTS42nA42nA5XRa4vE0hFd8zSDBb63cInvtAAYtSuTuZB+T7ZoFYy7tz+zK6+igQZtHRoGTyL3ZLab4M7vyGB+dxpAF+1i8NaEliLmWyNndsa+MZPi60/T/vpaJhTKT7ZqllZWaoZW3vsnA42m4IMS5cifPRScxN8fNeyK87NOZXqszsdDITa55/3i4dgVb0OPUTG2IR/vjzk9Vt6Qau5R3J/uYWCi3MJEJM2dzOkcyS80Q3WKrPia50IIIX2cmnwrxYIpIr6jTPBed1Mo0apFgpv0NcVMR3C5ESWLO5nS6fV3Ag6fFdmHmV/iYcTCHyL3ZRB3IsSRybzbP7MpjfoWvXYj+39cyZME+c7aEgTQ36smy0RA31dostrv9DF193IIJ9xcTxgSam+O2xAQwg9fMMo2JhTIPnjYgBi1KbC+RPq8REyR8iT9X7rRgWptpvssYLBwqHGB6rc7fc2ULYsh+F4MWJbLjUErH09c8ytcaxNTMCxtyGLC2oIUDT6/VO5TJdkMLJsTAneUMWpTYNotvE0eaj3rKxy6zun2t69mdKdt4fOley4lN35ls11pIOIC51D8XnWQu9xcGUQCteibyscuM5n31TKNqD5fm1H9DfA7PRScxdPVxhsUWMyy22Dq4MGS/i2GxxQxfd9oC2HEopb1WVcdtCU2Sqcv7OmTWpGbRLOV9SCh/P0GPUwvPvDIKnMQkFxK5N5s5m9N5LjqJ56KTeOubDFbvzSQlv7LN1P5FxzZ8Xp918v8SWk5WsWStLbr0a5oLHRdY/+GjPP8vtq7+0yCiJOHz+hDcLlxOJ2bzxeV0Irhdlk/9x0B8Xh9VjhoEt6s5rZTaFU1qQHC7qHLU/PpZ05EGqhw1uJxO0CVESSIlv5KoAznM2ZxufTJgzuZ0og7kkJJfaR1mcjmdVDlqflkc6ahSs1eUWdMzJrmQQYsSrYMJNy4raiHmYQWzD2IC2SvKLpa/dAzi8/qsc6cZBU6GLNjHlTMPcEtUJVMSdd45qRGdp7KxDOvDPu+c1JhxNMgtUZVcOfMAQxbss0K7vaLsQqbq+GCtCbEhPodOU2O58qNcZhwNsrMK4t0Xlp1VMONokCs/yqXT1FgrE7sATPvbJK0hblxWxDsnNWugvc7zcqFry3JlbomqbANzSdskpk9kFDjpOmWTpQnzne6sMgbbWWWYY8kpN0tOuYnOU1v8z9TcOyc1blxWRNcpmwwz6dLFjxr7vD5rY+eO13YSMS+Rh/co1iAby4wBluXKLDnl5rsCD1lVxk7FdwUelpxysyxXbvHcjWUwYb9CxLxE7nhtp7X10spELUHMMiHqQA6dJ+9k8KYaJh1u6ZRLTrnZklrb+hS3lURtSa1lySm39fyNZTAlUWfwpho6T95p1rqtS5LzICapJsmWNkbEBpiSqLMs1/gY3DsntfAuT4tDlkrYtci92bxzUmNjmaG9KYk6I2IDbbTStsBqjhma1EBKfiVdp2xiwNoCHt6jMOmwxjsnNev46KWUkaIksfCQk2W5Mu+c1Jh0WGPCfoUBawvoOmWT1d4Miy3nQczIuXpvJp2mxjJ4Uw0T9hsg09KM6fhcdBIxyYWXJM9FJzHjaJBpaTDpsAEzeFMNnabGGhVec+RtA1LlqAFd4vGley0Q8wZTEnWmpWGdWX3sUC3PHnW0K+b/n0qoZ1oaTEszfCQc5PGle0GXwv0k7PxI87S9EMjMMo35rvMdILPDbErrzlA4iOmw4SBh0/iXgUxLg8mnQvw9V2Zmmdau/D1XtpoxpiYe3qPw8B6FW6IqreOCvwpkWhqMinMwaFEi46PTfrFMXG38HLr6OHe8ttPykXZNYzrr4q0JdJoay4C1BS2cdfCmGuZsTrd6Hv/T5ozZJ7no9L1xWZE1fU0bD193unXx3GESFZNcyIb4nDazaUN8Dh6PkTy1O307CmgT9itM2K9YWnkuOumi26wTV6dZR43NXOXKj3LpPHknEY+us0DaDWiWnwCr92bSdcomBm+q4eE9ShsThTXh2jRn5mxOZ/CmmjYzZkRsgE5TY40Q33bhu/iiF66VcJjh604TuTfbUnnk3myGrzttQZgzZtJhzQrvfabHWGNccNELnz2tfSUcJjxADVhbwIC1BdYsMyOp+fyH9yhWGnAks/TS0gDTV4qK8q2NxU5TY7klqrIFTDhQ6+gZ/hwzdoSbpKgo/9LPj5hnR8yUwEwVw810MRkRG7BSRXPpLyrKv/RUsT2YI5mlLZLnEbEBK1q2lhGxASt5vuO1nZY5ioryL5TJX7icENwuioryjV1rr4+oAzkMWbDvouXEkAX7iDqQg8/rQ5MaLgZxaQWWJslWSWkWWBkFzl9UYP2PvgjFPNrj8/osM/2YcIQfE46QnpFmfL7K7SLocWpBj1Mz6+D0jLQWzzPb3b/6aI8SVnCbvXTTVOZxno6kqCjfKlPNUH4pIP9XPGz/N319UFnrf2iKLGi6LmggqCBoIOi6JuiqIqCrgqIrgqyrgoYu6JpiiK4LKgigCpquCCEdQdVVAU0VdP2iMGW29tplmtbcQNQ1QEXXNDQdQGsWHZBbvdQsKkTQfaiaBJrc/PyLPpQ2zqqbL9U10GV0TUbTZUCyQAoaJPaVinx5RmbVKZnVWRpf56r8WKlQFww2Q4bf8VdMXwsEtfkdGb97xSAb8yRG7df4zYYQ3deEsK2WsK1UsK1U6LIqxJWfKQzcEODVw0GS7KbG1F8Pout6C7WuL5Dpv1PBtlLEFgWXfyHTY61Ery91rvkiwLWfB7h6jcxV/5LoskLF9gl0+tjLI7FesuuxzKnrHeqneQdL143Bjacj6wqg4ZFUph8JYvusCdsXIldvhGvXi/T+SuS6dQrXrZO4fp3Ib76UuH5NiD6fi1z/mcgNnwa5epWMbbHG1StEvsoSjbeoq2i60h6MYNN1XTAhNF1vdlBoVFSG7/Nh+1Ti2o1Brl8v03uDyDVfN3DDVz5u+FKh15cKvdbp9FoHvT5X6PW5wjVr4LrPda6NkugTJdL1EwXbIpkVx5sdGaXZ8S9gGgNIJ6ipPHgghO3TED23h+ixTafXZpmb1ofos0ml+9dw1VcaV3wapMvKIF1WSVz+qULPzxV6faZw9Wc613yq0Xt1iN9Ehei+WMG2QObz03JHDtxsGk07P2XRmZ/hx7ZG5rqtMjdubqTHFonrNov8doPMZRvA9pmPqz8X+MNWhb/tkrg/VuGWaJXLPmmk85Imen6m0+sz6BMlcsNqP9etVujysU63jwIcrwy1N6UFm6Zrgma4KKBxrE7lyq999PnaT58dcMNWjV5bFa7d6sP2lcj/+szP6/FNHK2SqQtpSKqIKItUN2psyJH52yYXtkV+uq9UuP5fMj1XqVy9WuWGFSE6LQgxbHMQv6kVXW92B12wKZouSEjGNNMVJvwgYdugcGOsym+2q/TZqnD9dh3bVz5u3h4guVJtnpJa808zkJlBMMS7SQG6vB/gimUKvVdK9Fmu0nu5zLXLZGzvaWzLDhggmoysqwYIKoKqG+rKqVO5douP62JUfvutxg2xCn1iZTpv0rgpRuF0XQAIgRJElSUURUWWZWRZRpFlgrIKeIEg7yaC7X2FXkslei+XDVkmY1sQ4pFNDaA3hwcdNF0XbGjNZwNQWXZaxrZV5XexMjftFLnpW4ne34rYNvjZUywBQUJqEEkMoEk6oqIgySqipCCKEt6Qis8fRNEaAB+TtijYInV6Lwtx7VKRPstkIj5S6PGBRGFtwFCgApquCDYFTQANXZeZkiARsVPnlu9kfhcr0/cbiYivA4w94DM0oet4VQVJUQiJGiFRIiTKBEMSAX+QhoBIvU/C1SQCfpIKGrl8kZerFitcu0Tkuk9ErlsiYXtDYuMpYyobE0gVbIouC6DiDsgMiwtx406Z/rs0+u6WGPCNSI8tIZbnSoCCEvITkBRkWSMUkAgEJbz+EE2+IA3eAPUNjTR6fNTWSni9PuoFN/d8KtBpkcg1n3jp82GQ3h/6sc33seAHb/P6pYOmCTY0VQCNEkHhrgMhfrdL5k/fafT/XqT/boU+sRI/2r0AhESFYFDCF1TwBSWa/CE8TQHcjQFcDX6cdQGq63w43PWU1AoEmup4emMjtvl+enzop/d7Aa57N4Btvo/Z37jCHBzBpuqaAHDOHWDo/iD99in8+XuZO/er/H6fxsB/h0irDgGqoYGAhOAL0eALUd/oo87TRK2nCUddI3anQKXTTUl1DUVVNXga6nh2mwvb6066L3Bz3btOekU2YXtd5MVNDmuVVtEFm6brAmiUu4OMPODnjv0idx+UGHpQ4q6DEnf928+h0iCg0egN0OgXqW8MUCd4cXm81LgbqHIJlDs9lFd5KK90U1hWQ3GlgLOqlrs/rsQ2q45rFjq57q0yukc6sL3iYc62akBDR0fRNcGmq5oAQYSAyuQEibsPhnjgkMYD8T4ePOTnv/ZrfJrtBTWE4A3ibvRTJ3hx1jdRXddApbOeMoebEruL3Ao3p8vqOVVSR1JuDZkFtbywvgDb0zl0eqmanm+Wct2bFdhmlvP2Po/hH6qIrmiCTdNUAVVElTVeyfTz10My435UGHNE5JGfJIYf1ZiV4kFo8uILBKirD+LwBHC43Dhq6ymurqfAUU9ORS05RSU0NHmQVRW/JCMqOho6354U6DEri04z8+nxWim2fxSx8ZgLEAlJCqoiCzZZUwVZVECDjUVNDD8s8sRRlSmJOs8mwbPHZJ466iO2yI8aDNJU56a8tpGqaicOZx2FVfWcLa8lq7CMBn8IHfAGZQKSik/SQAoBOjEZtdiezqTTS/l0fzmPrFIBNB9CUCcoSYJN0TTBKymgS5TXBXn8pwCTj8lMT1WZmarx+nGR2Rk680+GOFleh9/bgMtZR3V1HYWVLvJKajiTV0pVjRsV8IVEgrLaLApeERSCAAx5/xS2+48zZvlZAmKIQFMTHq+PppAi2DRdFQIyyKIfRImoMz6ePO7lpUyJl08r/PN0iMjTEh9kS6zNEUgp92GvaaDAXstZh4DLG0JoChAMyviDMn5Jxi/K+EISIVnFr0h4JWPZ33a8mNteSCI6vhpZbMDhaqChyYfHHxRsmhYURBECoRDoMvkukVfTFN7IlHk7W+aDXIlVOSHW5ob4qhi2F4v8WNLIiSov5wLgkVVERSUYMqa2LyTjF1UCkkpQ1vGLImJAxCsai2SdKFJQ6aG0ooqK+gBuVxOCTxBsuq4IkqQSFCVCkgyqzg8lXt5J9/H+WViVJ7G+KMSOEoVdJSp77DJxdRrH3Rq5goLDJyMERRqCIt6QbPiHqBAQFSRJJSCrhGSZJklDUs/nIefsNRRXe3DWefE0NjUf21BURFEiGDRWVH9I5Nu8Rt7Pk/lXocbWIpFvKzT2VSr8YJdIcEqk1Svke2TsPhV3SMYTEmkISngDCr6QTFBSCUkqQUnFL2kEJUNLflFF1aGuyUepow6HuxG34DdyVkVRkCQFUVLxBWR0ScEfFPmuuIG1hTIxpSr/rpA46FBIqJHJdGmcqVPJa1Co9MrUBiTcQQlPQKYhoNAUUvCJCn5JJSApBCTZEr8oEVJU/IpKiaOOmnov9Q1+QyOqqiErGqKiIYk6/mAATQ4QalRItPvZU+EnvkrmxxqJRJdIVp1KTr1GQaNChVei2idTE9BwBRTqAzKeoEyjKNMkKvglhaCkNAMZogAeX4DS6npcDQE8jYHmM0aajqLqyLJOSNbwSTJev0woEKCxyU9OdZCEkgAJ1UGSBYWsBo3cRihq0qj0KVT5ZBwBjdqQRn1IRhBVGiWVRlklqOiIikZQ1hAV4ytjJE2n0ummqt6LU/AjNAYEm64jaBqoqo6iaEiKhiirBESVhkAQr9eH0ChSUu3nVGkdGY4mUmt8ZLoC5DWoFDUplHpVKnw6VT6ZWn+IuqCEJ6TQEFINzUgSflXFJ8nUe304XALVdQ3UNwaob/TT5A0ZILoO4TCyrBKSZHxBGcEfxNPgpdETwO32U+ZoIKesnrPlHrLtbn6urCfPXk+B3U2R3cO5qgbOVTVQUilwrkKgtEqguLKe4sp6yhwNlNg9VLkEhKYgjd4QTX6RYFA+X2Dpuo6maaiqiqqqKIqGKKn4QwrekERjIIC70YenMUBjk0S9EKK23our3ovb48Xj8SI0BfD4ROq9IdyNQeoa/Lg8AZxuPzV1PuobRASfguAN0egP4Q1KBEMykqwKNkAxMnpDNM1oSxhQGrKiI6oqTapIkyTiDYUIiDLBkEwoICOGjHghKxqKqqCoEooqEVJFgkqIkBIiKIsEpBB+MYA/FMAXkgiICiHRmK2KoilWo6bZRIKu61bjRdd1QdEQVBVBkzRBlVRBFhVBVTRBUXRBknVB1hAUECQQNF0XUHVB13RB0XRBVDRBUjRBUTVBUlRBlBRBlGQhJGuCJOuCouiCpuqCqqpl/7Eemqor5HnS2Ja/hPezpvCP1PuYlfo3vvo5EnfA0baH9qs+CKZpBIIh7DUuyuw1lNprqHDU4mnwoqoamq5xyn2YVTkv8cKJO3n+TH+eTB7Ao/H9eSr+TnbmrfyfgdiddZzKKaK0yklhuYN6oWVfvabay+6Tu3gzaSJPpPZm9E9XMmnvH1n60wKSanZypuEg35WuZlrCMLb9vPSXgzicdWTkFLX7vya5Dq/spk62s8v1AW+cu53ns29kSd6z/Fi9mZ/L8tpqVFfZeHYxBe7MSwdJy85v8Xd1oJwDFRtZlTeTD88+wcKsMSzMGsv8rL8wNbMnc7LuJN6xg6AcsF6TW1xBkzfQct9P8pDrSkfT1QuDKKrKz8UV1t+V3kKi89/m1YyhvHlyMPOz/ouFZ4fwYe59fJAzjLfO3s66wuep8p7jbF0iUTkzOe76/rzZ6jxUVteGtch06gL2C4PIikJFtcv6e3/ZeuamDOHNU//NivwxfFY8jnXlE/iyYiKflz/Eh4WD2Gv/CL/YQIJjI2+dvJvXTt7FtJS+LPt5OvVBY383KEoUlFaGzSz5wqb5ubC0WSsyG3PfZUbKnXzw8wOsKX6EdWUT+NI+nq8cY1nrGMnikjuJd0Xhld1sr3iTt37+IyuLHmZN0WMszxnPzLSBvJnxMMWNPxv7vUITLrdw8VlzMswnNud+xD+O3cGy3LF8ce5R1pZN4IuKsXzlGM0X1SP4uPJ2jgpraJAcfFb+CJHnbuOz8pF8UT6OL0om8nnRJFblPcrLaXfxxolROHzGd2idq7xIHBEavTQFQwAcLNvMP5Lu5JOcsawpmsRnJROIKnuYtVWjWVP9Vz6q7McRz0pUTSa2Zh6LSgeytOJPfGa/j3UVY1lTMoFPz01kdcEjLM95hNmp/8UHmU+j6MYnlrJyz3UMknHW0IbDW8rLyfexIGs4nxU8zqqi8Xx07gGiKkfyheN+ltnvJEFYGdYOFWlUqjniWcGK8iFElQ1jTek4Pi2awOqCR1iZ9wgfnx3Hs4l9+aHc+BqH2voGRFFqC+JpaEKSjOR2Y84iZqX8majcx1ieN57Xc+/hvXPD+aziAZaX30VGY0yH0/1s00E+KR7KquL7+ezceFbnT2BFzkSW5Uzg7VP38UbKQ3hCdc1aKWoLktHsG06/nbnJ9/H+6VGsyJnIC9l38kreMNaUPsKSkkHsdy26aABMcK3lw4L/5l9FY1mdP56lOeP55Ox4Psh+mOeT7+BAyUZj17O8qiWIKMkUlNoBOFQaw4zkQSw+M5bZp+7in7mPsKnkFVade4DPSsfTJNVeFCSk+lhbPIVl+Q+wMnccS8+OY/GZsXxwZjTTj9/OkqwXACi3O/H5A+dBKhy1lFQac33t2bf5R/KdvJnxFxadnkSyYzuf5j3BssIR/Kt4DBvLp/NF2dOsqXiSNRVPsKbyCeNnxZN8XjaFz4ufJrr4Bf5V8Agr8h5iWc5YPs4ey4enR/P+6YeYnfZn3kh9CAUfqgz2Gtd5kLOFpZTYjUMHH516jmlJA3jjxHCO2XexteBtFpwZyqqC0awo+huLCv7Eu4W38V7x73mvtD/vl/Xl/bJ+vFfye94tuo2F+X/g3dw/szT/b6zIHcMnZ0fz0ZmHWXT6ISKzRvJq5mBeSh5MSeNZyzyyrBggWTlFlNsNssiMKYz9oQe7i/9FmmM/r6bezZKfx7Is5yGW5f+NFYUjWHXuflaXDmN12V+JKhtGVNkwVpX9lZXFw1lRNILl+Q/ySc6DfHRmFIuyRhF5ciRvZ/6NNzPvZ3baIJ5N+AM/1xsfXcg9V47XH2wLMidpFE/9eAcVQg7Lsp7j9fShfHTmIT4+M4rIrKG8ljGAeSf78eaZfszP7sc/z/bln9n9mH+mH29m9eO1jP7MPfF7ZibfxvSE3zP1UD+eiruVxw/cxIT9fRj+764Mje3M6bqjAOQVl+MPhgyQvHPllFQapnkhfgRf5y7haNV3PJvwe945+QDvnnyAf2bcQ0zR22S7fySzbj+Z7n2cdO/jZP1eTtbvI9O9j8y6fWS49pHm3Edq9T6OV+0luXIPRyt2k1C+i/jybzhYupUfSrfjV40wX1zhQNN0A8RR66bEbjjr5p+Xc9IRz9snJvJ88h94O/N+3s64j1dS7mJLXuT/v0e/vT6qa93nnVXXdXLOlRtJi6qSWLmL8Yd682rGvcxLG8qbJ4byRuoQXj56L+UNuRcdoDHk5kDJNvaXbuZA2Rb2l21hX9nX7C3byNaCKJKr4pqnbw3+QLBlQDttxn4dPsh4hseP3sjcjP/m5dRBvJYymNdTBjMtvh8rT865KMja0wsZvqsr4/f3ZNyBnjx88CpGxV3BiAM2bt5iY8PPKwz/KKlsG1lDooTgCRJAYPKR/jyb2pcZaQOZdfyPzDn+J145/l/MSfojU364lW05yzuE2F30FU/80JcZSQN5+fifmH38Tmam3MGM1Dt4LOE6pv90DyHFCGLZ+SXtL3pn88rJCR5hbPy1TEq6jqnJv2XGsduZdfwPzD52By8n/5FZSX9g8sGbeDflGU7VHMUTqKMhVM/Z2hMsSZ/JY3G38I/E25l77I/MOv4HZhy/nRkptzE1+Rbu+beNhMrvjLEKSi+cj0T+8AaPZfTi2eQ/8Gj89fz96C3MSB7AjOTfMzPpNmYn3c7MowN4/IdrmXKoPy8l3MtLP/2Fpw7fxiMHr+HFxH7MTrqNmUm/56XkAbyY3I/pyb/jr/tsRJ542hqnOGydaRdkxv6J/DXBxvflX/Fd0Rru2W3jmYTrmZnUnxlJ/ZhxtB+zjg5g1tH+vJBwM1Pjr+fZ+Ot5PuFmZiX2Y9ZR43kvJfXlpeR+PJ90M3/da2Nm4gME5MZ2c5F2QV5OeYA/7rZxrOYgANE/f8S933ViTFxXZiX1ZfbRvsxK7MusxFuZnXgrs8JkZuKtzEi8lZlHf8espL48Gd+Lu3fbeDVpLA1BY+kvc7T7ZTktQUQlyLQjg/nzv20cyo+zrsdX7OKR/bcybLeNp368hpd+uok5ib9lbuKtzfI75ib+jtmJv2PGT7fwfMJveOj7zty/O4JPs+YjKsYUdTc04Wloav/YRusLz/04lAeTIsgsPENewfnc0is1EH32Qx47MICH913F+O//F+O/t/H4wW7877gIHtnfhXHfd2Hs91cyZl9v3k19lgLPaev15TV1NDR6Oz4/0vrC26ceYVhcL45X/GB4d2Eljf7Q+cJI9pHqiGPVqVeZd+wRZicOZ0bCvbyS9DAfpD3PnnNfUuO3ny9NVI2T+eVI8oVPGrUB2ZsfzX1HehJTtMK6FgyJZOYW0+gXf1EIz8wro9LhvKTn2lrugkMoFOS5n/7C0APXYK8tb3GepMrh5HB8Cmknz5JbXEpBSQVlFbVU2N0UlVWRW1RK1s95/JCQzMkzPyPLMpqm4ff7CQQChEIhJElCURQ0TcPsVOm6fn6tCT+oUOkq4bGE27n/qzv4KeMIwVCQQCBAbV0ttXW1VFRWkJ19lrS0DJKSj5F4NInk5OOcPHmK/Px8amtrcbvd1NTU4HQ6cbvdNDU1WTCyLKOqaguYDmvfgNzE4bIYdpWv4UT5EezuMkQl9B877PT/DQC7cLwx8LR3hQAAAABJRU5ErkJggg==) no-repeat;padding-left:40px}
+        .browser .browser-firefox{background-position:0 -34px}
+        .browser .browser-ie{background-position:0 -68px;margin-left:0px}
+        .browser .browser-360{background-position:0 -170px;margin-left: -27px}
+    </style>
+</head>
+<body style="margin-top:50px">
+<h1>请升级您的浏览器，以便我们更好的为您提供服务！</h1>
+<p>您正在使用 Internet Explorer 的早期版本（IE11以下版本或使用该内核的浏览器）。这意味着在升级浏览器前，您将无法访问此网站。</p>
+<hr>
+<h2>请注意：微软公司对Windows XP 及 Internet Explorer 早期版本的支持已经结束</h2>
+<p>自 2016 年 1 月 12 日起，Microsoft 不再为 IE 11 以下版本提供相应支持和更新。没有关键的浏览器安全更新，您的电脑可能易受有害病毒、间谍软件和其他恶意软件的攻击，它们可以窃取或损害您的业务数据和信息。请参阅 <a href="https://www.microsoft.com/zh-cn/WindowsForBusiness/End-of-IE-support">微软对 Internet Explorer 早期版本的支持将于 2016 年 1 月 12 日结束的说明</a> 。</p>
+<hr>
+<h2>您可以选择更先进的浏览器</h2>
+<p>推荐使用以下浏览器的最新版本。如果您的电脑已有以下浏览器的最新版本则直接使用该浏览器访问即可。</p>
+<ul class="browser">
+    <li class="browser-chrome"><a href="https://www.google.cn/chrome/browser/desktop/index.html?hl=zh-CN&standalone=1"> 谷歌浏览器<span>Google Chrome</span></a></li>
+    <li class="browser-firefox"><a href="https://www.mozilla.org/zh-CN/firefox/new/"> 火狐浏览器<span>Mozilla Firefox</span></a></li>
+    <li class="browser-ie"><a href="https://windows.microsoft.com/zh-cn/internet-explorer/download-ie"> IE 11 浏览器<span>Internet Explorer</span></a></li>
+    <li class="browser-360"><a href="http://se.360.cn/"> 360安全浏览器<span>360 Chrome</span></a></li>
+    <div class="clean"></div>
+</ul>
+<hr>
+</body>
+</html>
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..e739c1e
--- /dev/null
+++ b/index.html
@@ -0,0 +1,216 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+  <meta name="renderer" content="webkit">
+  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+  <link rel="icon" href="/favicon.ico">
+  <link rel="stylesheet" type="text/css" media="print" href="/print-lock.css">
+  <title>枝点品牌方管理系统</title>
+  <!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
+  <style>
+    html,
+    body,
+    #app {
+      height: 100%;
+      margin: 0px;
+      padding: 0px;
+    }
+
+    .chromeframe {
+      margin: 0.2em 0;
+      background: #ccc;
+      color: #000;
+      padding: 0.2em 0;
+    }
+
+    #loader-wrapper {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      z-index: 999999;
+    }
+
+    #loader {
+      display: block;
+      position: relative;
+      left: 50%;
+      top: 50%;
+      width: 150px;
+      height: 150px;
+      margin: -75px 0 0 -75px;
+      border-radius: 50%;
+      border: 3px solid transparent;
+      border-top-color: #FFF;
+      -webkit-animation: spin 2s linear infinite;
+      -ms-animation: spin 2s linear infinite;
+      -moz-animation: spin 2s linear infinite;
+      -o-animation: spin 2s linear infinite;
+      animation: spin 2s linear infinite;
+      z-index: 1001;
+    }
+
+    #loader:before {
+      content: "";
+      position: absolute;
+      top: 5px;
+      left: 5px;
+      right: 5px;
+      bottom: 5px;
+      border-radius: 50%;
+      border: 3px solid transparent;
+      border-top-color: #FFF;
+      -webkit-animation: spin 3s linear infinite;
+      -moz-animation: spin 3s linear infinite;
+      -o-animation: spin 3s linear infinite;
+      -ms-animation: spin 3s linear infinite;
+      animation: spin 3s linear infinite;
+    }
+
+    #loader:after {
+      content: "";
+      position: absolute;
+      top: 15px;
+      left: 15px;
+      right: 15px;
+      bottom: 15px;
+      border-radius: 50%;
+      border: 3px solid transparent;
+      border-top-color: #FFF;
+      -moz-animation: spin 1.5s linear infinite;
+      -o-animation: spin 1.5s linear infinite;
+      -ms-animation: spin 1.5s linear infinite;
+      -webkit-animation: spin 1.5s linear infinite;
+      animation: spin 1.5s linear infinite;
+    }
+
+
+    @-webkit-keyframes spin {
+      0% {
+        -webkit-transform: rotate(0deg);
+        -ms-transform: rotate(0deg);
+        transform: rotate(0deg);
+      }
+
+      100% {
+        -webkit-transform: rotate(360deg);
+        -ms-transform: rotate(360deg);
+        transform: rotate(360deg);
+      }
+    }
+
+    @keyframes spin {
+      0% {
+        -webkit-transform: rotate(0deg);
+        -ms-transform: rotate(0deg);
+        transform: rotate(0deg);
+      }
+
+      100% {
+        -webkit-transform: rotate(360deg);
+        -ms-transform: rotate(360deg);
+        transform: rotate(360deg);
+      }
+    }
+
+
+    #loader-wrapper .loader-section {
+      position: fixed;
+      top: 0;
+      width: 51%;
+      height: 100%;
+      background: #7171C6;
+      z-index: 1000;
+      -webkit-transform: translateX(0);
+      -ms-transform: translateX(0);
+      transform: translateX(0);
+    }
+
+    #loader-wrapper .loader-section.section-left {
+      left: 0;
+    }
+
+    #loader-wrapper .loader-section.section-right {
+      right: 0;
+    }
+
+
+    .loaded #loader-wrapper .loader-section.section-left {
+      -webkit-transform: translateX(-100%);
+      -ms-transform: translateX(-100%);
+      transform: translateX(-100%);
+      -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
+      transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
+    }
+
+    .loaded #loader-wrapper .loader-section.section-right {
+      -webkit-transform: translateX(100%);
+      -ms-transform: translateX(100%);
+      transform: translateX(100%);
+      -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
+      transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
+    }
+
+    .loaded #loader {
+      opacity: 0;
+      -webkit-transition: all 0.3s ease-out;
+      transition: all 0.3s ease-out;
+    }
+
+    .loaded #loader-wrapper {
+      visibility: hidden;
+      -webkit-transform: translateY(-100%);
+      -ms-transform: translateY(-100%);
+      transform: translateY(-100%);
+      -webkit-transition: all 0.3s 1s ease-out;
+      transition: all 0.3s 1s ease-out;
+    }
+
+    .no-js #loader-wrapper {
+      display: none;
+    }
+
+    .no-js h1 {
+      color: #222222;
+    }
+
+    #loader-wrapper .load_title {
+      font-family: 'Open Sans';
+      color: #FFF;
+      font-size: 19px;
+      width: 100%;
+      text-align: center;
+      z-index: 9999999999999;
+      position: absolute;
+      top: 60%;
+      opacity: 1;
+      line-height: 30px;
+    }
+
+    #loader-wrapper .load_title span {
+      font-weight: normal;
+      font-style: italic;
+      font-size: 13px;
+      color: #FFF;
+      opacity: 0.5;
+    }
+  </style>
+</head>
+
+<body>
+  <div id="app">
+    <div id="loader-wrapper">
+      <div id="loader"></div>
+      <div class="loader-section section-left"></div>
+      <div class="loader-section section-right"></div>
+      <div class="load_title">正在加载系统资源，请耐心等待</div>
+    </div>
+  </div>
+  <script type="module" src="/src/main.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..dcf93e4
--- /dev/null
+++ b/package.json
@@ -0,0 +1,49 @@
+{
+  "name": "ruoyi",
+  "version": "3.8.8",
+  "description": "枝点品牌方管理系统",
+  "author": "枝点品牌方",
+  "license": "MIT",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build:prod": "vite build",
+    "build:dev": "vite build --mode development",
+    "build:stage": "vite build --mode staging",
+    "preview": "vite preview"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://gitee.com/y_project/RuoYi-Vue.git"
+  },
+  "dependencies": {
+    "@element-plus/icons-vue": "2.3.1",
+    "@vueup/vue-quill": "1.2.0",
+    "@vueuse/core": "10.11.0",
+    "axios": "0.28.1",
+    "echarts": "5.5.1",
+    "element-china-area-data": "^6.1.0",
+    "element-plus": "^2.9.5",
+    "file-saver": "2.0.5",
+    "fuse.js": "6.6.2",
+    "js-cookie": "3.0.5",
+    "jsencrypt": "3.3.2",
+    "nprogress": "0.2.0",
+    "pinia": "2.1.7",
+    "pnpm": "^10.7.0",
+    "splitpanes": "3.1.5",
+    "vue": "3.4.31",
+    "vue-cropper": "1.1.1",
+    "vue-plugin-hiprint": "^0.0.60",
+    "vue-router": "4.4.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "5.0.5",
+    "sass": "1.77.5",
+    "unplugin-auto-import": "0.17.6",
+    "unplugin-vue-setup-extend-plus": "1.0.1",
+    "vite": "^5.3.2",
+    "vite-plugin-compression": "0.5.1",
+    "vite-plugin-svg-icons": "2.0.1"
+  }
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
new file mode 100644
index 0000000..be99a31
--- /dev/null
+++ b/pnpm-lock.yaml
@@ -0,0 +1,4252 @@
+lockfileVersion: '9.0'
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
+
+importers:
+
+  .:
+    dependencies:
+      '@element-plus/icons-vue':
+        specifier: 2.3.1
+        version: 2.3.1(vue@3.4.31)
+      '@vueup/vue-quill':
+        specifier: 1.2.0
+        version: 1.2.0(vue@3.4.31)
+      '@vueuse/core':
+        specifier: 10.11.0
+        version: 10.11.0(vue@3.4.31)
+      axios:
+        specifier: 0.28.1
+        version: 0.28.1
+      echarts:
+        specifier: 5.5.1
+        version: 5.5.1
+      element-china-area-data:
+        specifier: ^6.1.0
+        version: 6.1.0
+      element-plus:
+        specifier: ^2.9.5
+        version: 2.9.5(vue@3.4.31)
+      file-saver:
+        specifier: 2.0.5
+        version: 2.0.5
+      fuse.js:
+        specifier: 6.6.2
+        version: 6.6.2
+      js-cookie:
+        specifier: 3.0.5
+        version: 3.0.5
+      jsencrypt:
+        specifier: 3.3.2
+        version: 3.3.2
+      nprogress:
+        specifier: 0.2.0
+        version: 0.2.0
+      pinia:
+        specifier: 2.1.7
+        version: 2.1.7(vue@3.4.31)
+      splitpanes:
+        specifier: 3.1.5
+        version: 3.1.5
+      vue:
+        specifier: 3.4.31
+        version: 3.4.31
+      vue-cropper:
+        specifier: 1.1.1
+        version: 1.1.1
+      vue-plugin-hiprint:
+        specifier: ^0.0.58-fix
+        version: 0.0.58-fix
+      vue-router:
+        specifier: 4.4.0
+        version: 4.4.0(vue@3.4.31)
+    devDependencies:
+      '@vitejs/plugin-vue':
+        specifier: 5.0.5
+        version: 5.0.5(vite@5.3.2(@types/node@22.13.9)(sass@1.77.5))(vue@3.4.31)
+      sass:
+        specifier: 1.77.5
+        version: 1.77.5
+      unplugin-auto-import:
+        specifier: 0.17.6
+        version: 0.17.6(@vueuse/core@10.11.0(vue@3.4.31))(rollup@4.34.9)
+      unplugin-vue-setup-extend-plus:
+        specifier: 1.0.1
+        version: 1.0.1
+      vite:
+        specifier: 5.3.2
+        version: 5.3.2(@types/node@22.13.9)(sass@1.77.5)
+      vite-plugin-compression:
+        specifier: 0.5.1
+        version: 0.5.1(vite@5.3.2(@types/node@22.13.9)(sass@1.77.5))
+      vite-plugin-svg-icons:
+        specifier: 2.0.1
+        version: 2.0.1(vite@5.3.2(@types/node@22.13.9)(sass@1.77.5))
+
+packages:
+
+  '@antfu/utils@0.7.10':
+    resolution: {integrity: sha512-+562v9k4aI80m1+VuMHehNJWLOFjBnXn3tdOitzD0il5b7smkSBal4+a3oKiQTbrwMmN/TBUMDvbdoWDehgOww==}
+
+  '@babel/helper-string-parser@7.25.9':
+    resolution: {integrity: sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-validator-identifier@7.25.9':
+    resolution: {integrity: sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/parser@7.26.9':
+    resolution: {integrity: sha512-81NWa1njQblgZbQHxWHpxxCzNsa3ZwvFqpUg7P+NNUU6f3UU2jBEg4OlF/J6rl8+PQGh1q6/zWScd001YwcA5A==}
+    engines: {node: '>=6.0.0'}
+    hasBin: true
+
+  '@babel/runtime@7.26.9':
+    resolution: {integrity: sha512-aA63XwOkcl4xxQa3HjPMqOP6LiK0ZDv3mUPYEFXkpHbaFjtGggE1A61FjFzJnB+p7/oy2gA8E+rcBNl/zC1tMg==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/types@7.26.9':
+    resolution: {integrity: sha512-Y3IR1cRnOxOCDvMmNiym7XpXQ93iGDDPHx+Zj+NM+rg0fBaShfQLkg+hKPaZCEvg5N/LeCo4+Rj/i3FuJsIQaw==}
+    engines: {node: '>=6.9.0'}
+
+  '@claviska/jquery-minicolors@2.3.6':
+    resolution: {integrity: sha512-8Ro6D4GCrmOl41+6w4NFhEOpx8vjxwVRI69bulXsFDt49uVRKhLU5TnzEV7AmOJrylkVq+ugnYNMiGHBieeKUQ==}
+    peerDependencies:
+      jquery: '>= 1.7.x'
+
+  '@ctrl/tinycolor@3.6.1':
+    resolution: {integrity: sha512-SITSV6aIXsuVNV3f3O0f2n/cgyEDWoSqtZMYiAmcsYHydcKrOz3gUxB/iXd/Qf08+IZX4KpgNbvUdMBmWz+kcA==}
+    engines: {node: '>=10'}
+
+  '@element-plus/icons-vue@2.3.1':
+    resolution: {integrity: sha512-XxVUZv48RZAd87ucGS48jPf6pKu0yV5UCg9f4FFwtrYxXOwWuVJo6wOvSLKEoMQKjv8GsX/mhP6UsC1lRwbUWg==}
+    peerDependencies:
+      vue: ^3.2.0
+
+  '@esbuild/aix-ppc64@0.21.5':
+    resolution: {integrity: sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [aix]
+
+  '@esbuild/android-arm64@0.21.5':
+    resolution: {integrity: sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm@0.21.5':
+    resolution: {integrity: sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-x64@0.21.5':
+    resolution: {integrity: sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/darwin-arm64@0.21.5':
+    resolution: {integrity: sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.21.5':
+    resolution: {integrity: sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/freebsd-arm64@0.21.5':
+    resolution: {integrity: sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.21.5':
+    resolution: {integrity: sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/linux-arm64@0.21.5':
+    resolution: {integrity: sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.21.5':
+    resolution: {integrity: sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.21.5':
+    resolution: {integrity: sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.21.5':
+    resolution: {integrity: sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==}
+    engines: {node: '>=12'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.21.5':
+    resolution: {integrity: sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==}
+    engines: {node: '>=12'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.21.5':
+    resolution: {integrity: sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.21.5':
+    resolution: {integrity: sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==}
+    engines: {node: '>=12'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.21.5':
+    resolution: {integrity: sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==}
+    engines: {node: '>=12'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.21.5':
+    resolution: {integrity: sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/netbsd-x64@0.21.5':
+    resolution: {integrity: sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/openbsd-x64@0.21.5':
+    resolution: {integrity: sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@esbuild/sunos-x64@0.21.5':
+    resolution: {integrity: sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/win32-arm64@0.21.5':
+    resolution: {integrity: sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.21.5':
+    resolution: {integrity: sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-x64@0.21.5':
+    resolution: {integrity: sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [win32]
+
+  '@floating-ui/core@1.6.9':
+    resolution: {integrity: sha512-uMXCuQ3BItDUbAMhIXw7UPXRfAlOAvZzdK9BWpE60MCn+Svt3aLn9jsPTi/WNGlRUu2uI0v5S7JiIUsbsvh3fw==}
+
+  '@floating-ui/dom@1.6.13':
+    resolution: {integrity: sha512-umqzocjDgNRGTuO7Q8CU32dkHkECqI8ZdMZ5Swb6QAM0t5rnlrN3lGo1hdpscRd3WS8T6DKYK4ephgIH9iRh3w==}
+
+  '@floating-ui/utils@0.2.9':
+    resolution: {integrity: sha512-MDWhGtE+eHw5JW7lq4qhc5yRLS11ERl1c7Z6Xd0a58DozHES6EnNNwUWbMiG4J9Cgj053Bhk8zvlhFYKVhULwg==}
+
+  '@jridgewell/sourcemap-codec@1.5.0':
+    resolution: {integrity: sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==}
+
+  '@nodelib/fs.scandir@2.1.5':
+    resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
+    engines: {node: '>= 8'}
+
+  '@nodelib/fs.stat@2.0.5':
+    resolution: {integrity: sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==}
+    engines: {node: '>= 8'}
+
+  '@nodelib/fs.walk@1.2.8':
+    resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
+    engines: {node: '>= 8'}
+
+  '@rollup/pluginutils@5.1.4':
+    resolution: {integrity: sha512-USm05zrsFxYLPdWWq+K3STlWiT/3ELn3RcV5hJMghpeAIhxfsUIg6mt12CBJBInWMV4VneoV7SfGv8xIwo2qNQ==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0
+    peerDependenciesMeta:
+      rollup:
+        optional: true
+
+  '@rollup/rollup-android-arm-eabi@4.34.9':
+    resolution: {integrity: sha512-qZdlImWXur0CFakn2BJ2znJOdqYZKiedEPEVNTBrpfPjc/YuTGcaYZcdmNFTkUj3DU0ZM/AElcM8Ybww3xVLzA==}
+    cpu: [arm]
+    os: [android]
+
+  '@rollup/rollup-android-arm64@4.34.9':
+    resolution: {integrity: sha512-4KW7P53h6HtJf5Y608T1ISKvNIYLWRKMvfnG0c44M6In4DQVU58HZFEVhWINDZKp7FZps98G3gxwC1sb0wXUUg==}
+    cpu: [arm64]
+    os: [android]
+
+  '@rollup/rollup-darwin-arm64@4.34.9':
+    resolution: {integrity: sha512-0CY3/K54slrzLDjOA7TOjN1NuLKERBgk9nY5V34mhmuu673YNb+7ghaDUs6N0ujXR7fz5XaS5Aa6d2TNxZd0OQ==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@rollup/rollup-darwin-x64@4.34.9':
+    resolution: {integrity: sha512-eOojSEAi/acnsJVYRxnMkPFqcxSMFfrw7r2iD9Q32SGkb/Q9FpUY1UlAu1DH9T7j++gZ0lHjnm4OyH2vCI7l7Q==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@rollup/rollup-freebsd-arm64@4.34.9':
+    resolution: {integrity: sha512-2lzjQPJbN5UnHm7bHIUKFMulGTQwdvOkouJDpPysJS+QFBGDJqcfh+CxxtG23Ik/9tEvnebQiylYoazFMAgrYw==}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@rollup/rollup-freebsd-x64@4.34.9':
+    resolution: {integrity: sha512-SLl0hi2Ah2H7xQYd6Qaiu01kFPzQ+hqvdYSoOtHYg/zCIFs6t8sV95kaoqjzjFwuYQLtOI0RZre/Ke0nPaQV+g==}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.34.9':
+    resolution: {integrity: sha512-88I+D3TeKItrw+Y/2ud4Tw0+3CxQ2kLgu3QvrogZ0OfkmX/DEppehus7L3TS2Q4lpB+hYyxhkQiYPJ6Mf5/dPg==}
+    cpu: [arm]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-arm-musleabihf@4.34.9':
+    resolution: {integrity: sha512-3qyfWljSFHi9zH0KgtEPG4cBXHDFhwD8kwg6xLfHQ0IWuH9crp005GfoUUh/6w9/FWGBwEHg3lxK1iHRN1MFlA==}
+    cpu: [arm]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-arm64-gnu@4.34.9':
+    resolution: {integrity: sha512-6TZjPHjKZUQKmVKMUowF3ewHxctrRR09eYyvT5eFv8w/fXarEra83A2mHTVJLA5xU91aCNOUnM+DWFMSbQ0Nxw==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-arm64-musl@4.34.9':
+    resolution: {integrity: sha512-LD2fytxZJZ6xzOKnMbIpgzFOuIKlxVOpiMAXawsAZ2mHBPEYOnLRK5TTEsID6z4eM23DuO88X0Tq1mErHMVq0A==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-loongarch64-gnu@4.34.9':
+    resolution: {integrity: sha512-dRAgTfDsn0TE0HI6cmo13hemKpVHOEyeciGtvlBTkpx/F65kTvShtY/EVyZEIfxFkV5JJTuQ9tP5HGBS0hfxIg==}
+    cpu: [loong64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-powerpc64le-gnu@4.34.9':
+    resolution: {integrity: sha512-PHcNOAEhkoMSQtMf+rJofwisZqaU8iQ8EaSps58f5HYll9EAY5BSErCZ8qBDMVbq88h4UxaNPlbrKqfWP8RfJA==}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-riscv64-gnu@4.34.9':
+    resolution: {integrity: sha512-Z2i0Uy5G96KBYKjeQFKbbsB54xFOL5/y1P5wNBsbXB8yE+At3oh0DVMjQVzCJRJSfReiB2tX8T6HUFZ2k8iaKg==}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-s390x-gnu@4.34.9':
+    resolution: {integrity: sha512-U+5SwTMoeYXoDzJX5dhDTxRltSrIax8KWwfaaYcynuJw8mT33W7oOgz0a+AaXtGuvhzTr2tVKh5UO8GVANTxyQ==}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-x64-gnu@4.34.9':
+    resolution: {integrity: sha512-FwBHNSOjUTQLP4MG7y6rR6qbGw4MFeQnIBrMe161QGaQoBQLqSUEKlHIiVgF3g/mb3lxlxzJOpIBhaP+C+KP2A==}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-x64-musl@4.34.9':
+    resolution: {integrity: sha512-cYRpV4650z2I3/s6+5/LONkjIz8MBeqrk+vPXV10ORBnshpn8S32bPqQ2Utv39jCiDcO2eJTuSlPXpnvmaIgRA==}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-win32-arm64-msvc@4.34.9':
+    resolution: {integrity: sha512-z4mQK9dAN6byRA/vsSgQiPeuO63wdiDxZ9yg9iyX2QTzKuQM7T4xlBoeUP/J8uiFkqxkcWndWi+W7bXdPbt27Q==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@rollup/rollup-win32-ia32-msvc@4.34.9':
+    resolution: {integrity: sha512-KB48mPtaoHy1AwDNkAJfHXvHp24H0ryZog28spEs0V48l3H1fr4i37tiyHsgKZJnCmvxsbATdZGBpbmxTE3a9w==}
+    cpu: [ia32]
+    os: [win32]
+
+  '@rollup/rollup-win32-x64-msvc@4.34.9':
+    resolution: {integrity: sha512-AyleYRPU7+rgkMWbEh71fQlrzRfeP6SyMnRf9XX4fCdDPAJumdSBqYEcWPMzVQ4ScAl7E4oFfK0GUVn77xSwbw==}
+    cpu: [x64]
+    os: [win32]
+
+  '@socket.io/component-emitter@3.1.2':
+    resolution: {integrity: sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==}
+
+  '@sxzz/popperjs-es@2.11.7':
+    resolution: {integrity: sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ==}
+
+  '@trysound/sax@0.2.0':
+    resolution: {integrity: sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==}
+    engines: {node: '>=10.13.0'}
+
+  '@types/estree@1.0.6':
+    resolution: {integrity: sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==}
+
+  '@types/lodash-es@4.17.12':
+    resolution: {integrity: sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==}
+
+  '@types/lodash@4.17.16':
+    resolution: {integrity: sha512-HX7Em5NYQAXKW+1T+FiuG27NGwzJfCX3s1GjOa7ujxZa52kjJLOr4FUxT+giF6Tgxv1e+/czV/iTtBw27WTU9g==}
+
+  '@types/node@22.13.9':
+    resolution: {integrity: sha512-acBjXdRJ3A6Pb3tqnw9HZmyR3Fiol3aGxRCK1x3d+6CDAMjl7I649wpSd+yNURCjbOUGu9tqtLKnTGxmK6CyGw==}
+
+  '@types/raf@3.4.3':
+    resolution: {integrity: sha512-c4YAvMedbPZ5tEyxzQdMoOhhJ4RD3rngZIdwC2/qDN3d7JpEhB6fiBRKVY1lg5B7Wk+uPBjn5f39j1/2MY1oOw==}
+
+  '@types/svgo@2.6.4':
+    resolution: {integrity: sha512-l4cmyPEckf8moNYHdJ+4wkHvFxjyW6ulm9l4YGaOxeyBWPhBOT0gvni1InpFPdzx1dKf/2s62qGITwxNWnPQng==}
+
+  '@types/web-bluetooth@0.0.16':
+    resolution: {integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==}
+
+  '@types/web-bluetooth@0.0.20':
+    resolution: {integrity: sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==}
+
+  '@vitejs/plugin-vue@5.0.5':
+    resolution: {integrity: sha512-LOjm7XeIimLBZyzinBQ6OSm3UBCNVCpLkxGC0oWmm2YPzVZoxMsdvNVimLTBzpAnR9hl/yn1SHGuRfe6/Td9rQ==}
+    engines: {node: ^18.0.0 || >=20.0.0}
+    peerDependencies:
+      vite: ^5.0.0
+      vue: ^3.2.25
+
+  '@vue/compiler-core@3.4.31':
+    resolution: {integrity: sha512-skOiodXWTV3DxfDhB4rOf3OGalpITLlgCeOwb+Y9GJpfQ8ErigdBUHomBzvG78JoVE8MJoQsb+qhZiHfKeNeEg==}
+
+  '@vue/compiler-core@3.5.13':
+    resolution: {integrity: sha512-oOdAkwqUfW1WqpwSYJce06wvt6HljgY3fGeM9NcVA1HaYOij3mZG9Rkysn0OHuyUAGMbEbARIpsG+LPVlBJ5/Q==}
+
+  '@vue/compiler-dom@3.4.31':
+    resolution: {integrity: sha512-wK424WMXsG1IGMyDGyLqB+TbmEBFM78hIsOJ9QwUVLGrcSk0ak6zYty7Pj8ftm7nEtdU/DGQxAXp0/lM/2cEpQ==}
+
+  '@vue/compiler-dom@3.5.13':
+    resolution: {integrity: sha512-ZOJ46sMOKUjO3e94wPdCzQ6P1Lx/vhp2RSvfaab88Ajexs0AHeV0uasYhi99WPaogmBlRHNRuly8xV75cNTMDA==}
+
+  '@vue/compiler-sfc@3.4.31':
+    resolution: {integrity: sha512-einJxqEw8IIJxzmnxmJBuK2usI+lJonl53foq+9etB2HAzlPjAS/wa7r0uUpXw5ByX3/0uswVSrjNb17vJm1kQ==}
+
+  '@vue/compiler-sfc@3.5.13':
+    resolution: {integrity: sha512-6VdaljMpD82w6c2749Zhf5T9u5uLBWKnVue6XWxprDobftnletJ8+oel7sexFfM3qIxNmVE7LSFGTpv6obNyaQ==}
+
+  '@vue/compiler-ssr@3.4.31':
+    resolution: {integrity: sha512-RtefmITAje3fJ8FSg1gwgDhdKhZVntIVbwupdyZDSifZTRMiWxWehAOTCc8/KZDnBOcYQ4/9VWxsTbd3wT0hAA==}
+
+  '@vue/compiler-ssr@3.5.13':
+    resolution: {integrity: sha512-wMH6vrYHxQl/IybKJagqbquvxpWCuVYpoUJfCqFZwa/JY1GdATAQ+TgVtgrwwMZ0D07QhA99rs/EAAWfvG6KpA==}
+
+  '@vue/devtools-api@6.6.4':
+    resolution: {integrity: sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==}
+
+  '@vue/reactivity@3.4.31':
+    resolution: {integrity: sha512-VGkTani8SOoVkZNds1PfJ/T1SlAIOf8E58PGAhIOUDYPC4GAmFA2u/E14TDAFcf3vVDKunc4QqCe/SHr8xC65Q==}
+
+  '@vue/runtime-core@3.4.31':
+    resolution: {integrity: sha512-LDkztxeUPazxG/p8c5JDDKPfkCDBkkiNLVNf7XZIUnJ+66GVGkP+TIh34+8LtPisZ+HMWl2zqhIw0xN5MwU1cw==}
+
+  '@vue/runtime-dom@3.4.31':
+    resolution: {integrity: sha512-2Auws3mB7+lHhTFCg8E9ZWopA6Q6L455EcU7bzcQ4x6Dn4cCPuqj6S2oBZgN2a8vJRS/LSYYxwFFq2Hlx3Fsaw==}
+
+  '@vue/server-renderer@3.4.31':
+    resolution: {integrity: sha512-D5BLbdvrlR9PE3by9GaUp1gQXlCNadIZytMIb8H2h3FMWJd4oUfkUTEH2wAr3qxoRz25uxbTcbqd3WKlm9EHQA==}
+    peerDependencies:
+      vue: 3.4.31
+
+  '@vue/shared@3.4.31':
+    resolution: {integrity: sha512-Yp3wtJk//8cO4NItOPpi3QkLExAr/aLBGZMmTtW9WpdwBCJpRM6zj9WgWktXAl8IDIozwNMByT45JP3tO3ACWA==}
+
+  '@vue/shared@3.5.13':
+    resolution: {integrity: sha512-/hnE/qP5ZoGpol0a5mDi45bOd7t3tjYJBjsgCsivow7D48cJeV5l05RD82lPqi7gRiphZM37rnhW1l6ZoCNNnQ==}
+
+  '@vueup/vue-quill@1.2.0':
+    resolution: {integrity: sha512-kd5QPSHMDpycklojPXno2Kw2JSiKMYduKYQckTm1RJoVDA557MnyUXgcuuDpry4HY/Rny9nGNcK+m3AHk94wag==}
+    peerDependencies:
+      vue: ^3.2.41
+
+  '@vueuse/core@10.11.0':
+    resolution: {integrity: sha512-x3sD4Mkm7PJ+pcq3HX8PLPBadXCAlSDR/waK87dz0gQE+qJnaaFhc/dZVfJz+IUYzTMVGum2QlR7ImiJQN4s6g==}
+
+  '@vueuse/core@9.13.0':
+    resolution: {integrity: sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==}
+
+  '@vueuse/metadata@10.11.0':
+    resolution: {integrity: sha512-kQX7l6l8dVWNqlqyN3ePW3KmjCQO3ZMgXuBMddIu83CmucrsBfXlH+JoviYyRBws/yLTQO8g3Pbw+bdIoVm4oQ==}
+
+  '@vueuse/metadata@9.13.0':
+    resolution: {integrity: sha512-gdU7TKNAUVlXXLbaF+ZCfte8BjRJQWPCa2J55+7/h+yDtzw3vOoGQDRXzI6pyKyo6bXFT5/QoPE4hAknExjRLQ==}
+
+  '@vueuse/shared@10.11.0':
+    resolution: {integrity: sha512-fyNoIXEq3PfX1L3NkNhtVQUSRtqYwJtJg+Bp9rIzculIZWHTkKSysujrOk2J+NrRulLTQH9+3gGSfYLWSEWU1A==}
+
+  '@vueuse/shared@9.13.0':
+    resolution: {integrity: sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==}
+
+  '@wtto00/html2canvas@1.4.3':
+    resolution: {integrity: sha512-jwsb+xL8N+gjrSNABSaFdxmWtE4c7RNFjP20lo1G7gs63Qqo1phhxVBTzxc/apDVh6LgXsU2l5bwKtXd9uz65w==}
+    engines: {node: '>=8.0.0'}
+
+  acorn@8.14.1:
+    resolution: {integrity: sha512-OvQ/2pUDKmgfCg++xsTX1wGxfTaszcHVcTctW4UJB4hibJx2HXxxO5UmVgyjMa+ZDsiaf5wWLXYpRWMmBI0QHg==}
+    engines: {node: '>=0.4.0'}
+    hasBin: true
+
+  ansi-regex@2.1.1:
+    resolution: {integrity: sha512-TIGnTpdo+E3+pCyAluZvtED5p5wCqLdezCyhPZzKPcxvFplEt4i+W7OONCKgeZFT3+y5NZZfOOS/Bdcanm1MYA==}
+    engines: {node: '>=0.10.0'}
+
+  ansi-styles@2.2.1:
+    resolution: {integrity: sha512-kmCevFghRiWM7HB5zTPULl4r9bVFSWjz62MhqizDGUrq2NWuNMQyuv4tHHoKJHs69M/MF64lEcHdYIocrdWQYA==}
+    engines: {node: '>=0.10.0'}
+
+  ansi-styles@4.3.0:
+    resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
+    engines: {node: '>=8'}
+
+  anymatch@3.1.3:
+    resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
+    engines: {node: '>= 8'}
+
+  arr-diff@4.0.0:
+    resolution: {integrity: sha512-YVIQ82gZPGBebQV/a8dar4AitzCQs0jjXwMPZllpXMaGjXPYVUawSxQrRsjhjupyVxEvbHgUmIhKVlND+j02kA==}
+    engines: {node: '>=0.10.0'}
+
+  arr-flatten@1.1.0:
+    resolution: {integrity: sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg==}
+    engines: {node: '>=0.10.0'}
+
+  arr-union@3.1.0:
+    resolution: {integrity: sha512-sKpyeERZ02v1FeCZT8lrfJq5u6goHCtpTAzPwJYe7c8SPFOboNjNg1vz2L4VTn9T4PQxEx13TbXLmYUcS6Ug7Q==}
+    engines: {node: '>=0.10.0'}
+
+  array-buffer-byte-length@1.0.2:
+    resolution: {integrity: sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==}
+    engines: {node: '>= 0.4'}
+
+  array-unique@0.3.2:
+    resolution: {integrity: sha512-SleRWjh9JUud2wH1hPs9rZBZ33H6T9HOiL0uwGnGx9FpE6wKGyfWugmbkEOIs6qWrZhg0LWeLziLrEwQJhs5mQ==}
+    engines: {node: '>=0.10.0'}
+
+  arraybuffer.prototype.slice@1.0.4:
+    resolution: {integrity: sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==}
+    engines: {node: '>= 0.4'}
+
+  assign-symbols@1.0.0:
+    resolution: {integrity: sha512-Q+JC7Whu8HhmTdBph/Tq59IoRtoy6KAm5zzPv00WdujX82lbAL8K7WVjne7vdCsAmbF4AYaDOPyO3k0kl8qIrw==}
+    engines: {node: '>=0.10.0'}
+
+  async-function@1.0.0:
+    resolution: {integrity: sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==}
+    engines: {node: '>= 0.4'}
+
+  async-validator@4.2.5:
+    resolution: {integrity: sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==}
+
+  asynckit@0.4.0:
+    resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==}
+
+  atob@2.1.2:
+    resolution: {integrity: sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==}
+    engines: {node: '>= 4.5.0'}
+    hasBin: true
+
+  available-typed-arrays@1.0.7:
+    resolution: {integrity: sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==}
+    engines: {node: '>= 0.4'}
+
+  axios@0.28.1:
+    resolution: {integrity: sha512-iUcGA5a7p0mVb4Gm/sy+FSECNkPFT4y7wt6OM/CDpO/OnNCvSs3PoMG8ibrC9jRoGYU0gUK5pXVC4NPXq6lHRQ==}
+
+  balanced-match@1.0.2:
+    resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
+
+  base64-arraybuffer@1.0.2:
+    resolution: {integrity: sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ==}
+    engines: {node: '>= 0.6.0'}
+
+  base@0.11.2:
+    resolution: {integrity: sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg==}
+    engines: {node: '>=0.10.0'}
+
+  big.js@5.2.2:
+    resolution: {integrity: sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==}
+
+  binary-extensions@2.3.0:
+    resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==}
+    engines: {node: '>=8'}
+
+  bluebird@3.7.2:
+    resolution: {integrity: sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==}
+
+  boolbase@1.0.0:
+    resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==}
+
+  brace-expansion@2.0.1:
+    resolution: {integrity: sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==}
+
+  braces@2.3.2:
+    resolution: {integrity: sha512-aNdbnj9P8PjdXU4ybaWLK2IF3jc/EoDYbC7AazW6to3TRsfXxscC9UXOB5iDiEQrkyIbWp2SLQda4+QAa7nc3w==}
+    engines: {node: '>=0.10.0'}
+
+  braces@3.0.3:
+    resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==}
+    engines: {node: '>=8'}
+
+  btoa@1.2.1:
+    resolution: {integrity: sha512-SB4/MIGlsiVkMcHmT+pSmIPoNDoHg+7cMzmt3Uxt628MTz2487DKSqK/fuhFBrkuqrYv5UCEnACpF4dTFNKc/g==}
+    engines: {node: '>= 0.4.0'}
+    hasBin: true
+
+  bwip-js@4.5.1:
+    resolution: {integrity: sha512-83yQCKiIftz5YonnsTh6wIkFoHHWl+B/XaGWD1UdRw7aB6XP9JtyYP9n8sRy3m5rzL+Ch/RUPnu28UW0RrPZUA==}
+    hasBin: true
+
+  cache-base@1.0.1:
+    resolution: {integrity: sha512-AKcdTnFSWATd5/GCPRxr2ChwIJ85CeyrEyjRHlKxQ56d4XJMGym0uAiKn0xbLOGOl3+yRpOTi484dVCEc5AUzQ==}
+    engines: {node: '>=0.10.0'}
+
+  call-bind-apply-helpers@1.0.2:
+    resolution: {integrity: sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==}
+    engines: {node: '>= 0.4'}
+
+  call-bind@1.0.8:
+    resolution: {integrity: sha512-oKlSFMcMwpUg2ednkhQ454wfWiU/ul3CkJe/PEHcTKuiX6RpbehUiFMXu13HalGZxfUwCQzZG747YXBn1im9ww==}
+    engines: {node: '>= 0.4'}
+
+  call-bound@1.0.4:
+    resolution: {integrity: sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==}
+    engines: {node: '>= 0.4'}
+
+  canvg@3.0.10:
+    resolution: {integrity: sha512-qwR2FRNO9NlzTeKIPIKpnTY6fqwuYSequ8Ru8c0YkYU7U0oW+hLUvWadLvAu1Rl72OMNiFhoLu4f8eUjQ7l/+Q==}
+    engines: {node: '>=10.0.0'}
+
+  chalk@1.1.3:
+    resolution: {integrity: sha512-U3lRVLMSlsCfjqYPbLyVv11M9CPW4I728d6TCKMAOJueEeB9/8o+eSsMnxPJD+Q+K909sdESg7C+tIkoH6on1A==}
+    engines: {node: '>=0.10.0'}
+
+  chalk@4.1.2:
+    resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==}
+    engines: {node: '>=10'}
+
+  china-division@2.7.0:
+    resolution: {integrity: sha512-4uUPAT+1WfqDh5jytq7omdCmHNk3j+k76zEG/2IqaGcYB90c2SwcixttcypdsZ3T/9tN1TTpBDoeZn+Yw/qBEA==}
+
+  chokidar@3.6.0:
+    resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
+    engines: {node: '>= 8.10.0'}
+
+  class-utils@0.3.6:
+    resolution: {integrity: sha512-qOhPa/Fj7s6TY8H8esGu5QNpMMQxz79h+urzrNYN6mn+9BnxlDGf5QZ+XeCDsxSjPqsSR56XOZOJmpeurnLMeg==}
+    engines: {node: '>=0.10.0'}
+
+  clone@2.1.2:
+    resolution: {integrity: sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==}
+    engines: {node: '>=0.8'}
+
+  collection-visit@1.0.0:
+    resolution: {integrity: sha512-lNkKvzEeMBBjUGHZ+q6z9pSJla0KWAQPvtzhEV9+iGyQYG+pBpl7xKDhxoNSOZH2hhv0v5k0y2yAM4o4SjoSkw==}
+    engines: {node: '>=0.10.0'}
+
+  color-convert@2.0.1:
+    resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
+    engines: {node: '>=7.0.0'}
+
+  color-name@1.1.4:
+    resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
+
+  combined-stream@1.0.8:
+    resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==}
+    engines: {node: '>= 0.8'}
+
+  commander@7.2.0:
+    resolution: {integrity: sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==}
+    engines: {node: '>= 10'}
+
+  component-emitter@1.3.1:
+    resolution: {integrity: sha512-T0+barUSQRTUQASh8bx02dl+DhF54GtIDY13Y3m9oWTklKbb3Wv974meRpeZ3lp1JpLVECWWNHC4vaG2XHXouQ==}
+
+  confbox@0.1.8:
+    resolution: {integrity: sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==}
+
+  confbox@0.2.1:
+    resolution: {integrity: sha512-hkT3yDPFbs95mNCy1+7qNKC6Pro+/ibzYxtM2iqEigpf0sVw+bg4Zh9/snjsBcf990vfIsg5+1U7VyiyBb3etg==}
+
+  copy-descriptor@0.1.1:
+    resolution: {integrity: sha512-XgZ0pFcakEUlbwQEVNg3+QAis1FyTL3Qel9FYy8pSkQqoG3PNoT0bOCQtOXcOkur21r2Eq2kI+IE+gsmAEVlYw==}
+    engines: {node: '>=0.10.0'}
+
+  core-js@3.41.0:
+    resolution: {integrity: sha512-SJ4/EHwS36QMJd6h/Rg+GyR4A5xE0FSI3eZ+iBVpfqf1x0eTSg1smWLHrA+2jQThZSh97fmSgFSU8B61nxosxA==}
+
+  cors@2.8.5:
+    resolution: {integrity: sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==}
+    engines: {node: '>= 0.10'}
+
+  css-line-break@2.1.0:
+    resolution: {integrity: sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w==}
+
+  css-select@4.3.0:
+    resolution: {integrity: sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==}
+
+  css-tree@1.1.3:
+    resolution: {integrity: sha512-tRpdppF7TRazZrjJ6v3stzv93qxRcSsFmW6cX0Zm2NVKpxE1WV1HblnghVv9TreireHkqI/VDEsfolRF1p6y7Q==}
+    engines: {node: '>=8.0.0'}
+
+  css-what@6.1.0:
+    resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==}
+    engines: {node: '>= 6'}
+
+  csso@4.2.0:
+    resolution: {integrity: sha512-wvlcdIbf6pwKEk7vHj8/Bkc0B4ylXZruLvOgs9doS5eOsOpuodOV2zJChSpkp+pRpYQLQMeF04nr3Z68Sta9jA==}
+    engines: {node: '>=8.0.0'}
+
+  csstype@3.1.3:
+    resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}
+
+  data-view-buffer@1.0.2:
+    resolution: {integrity: sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==}
+    engines: {node: '>= 0.4'}
+
+  data-view-byte-length@1.0.2:
+    resolution: {integrity: sha512-tuhGbE6CfTM9+5ANGf+oQb72Ky/0+s3xKUpHvShfiz2RxMFgFPjsXuRLBVMtvMs15awe45SRb83D6wH4ew6wlQ==}
+    engines: {node: '>= 0.4'}
+
+  data-view-byte-offset@1.0.1:
+    resolution: {integrity: sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==}
+    engines: {node: '>= 0.4'}
+
+  dayjs@1.11.13:
+    resolution: {integrity: sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg==}
+
+  debug@2.6.9:
+    resolution: {integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+
+  debug@4.3.7:
+    resolution: {integrity: sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==}
+    engines: {node: '>=6.0'}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+
+  debug@4.4.0:
+    resolution: {integrity: sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==}
+    engines: {node: '>=6.0'}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+
+  decode-uri-component@0.2.2:
+    resolution: {integrity: sha512-FqUYQ+8o158GyGTrMFJms9qh3CqTKvAqgqsTnkLI8sKu0028orqBhxNMFkFen0zGyg6epACD32pjVk58ngIErQ==}
+    engines: {node: '>=0.10'}
+
+  deep-equal@1.1.2:
+    resolution: {integrity: sha512-5tdhKF6DbU7iIzrIOa1AOUt39ZRm13cmL1cGEh//aqR8x9+tNfbywRf0n5FD/18OKMdo7DNEtrX2t22ZAkI+eg==}
+    engines: {node: '>= 0.4'}
+
+  define-data-property@1.1.4:
+    resolution: {integrity: sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==}
+    engines: {node: '>= 0.4'}
+
+  define-properties@1.2.1:
+    resolution: {integrity: sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==}
+    engines: {node: '>= 0.4'}
+
+  define-property@0.2.5:
+    resolution: {integrity: sha512-Rr7ADjQZenceVOAKop6ALkkRAmH1A4Gx9hV/7ZujPUN2rkATqFO0JZLZInbAjpZYoJ1gUx8MRMQVkYemcbMSTA==}
+    engines: {node: '>=0.10.0'}
+
+  define-property@1.0.0:
+    resolution: {integrity: sha512-cZTYKFWspt9jZsMscWo8sc/5lbPC9Q0N5nBLgb+Yd915iL3udB1uFgS3B8YCx66UVHq018DAVFoee7x+gxggeA==}
+    engines: {node: '>=0.10.0'}
+
+  define-property@2.0.2:
+    resolution: {integrity: sha512-jwK2UV4cnPpbcG7+VRARKTZPUWowwXA8bzH5NP6ud0oeAxyYPuGZUAC7hMugpCdz4BeSZl2Dl9k66CHJ/46ZYQ==}
+    engines: {node: '>=0.10.0'}
+
+  delayed-stream@1.0.0:
+    resolution: {integrity: sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==}
+    engines: {node: '>=0.4.0'}
+
+  dom-serializer@0.2.2:
+    resolution: {integrity: sha512-2/xPb3ORsQ42nHYiSunXkDjPLBaEj/xTwUO4B7XCZQTRk7EBtTOPaygh10YAAh2OI1Qrp6NWfpAhzswj0ydt9g==}
+
+  dom-serializer@1.4.1:
+    resolution: {integrity: sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==}
+
+  domelementtype@1.3.1:
+    resolution: {integrity: sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==}
+
+  domelementtype@2.3.0:
+    resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==}
+
+  domhandler@2.4.2:
+    resolution: {integrity: sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==}
+
+  domhandler@4.3.1:
+    resolution: {integrity: sha512-GrwoxYN+uWlzO8uhUXRl0P+kHE4GtVPfYzVLcUxPL7KNdHKj66vvlhiweIHqYYXWlw+T8iLMp42Lm67ghw4WMQ==}
+    engines: {node: '>= 4'}
+
+  dompurify@2.5.8:
+    resolution: {integrity: sha512-o1vSNgrmYMQObbSSvF/1brBYEQPHhV1+gsmrusO7/GXtp1T9rCS8cXFqVxK/9crT1jA6Ccv+5MTSjBNqr7Sovw==}
+
+  domutils@1.7.0:
+    resolution: {integrity: sha512-Lgd2XcJ/NjEw+7tFvfKxOzCYKZsdct5lczQ2ZaQY8Djz7pfAD3Gbp8ySJWtreII/vDlMVmxwa6pHmdxIYgttDg==}
+
+  domutils@2.8.0:
+    resolution: {integrity: sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==}
+
+  dunder-proto@1.0.1:
+    resolution: {integrity: sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==}
+    engines: {node: '>= 0.4'}
+
+  echarts@5.5.1:
+    resolution: {integrity: sha512-Fce8upazaAXUVUVsjgV6mBnGuqgO+JNDlcgF79Dksy4+wgGpQB2lmYoO4TSweFg/mZITdpGHomw/cNBJZj1icA==}
+
+  element-china-area-data@6.1.0:
+    resolution: {integrity: sha512-IkpcjwQv2A/2AxFiSoaISZ+oMw1rZCPUSOg5sOCwT5jKc96TaawmKZeY81xfxXsO0QbKxU5LLc6AirhG52hUmg==}
+
+  element-plus@2.9.5:
+    resolution: {integrity: sha512-r+X79oogLbYq8p9L5f9fHSHhUFNM0AL72aikqiZVxSc2/08mK6m/PotiB9e/D90QmWTIHIaFnFmW65AcXmneig==}
+    peerDependencies:
+      vue: ^3.2.0
+
+  emojis-list@3.0.0:
+    resolution: {integrity: sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==}
+    engines: {node: '>= 4'}
+
+  engine.io-client@6.6.3:
+    resolution: {integrity: sha512-T0iLjnyNWahNyv/lcjS2y4oE358tVS/SYQNxYXGAJ9/GLgH4VCvOQ/mhTjqU88mLZCQgiG8RIegFHYCdVC+j5w==}
+
+  engine.io-parser@5.2.3:
+    resolution: {integrity: sha512-HqD3yTBfnBxIrbnM1DoD6Pcq8NECnh8d4As1Qgh0z5Gg3jRRIqijury0CL3ghu/edArpUYiYqQiDUQBIs4np3Q==}
+    engines: {node: '>=10.0.0'}
+
+  entities@1.1.2:
+    resolution: {integrity: sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w==}
+
+  entities@2.2.0:
+    resolution: {integrity: sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==}
+
+  entities@4.5.0:
+    resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
+    engines: {node: '>=0.12'}
+
+  es-abstract@1.23.9:
+    resolution: {integrity: sha512-py07lI0wjxAC/DcfK1S6G7iANonniZwTISvdPzk9hzeH0IZIshbuuFxLIU96OyF89Yb9hiqWn8M/bY83KY5vzA==}
+    engines: {node: '>= 0.4'}
+
+  es-define-property@1.0.1:
+    resolution: {integrity: sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==}
+    engines: {node: '>= 0.4'}
+
+  es-errors@1.3.0:
+    resolution: {integrity: sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==}
+    engines: {node: '>= 0.4'}
+
+  es-object-atoms@1.1.1:
+    resolution: {integrity: sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==}
+    engines: {node: '>= 0.4'}
+
+  es-set-tostringtag@2.1.0:
+    resolution: {integrity: sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==}
+    engines: {node: '>= 0.4'}
+
+  es-to-primitive@1.3.0:
+    resolution: {integrity: sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==}
+    engines: {node: '>= 0.4'}
+
+  esbuild@0.21.5:
+    resolution: {integrity: sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==}
+    engines: {node: '>=12'}
+    hasBin: true
+
+  escape-html@1.0.3:
+    resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==}
+
+  escape-string-regexp@1.0.5:
+    resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==}
+    engines: {node: '>=0.8.0'}
+
+  escape-string-regexp@5.0.0:
+    resolution: {integrity: sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==}
+    engines: {node: '>=12'}
+
+  estree-walker@2.0.2:
+    resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
+
+  estree-walker@3.0.3:
+    resolution: {integrity: sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==}
+
+  etag@1.8.1:
+    resolution: {integrity: sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==}
+    engines: {node: '>= 0.6'}
+
+  eventemitter3@2.0.3:
+    resolution: {integrity: sha512-jLN68Dx5kyFHaePoXWPsCGW5qdyZQtLYHkxkg02/Mz6g0kYpDx4FyP6XfArhQdlOC4b8Mv+EMxPo/8La7Tzghg==}
+
+  expand-brackets@2.1.4:
+    resolution: {integrity: sha512-w/ozOKR9Obk3qoWeY/WDi6MFta9AoMR+zud60mdnbniMcBxRuFJyDt2LdX/14A1UABeqk+Uk+LDfUpvoGKppZA==}
+    engines: {node: '>=0.10.0'}
+
+  exsolve@1.0.2:
+    resolution: {integrity: sha512-ZEcIMbthn2zeX4/wD/DLxDUjuCltHXT8Htvm/JFlTkdYgWh2+HGppgwwNUnIVxzxP7yJOPtuBAec0dLx6lVY8w==}
+
+  extend-shallow@2.0.1:
+    resolution: {integrity: sha512-zCnTtlxNoAiDc3gqY2aYAWFx7XWWiasuF2K8Me5WbN8otHKTUKBwjPtNpRs/rbUZm7KxWAaNj7P1a/p52GbVug==}
+    engines: {node: '>=0.10.0'}
+
+  extend-shallow@3.0.2:
+    resolution: {integrity: sha512-BwY5b5Ql4+qZoefgMj2NUmx+tehVTH/Kf4k1ZEtOHNFcm2wSxMRo992l6X3TIgni2eZVTZ85xMOjF31fwZAj6Q==}
+    engines: {node: '>=0.10.0'}
+
+  extend@3.0.2:
+    resolution: {integrity: sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==}
+
+  extglob@2.0.4:
+    resolution: {integrity: sha512-Nmb6QXkELsuBr24CJSkilo6UHHgbekK5UiZgfE6UHD3Eb27YC6oD+bhcT+tJ6cl8dmsgdQxnWlcry8ksBIBLpw==}
+    engines: {node: '>=0.10.0'}
+
+  fast-diff@1.1.2:
+    resolution: {integrity: sha512-KaJUt+M9t1qaIteSvjc6P3RbMdXsNhK61GRftR6SNxqmhthcd9MGIi4T+o0jD8LUSpSnSKXE20nLtJ3fOHxQig==}
+
+  fast-diff@1.2.0:
+    resolution: {integrity: sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==}
+
+  fast-glob@3.3.3:
+    resolution: {integrity: sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==}
+    engines: {node: '>=8.6.0'}
+
+  fastq@1.19.1:
+    resolution: {integrity: sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==}
+
+  fflate@0.8.2:
+    resolution: {integrity: sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==}
+
+  file-saver@2.0.5:
+    resolution: {integrity: sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==}
+
+  fill-range@4.0.0:
+    resolution: {integrity: sha512-VcpLTWqWDiTerugjj8e3+esbg+skS3M9e54UuR3iCeIDMXCLTsAH8hTSzDQU/X6/6t3eYkOKoZSef2PlU6U1XQ==}
+    engines: {node: '>=0.10.0'}
+
+  fill-range@7.1.1:
+    resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==}
+    engines: {node: '>=8'}
+
+  follow-redirects@1.15.9:
+    resolution: {integrity: sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==}
+    engines: {node: '>=4.0'}
+    peerDependencies:
+      debug: '*'
+    peerDependenciesMeta:
+      debug:
+        optional: true
+
+  for-each@0.3.5:
+    resolution: {integrity: sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==}
+    engines: {node: '>= 0.4'}
+
+  for-in@1.0.2:
+    resolution: {integrity: sha512-7EwmXrOjyL+ChxMhmG5lnW9MPt1aIeZEwKhQzoBUdTV0N3zuwWDZYVJatDvZ2OyzPUvdIAZDsCetk3coyMfcnQ==}
+    engines: {node: '>=0.10.0'}
+
+  form-data@4.0.2:
+    resolution: {integrity: sha512-hGfm/slu0ZabnNt4oaRZ6uREyfCj6P4fT/n6A1rGV+Z0VdGXjfOhVUpkn6qVQONHGIFwmveGXyDs75+nr6FM8w==}
+    engines: {node: '>= 6'}
+
+  fragment-cache@0.2.1:
+    resolution: {integrity: sha512-GMBAbW9antB8iZRHLoGw0b3HANt57diZYFO/HL1JGIC1MjKrdmhxvrJbupnVvpys0zsz7yBApXdQyfepKly2kA==}
+    engines: {node: '>=0.10.0'}
+
+  fs-extra@10.1.0:
+    resolution: {integrity: sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==}
+    engines: {node: '>=12'}
+
+  fsevents@2.3.3:
+    resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+
+  function-bind@1.1.2:
+    resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==}
+
+  function.prototype.name@1.1.8:
+    resolution: {integrity: sha512-e5iwyodOHhbMr/yNrc7fDYG4qlbIvI5gajyzPnb5TCwyhjApznQh1BMFou9b30SevY43gCJKXycoCBjMbsuW0Q==}
+    engines: {node: '>= 0.4'}
+
+  functions-have-names@1.2.3:
+    resolution: {integrity: sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==}
+
+  fuse.js@6.6.2:
+    resolution: {integrity: sha512-cJaJkxCCxC8qIIcPBF9yGxY0W/tVZS3uEISDxhYIdtk8OL93pe+6Zj7LjCqVV4dzbqcriOZ+kQ/NE4RXZHsIGA==}
+    engines: {node: '>=10'}
+
+  get-intrinsic@1.3.0:
+    resolution: {integrity: sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==}
+    engines: {node: '>= 0.4'}
+
+  get-proto@1.0.1:
+    resolution: {integrity: sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==}
+    engines: {node: '>= 0.4'}
+
+  get-symbol-description@1.1.0:
+    resolution: {integrity: sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg==}
+    engines: {node: '>= 0.4'}
+
+  get-value@2.0.6:
+    resolution: {integrity: sha512-Ln0UQDlxH1BapMu3GPtf7CuYNwRZf2gwCuPqbyG6pB8WfmFpzqcy4xtAaAMUhnNqjMKTiCPZG2oMT3YSx8U2NA==}
+    engines: {node: '>=0.10.0'}
+
+  glob-parent@5.1.2:
+    resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==}
+    engines: {node: '>= 6'}
+
+  globalthis@1.0.4:
+    resolution: {integrity: sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==}
+    engines: {node: '>= 0.4'}
+
+  gopd@1.2.0:
+    resolution: {integrity: sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==}
+    engines: {node: '>= 0.4'}
+
+  graceful-fs@4.2.11:
+    resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
+
+  has-ansi@2.0.0:
+    resolution: {integrity: sha512-C8vBJ8DwUCx19vhm7urhTuUsr4/IyP6l4VzNQDv+ryHQObW3TTTp9yB68WpYgRe2bbaGuZ/se74IqFeVnMnLZg==}
+    engines: {node: '>=0.10.0'}
+
+  has-bigints@1.1.0:
+    resolution: {integrity: sha512-R3pbpkcIqv2Pm3dUwgjclDRVmWpTJW2DcMzcIhEXEx1oh/CEMObMm3KLmRJOdvhM7o4uQBnwr8pzRK2sJWIqfg==}
+    engines: {node: '>= 0.4'}
+
+  has-flag@1.0.0:
+    resolution: {integrity: sha512-DyYHfIYwAJmjAjSSPKANxI8bFY9YtFrgkAfinBojQ8YJTOuOuav64tMUJv584SES4xl74PmuaevIyaLESHdTAA==}
+    engines: {node: '>=0.10.0'}
+
+  has-flag@4.0.0:
+    resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
+    engines: {node: '>=8'}
+
+  has-property-descriptors@1.0.2:
+    resolution: {integrity: sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==}
+
+  has-proto@1.2.0:
+    resolution: {integrity: sha512-KIL7eQPfHQRC8+XluaIw7BHUwwqL19bQn4hzNgdr+1wXoU0KKj6rufu47lhY7KbJR2C6T6+PfyN0Ea7wkSS+qQ==}
+    engines: {node: '>= 0.4'}
+
+  has-symbols@1.1.0:
+    resolution: {integrity: sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==}
+    engines: {node: '>= 0.4'}
+
+  has-tostringtag@1.0.2:
+    resolution: {integrity: sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==}
+    engines: {node: '>= 0.4'}
+
+  has-value@0.3.1:
+    resolution: {integrity: sha512-gpG936j8/MzaeID5Yif+577c17TxaDmhuyVgSwtnL/q8UUTySg8Mecb+8Cf1otgLoD7DDH75axp86ER7LFsf3Q==}
+    engines: {node: '>=0.10.0'}
+
+  has-value@1.0.0:
+    resolution: {integrity: sha512-IBXk4GTsLYdQ7Rvt+GRBrFSVEkmuOUy4re0Xjd9kJSUQpnTrWR4/y9RpfexN9vkAPMFuQoeWKwqzPozRTlasGw==}
+    engines: {node: '>=0.10.0'}
+
+  has-values@0.1.4:
+    resolution: {integrity: sha512-J8S0cEdWuQbqD9//tlZxiMuMNmxB8PlEwvYwuxsTmR1G5RXUePEX/SJn7aD0GMLieuZYSwNH0cQuJGwnYunXRQ==}
+    engines: {node: '>=0.10.0'}
+
+  has-values@1.0.0:
+    resolution: {integrity: sha512-ODYZC64uqzmtfGMEAX/FvZiRyWLpAC3vYnNunURUnkGVTS+mI0smVsWaPydRBsE3g+ok7h960jChO8mFcWlHaQ==}
+    engines: {node: '>=0.10.0'}
+
+  hasown@2.0.2:
+    resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==}
+    engines: {node: '>= 0.4'}
+
+  he@1.2.0:
+    resolution: {integrity: sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==}
+    hasBin: true
+
+  html2canvas@1.4.1:
+    resolution: {integrity: sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==}
+    engines: {node: '>=8.0.0'}
+
+  htmlparser2@3.10.1:
+    resolution: {integrity: sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==}
+
+  image-size@0.5.5:
+    resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==}
+    engines: {node: '>=0.10.0'}
+    hasBin: true
+
+  immutable@4.3.7:
+    resolution: {integrity: sha512-1hqclzwYwjRDFLjcFxOM5AYkkG0rpFPpr1RLPMEuGczoS7YA8gLhy8SWXYRAA/XwfEHpfo3cw5JGioS32fnMRw==}
+
+  inherits@2.0.4:
+    resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
+
+  internal-slot@1.1.0:
+    resolution: {integrity: sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==}
+    engines: {node: '>= 0.4'}
+
+  is-accessor-descriptor@1.0.1:
+    resolution: {integrity: sha512-YBUanLI8Yoihw923YeFUS5fs0fF2f5TSFTNiYAAzhhDscDa3lEqYuz1pDOEP5KvX94I9ey3vsqjJcLVFVU+3QA==}
+    engines: {node: '>= 0.10'}
+
+  is-arguments@1.2.0:
+    resolution: {integrity: sha512-7bVbi0huj/wrIAOzb8U1aszg9kdi3KN/CyU19CTI7tAoZYEZoL9yCDXpbXN+uPsuWnP02cyug1gleqq+TU+YCA==}
+    engines: {node: '>= 0.4'}
+
+  is-array-buffer@3.0.5:
+    resolution: {integrity: sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A==}
+    engines: {node: '>= 0.4'}
+
+  is-async-function@2.1.1:
+    resolution: {integrity: sha512-9dgM/cZBnNvjzaMYHVoxxfPj2QXt22Ev7SuuPrs+xav0ukGB0S6d4ydZdEiM48kLx5kDV+QBPrpVnFyefL8kkQ==}
+    engines: {node: '>= 0.4'}
+
+  is-bigint@1.1.0:
+    resolution: {integrity: sha512-n4ZT37wG78iz03xPRKJrHTdZbe3IicyucEtdRsV5yglwc3GyUfbAfpSeD0FJ41NbUNSt5wbhqfp1fS+BgnvDFQ==}
+    engines: {node: '>= 0.4'}
+
+  is-binary-path@2.1.0:
+    resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
+    engines: {node: '>=8'}
+
+  is-boolean-object@1.2.2:
+    resolution: {integrity: sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==}
+    engines: {node: '>= 0.4'}
+
+  is-buffer@1.1.6:
+    resolution: {integrity: sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==}
+
+  is-callable@1.2.7:
+    resolution: {integrity: sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==}
+    engines: {node: '>= 0.4'}
+
+  is-data-descriptor@1.0.1:
+    resolution: {integrity: sha512-bc4NlCDiCr28U4aEsQ3Qs2491gVq4V8G7MQyws968ImqjKuYtTJXrl7Vq7jsN7Ly/C3xj5KWFrY7sHNeDkAzXw==}
+    engines: {node: '>= 0.4'}
+
+  is-data-view@1.0.2:
+    resolution: {integrity: sha512-RKtWF8pGmS87i2D6gqQu/l7EYRlVdfzemCJN/P3UOs//x1QE7mfhvzHIApBTRf7axvT6DMGwSwBXYCT0nfB9xw==}
+    engines: {node: '>= 0.4'}
+
+  is-date-object@1.1.0:
+    resolution: {integrity: sha512-PwwhEakHVKTdRNVOw+/Gyh0+MzlCl4R6qKvkhuvLtPMggI1WAHt9sOwZxQLSGpUaDnrdyDsomoRgNnCfKNSXXg==}
+    engines: {node: '>= 0.4'}
+
+  is-descriptor@0.1.7:
+    resolution: {integrity: sha512-C3grZTvObeN1xud4cRWl366OMXZTj0+HGyk4hvfpx4ZHt1Pb60ANSXqCK7pdOTeUQpRzECBSTphqvD7U+l22Eg==}
+    engines: {node: '>= 0.4'}
+
+  is-descriptor@1.0.3:
+    resolution: {integrity: sha512-JCNNGbwWZEVaSPtS45mdtrneRWJFp07LLmykxeFV5F6oBvNF8vHSfJuJgoT472pSfk+Mf8VnlrspaFBHWM8JAw==}
+    engines: {node: '>= 0.4'}
+
+  is-extendable@0.1.1:
+    resolution: {integrity: sha512-5BMULNob1vgFX6EjQw5izWDxrecWK9AM72rugNr0TFldMOi0fj6Jk+zeKIt0xGj4cEfQIJth4w3OKWOJ4f+AFw==}
+    engines: {node: '>=0.10.0'}
+
+  is-extendable@1.0.1:
+    resolution: {integrity: sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==}
+    engines: {node: '>=0.10.0'}
+
+  is-extglob@2.1.1:
+    resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
+    engines: {node: '>=0.10.0'}
+
+  is-finalizationregistry@1.1.1:
+    resolution: {integrity: sha512-1pC6N8qWJbWoPtEjgcL2xyhQOP491EQjeUo3qTKcmV8YSDDJrOepfG8pcC7h/QgnQHYSv0mJ3Z/ZWxmatVrysg==}
+    engines: {node: '>= 0.4'}
+
+  is-generator-function@1.1.0:
+    resolution: {integrity: sha512-nPUB5km40q9e8UfN/Zc24eLlzdSf9OfKByBw9CIdw4H1giPMeA0OIJvbchsCu4npfI2QcMVBsGEBHKZ7wLTWmQ==}
+    engines: {node: '>= 0.4'}
+
+  is-glob@4.0.3:
+    resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
+    engines: {node: '>=0.10.0'}
+
+  is-map@2.0.3:
+    resolution: {integrity: sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==}
+    engines: {node: '>= 0.4'}
+
+  is-number-object@1.1.1:
+    resolution: {integrity: sha512-lZhclumE1G6VYD8VHe35wFaIif+CTy5SJIi5+3y4psDgWu4wPDoBhF8NxUOinEc7pHgiTsT6MaBb92rKhhD+Xw==}
+    engines: {node: '>= 0.4'}
+
+  is-number@3.0.0:
+    resolution: {integrity: sha512-4cboCqIpliH+mAvFNegjZQ4kgKc3ZUhQVr3HvWbSh5q3WH2v82ct+T2Y1hdU5Gdtorx/cLifQjqCbL7bpznLTg==}
+    engines: {node: '>=0.10.0'}
+
+  is-number@7.0.0:
+    resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==}
+    engines: {node: '>=0.12.0'}
+
+  is-plain-obj@1.1.0:
+    resolution: {integrity: sha512-yvkRyxmFKEOQ4pNXCmJG5AEQNlXJS5LaONXo5/cLdTZdWvsZ1ioJEonLGAosKlMWE8lwUy/bJzMjcw8az73+Fg==}
+    engines: {node: '>=0.10.0'}
+
+  is-plain-object@2.0.4:
+    resolution: {integrity: sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==}
+    engines: {node: '>=0.10.0'}
+
+  is-regex@1.2.1:
+    resolution: {integrity: sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==}
+    engines: {node: '>= 0.4'}
+
+  is-set@2.0.3:
+    resolution: {integrity: sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==}
+    engines: {node: '>= 0.4'}
+
+  is-shared-array-buffer@1.0.4:
+    resolution: {integrity: sha512-ISWac8drv4ZGfwKl5slpHG9OwPNty4jOWPRIhBpxOoD+hqITiwuipOQ2bNthAzwA3B4fIjO4Nln74N0S9byq8A==}
+    engines: {node: '>= 0.4'}
+
+  is-string@1.1.1:
+    resolution: {integrity: sha512-BtEeSsoaQjlSPBemMQIrY1MY0uM6vnS1g5fmufYOtnxLGUZM2178PKbhsk7Ffv58IX+ZtcvoGwccYsh0PglkAA==}
+    engines: {node: '>= 0.4'}
+
+  is-symbol@1.1.1:
+    resolution: {integrity: sha512-9gGx6GTtCQM73BgmHQXfDmLtfjjTUDSyoxTCbp5WtoixAhfgsDirWIcVQ/IHpvI5Vgd5i/J5F7B9cN/WlVbC/w==}
+    engines: {node: '>= 0.4'}
+
+  is-typed-array@1.1.15:
+    resolution: {integrity: sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==}
+    engines: {node: '>= 0.4'}
+
+  is-weakmap@2.0.2:
+    resolution: {integrity: sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==}
+    engines: {node: '>= 0.4'}
+
+  is-weakref@1.1.1:
+    resolution: {integrity: sha512-6i9mGWSlqzNMEqpCp93KwRS1uUOodk2OJ6b+sq7ZPDSy2WuI5NFIxp/254TytR8ftefexkWn5xNiHUNpPOfSew==}
+    engines: {node: '>= 0.4'}
+
+  is-weakset@2.0.4:
+    resolution: {integrity: sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ==}
+    engines: {node: '>= 0.4'}
+
+  is-windows@1.0.2:
+    resolution: {integrity: sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA==}
+    engines: {node: '>=0.10.0'}
+
+  isarray@1.0.0:
+    resolution: {integrity: sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==}
+
+  isarray@2.0.5:
+    resolution: {integrity: sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==}
+
+  isobject@2.1.0:
+    resolution: {integrity: sha512-+OUdGJlgjOBZDfxnDjYYG6zp487z0JGNQq3cYQYg5f5hKR+syHMsaztzGeml/4kGG55CSpKSpWTY+jYGgsHLgA==}
+    engines: {node: '>=0.10.0'}
+
+  isobject@3.0.1:
+    resolution: {integrity: sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==}
+    engines: {node: '>=0.10.0'}
+
+  jquery@3.7.1:
+    resolution: {integrity: sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==}
+
+  js-base64@2.6.4:
+    resolution: {integrity: sha512-pZe//GGmwJndub7ZghVHz7vjb2LgC1m8B07Au3eYqeqv9emhESByMXxaEgkUkEqJe87oBbSniGYoQNIBklc7IQ==}
+
+  js-cookie@3.0.5:
+    resolution: {integrity: sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==}
+    engines: {node: '>=14'}
+
+  js-tokens@9.0.1:
+    resolution: {integrity: sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ==}
+
+  jsbarcode@3.11.6:
+    resolution: {integrity: sha512-G5TKGyKY1zJo0ZQKFM1IIMfy0nF2rs92BLlCz+cU4/TazIc4ZH+X1GYeDRt7TKjrYqmPfTjwTBkU/QnQlsYiuA==}
+
+  jsencrypt@3.3.2:
+    resolution: {integrity: sha512-arQR1R1ESGdAxY7ZheWr12wCaF2yF47v5qpB76TtV64H1pyGudk9Hvw8Y9tb/FiTIaaTRUyaSnm5T/Y53Ghm/A==}
+
+  json5@1.0.2:
+    resolution: {integrity: sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==}
+    hasBin: true
+
+  jsonfile@6.1.0:
+    resolution: {integrity: sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==}
+
+  jspdf@2.5.2:
+    resolution: {integrity: sha512-myeX9c+p7znDWPk0eTrujCzNjT+CXdXyk7YmJq5nD5V7uLLKmSXnlQ/Jn/kuo3X09Op70Apm0rQSnFWyGK8uEQ==}
+
+  kind-of@3.2.2:
+    resolution: {integrity: sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==}
+    engines: {node: '>=0.10.0'}
+
+  kind-of@4.0.0:
+    resolution: {integrity: sha512-24XsCxmEbRwEDbz/qz3stgin8TTzZ1ESR56OMCN0ujYg+vRutNSiOj9bHH9u85DKgXguraugV5sFuvbD4FW/hw==}
+    engines: {node: '>=0.10.0'}
+
+  kind-of@5.1.0:
+    resolution: {integrity: sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw==}
+    engines: {node: '>=0.10.0'}
+
+  kind-of@6.0.3:
+    resolution: {integrity: sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==}
+    engines: {node: '>=0.10.0'}
+
+  loader-utils@1.4.2:
+    resolution: {integrity: sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==}
+    engines: {node: '>=4.0.0'}
+
+  local-pkg@0.5.1:
+    resolution: {integrity: sha512-9rrA30MRRP3gBD3HTGnC6cDFpaE1kVDWxWgqWJUN0RvDNAo+Nz/9GxB+nHOH0ifbVFy0hSA1V6vFDvnx54lTEQ==}
+    engines: {node: '>=14'}
+
+  local-pkg@1.1.1:
+    resolution: {integrity: sha512-WunYko2W1NcdfAFpuLUoucsgULmgDBRkdxHxWQ7mK0cQqwPiy8E1enjuRBrhLtZkB5iScJ1XIPdhVEFK8aOLSg==}
+    engines: {node: '>=14'}
+
+  lodash-es@4.17.21:
+    resolution: {integrity: sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==}
+
+  lodash-unified@1.0.3:
+    resolution: {integrity: sha512-WK9qSozxXOD7ZJQlpSqOT+om2ZfcT4yO+03FuzAHD0wF6S0l0090LRPDx3vhTTLZ8cFKpBn+IOcVXK6qOcIlfQ==}
+    peerDependencies:
+      '@types/lodash-es': '*'
+      lodash: '*'
+      lodash-es: '*'
+
+  lodash.clonedeep@4.5.0:
+    resolution: {integrity: sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==}
+
+  lodash.isequal@4.5.0:
+    resolution: {integrity: sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==}
+    deprecated: This package is deprecated. Use require('node:util').isDeepStrictEqual instead.
+
+  lodash@4.17.21:
+    resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
+
+  magic-string@0.26.7:
+    resolution: {integrity: sha512-hX9XH3ziStPoPhJxLq1syWuZMxbDvGNbVchfrdCtanC7D13888bMFow61x8axrx+GfHLtVeAx2kxL7tTGRl+Ow==}
+    engines: {node: '>=12'}
+
+  magic-string@0.30.17:
+    resolution: {integrity: sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==}
+
+  map-cache@0.2.2:
+    resolution: {integrity: sha512-8y/eV9QQZCiyn1SprXSrCmqJN0yNRATe+PO8ztwqrvrbdRLA3eYJF0yaR0YayLWkMbsQSKWS9N2gPcGEc4UsZg==}
+    engines: {node: '>=0.10.0'}
+
+  map-visit@1.0.0:
+    resolution: {integrity: sha512-4y7uGv8bd2WdM9vpQsiQNo41Ln1NvhvDRuVt0k2JZQ+ezN2uaQes7lZeZ+QQUHOLQAtDaBJ+7wCbi+ab/KFs+w==}
+    engines: {node: '>=0.10.0'}
+
+  math-intrinsics@1.1.0:
+    resolution: {integrity: sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==}
+    engines: {node: '>= 0.4'}
+
+  mdn-data@2.0.14:
+    resolution: {integrity: sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==}
+
+  memoize-one@6.0.0:
+    resolution: {integrity: sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==}
+
+  merge-options@1.0.1:
+    resolution: {integrity: sha512-iuPV41VWKWBIOpBsjoxjDZw8/GbSfZ2mk7N1453bwMrfzdrIk7EzBd+8UVR6rkw67th7xnk9Dytl3J+lHPdxvg==}
+    engines: {node: '>=4'}
+
+  merge2@1.4.1:
+    resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
+    engines: {node: '>= 8'}
+
+  micromatch@3.1.0:
+    resolution: {integrity: sha512-3StSelAE+hnRvMs8IdVW7Uhk8CVed5tp+kLLGlBP6WiRAXS21GPGu/Nat4WNPXj2Eoc24B02SaeoyozPMfj0/g==}
+    engines: {node: '>=0.10.0'}
+
+  micromatch@4.0.8:
+    resolution: {integrity: sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==}
+    engines: {node: '>=8.6'}
+
+  mime-db@1.52.0:
+    resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
+    engines: {node: '>= 0.6'}
+
+  mime-types@2.1.35:
+    resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
+    engines: {node: '>= 0.6'}
+
+  minimatch@9.0.5:
+    resolution: {integrity: sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==}
+    engines: {node: '>=16 || 14 >=14.17'}
+
+  minimist@1.2.8:
+    resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==}
+
+  mixin-deep@1.3.2:
+    resolution: {integrity: sha512-WRoDn//mXBiJ1H40rqa3vH0toePwSsGb45iInWlTySa+Uu4k3tYUSxa2v1KqAiLtvlrSzaExqS1gtk96A9zvEA==}
+    engines: {node: '>=0.10.0'}
+
+  mlly@1.7.4:
+    resolution: {integrity: sha512-qmdSIPC4bDJXgZTCR7XosJiNKySV7O215tsPtDN9iEO/7q/76b/ijtgRu/+epFXSJhijtTCCGp3DWS549P3xKw==}
+
+  ms@2.0.0:
+    resolution: {integrity: sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==}
+
+  ms@2.1.3:
+    resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
+
+  nanoid@3.3.8:
+    resolution: {integrity: sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==}
+    engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
+    hasBin: true
+
+  nanomatch@1.2.13:
+    resolution: {integrity: sha512-fpoe2T0RbHwBTBUOftAfBPaDEi06ufaUai0mE6Yn1kacc3SnTErfb/h+X94VXzI64rKFHYImXSvdwGGCmwOqCA==}
+    engines: {node: '>=0.10.0'}
+
+  normalize-path@3.0.0:
+    resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
+    engines: {node: '>=0.10.0'}
+
+  normalize-wheel-es@1.2.0:
+    resolution: {integrity: sha512-Wj7+EJQ8mSuXr2iWfnujrimU35R2W4FAErEyTmJoJ7ucwTn2hOUSsRehMb5RSYkxXGTM7Y9QpvPmp++w5ftoJw==}
+
+  nprogress@0.2.0:
+    resolution: {integrity: sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==}
+
+  nth-check@2.1.1:
+    resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
+
+  nzh@1.0.14:
+    resolution: {integrity: sha512-wKgaqCSZdrySvB4RWop5g+v6IDv2IErsT6rjq06Bg0yiT9hiHYZO12GMGx/xweGVLcO2lDjX5RqWD0S/Jy9z5Q==}
+
+  object-assign@4.1.1:
+    resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
+    engines: {node: '>=0.10.0'}
+
+  object-copy@0.1.0:
+    resolution: {integrity: sha512-79LYn6VAb63zgtmAteVOWo9Vdj71ZVBy3Pbse+VqxDpEP83XuujMrGqHIwAXJ5I/aM0zU7dIyIAhifVTPrNItQ==}
+    engines: {node: '>=0.10.0'}
+
+  object-inspect@1.13.4:
+    resolution: {integrity: sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==}
+    engines: {node: '>= 0.4'}
+
+  object-is@1.1.6:
+    resolution: {integrity: sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==}
+    engines: {node: '>= 0.4'}
+
+  object-keys@1.1.1:
+    resolution: {integrity: sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==}
+    engines: {node: '>= 0.4'}
+
+  object-visit@1.0.1:
+    resolution: {integrity: sha512-GBaMwwAVK9qbQN3Scdo0OyvgPW7l3lnaVMj84uTOZlswkX0KpF6fyDBJhtTthf7pymztoN36/KEr1DyhF96zEA==}
+    engines: {node: '>=0.10.0'}
+
+  object.assign@4.1.7:
+    resolution: {integrity: sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==}
+    engines: {node: '>= 0.4'}
+
+  object.pick@1.3.0:
+    resolution: {integrity: sha512-tqa/UMy/CCoYmj+H5qc07qvSL9dqcs/WZENZ1JbtWBlATP+iVOe778gE6MSijnyCnORzDuX6hU+LA4SZ09YjFQ==}
+    engines: {node: '>=0.10.0'}
+
+  own-keys@1.0.1:
+    resolution: {integrity: sha512-qFOyK5PjiWZd+QQIh+1jhdb9LpxTF0qs7Pm8o5QHYZ0M3vKqSqzsZaEB6oWlxZ+q2sJBMI/Ktgd2N5ZwQoRHfg==}
+    engines: {node: '>= 0.4'}
+
+  parchment@1.1.4:
+    resolution: {integrity: sha512-J5FBQt/pM2inLzg4hEWmzQx/8h8D0CiDxaG3vyp9rKrQRSDgBlhjdP5jQGgosEajXPSQouXGHOmVdgo7QmJuOg==}
+
+  pascalcase@0.1.1:
+    resolution: {integrity: sha512-XHXfu/yOQRy9vYOtUDVMN60OEJjW013GoObG1o+xwQTpB9eYJX/BjXMsdW13ZDPruFhYYn0AG22w0xgQMwl3Nw==}
+    engines: {node: '>=0.10.0'}
+
+  pathe@0.2.0:
+    resolution: {integrity: sha512-sTitTPYnn23esFR3RlqYBWn4c45WGeLcsKzQiUpXJAyfcWkolvlYpV8FLo7JishK946oQwMFUCHXQ9AjGPKExw==}
+
+  pathe@2.0.3:
+    resolution: {integrity: sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==}
+
+  performance-now@2.1.0:
+    resolution: {integrity: sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==}
+
+  picocolors@1.1.1:
+    resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
+
+  picomatch@2.3.1:
+    resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
+    engines: {node: '>=8.6'}
+
+  picomatch@4.0.2:
+    resolution: {integrity: sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==}
+    engines: {node: '>=12'}
+
+  pinia@2.1.7:
+    resolution: {integrity: sha512-+C2AHFtcFqjPih0zpYuvof37SFxMQ7OEG2zV9jRI12i9BOy3YQVAHwdKtyyc8pDcDyIc33WCIsZaCFWU7WWxGQ==}
+    peerDependencies:
+      '@vue/composition-api': ^1.4.0
+      typescript: '>=4.4.4'
+      vue: ^2.6.14 || ^3.3.0
+    peerDependenciesMeta:
+      '@vue/composition-api':
+        optional: true
+      typescript:
+        optional: true
+
+  pkg-types@1.3.1:
+    resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
+
+  pkg-types@2.1.0:
+    resolution: {integrity: sha512-wmJwA+8ihJixSoHKxZJRBQG1oY8Yr9pGLzRmSsNms0iNWyHHAlZCa7mmKiFR10YPZuz/2k169JiS/inOjBCZ2A==}
+
+  posix-character-classes@0.1.1:
+    resolution: {integrity: sha512-xTgYBc3fuo7Yt7JbiuFxSYGToMoz8fLoE6TC9Wx1P/u+LfeThMOAqmuyECnlBaaJb+u1m9hHiXUEtwW4OzfUJg==}
+    engines: {node: '>=0.10.0'}
+
+  possible-typed-array-names@1.1.0:
+    resolution: {integrity: sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==}
+    engines: {node: '>= 0.4'}
+
+  postcss-prefix-selector@1.16.1:
+    resolution: {integrity: sha512-Umxu+FvKMwlY6TyDzGFoSUnzW+NOfMBLyC1tAkIjgX+Z/qGspJeRjVC903D7mx7TuBpJlwti2ibXtWuA7fKMeQ==}
+    peerDependencies:
+      postcss: '>4 <9'
+
+  postcss@5.2.18:
+    resolution: {integrity: sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==}
+    engines: {node: '>=0.12'}
+
+  postcss@8.5.3:
+    resolution: {integrity: sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==}
+    engines: {node: ^10 || ^12 || >=14}
+
+  posthtml-parser@0.2.1:
+    resolution: {integrity: sha512-nPC53YMqJnc/+1x4fRYFfm81KV2V+G9NZY+hTohpYg64Ay7NemWWcV4UWuy/SgMupqQ3kJ88M/iRfZmSnxT+pw==}
+
+  posthtml-rename-id@1.0.12:
+    resolution: {integrity: sha512-UKXf9OF/no8WZo9edRzvuMenb6AD5hDLzIepJW+a4oJT+T/Lx7vfMYWT4aWlGNQh0WMhnUx1ipN9OkZ9q+ddEw==}
+
+  posthtml-render@1.4.0:
+    resolution: {integrity: sha512-W1779iVHGfq0Fvh2PROhCe2QhB8mEErgqzo1wpIt36tCgChafP+hbXIhLDOM8ePJrZcFs0vkNEtdibEWVqChqw==}
+    engines: {node: '>=10'}
+
+  posthtml-svg-mode@1.0.3:
+    resolution: {integrity: sha512-hEqw9NHZ9YgJ2/0G7CECOeuLQKZi8HjWLkBaSVtOWjygQ9ZD8P7tqeowYs7WrFdKsWEKG7o+IlsPY8jrr0CJpQ==}
+
+  posthtml@0.9.2:
+    resolution: {integrity: sha512-spBB5sgC4cv2YcW03f/IAUN1pgDJWNWD8FzkyY4mArLUMJW+KlQhlmUdKAHQuPfb00Jl5xIfImeOsf6YL8QK7Q==}
+    engines: {node: '>=0.10.0'}
+
+  proxy-from-env@1.1.0:
+    resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==}
+
+  quansync@0.2.8:
+    resolution: {integrity: sha512-4+saucphJMazjt7iOM27mbFCk+D9dd/zmgMDCzRZ8MEoBfYp7lAvoN38et/phRQF6wOPMy/OROBGgoWeSKyluA==}
+
+  query-string@4.3.4:
+    resolution: {integrity: sha512-O2XLNDBIg1DnTOa+2XrIwSiXEV8h2KImXUnjhhn2+UsvZ+Es2uyd5CCRTNQlDGbzUQOW3aYCBx9rVA6dzsiY7Q==}
+    engines: {node: '>=0.10.0'}
+
+  queue-microtask@1.2.3:
+    resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
+
+  quill-delta@3.6.3:
+    resolution: {integrity: sha512-wdIGBlcX13tCHOXGMVnnTVFtGRLoP0imqxM696fIPwIf5ODIYUHIvHbZcyvGlZFiFhK5XzDC2lpjbxRhnM05Tg==}
+    engines: {node: '>=0.10'}
+
+  quill-delta@4.2.2:
+    resolution: {integrity: sha512-qjbn82b/yJzOjstBgkhtBjN2TNK+ZHP/BgUQO+j6bRhWQQdmj2lH6hXG7+nwwLF41Xgn//7/83lxs9n2BkTtTg==}
+
+  quill@1.3.7:
+    resolution: {integrity: sha512-hG/DVzh/TiknWtE6QmWAF/pxoZKYxfe3J/d/+ShUWkDvvkZQVTPeVmUJVu1uE6DDooC4fWTiCLh84ul89oNz5g==}
+
+  raf@3.4.1:
+    resolution: {integrity: sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==}
+
+  readable-stream@3.6.2:
+    resolution: {integrity: sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==}
+    engines: {node: '>= 6'}
+
+  readdirp@3.6.0:
+    resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
+    engines: {node: '>=8.10.0'}
+
+  reflect.getprototypeof@1.0.10:
+    resolution: {integrity: sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==}
+    engines: {node: '>= 0.4'}
+
+  regenerator-runtime@0.13.11:
+    resolution: {integrity: sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==}
+
+  regenerator-runtime@0.14.1:
+    resolution: {integrity: sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==}
+
+  regex-not@1.0.2:
+    resolution: {integrity: sha512-J6SDjUgDxQj5NusnOtdFxDwN/+HWykR8GELwctJ7mdqhcyy1xEc4SRFHUXvxTp661YaVKAjfRLZ9cCqS6tn32A==}
+    engines: {node: '>=0.10.0'}
+
+  regexp.prototype.flags@1.5.4:
+    resolution: {integrity: sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA==}
+    engines: {node: '>= 0.4'}
+
+  repeat-element@1.1.4:
+    resolution: {integrity: sha512-LFiNfRcSu7KK3evMyYOuCzv3L10TW7yC1G2/+StMjK8Y6Vqd2MG7r/Qjw4ghtuCOjFvlnms/iMmLqpvW/ES/WQ==}
+    engines: {node: '>=0.10.0'}
+
+  repeat-string@1.6.1:
+    resolution: {integrity: sha512-PV0dzCYDNfRi1jCDbJzpW7jNNDRuCOG/jI5ctQcGKt/clZD+YcPS3yIlWuTJMmESC8aevCFmWJy5wjAFgNqN6w==}
+    engines: {node: '>=0.10'}
+
+  resolve-url@0.2.1:
+    resolution: {integrity: sha512-ZuF55hVUQaaczgOIwqWzkEcEidmlD/xl44x1UZnhOXcYuFN2S6+rcxpG+C1N3So0wvNI3DmJICUFfu2SxhBmvg==}
+    deprecated: https://github.com/lydell/resolve-url#deprecated
+
+  ret@0.1.15:
+    resolution: {integrity: sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==}
+    engines: {node: '>=0.12'}
+
+  reusify@1.1.0:
+    resolution: {integrity: sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==}
+    engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
+
+  rgbcolor@1.0.1:
+    resolution: {integrity: sha512-9aZLIrhRaD97sgVhtJOW6ckOEh6/GnvQtdVNfdZ6s67+3/XwLS9lBcQYzEEhYVeUowN7pRzMLsyGhK2i/xvWbw==}
+    engines: {node: '>= 0.8.15'}
+
+  rollup@4.34.9:
+    resolution: {integrity: sha512-nF5XYqWWp9hx/LrpC8sZvvvmq0TeTjQgaZHYmAgwysT9nh8sWnZhBnM8ZyVbbJFIQBLwHDNoMqsBZBbUo4U8sQ==}
+    engines: {node: '>=18.0.0', npm: '>=8.0.0'}
+    hasBin: true
+
+  run-parallel@1.2.0:
+    resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
+
+  safe-array-concat@1.1.3:
+    resolution: {integrity: sha512-AURm5f0jYEOydBj7VQlVvDrjeFgthDdEF5H1dP+6mNpoXOMo1quQqJ4wvJDyRZ9+pO3kGWoOdmV08cSv2aJV6Q==}
+    engines: {node: '>=0.4'}
+
+  safe-buffer@5.2.1:
+    resolution: {integrity: sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==}
+
+  safe-push-apply@1.0.0:
+    resolution: {integrity: sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==}
+    engines: {node: '>= 0.4'}
+
+  safe-regex-test@1.1.0:
+    resolution: {integrity: sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==}
+    engines: {node: '>= 0.4'}
+
+  safe-regex@1.1.0:
+    resolution: {integrity: sha512-aJXcif4xnaNUzvUuC5gcb46oTS7zvg4jpMTnuqtrEPlR3vFr4pxtdTwaF1Qs3Enjn9HK+ZlwQui+a7z0SywIzg==}
+
+  sass@1.77.5:
+    resolution: {integrity: sha512-oDfX1mukIlxacPdQqNb6mV2tVCrnE+P3nVYioy72V5tlk56CPNcO4TCuFcaCRKKfJ1M3lH95CleRS+dVKL2qMg==}
+    engines: {node: '>=14.0.0'}
+    hasBin: true
+
+  scule@1.3.0:
+    resolution: {integrity: sha512-6FtHJEvt+pVMIB9IBY+IcCJ6Z5f1iQnytgyfKMhDKgmzYG+TeH/wx1y3l27rshSbLiSanrR9ffZDrEsmjlQF2g==}
+
+  set-function-length@1.2.2:
+    resolution: {integrity: sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==}
+    engines: {node: '>= 0.4'}
+
+  set-function-name@2.0.2:
+    resolution: {integrity: sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==}
+    engines: {node: '>= 0.4'}
+
+  set-proto@1.0.0:
+    resolution: {integrity: sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==}
+    engines: {node: '>= 0.4'}
+
+  set-value@2.0.1:
+    resolution: {integrity: sha512-JxHc1weCN68wRY0fhCoXpyK55m/XPHafOmK4UWD7m2CI14GMcFypt4w/0+NV5f/ZMby2F6S2wwA7fgynh9gWSw==}
+    engines: {node: '>=0.10.0'}
+
+  side-channel-list@1.0.0:
+    resolution: {integrity: sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==}
+    engines: {node: '>= 0.4'}
+
+  side-channel-map@1.0.1:
+    resolution: {integrity: sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==}
+    engines: {node: '>= 0.4'}
+
+  side-channel-weakmap@1.0.2:
+    resolution: {integrity: sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==}
+    engines: {node: '>= 0.4'}
+
+  side-channel@1.1.0:
+    resolution: {integrity: sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==}
+    engines: {node: '>= 0.4'}
+
+  snapdragon-node@2.1.1:
+    resolution: {integrity: sha512-O27l4xaMYt/RSQ5TR3vpWCAB5Kb/czIcqUFOM/C4fYcLnbZUc1PkjTAMjof2pBWaSTwOUd6qUHcFGVGj7aIwnw==}
+    engines: {node: '>=0.10.0'}
+
+  snapdragon-util@3.0.1:
+    resolution: {integrity: sha512-mbKkMdQKsjX4BAL4bRYTj21edOf8cN7XHdYUJEe+Zn99hVEYcMvKPct1IqNe7+AZPirn8BCDOQBHQZknqmKlZQ==}
+    engines: {node: '>=0.10.0'}
+
+  snapdragon@0.8.2:
+    resolution: {integrity: sha512-FtyOnWN/wCHTVXOMwvSv26d+ko5vWlIDD6zoUJ7LW8vh+ZBC8QdljveRP+crNrtBwioEUWy/4dMtbBjA4ioNlg==}
+    engines: {node: '>=0.10.0'}
+
+  socket.io-client@4.8.1:
+    resolution: {integrity: sha512-hJVXfu3E28NmzGk8o1sHhN3om52tRvwYeidbj7xKy2eIIse5IoKX3USlS6Tqt3BHAtflLIkCQBkzVrEEfWUyYQ==}
+    engines: {node: '>=10.0.0'}
+
+  socket.io-parser@4.2.4:
+    resolution: {integrity: sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==}
+    engines: {node: '>=10.0.0'}
+
+  source-map-js@1.2.1:
+    resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
+    engines: {node: '>=0.10.0'}
+
+  source-map-resolve@0.5.3:
+    resolution: {integrity: sha512-Htz+RnsXWk5+P2slx5Jh3Q66vhQj1Cllm0zvnaY98+NFx+Dv2CF/f5O/t8x+KaNdrdIAsruNzoh/KpialbqAnw==}
+    deprecated: See https://github.com/lydell/source-map-resolve#deprecated
+
+  source-map-url@0.4.1:
+    resolution: {integrity: sha512-cPiFOTLUKvJFIg4SKVScy4ilPPW6rFgMgfuZJPNoDuMs3nC1HbMUycBoJw77xFIp6z1UJQJOfx6C9GMH80DiTw==}
+    deprecated: See https://github.com/lydell/source-map-url#deprecated
+
+  source-map@0.5.7:
+    resolution: {integrity: sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==}
+    engines: {node: '>=0.10.0'}
+
+  source-map@0.6.1:
+    resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
+    engines: {node: '>=0.10.0'}
+
+  sourcemap-codec@1.4.8:
+    resolution: {integrity: sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==}
+    deprecated: Please use @jridgewell/sourcemap-codec instead
+
+  split-string@3.1.0:
+    resolution: {integrity: sha512-NzNVhJDYpwceVVii8/Hu6DKfD2G+NrQHlS/V/qgv763EYudVwEcMQNxd2lh+0VrUByXN/oJkl5grOhYWvQUYiw==}
+    engines: {node: '>=0.10.0'}
+
+  splitpanes@3.1.5:
+    resolution: {integrity: sha512-r3Mq2ITFQ5a2VXLOy4/Sb2Ptp7OfEO8YIbhVJqJXoFc9hc5nTXXkCvtVDjIGbvC0vdE7tse+xTM9BMjsszP6bw==}
+
+  stable@0.1.8:
+    resolution: {integrity: sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w==}
+    deprecated: 'Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility'
+
+  stackblur-canvas@2.7.0:
+    resolution: {integrity: sha512-yf7OENo23AGJhBriGx0QivY5JP6Y1HbrrDI6WLt6C5auYZXlQrheoY8hD4ibekFKz1HOfE48Ww8kMWMnJD/zcQ==}
+    engines: {node: '>=0.1.14'}
+
+  static-extend@0.1.2:
+    resolution: {integrity: sha512-72E9+uLc27Mt718pMHt9VMNiAL4LMsmDbBva8mxWUCkT07fSzEGMYUCk0XWY6lp0j6RBAG4cJ3mWuZv2OE3s0g==}
+    engines: {node: '>=0.10.0'}
+
+  strict-uri-encode@1.1.0:
+    resolution: {integrity: sha512-R3f198pcvnB+5IpnBlRkphuE9n46WyVl8I39W/ZUTZLz4nqSP/oLYUrcnJrw462Ds8he4YKMov2efsTIw1BDGQ==}
+    engines: {node: '>=0.10.0'}
+
+  string.prototype.trim@1.2.10:
+    resolution: {integrity: sha512-Rs66F0P/1kedk5lyYyH9uBzuiI/kNRmwJAR9quK6VOtIpZ2G+hMZd+HQbbv25MgCA6gEffoMZYxlTod4WcdrKA==}
+    engines: {node: '>= 0.4'}
+
+  string.prototype.trimend@1.0.9:
+    resolution: {integrity: sha512-G7Ok5C6E/j4SGfyLCloXTrngQIQU3PWtXGst3yM7Bea9FRURf1S42ZHlZZtsNque2FN2PoUhfZXYLNWwEr4dLQ==}
+    engines: {node: '>= 0.4'}
+
+  string.prototype.trimstart@1.0.8:
+    resolution: {integrity: sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==}
+    engines: {node: '>= 0.4'}
+
+  string_decoder@1.3.0:
+    resolution: {integrity: sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==}
+
+  strip-ansi@3.0.1:
+    resolution: {integrity: sha512-VhumSSbBqDTP8p2ZLKj40UjBCV4+v8bUSEpUb4KjRgWk9pbqGF4REFj6KEagidb2f/M6AzC0EmFyDNGaw9OCzg==}
+    engines: {node: '>=0.10.0'}
+
+  strip-literal@2.1.1:
+    resolution: {integrity: sha512-631UJ6O00eNGfMiWG78ck80dfBab8X6IVFB51jZK5Icd7XAs60Z5y7QdSd/wGIklnWvRbUNloVzhOKKmutxQ6Q==}
+
+  supports-color@2.0.0:
+    resolution: {integrity: sha512-KKNVtd6pCYgPIKU4cp2733HWYCpplQhddZLBUryaAHou723x+FRzQ5Df824Fj+IyyuiQTRoub4SnIFfIcrp70g==}
+    engines: {node: '>=0.8.0'}
+
+  supports-color@3.2.3:
+    resolution: {integrity: sha512-Jds2VIYDrlp5ui7t8abHN2bjAu4LV/q4N2KivFPpGH0lrka0BMq/33AmECUXlKPcHigkNaqfXRENFju+rlcy+A==}
+    engines: {node: '>=0.8.0'}
+
+  supports-color@7.2.0:
+    resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==}
+    engines: {node: '>=8'}
+
+  svg-baker@1.7.0:
+    resolution: {integrity: sha512-nibslMbkXOIkqKVrfcncwha45f97fGuAOn1G99YwnwTj8kF9YiM6XexPcUso97NxOm6GsP0SIvYVIosBis1xLg==}
+
+  svg-pathdata@6.0.3:
+    resolution: {integrity: sha512-qsjeeq5YjBZ5eMdFuUa4ZosMLxgr5RZ+F+Y1OrDhuOCEInRMA3x74XdBtggJcj9kOeInz0WE+LgCPDkZFlBYJw==}
+    engines: {node: '>=12.0.0'}
+
+  svgo@2.8.0:
+    resolution: {integrity: sha512-+N/Q9kV1+F+UeWYoSiULYo4xYSDQlTgb+ayMobAXPwMnLvop7oxKMo9OzIrX5x3eS4L4f2UHhc9axXwY8DpChg==}
+    engines: {node: '>=10.13.0'}
+    hasBin: true
+
+  text-segmentation@1.0.3:
+    resolution: {integrity: sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw==}
+
+  to-object-path@0.3.0:
+    resolution: {integrity: sha512-9mWHdnGRuh3onocaHzukyvCZhzvr6tiflAy/JRFXcJX0TjgfWA9pk9t8CMbzmBE4Jfw58pXbkngtBtqYxzNEyg==}
+    engines: {node: '>=0.10.0'}
+
+  to-regex-range@2.1.1:
+    resolution: {integrity: sha512-ZZWNfCjUokXXDGXFpZehJIkZqq91BcULFq/Pi7M5i4JnxXdhMKAK682z8bCW3o8Hj1wuuzoKcW3DfVzaP6VuNg==}
+    engines: {node: '>=0.10.0'}
+
+  to-regex-range@5.0.1:
+    resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
+    engines: {node: '>=8.0'}
+
+  to-regex@3.0.2:
+    resolution: {integrity: sha512-FWtleNAtZ/Ki2qtqej2CXTOayOH9bHDQF+Q48VpWyDXjbYxA4Yz8iDB31zXOBUlOHHKidDbqGVrTUvQMPmBGBw==}
+    engines: {node: '>=0.10.0'}
+
+  traverse@0.6.11:
+    resolution: {integrity: sha512-vxXDZg8/+p3gblxB6BhhG5yWVn1kGRlaL8O78UDXc3wRnPizB5g83dcvWV1jpDMIPnjZjOFuxlMmE82XJ4407w==}
+    engines: {node: '>= 0.4'}
+
+  tslib@2.3.0:
+    resolution: {integrity: sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==}
+
+  typed-array-buffer@1.0.3:
+    resolution: {integrity: sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==}
+    engines: {node: '>= 0.4'}
+
+  typed-array-byte-length@1.0.3:
+    resolution: {integrity: sha512-BaXgOuIxz8n8pIq3e7Atg/7s+DpiYrxn4vdot3w9KbnBhcRQq6o3xemQdIfynqSeXeDrF32x+WvfzmOjPiY9lg==}
+    engines: {node: '>= 0.4'}
+
+  typed-array-byte-offset@1.0.4:
+    resolution: {integrity: sha512-bTlAFB/FBYMcuX81gbL4OcpH5PmlFHqlCCpAl8AlEzMz5k53oNDvN8p1PNOWLEmI2x4orp3raOFB51tv9X+MFQ==}
+    engines: {node: '>= 0.4'}
+
+  typed-array-length@1.0.7:
+    resolution: {integrity: sha512-3KS2b+kL7fsuk/eJZ7EQdnEmQoaho/r6KUef7hxvltNA5DR8NAUM+8wJMbJyZ4G9/7i3v5zPBIMN5aybAh2/Jg==}
+    engines: {node: '>= 0.4'}
+
+  typedarray.prototype.slice@1.0.5:
+    resolution: {integrity: sha512-q7QNVDGTdl702bVFiI5eY4l/HkgCM6at9KhcFbgUAzezHFbOVy4+0O/lCjsABEQwbZPravVfBIiBVGo89yzHFg==}
+    engines: {node: '>= 0.4'}
+
+  ufo@1.5.4:
+    resolution: {integrity: sha512-UsUk3byDzKd04EyoZ7U4DOlxQaD14JUKQl6/P7wiX4FNvUfm3XL246n9W5AmqwW5RSFJ27NAuM0iLscAOYUiGQ==}
+
+  unbox-primitive@1.1.0:
+    resolution: {integrity: sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw==}
+    engines: {node: '>= 0.4'}
+
+  undici-types@6.20.0:
+    resolution: {integrity: sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==}
+
+  unimport@3.14.6:
+    resolution: {integrity: sha512-CYvbDaTT04Rh8bmD8jz3WPmHYZRG/NnvYVzwD6V1YAlvvKROlAeNDUBhkBGzNav2RKaeuXvlWYaa1V4Lfi/O0g==}
+
+  union-value@1.0.1:
+    resolution: {integrity: sha512-tJfXmxMeWYnczCVs7XAEvIV7ieppALdyepWMkHkwciRpZraG/xwT+s2JN8+pr1+8jCRf80FFzvr+MpQeeoF4Xg==}
+    engines: {node: '>=0.10.0'}
+
+  universalify@2.0.1:
+    resolution: {integrity: sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==}
+    engines: {node: '>= 10.0.0'}
+
+  unplugin-auto-import@0.17.6:
+    resolution: {integrity: sha512-dmX0Pex5DzMzVuALkexboOZvh51fL/BD6aoPO7qHoTYGlQp0GRKsREv2KMF1lzYI9SXKQiRxAjwzbQnrFFNydQ==}
+    engines: {node: '>=14'}
+    peerDependencies:
+      '@nuxt/kit': ^3.2.2
+      '@vueuse/core': '*'
+    peerDependenciesMeta:
+      '@nuxt/kit':
+        optional: true
+      '@vueuse/core':
+        optional: true
+
+  unplugin-vue-setup-extend-plus@1.0.1:
+    resolution: {integrity: sha512-mW2IzkyJITyspAV/LEdnEyE1CJip9jB5fCeaVv7Q6X0oJyDrOxXoB+jyet0q5pRJNjErbjQx950/8NPTvbqLTQ==}
+
+  unplugin@1.16.1:
+    resolution: {integrity: sha512-4/u/j4FrCKdi17jaxuJA0jClGxB1AvU2hw/IuayPc4ay1XGaJs/rbb4v5WKwAjNifjmXK9PIFyuPiaK8azyR9w==}
+    engines: {node: '>=14.0.0'}
+
+  unset-value@1.0.0:
+    resolution: {integrity: sha512-PcA2tsuGSF9cnySLHTLSh2qrQiJ70mn+r+Glzxv2TWZblxsxCC52BDlZoPCsz7STd9pN7EZetkWZBAvk4cgZdQ==}
+    engines: {node: '>=0.10.0'}
+
+  urix@0.1.0:
+    resolution: {integrity: sha512-Am1ousAhSLBeB9cG/7k7r2R0zj50uDRlZHPGbazid5s9rlF1F/QKYObEKSIunSjIOkJZqwRRLpvewjEkM7pSqg==}
+    deprecated: Please see https://github.com/lydell/urix#deprecated
+
+  use@3.1.1:
+    resolution: {integrity: sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==}
+    engines: {node: '>=0.10.0'}
+
+  util-deprecate@1.0.2:
+    resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
+
+  utrie@1.0.2:
+    resolution: {integrity: sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw==}
+
+  vary@1.1.2:
+    resolution: {integrity: sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==}
+    engines: {node: '>= 0.8'}
+
+  vite-plugin-compression@0.5.1:
+    resolution: {integrity: sha512-5QJKBDc+gNYVqL/skgFAP81Yuzo9R+EAf19d+EtsMF/i8kFUpNi3J/H01QD3Oo8zBQn+NzoCIFkpPLynoOzaJg==}
+    peerDependencies:
+      vite: '>=2.0.0'
+
+  vite-plugin-svg-icons@2.0.1:
+    resolution: {integrity: sha512-6ktD+DhV6Rz3VtedYvBKKVA2eXF+sAQVaKkKLDSqGUfnhqXl3bj5PPkVTl3VexfTuZy66PmINi8Q6eFnVfRUmA==}
+    peerDependencies:
+      vite: '>=2.0.0'
+
+  vite@5.3.2:
+    resolution: {integrity: sha512-6lA7OBHBlXUxiJxbO5aAY2fsHHzDr1q7DvXYnyZycRs2Dz+dXBWuhpWHvmljTRTpQC2uvGmUFFkSHF2vGo90MA==}
+    engines: {node: ^18.0.0 || >=20.0.0}
+    hasBin: true
+    peerDependencies:
+      '@types/node': ^18.0.0 || >=20.0.0
+      less: '*'
+      lightningcss: ^1.21.0
+      sass: '*'
+      stylus: '*'
+      sugarss: '*'
+      terser: ^5.4.0
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      less:
+        optional: true
+      lightningcss:
+        optional: true
+      sass:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
+
+  vue-cropper@1.1.1:
+    resolution: {integrity: sha512-WsqKMpaBf9Osi1LQlE/5AKdD0nHWOy1asLXocaG8NomOWO07jiZi968+/PbMmnD0QbPJOumDQaGuGa13qys85A==}
+
+  vue-demi@0.14.10:
+    resolution: {integrity: sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==}
+    engines: {node: '>=12'}
+    hasBin: true
+    peerDependencies:
+      '@vue/composition-api': ^1.0.0-rc.1
+      vue: ^3.0.0-0 || ^2.6.0
+    peerDependenciesMeta:
+      '@vue/composition-api':
+        optional: true
+
+  vue-plugin-hiprint@0.0.58-fix:
+    resolution: {integrity: sha512-D9oU8EEUE8p1cN+Fc7pt4clXijVirgrK9+ghBeMfymwFh524/oxsRH2Z5nNem1ygCSFyDU2pGrgrNuvin654UA==}
+    engines: {node: 16.x}
+
+  vue-router@4.4.0:
+    resolution: {integrity: sha512-HB+t2p611aIZraV2aPSRNXf0Z/oLZFrlygJm+sZbdJaW6lcFqEDQwnzUBXn+DApw+/QzDU/I9TeWx9izEjTmsA==}
+    peerDependencies:
+      vue: ^3.2.0
+
+  vue@3.4.31:
+    resolution: {integrity: sha512-njqRrOy7W3YLAlVqSKpBebtZpDVg21FPoaq1I7f/+qqBThK9ChAIjkRWgeP6Eat+8C+iia4P3OYqpATP21BCoQ==}
+    peerDependencies:
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+
+  webpack-virtual-modules@0.6.2:
+    resolution: {integrity: sha512-66/V2i5hQanC51vBQKPH4aI8NMAcBW59FVBs+rC7eGHupMyfn34q7rZIE+ETlJ+XTevqfUhVVBgSUNSW2flEUQ==}
+
+  which-boxed-primitive@1.1.1:
+    resolution: {integrity: sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==}
+    engines: {node: '>= 0.4'}
+
+  which-builtin-type@1.2.1:
+    resolution: {integrity: sha512-6iBczoX+kDQ7a3+YJBnh3T+KZRxM/iYNPXicqk66/Qfm1b93iu+yOImkg0zHbj5LNOcNv1TEADiZ0xa34B4q6Q==}
+    engines: {node: '>= 0.4'}
+
+  which-collection@1.0.2:
+    resolution: {integrity: sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==}
+    engines: {node: '>= 0.4'}
+
+  which-typed-array@1.1.18:
+    resolution: {integrity: sha512-qEcY+KJYlWyLH9vNbsr6/5j59AXk5ni5aakf8ldzBvGde6Iz4sxZGkJyWSAueTG7QhOvNRYb1lDdFmL5Td0QKA==}
+    engines: {node: '>= 0.4'}
+
+  ws@8.17.1:
+    resolution: {integrity: sha512-6XQFvXTkbfUOZOKKILFG1PDK2NDQs4azKQl26T0YS5CxqWLgXajbPZ+h4gZekJyRqFU8pvnbAbbs/3TgRPy+GQ==}
+    engines: {node: '>=10.0.0'}
+    peerDependencies:
+      bufferutil: ^4.0.1
+      utf-8-validate: '>=5.0.2'
+    peerDependenciesMeta:
+      bufferutil:
+        optional: true
+      utf-8-validate:
+        optional: true
+
+  xmlhttprequest-ssl@2.1.2:
+    resolution: {integrity: sha512-TEU+nJVUUnA4CYJFLvK5X9AOeH4KvDvhIfm0vV1GaQRtchnG0hgK5p8hw/xjv8cunWYCsiPCSDzObPyhEwq3KQ==}
+    engines: {node: '>=0.4.0'}
+
+  zrender@5.6.0:
+    resolution: {integrity: sha512-uzgraf4njmmHAbEUxMJ8Oxg+P3fT04O+9p7gY+wJRVxo8Ge+KmYv0WJev945EH4wFuc4OY2NLXz46FZrWS9xJg==}
+
+snapshots:
+
+  '@antfu/utils@0.7.10': {}
+
+  '@babel/helper-string-parser@7.25.9': {}
+
+  '@babel/helper-validator-identifier@7.25.9': {}
+
+  '@babel/parser@7.26.9':
+    dependencies:
+      '@babel/types': 7.26.9
+
+  '@babel/runtime@7.26.9':
+    dependencies:
+      regenerator-runtime: 0.14.1
+
+  '@babel/types@7.26.9':
+    dependencies:
+      '@babel/helper-string-parser': 7.25.9
+      '@babel/helper-validator-identifier': 7.25.9
+
+  '@claviska/jquery-minicolors@2.3.6(jquery@3.7.1)':
+    dependencies:
+      jquery: 3.7.1
+
+  '@ctrl/tinycolor@3.6.1': {}
+
+  '@element-plus/icons-vue@2.3.1(vue@3.4.31)':
+    dependencies:
+      vue: 3.4.31
+
+  '@esbuild/aix-ppc64@0.21.5':
+    optional: true
+
+  '@esbuild/android-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/android-arm@0.21.5':
+    optional: true
+
+  '@esbuild/android-x64@0.21.5':
+    optional: true
+
+  '@esbuild/darwin-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/darwin-x64@0.21.5':
+    optional: true
+
+  '@esbuild/freebsd-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-arm@0.21.5':
+    optional: true
+
+  '@esbuild/linux-ia32@0.21.5':
+    optional: true
+
+  '@esbuild/linux-loong64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.21.5':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-s390x@0.21.5':
+    optional: true
+
+  '@esbuild/linux-x64@0.21.5':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.21.5':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.21.5':
+    optional: true
+
+  '@esbuild/sunos-x64@0.21.5':
+    optional: true
+
+  '@esbuild/win32-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/win32-ia32@0.21.5':
+    optional: true
+
+  '@esbuild/win32-x64@0.21.5':
+    optional: true
+
+  '@floating-ui/core@1.6.9':
+    dependencies:
+      '@floating-ui/utils': 0.2.9
+
+  '@floating-ui/dom@1.6.13':
+    dependencies:
+      '@floating-ui/core': 1.6.9
+      '@floating-ui/utils': 0.2.9
+
+  '@floating-ui/utils@0.2.9': {}
+
+  '@jridgewell/sourcemap-codec@1.5.0': {}
+
+  '@nodelib/fs.scandir@2.1.5':
+    dependencies:
+      '@nodelib/fs.stat': 2.0.5
+      run-parallel: 1.2.0
+
+  '@nodelib/fs.stat@2.0.5': {}
+
+  '@nodelib/fs.walk@1.2.8':
+    dependencies:
+      '@nodelib/fs.scandir': 2.1.5
+      fastq: 1.19.1
+
+  '@rollup/pluginutils@5.1.4(rollup@4.34.9)':
+    dependencies:
+      '@types/estree': 1.0.6
+      estree-walker: 2.0.2
+      picomatch: 4.0.2
+    optionalDependencies:
+      rollup: 4.34.9
+
+  '@rollup/rollup-android-arm-eabi@4.34.9':
+    optional: true
+
+  '@rollup/rollup-android-arm64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-darwin-arm64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-darwin-x64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-freebsd-arm64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-freebsd-x64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-arm-musleabihf@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-musl@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-loongarch64-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-powerpc64le-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-riscv64-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-s390x-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-x64-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-x64-musl@4.34.9':
+    optional: true
+
+  '@rollup/rollup-win32-arm64-msvc@4.34.9':
+    optional: true
+
+  '@rollup/rollup-win32-ia32-msvc@4.34.9':
+    optional: true
+
+  '@rollup/rollup-win32-x64-msvc@4.34.9':
+    optional: true
+
+  '@socket.io/component-emitter@3.1.2': {}
+
+  '@sxzz/popperjs-es@2.11.7': {}
+
+  '@trysound/sax@0.2.0': {}
+
+  '@types/estree@1.0.6': {}
+
+  '@types/lodash-es@4.17.12':
+    dependencies:
+      '@types/lodash': 4.17.16
+
+  '@types/lodash@4.17.16': {}
+
+  '@types/node@22.13.9':
+    dependencies:
+      undici-types: 6.20.0
+
+  '@types/raf@3.4.3': {}
+
+  '@types/svgo@2.6.4':
+    dependencies:
+      '@types/node': 22.13.9
+
+  '@types/web-bluetooth@0.0.16': {}
+
+  '@types/web-bluetooth@0.0.20': {}
+
+  '@vitejs/plugin-vue@5.0.5(vite@5.3.2(@types/node@22.13.9)(sass@1.77.5))(vue@3.4.31)':
+    dependencies:
+      vite: 5.3.2(@types/node@22.13.9)(sass@1.77.5)
+      vue: 3.4.31
+
+  '@vue/compiler-core@3.4.31':
+    dependencies:
+      '@babel/parser': 7.26.9
+      '@vue/shared': 3.4.31
+      entities: 4.5.0
+      estree-walker: 2.0.2
+      source-map-js: 1.2.1
+
+  '@vue/compiler-core@3.5.13':
+    dependencies:
+      '@babel/parser': 7.26.9
+      '@vue/shared': 3.5.13
+      entities: 4.5.0
+      estree-walker: 2.0.2
+      source-map-js: 1.2.1
+
+  '@vue/compiler-dom@3.4.31':
+    dependencies:
+      '@vue/compiler-core': 3.4.31
+      '@vue/shared': 3.4.31
+
+  '@vue/compiler-dom@3.5.13':
+    dependencies:
+      '@vue/compiler-core': 3.5.13
+      '@vue/shared': 3.5.13
+
+  '@vue/compiler-sfc@3.4.31':
+    dependencies:
+      '@babel/parser': 7.26.9
+      '@vue/compiler-core': 3.4.31
+      '@vue/compiler-dom': 3.4.31
+      '@vue/compiler-ssr': 3.4.31
+      '@vue/shared': 3.4.31
+      estree-walker: 2.0.2
+      magic-string: 0.30.17
+      postcss: 8.5.3
+      source-map-js: 1.2.1
+
+  '@vue/compiler-sfc@3.5.13':
+    dependencies:
+      '@babel/parser': 7.26.9
+      '@vue/compiler-core': 3.5.13
+      '@vue/compiler-dom': 3.5.13
+      '@vue/compiler-ssr': 3.5.13
+      '@vue/shared': 3.5.13
+      estree-walker: 2.0.2
+      magic-string: 0.30.17
+      postcss: 8.5.3
+      source-map-js: 1.2.1
+
+  '@vue/compiler-ssr@3.4.31':
+    dependencies:
+      '@vue/compiler-dom': 3.4.31
+      '@vue/shared': 3.4.31
+
+  '@vue/compiler-ssr@3.5.13':
+    dependencies:
+      '@vue/compiler-dom': 3.5.13
+      '@vue/shared': 3.5.13
+
+  '@vue/devtools-api@6.6.4': {}
+
+  '@vue/reactivity@3.4.31':
+    dependencies:
+      '@vue/shared': 3.4.31
+
+  '@vue/runtime-core@3.4.31':
+    dependencies:
+      '@vue/reactivity': 3.4.31
+      '@vue/shared': 3.4.31
+
+  '@vue/runtime-dom@3.4.31':
+    dependencies:
+      '@vue/reactivity': 3.4.31
+      '@vue/runtime-core': 3.4.31
+      '@vue/shared': 3.4.31
+      csstype: 3.1.3
+
+  '@vue/server-renderer@3.4.31(vue@3.4.31)':
+    dependencies:
+      '@vue/compiler-ssr': 3.4.31
+      '@vue/shared': 3.4.31
+      vue: 3.4.31
+
+  '@vue/shared@3.4.31': {}
+
+  '@vue/shared@3.5.13': {}
+
+  '@vueup/vue-quill@1.2.0(vue@3.4.31)':
+    dependencies:
+      quill: 1.3.7
+      quill-delta: 4.2.2
+      vue: 3.4.31
+
+  '@vueuse/core@10.11.0(vue@3.4.31)':
+    dependencies:
+      '@types/web-bluetooth': 0.0.20
+      '@vueuse/metadata': 10.11.0
+      '@vueuse/shared': 10.11.0(vue@3.4.31)
+      vue-demi: 0.14.10(vue@3.4.31)
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
+
+  '@vueuse/core@9.13.0(vue@3.4.31)':
+    dependencies:
+      '@types/web-bluetooth': 0.0.16
+      '@vueuse/metadata': 9.13.0
+      '@vueuse/shared': 9.13.0(vue@3.4.31)
+      vue-demi: 0.14.10(vue@3.4.31)
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
+
+  '@vueuse/metadata@10.11.0': {}
+
+  '@vueuse/metadata@9.13.0': {}
+
+  '@vueuse/shared@10.11.0(vue@3.4.31)':
+    dependencies:
+      vue-demi: 0.14.10(vue@3.4.31)
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
+
+  '@vueuse/shared@9.13.0(vue@3.4.31)':
+    dependencies:
+      vue-demi: 0.14.10(vue@3.4.31)
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
+
+  '@wtto00/html2canvas@1.4.3':
+    dependencies:
+      css-line-break: 2.1.0
+      text-segmentation: 1.0.3
+
+  acorn@8.14.1: {}
+
+  ansi-regex@2.1.1: {}
+
+  ansi-styles@2.2.1: {}
+
+  ansi-styles@4.3.0:
+    dependencies:
+      color-convert: 2.0.1
+
+  anymatch@3.1.3:
+    dependencies:
+      normalize-path: 3.0.0
+      picomatch: 2.3.1
+
+  arr-diff@4.0.0: {}
+
+  arr-flatten@1.1.0: {}
+
+  arr-union@3.1.0: {}
+
+  array-buffer-byte-length@1.0.2:
+    dependencies:
+      call-bound: 1.0.4
+      is-array-buffer: 3.0.5
+
+  array-unique@0.3.2: {}
+
+  arraybuffer.prototype.slice@1.0.4:
+    dependencies:
+      array-buffer-byte-length: 1.0.2
+      call-bind: 1.0.8
+      define-properties: 1.2.1
+      es-abstract: 1.23.9
+      es-errors: 1.3.0
+      get-intrinsic: 1.3.0
+      is-array-buffer: 3.0.5
+
+  assign-symbols@1.0.0: {}
+
+  async-function@1.0.0: {}
+
+  async-validator@4.2.5: {}
+
+  asynckit@0.4.0: {}
+
+  atob@2.1.2: {}
+
+  available-typed-arrays@1.0.7:
+    dependencies:
+      possible-typed-array-names: 1.1.0
+
+  axios@0.28.1:
+    dependencies:
+      follow-redirects: 1.15.9
+      form-data: 4.0.2
+      proxy-from-env: 1.1.0
+    transitivePeerDependencies:
+      - debug
+
+  balanced-match@1.0.2: {}
+
+  base64-arraybuffer@1.0.2: {}
+
+  base@0.11.2:
+    dependencies:
+      cache-base: 1.0.1
+      class-utils: 0.3.6
+      component-emitter: 1.3.1
+      define-property: 1.0.0
+      isobject: 3.0.1
+      mixin-deep: 1.3.2
+      pascalcase: 0.1.1
+
+  big.js@5.2.2: {}
+
+  binary-extensions@2.3.0: {}
+
+  bluebird@3.7.2: {}
+
+  boolbase@1.0.0: {}
+
+  brace-expansion@2.0.1:
+    dependencies:
+      balanced-match: 1.0.2
+
+  braces@2.3.2:
+    dependencies:
+      arr-flatten: 1.1.0
+      array-unique: 0.3.2
+      extend-shallow: 2.0.1
+      fill-range: 4.0.0
+      isobject: 3.0.1
+      repeat-element: 1.1.4
+      snapdragon: 0.8.2
+      snapdragon-node: 2.1.1
+      split-string: 3.1.0
+      to-regex: 3.0.2
+    transitivePeerDependencies:
+      - supports-color
+
+  braces@3.0.3:
+    dependencies:
+      fill-range: 7.1.1
+
+  btoa@1.2.1: {}
+
+  bwip-js@4.5.1: {}
+
+  cache-base@1.0.1:
+    dependencies:
+      collection-visit: 1.0.0
+      component-emitter: 1.3.1
+      get-value: 2.0.6
+      has-value: 1.0.0
+      isobject: 3.0.1
+      set-value: 2.0.1
+      to-object-path: 0.3.0
+      union-value: 1.0.1
+      unset-value: 1.0.0
+
+  call-bind-apply-helpers@1.0.2:
+    dependencies:
+      es-errors: 1.3.0
+      function-bind: 1.1.2
+
+  call-bind@1.0.8:
+    dependencies:
+      call-bind-apply-helpers: 1.0.2
+      es-define-property: 1.0.1
+      get-intrinsic: 1.3.0
+      set-function-length: 1.2.2
+
+  call-bound@1.0.4:
+    dependencies:
+      call-bind-apply-helpers: 1.0.2
+      get-intrinsic: 1.3.0
+
+  canvg@3.0.10:
+    dependencies:
+      '@babel/runtime': 7.26.9
+      '@types/raf': 3.4.3
+      core-js: 3.41.0
+      raf: 3.4.1
+      regenerator-runtime: 0.13.11
+      rgbcolor: 1.0.1
+      stackblur-canvas: 2.7.0
+      svg-pathdata: 6.0.3
+
+  chalk@1.1.3:
+    dependencies:
+      ansi-styles: 2.2.1
+      escape-string-regexp: 1.0.5
+      has-ansi: 2.0.0
+      strip-ansi: 3.0.1
+      supports-color: 2.0.0
+
+  chalk@4.1.2:
+    dependencies:
+      ansi-styles: 4.3.0
+      supports-color: 7.2.0
+
+  china-division@2.7.0: {}
+
+  chokidar@3.6.0:
+    dependencies:
+      anymatch: 3.1.3
+      braces: 3.0.3
+      glob-parent: 5.1.2
+      is-binary-path: 2.1.0
+      is-glob: 4.0.3
+      normalize-path: 3.0.0
+      readdirp: 3.6.0
+    optionalDependencies:
+      fsevents: 2.3.3
+
+  class-utils@0.3.6:
+    dependencies:
+      arr-union: 3.1.0
+      define-property: 0.2.5
+      isobject: 3.0.1
+      static-extend: 0.1.2
+
+  clone@2.1.2: {}
+
+  collection-visit@1.0.0:
+    dependencies:
+      map-visit: 1.0.0
+      object-visit: 1.0.1
+
+  color-convert@2.0.1:
+    dependencies:
+      color-name: 1.1.4
+
+  color-name@1.1.4: {}
+
+  combined-stream@1.0.8:
+    dependencies:
+      delayed-stream: 1.0.0
+
+  commander@7.2.0: {}
+
+  component-emitter@1.3.1: {}
+
+  confbox@0.1.8: {}
+
+  confbox@0.2.1: {}
+
+  copy-descriptor@0.1.1: {}
+
+  core-js@3.41.0: {}
+
+  cors@2.8.5:
+    dependencies:
+      object-assign: 4.1.1
+      vary: 1.1.2
+
+  css-line-break@2.1.0:
+    dependencies:
+      utrie: 1.0.2
+
+  css-select@4.3.0:
+    dependencies:
+      boolbase: 1.0.0
+      css-what: 6.1.0
+      domhandler: 4.3.1
+      domutils: 2.8.0
+      nth-check: 2.1.1
+
+  css-tree@1.1.3:
+    dependencies:
+      mdn-data: 2.0.14
+      source-map: 0.6.1
+
+  css-what@6.1.0: {}
+
+  csso@4.2.0:
+    dependencies:
+      css-tree: 1.1.3
+
+  csstype@3.1.3: {}
+
+  data-view-buffer@1.0.2:
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      is-data-view: 1.0.2
+
+  data-view-byte-length@1.0.2:
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      is-data-view: 1.0.2
+
+  data-view-byte-offset@1.0.1:
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      is-data-view: 1.0.2
+
+  dayjs@1.11.13: {}
+
+  debug@2.6.9:
+    dependencies:
+      ms: 2.0.0
+
+  debug@4.3.7:
+    dependencies:
+      ms: 2.1.3
+
+  debug@4.4.0:
+    dependencies:
+      ms: 2.1.3
+
+  decode-uri-component@0.2.2: {}
+
+  deep-equal@1.1.2:
+    dependencies:
+      is-arguments: 1.2.0
+      is-date-object: 1.1.0
+      is-regex: 1.2.1
+      object-is: 1.1.6
+      object-keys: 1.1.1
+      regexp.prototype.flags: 1.5.4
+
+  define-data-property@1.1.4:
+    dependencies:
+      es-define-property: 1.0.1
+      es-errors: 1.3.0
+      gopd: 1.2.0
+
+  define-properties@1.2.1:
+    dependencies:
+      define-data-property: 1.1.4
+      has-property-descriptors: 1.0.2
+      object-keys: 1.1.1
+
+  define-property@0.2.5:
+    dependencies:
+      is-descriptor: 0.1.7
+
+  define-property@1.0.0:
+    dependencies:
+      is-descriptor: 1.0.3
+
+  define-property@2.0.2:
+    dependencies:
+      is-descriptor: 1.0.3
+      isobject: 3.0.1
+
+  delayed-stream@1.0.0: {}
+
+  dom-serializer@0.2.2:
+    dependencies:
+      domelementtype: 2.3.0
+      entities: 2.2.0
+
+  dom-serializer@1.4.1:
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 4.3.1
+      entities: 2.2.0
+
+  domelementtype@1.3.1: {}
+
+  domelementtype@2.3.0: {}
+
+  domhandler@2.4.2:
+    dependencies:
+      domelementtype: 1.3.1
+
+  domhandler@4.3.1:
+    dependencies:
+      domelementtype: 2.3.0
+
+  dompurify@2.5.8:
+    optional: true
+
+  domutils@1.7.0:
+    dependencies:
+      dom-serializer: 0.2.2
+      domelementtype: 1.3.1
+
+  domutils@2.8.0:
+    dependencies:
+      dom-serializer: 1.4.1
+      domelementtype: 2.3.0
+      domhandler: 4.3.1
+
+  dunder-proto@1.0.1:
+    dependencies:
+      call-bind-apply-helpers: 1.0.2
+      es-errors: 1.3.0
+      gopd: 1.2.0
+
+  echarts@5.5.1:
+    dependencies:
+      tslib: 2.3.0
+      zrender: 5.6.0
+
+  element-china-area-data@6.1.0:
+    dependencies:
+      china-division: 2.7.0
+
+  element-plus@2.9.5(vue@3.4.31):
+    dependencies:
+      '@ctrl/tinycolor': 3.6.1
+      '@element-plus/icons-vue': 2.3.1(vue@3.4.31)
+      '@floating-ui/dom': 1.6.13
+      '@popperjs/core': '@sxzz/popperjs-es@2.11.7'
+      '@types/lodash': 4.17.16
+      '@types/lodash-es': 4.17.12
+      '@vueuse/core': 9.13.0(vue@3.4.31)
+      async-validator: 4.2.5
+      dayjs: 1.11.13
+      escape-html: 1.0.3
+      lodash: 4.17.21
+      lodash-es: 4.17.21
+      lodash-unified: 1.0.3(@types/lodash-es@4.17.12)(lodash-es@4.17.21)(lodash@4.17.21)
+      memoize-one: 6.0.0
+      normalize-wheel-es: 1.2.0
+      vue: 3.4.31
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+
+  emojis-list@3.0.0: {}
+
+  engine.io-client@6.6.3:
+    dependencies:
+      '@socket.io/component-emitter': 3.1.2
+      debug: 4.3.7
+      engine.io-parser: 5.2.3
+      ws: 8.17.1
+      xmlhttprequest-ssl: 2.1.2
+    transitivePeerDependencies:
+      - bufferutil
+      - supports-color
+      - utf-8-validate
+
+  engine.io-parser@5.2.3: {}
+
+  entities@1.1.2: {}
+
+  entities@2.2.0: {}
+
+  entities@4.5.0: {}
+
+  es-abstract@1.23.9:
+    dependencies:
+      array-buffer-byte-length: 1.0.2
+      arraybuffer.prototype.slice: 1.0.4
+      available-typed-arrays: 1.0.7
+      call-bind: 1.0.8
+      call-bound: 1.0.4
+      data-view-buffer: 1.0.2
+      data-view-byte-length: 1.0.2
+      data-view-byte-offset: 1.0.1
+      es-define-property: 1.0.1
+      es-errors: 1.3.0
+      es-object-atoms: 1.1.1
+      es-set-tostringtag: 2.1.0
+      es-to-primitive: 1.3.0
+      function.prototype.name: 1.1.8
+      get-intrinsic: 1.3.0
+      get-proto: 1.0.1
+      get-symbol-description: 1.1.0
+      globalthis: 1.0.4
+      gopd: 1.2.0
+      has-property-descriptors: 1.0.2
+      has-proto: 1.2.0
+      has-symbols: 1.1.0
+      hasown: 2.0.2
+      internal-slot: 1.1.0
+      is-array-buffer: 3.0.5
+      is-callable: 1.2.7
+      is-data-view: 1.0.2
+      is-regex: 1.2.1
+      is-shared-array-buffer: 1.0.4
+      is-string: 1.1.1
+      is-typed-array: 1.1.15
+      is-weakref: 1.1.1
+      math-intrinsics: 1.1.0
+      object-inspect: 1.13.4
+      object-keys: 1.1.1
+      object.assign: 4.1.7
+      own-keys: 1.0.1
+      regexp.prototype.flags: 1.5.4
+      safe-array-concat: 1.1.3
+      safe-push-apply: 1.0.0
+      safe-regex-test: 1.1.0
+      set-proto: 1.0.0
+      string.prototype.trim: 1.2.10
+      string.prototype.trimend: 1.0.9
+      string.prototype.trimstart: 1.0.8
+      typed-array-buffer: 1.0.3
+      typed-array-byte-length: 1.0.3
+      typed-array-byte-offset: 1.0.4
+      typed-array-length: 1.0.7
+      unbox-primitive: 1.1.0
+      which-typed-array: 1.1.18
+
+  es-define-property@1.0.1: {}
+
+  es-errors@1.3.0: {}
+
+  es-object-atoms@1.1.1:
+    dependencies:
+      es-errors: 1.3.0
+
+  es-set-tostringtag@2.1.0:
+    dependencies:
+      es-errors: 1.3.0
+      get-intrinsic: 1.3.0
+      has-tostringtag: 1.0.2
+      hasown: 2.0.2
+
+  es-to-primitive@1.3.0:
+    dependencies:
+      is-callable: 1.2.7
+      is-date-object: 1.1.0
+      is-symbol: 1.1.1
+
+  esbuild@0.21.5:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.21.5
+      '@esbuild/android-arm': 0.21.5
+      '@esbuild/android-arm64': 0.21.5
+      '@esbuild/android-x64': 0.21.5
+      '@esbuild/darwin-arm64': 0.21.5
+      '@esbuild/darwin-x64': 0.21.5
+      '@esbuild/freebsd-arm64': 0.21.5
+      '@esbuild/freebsd-x64': 0.21.5
+      '@esbuild/linux-arm': 0.21.5
+      '@esbuild/linux-arm64': 0.21.5
+      '@esbuild/linux-ia32': 0.21.5
+      '@esbuild/linux-loong64': 0.21.5
+      '@esbuild/linux-mips64el': 0.21.5
+      '@esbuild/linux-ppc64': 0.21.5
+      '@esbuild/linux-riscv64': 0.21.5
+      '@esbuild/linux-s390x': 0.21.5
+      '@esbuild/linux-x64': 0.21.5
+      '@esbuild/netbsd-x64': 0.21.5
+      '@esbuild/openbsd-x64': 0.21.5
+      '@esbuild/sunos-x64': 0.21.5
+      '@esbuild/win32-arm64': 0.21.5
+      '@esbuild/win32-ia32': 0.21.5
+      '@esbuild/win32-x64': 0.21.5
+
+  escape-html@1.0.3: {}
+
+  escape-string-regexp@1.0.5: {}
+
+  escape-string-regexp@5.0.0: {}
+
+  estree-walker@2.0.2: {}
+
+  estree-walker@3.0.3:
+    dependencies:
+      '@types/estree': 1.0.6
+
+  etag@1.8.1: {}
+
+  eventemitter3@2.0.3: {}
+
+  expand-brackets@2.1.4:
+    dependencies:
+      debug: 2.6.9
+      define-property: 0.2.5
+      extend-shallow: 2.0.1
+      posix-character-classes: 0.1.1
+      regex-not: 1.0.2
+      snapdragon: 0.8.2
+      to-regex: 3.0.2
+    transitivePeerDependencies:
+      - supports-color
+
+  exsolve@1.0.2: {}
+
+  extend-shallow@2.0.1:
+    dependencies:
+      is-extendable: 0.1.1
+
+  extend-shallow@3.0.2:
+    dependencies:
+      assign-symbols: 1.0.0
+      is-extendable: 1.0.1
+
+  extend@3.0.2: {}
+
+  extglob@2.0.4:
+    dependencies:
+      array-unique: 0.3.2
+      define-property: 1.0.0
+      expand-brackets: 2.1.4
+      extend-shallow: 2.0.1
+      fragment-cache: 0.2.1
+      regex-not: 1.0.2
+      snapdragon: 0.8.2
+      to-regex: 3.0.2
+    transitivePeerDependencies:
+      - supports-color
+
+  fast-diff@1.1.2: {}
+
+  fast-diff@1.2.0: {}
+
+  fast-glob@3.3.3:
+    dependencies:
+      '@nodelib/fs.stat': 2.0.5
+      '@nodelib/fs.walk': 1.2.8
+      glob-parent: 5.1.2
+      merge2: 1.4.1
+      micromatch: 4.0.8
+
+  fastq@1.19.1:
+    dependencies:
+      reusify: 1.1.0
+
+  fflate@0.8.2: {}
+
+  file-saver@2.0.5: {}
+
+  fill-range@4.0.0:
+    dependencies:
+      extend-shallow: 2.0.1
+      is-number: 3.0.0
+      repeat-string: 1.6.1
+      to-regex-range: 2.1.1
+
+  fill-range@7.1.1:
+    dependencies:
+      to-regex-range: 5.0.1
+
+  follow-redirects@1.15.9: {}
+
+  for-each@0.3.5:
+    dependencies:
+      is-callable: 1.2.7
+
+  for-in@1.0.2: {}
+
+  form-data@4.0.2:
+    dependencies:
+      asynckit: 0.4.0
+      combined-stream: 1.0.8
+      es-set-tostringtag: 2.1.0
+      mime-types: 2.1.35
+
+  fragment-cache@0.2.1:
+    dependencies:
+      map-cache: 0.2.2
+
+  fs-extra@10.1.0:
+    dependencies:
+      graceful-fs: 4.2.11
+      jsonfile: 6.1.0
+      universalify: 2.0.1
+
+  fsevents@2.3.3:
+    optional: true
+
+  function-bind@1.1.2: {}
+
+  function.prototype.name@1.1.8:
+    dependencies:
+      call-bind: 1.0.8
+      call-bound: 1.0.4
+      define-properties: 1.2.1
+      functions-have-names: 1.2.3
+      hasown: 2.0.2
+      is-callable: 1.2.7
+
+  functions-have-names@1.2.3: {}
+
+  fuse.js@6.6.2: {}
+
+  get-intrinsic@1.3.0:
+    dependencies:
+      call-bind-apply-helpers: 1.0.2
+      es-define-property: 1.0.1
+      es-errors: 1.3.0
+      es-object-atoms: 1.1.1
+      function-bind: 1.1.2
+      get-proto: 1.0.1
+      gopd: 1.2.0
+      has-symbols: 1.1.0
+      hasown: 2.0.2
+      math-intrinsics: 1.1.0
+
+  get-proto@1.0.1:
+    dependencies:
+      dunder-proto: 1.0.1
+      es-object-atoms: 1.1.1
+
+  get-symbol-description@1.1.0:
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      get-intrinsic: 1.3.0
+
+  get-value@2.0.6: {}
+
+  glob-parent@5.1.2:
+    dependencies:
+      is-glob: 4.0.3
+
+  globalthis@1.0.4:
+    dependencies:
+      define-properties: 1.2.1
+      gopd: 1.2.0
+
+  gopd@1.2.0: {}
+
+  graceful-fs@4.2.11: {}
+
+  has-ansi@2.0.0:
+    dependencies:
+      ansi-regex: 2.1.1
+
+  has-bigints@1.1.0: {}
+
+  has-flag@1.0.0: {}
+
+  has-flag@4.0.0: {}
+
+  has-property-descriptors@1.0.2:
+    dependencies:
+      es-define-property: 1.0.1
+
+  has-proto@1.2.0:
+    dependencies:
+      dunder-proto: 1.0.1
+
+  has-symbols@1.1.0: {}
+
+  has-tostringtag@1.0.2:
+    dependencies:
+      has-symbols: 1.1.0
+
+  has-value@0.3.1:
+    dependencies:
+      get-value: 2.0.6
+      has-values: 0.1.4
+      isobject: 2.1.0
+
+  has-value@1.0.0:
+    dependencies:
+      get-value: 2.0.6
+      has-values: 1.0.0
+      isobject: 3.0.1
+
+  has-values@0.1.4: {}
+
+  has-values@1.0.0:
+    dependencies:
+      is-number: 3.0.0
+      kind-of: 4.0.0
+
+  hasown@2.0.2:
+    dependencies:
+      function-bind: 1.1.2
+
+  he@1.2.0: {}
+
+  html2canvas@1.4.1:
+    dependencies:
+      css-line-break: 2.1.0
+      text-segmentation: 1.0.3
+    optional: true
+
+  htmlparser2@3.10.1:
+    dependencies:
+      domelementtype: 1.3.1
+      domhandler: 2.4.2
+      domutils: 1.7.0
+      entities: 1.1.2
+      inherits: 2.0.4
+      readable-stream: 3.6.2
+
+  image-size@0.5.5: {}
+
+  immutable@4.3.7: {}
+
+  inherits@2.0.4: {}
+
+  internal-slot@1.1.0:
+    dependencies:
+      es-errors: 1.3.0
+      hasown: 2.0.2
+      side-channel: 1.1.0
+
+  is-accessor-descriptor@1.0.1:
+    dependencies:
+      hasown: 2.0.2
+
+  is-arguments@1.2.0:
+    dependencies:
+      call-bound: 1.0.4
+      has-tostringtag: 1.0.2
+
+  is-array-buffer@3.0.5:
+    dependencies:
+      call-bind: 1.0.8
+      call-bound: 1.0.4
+      get-intrinsic: 1.3.0
+
+  is-async-function@2.1.1:
+    dependencies:
+      async-function: 1.0.0
+      call-bound: 1.0.4
+      get-proto: 1.0.1
+      has-tostringtag: 1.0.2
+      safe-regex-test: 1.1.0
+
+  is-bigint@1.1.0:
+    dependencies:
+      has-bigints: 1.1.0
+
+  is-binary-path@2.1.0:
+    dependencies:
+      binary-extensions: 2.3.0
+
+  is-boolean-object@1.2.2:
+    dependencies:
+      call-bound: 1.0.4
+      has-tostringtag: 1.0.2
+
+  is-buffer@1.1.6: {}
+
+  is-callable@1.2.7: {}
+
+  is-data-descriptor@1.0.1:
+    dependencies:
+      hasown: 2.0.2
+
+  is-data-view@1.0.2:
+    dependencies:
+      call-bound: 1.0.4
+      get-intrinsic: 1.3.0
+      is-typed-array: 1.1.15
+
+  is-date-object@1.1.0:
+    dependencies:
+      call-bound: 1.0.4
+      has-tostringtag: 1.0.2
+
+  is-descriptor@0.1.7:
+    dependencies:
+      is-accessor-descriptor: 1.0.1
+      is-data-descriptor: 1.0.1
+
+  is-descriptor@1.0.3:
+    dependencies:
+      is-accessor-descriptor: 1.0.1
+      is-data-descriptor: 1.0.1
+
+  is-extendable@0.1.1: {}
+
+  is-extendable@1.0.1:
+    dependencies:
+      is-plain-object: 2.0.4
+
+  is-extglob@2.1.1: {}
+
+  is-finalizationregistry@1.1.1:
+    dependencies:
+      call-bound: 1.0.4
+
+  is-generator-function@1.1.0:
+    dependencies:
+      call-bound: 1.0.4
+      get-proto: 1.0.1
+      has-tostringtag: 1.0.2
+      safe-regex-test: 1.1.0
+
+  is-glob@4.0.3:
+    dependencies:
+      is-extglob: 2.1.1
+
+  is-map@2.0.3: {}
+
+  is-number-object@1.1.1:
+    dependencies:
+      call-bound: 1.0.4
+      has-tostringtag: 1.0.2
+
+  is-number@3.0.0:
+    dependencies:
+      kind-of: 3.2.2
+
+  is-number@7.0.0: {}
+
+  is-plain-obj@1.1.0: {}
+
+  is-plain-object@2.0.4:
+    dependencies:
+      isobject: 3.0.1
+
+  is-regex@1.2.1:
+    dependencies:
+      call-bound: 1.0.4
+      gopd: 1.2.0
+      has-tostringtag: 1.0.2
+      hasown: 2.0.2
+
+  is-set@2.0.3: {}
+
+  is-shared-array-buffer@1.0.4:
+    dependencies:
+      call-bound: 1.0.4
+
+  is-string@1.1.1:
+    dependencies:
+      call-bound: 1.0.4
+      has-tostringtag: 1.0.2
+
+  is-symbol@1.1.1:
+    dependencies:
+      call-bound: 1.0.4
+      has-symbols: 1.1.0
+      safe-regex-test: 1.1.0
+
+  is-typed-array@1.1.15:
+    dependencies:
+      which-typed-array: 1.1.18
+
+  is-weakmap@2.0.2: {}
+
+  is-weakref@1.1.1:
+    dependencies:
+      call-bound: 1.0.4
+
+  is-weakset@2.0.4:
+    dependencies:
+      call-bound: 1.0.4
+      get-intrinsic: 1.3.0
+
+  is-windows@1.0.2: {}
+
+  isarray@1.0.0: {}
+
+  isarray@2.0.5: {}
+
+  isobject@2.1.0:
+    dependencies:
+      isarray: 1.0.0
+
+  isobject@3.0.1: {}
+
+  jquery@3.7.1: {}
+
+  js-base64@2.6.4: {}
+
+  js-cookie@3.0.5: {}
+
+  js-tokens@9.0.1: {}
+
+  jsbarcode@3.11.6: {}
+
+  jsencrypt@3.3.2: {}
+
+  json5@1.0.2:
+    dependencies:
+      minimist: 1.2.8
+
+  jsonfile@6.1.0:
+    dependencies:
+      universalify: 2.0.1
+    optionalDependencies:
+      graceful-fs: 4.2.11
+
+  jspdf@2.5.2:
+    dependencies:
+      '@babel/runtime': 7.26.9
+      atob: 2.1.2
+      btoa: 1.2.1
+      fflate: 0.8.2
+    optionalDependencies:
+      canvg: 3.0.10
+      core-js: 3.41.0
+      dompurify: 2.5.8
+      html2canvas: 1.4.1
+
+  kind-of@3.2.2:
+    dependencies:
+      is-buffer: 1.1.6
+
+  kind-of@4.0.0:
+    dependencies:
+      is-buffer: 1.1.6
+
+  kind-of@5.1.0: {}
+
+  kind-of@6.0.3: {}
+
+  loader-utils@1.4.2:
+    dependencies:
+      big.js: 5.2.2
+      emojis-list: 3.0.0
+      json5: 1.0.2
+
+  local-pkg@0.5.1:
+    dependencies:
+      mlly: 1.7.4
+      pkg-types: 1.3.1
+
+  local-pkg@1.1.1:
+    dependencies:
+      mlly: 1.7.4
+      pkg-types: 2.1.0
+      quansync: 0.2.8
+
+  lodash-es@4.17.21: {}
+
+  lodash-unified@1.0.3(@types/lodash-es@4.17.12)(lodash-es@4.17.21)(lodash@4.17.21):
+    dependencies:
+      '@types/lodash-es': 4.17.12
+      lodash: 4.17.21
+      lodash-es: 4.17.21
+
+  lodash.clonedeep@4.5.0: {}
+
+  lodash.isequal@4.5.0: {}
+
+  lodash@4.17.21: {}
+
+  magic-string@0.26.7:
+    dependencies:
+      sourcemap-codec: 1.4.8
+
+  magic-string@0.30.17:
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.0
+
+  map-cache@0.2.2: {}
+
+  map-visit@1.0.0:
+    dependencies:
+      object-visit: 1.0.1
+
+  math-intrinsics@1.1.0: {}
+
+  mdn-data@2.0.14: {}
+
+  memoize-one@6.0.0: {}
+
+  merge-options@1.0.1:
+    dependencies:
+      is-plain-obj: 1.1.0
+
+  merge2@1.4.1: {}
+
+  micromatch@3.1.0:
+    dependencies:
+      arr-diff: 4.0.0
+      array-unique: 0.3.2
+      braces: 2.3.2
+      define-property: 1.0.0
+      extend-shallow: 2.0.1
+      extglob: 2.0.4
+      fragment-cache: 0.2.1
+      kind-of: 5.1.0
+      nanomatch: 1.2.13
+      object.pick: 1.3.0
+      regex-not: 1.0.2
+      snapdragon: 0.8.2
+      to-regex: 3.0.2
+    transitivePeerDependencies:
+      - supports-color
+
+  micromatch@4.0.8:
+    dependencies:
+      braces: 3.0.3
+      picomatch: 2.3.1
+
+  mime-db@1.52.0: {}
+
+  mime-types@2.1.35:
+    dependencies:
+      mime-db: 1.52.0
+
+  minimatch@9.0.5:
+    dependencies:
+      brace-expansion: 2.0.1
+
+  minimist@1.2.8: {}
+
+  mixin-deep@1.3.2:
+    dependencies:
+      for-in: 1.0.2
+      is-extendable: 1.0.1
+
+  mlly@1.7.4:
+    dependencies:
+      acorn: 8.14.1
+      pathe: 2.0.3
+      pkg-types: 1.3.1
+      ufo: 1.5.4
+
+  ms@2.0.0: {}
+
+  ms@2.1.3: {}
+
+  nanoid@3.3.8: {}
+
+  nanomatch@1.2.13:
+    dependencies:
+      arr-diff: 4.0.0
+      array-unique: 0.3.2
+      define-property: 2.0.2
+      extend-shallow: 3.0.2
+      fragment-cache: 0.2.1
+      is-windows: 1.0.2
+      kind-of: 6.0.3
+      object.pick: 1.3.0
+      regex-not: 1.0.2
+      snapdragon: 0.8.2
+      to-regex: 3.0.2
+    transitivePeerDependencies:
+      - supports-color
+
+  normalize-path@3.0.0: {}
+
+  normalize-wheel-es@1.2.0: {}
+
+  nprogress@0.2.0: {}
+
+  nth-check@2.1.1:
+    dependencies:
+      boolbase: 1.0.0
+
+  nzh@1.0.14: {}
+
+  object-assign@4.1.1: {}
+
+  object-copy@0.1.0:
+    dependencies:
+      copy-descriptor: 0.1.1
+      define-property: 0.2.5
+      kind-of: 3.2.2
+
+  object-inspect@1.13.4: {}
+
+  object-is@1.1.6:
+    dependencies:
+      call-bind: 1.0.8
+      define-properties: 1.2.1
+
+  object-keys@1.1.1: {}
+
+  object-visit@1.0.1:
+    dependencies:
+      isobject: 3.0.1
+
+  object.assign@4.1.7:
+    dependencies:
+      call-bind: 1.0.8
+      call-bound: 1.0.4
+      define-properties: 1.2.1
+      es-object-atoms: 1.1.1
+      has-symbols: 1.1.0
+      object-keys: 1.1.1
+
+  object.pick@1.3.0:
+    dependencies:
+      isobject: 3.0.1
+
+  own-keys@1.0.1:
+    dependencies:
+      get-intrinsic: 1.3.0
+      object-keys: 1.1.1
+      safe-push-apply: 1.0.0
+
+  parchment@1.1.4: {}
+
+  pascalcase@0.1.1: {}
+
+  pathe@0.2.0: {}
+
+  pathe@2.0.3: {}
+
+  performance-now@2.1.0: {}
+
+  picocolors@1.1.1: {}
+
+  picomatch@2.3.1: {}
+
+  picomatch@4.0.2: {}
+
+  pinia@2.1.7(vue@3.4.31):
+    dependencies:
+      '@vue/devtools-api': 6.6.4
+      vue: 3.4.31
+      vue-demi: 0.14.10(vue@3.4.31)
+
+  pkg-types@1.3.1:
+    dependencies:
+      confbox: 0.1.8
+      mlly: 1.7.4
+      pathe: 2.0.3
+
+  pkg-types@2.1.0:
+    dependencies:
+      confbox: 0.2.1
+      exsolve: 1.0.2
+      pathe: 2.0.3
+
+  posix-character-classes@0.1.1: {}
+
+  possible-typed-array-names@1.1.0: {}
+
+  postcss-prefix-selector@1.16.1(postcss@5.2.18):
+    dependencies:
+      postcss: 5.2.18
+
+  postcss@5.2.18:
+    dependencies:
+      chalk: 1.1.3
+      js-base64: 2.6.4
+      source-map: 0.5.7
+      supports-color: 3.2.3
+
+  postcss@8.5.3:
+    dependencies:
+      nanoid: 3.3.8
+      picocolors: 1.1.1
+      source-map-js: 1.2.1
+
+  posthtml-parser@0.2.1:
+    dependencies:
+      htmlparser2: 3.10.1
+      isobject: 2.1.0
+
+  posthtml-rename-id@1.0.12:
+    dependencies:
+      escape-string-regexp: 1.0.5
+
+  posthtml-render@1.4.0: {}
+
+  posthtml-svg-mode@1.0.3:
+    dependencies:
+      merge-options: 1.0.1
+      posthtml: 0.9.2
+      posthtml-parser: 0.2.1
+      posthtml-render: 1.4.0
+
+  posthtml@0.9.2:
+    dependencies:
+      posthtml-parser: 0.2.1
+      posthtml-render: 1.4.0
+
+  proxy-from-env@1.1.0: {}
+
+  quansync@0.2.8: {}
+
+  query-string@4.3.4:
+    dependencies:
+      object-assign: 4.1.1
+      strict-uri-encode: 1.1.0
+
+  queue-microtask@1.2.3: {}
+
+  quill-delta@3.6.3:
+    dependencies:
+      deep-equal: 1.1.2
+      extend: 3.0.2
+      fast-diff: 1.1.2
+
+  quill-delta@4.2.2:
+    dependencies:
+      fast-diff: 1.2.0
+      lodash.clonedeep: 4.5.0
+      lodash.isequal: 4.5.0
+
+  quill@1.3.7:
+    dependencies:
+      clone: 2.1.2
+      deep-equal: 1.1.2
+      eventemitter3: 2.0.3
+      extend: 3.0.2
+      parchment: 1.1.4
+      quill-delta: 3.6.3
+
+  raf@3.4.1:
+    dependencies:
+      performance-now: 2.1.0
+
+  readable-stream@3.6.2:
+    dependencies:
+      inherits: 2.0.4
+      string_decoder: 1.3.0
+      util-deprecate: 1.0.2
+
+  readdirp@3.6.0:
+    dependencies:
+      picomatch: 2.3.1
+
+  reflect.getprototypeof@1.0.10:
+    dependencies:
+      call-bind: 1.0.8
+      define-properties: 1.2.1
+      es-abstract: 1.23.9
+      es-errors: 1.3.0
+      es-object-atoms: 1.1.1
+      get-intrinsic: 1.3.0
+      get-proto: 1.0.1
+      which-builtin-type: 1.2.1
+
+  regenerator-runtime@0.13.11: {}
+
+  regenerator-runtime@0.14.1: {}
+
+  regex-not@1.0.2:
+    dependencies:
+      extend-shallow: 3.0.2
+      safe-regex: 1.1.0
+
+  regexp.prototype.flags@1.5.4:
+    dependencies:
+      call-bind: 1.0.8
+      define-properties: 1.2.1
+      es-errors: 1.3.0
+      get-proto: 1.0.1
+      gopd: 1.2.0
+      set-function-name: 2.0.2
+
+  repeat-element@1.1.4: {}
+
+  repeat-string@1.6.1: {}
+
+  resolve-url@0.2.1: {}
+
+  ret@0.1.15: {}
+
+  reusify@1.1.0: {}
+
+  rgbcolor@1.0.1: {}
+
+  rollup@4.34.9:
+    dependencies:
+      '@types/estree': 1.0.6
+    optionalDependencies:
+      '@rollup/rollup-android-arm-eabi': 4.34.9
+      '@rollup/rollup-android-arm64': 4.34.9
+      '@rollup/rollup-darwin-arm64': 4.34.9
+      '@rollup/rollup-darwin-x64': 4.34.9
+      '@rollup/rollup-freebsd-arm64': 4.34.9
+      '@rollup/rollup-freebsd-x64': 4.34.9
+      '@rollup/rollup-linux-arm-gnueabihf': 4.34.9
+      '@rollup/rollup-linux-arm-musleabihf': 4.34.9
+      '@rollup/rollup-linux-arm64-gnu': 4.34.9
+      '@rollup/rollup-linux-arm64-musl': 4.34.9
+      '@rollup/rollup-linux-loongarch64-gnu': 4.34.9
+      '@rollup/rollup-linux-powerpc64le-gnu': 4.34.9
+      '@rollup/rollup-linux-riscv64-gnu': 4.34.9
+      '@rollup/rollup-linux-s390x-gnu': 4.34.9
+      '@rollup/rollup-linux-x64-gnu': 4.34.9
+      '@rollup/rollup-linux-x64-musl': 4.34.9
+      '@rollup/rollup-win32-arm64-msvc': 4.34.9
+      '@rollup/rollup-win32-ia32-msvc': 4.34.9
+      '@rollup/rollup-win32-x64-msvc': 4.34.9
+      fsevents: 2.3.3
+
+  run-parallel@1.2.0:
+    dependencies:
+      queue-microtask: 1.2.3
+
+  safe-array-concat@1.1.3:
+    dependencies:
+      call-bind: 1.0.8
+      call-bound: 1.0.4
+      get-intrinsic: 1.3.0
+      has-symbols: 1.1.0
+      isarray: 2.0.5
+
+  safe-buffer@5.2.1: {}
+
+  safe-push-apply@1.0.0:
+    dependencies:
+      es-errors: 1.3.0
+      isarray: 2.0.5
+
+  safe-regex-test@1.1.0:
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      is-regex: 1.2.1
+
+  safe-regex@1.1.0:
+    dependencies:
+      ret: 0.1.15
+
+  sass@1.77.5:
+    dependencies:
+      chokidar: 3.6.0
+      immutable: 4.3.7
+      source-map-js: 1.2.1
+
+  scule@1.3.0: {}
+
+  set-function-length@1.2.2:
+    dependencies:
+      define-data-property: 1.1.4
+      es-errors: 1.3.0
+      function-bind: 1.1.2
+      get-intrinsic: 1.3.0
+      gopd: 1.2.0
+      has-property-descriptors: 1.0.2
+
+  set-function-name@2.0.2:
+    dependencies:
+      define-data-property: 1.1.4
+      es-errors: 1.3.0
+      functions-have-names: 1.2.3
+      has-property-descriptors: 1.0.2
+
+  set-proto@1.0.0:
+    dependencies:
+      dunder-proto: 1.0.1
+      es-errors: 1.3.0
+      es-object-atoms: 1.1.1
+
+  set-value@2.0.1:
+    dependencies:
+      extend-shallow: 2.0.1
+      is-extendable: 0.1.1
+      is-plain-object: 2.0.4
+      split-string: 3.1.0
+
+  side-channel-list@1.0.0:
+    dependencies:
+      es-errors: 1.3.0
+      object-inspect: 1.13.4
+
+  side-channel-map@1.0.1:
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      get-intrinsic: 1.3.0
+      object-inspect: 1.13.4
+
+  side-channel-weakmap@1.0.2:
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      get-intrinsic: 1.3.0
+      object-inspect: 1.13.4
+      side-channel-map: 1.0.1
+
+  side-channel@1.1.0:
+    dependencies:
+      es-errors: 1.3.0
+      object-inspect: 1.13.4
+      side-channel-list: 1.0.0
+      side-channel-map: 1.0.1
+      side-channel-weakmap: 1.0.2
+
+  snapdragon-node@2.1.1:
+    dependencies:
+      define-property: 1.0.0
+      isobject: 3.0.1
+      snapdragon-util: 3.0.1
+
+  snapdragon-util@3.0.1:
+    dependencies:
+      kind-of: 3.2.2
+
+  snapdragon@0.8.2:
+    dependencies:
+      base: 0.11.2
+      debug: 2.6.9
+      define-property: 0.2.5
+      extend-shallow: 2.0.1
+      map-cache: 0.2.2
+      source-map: 0.5.7
+      source-map-resolve: 0.5.3
+      use: 3.1.1
+    transitivePeerDependencies:
+      - supports-color
+
+  socket.io-client@4.8.1:
+    dependencies:
+      '@socket.io/component-emitter': 3.1.2
+      debug: 4.3.7
+      engine.io-client: 6.6.3
+      socket.io-parser: 4.2.4
+    transitivePeerDependencies:
+      - bufferutil
+      - supports-color
+      - utf-8-validate
+
+  socket.io-parser@4.2.4:
+    dependencies:
+      '@socket.io/component-emitter': 3.1.2
+      debug: 4.3.7
+    transitivePeerDependencies:
+      - supports-color
+
+  source-map-js@1.2.1: {}
+
+  source-map-resolve@0.5.3:
+    dependencies:
+      atob: 2.1.2
+      decode-uri-component: 0.2.2
+      resolve-url: 0.2.1
+      source-map-url: 0.4.1
+      urix: 0.1.0
+
+  source-map-url@0.4.1: {}
+
+  source-map@0.5.7: {}
+
+  source-map@0.6.1: {}
+
+  sourcemap-codec@1.4.8: {}
+
+  split-string@3.1.0:
+    dependencies:
+      extend-shallow: 3.0.2
+
+  splitpanes@3.1.5: {}
+
+  stable@0.1.8: {}
+
+  stackblur-canvas@2.7.0: {}
+
+  static-extend@0.1.2:
+    dependencies:
+      define-property: 0.2.5
+      object-copy: 0.1.0
+
+  strict-uri-encode@1.1.0: {}
+
+  string.prototype.trim@1.2.10:
+    dependencies:
+      call-bind: 1.0.8
+      call-bound: 1.0.4
+      define-data-property: 1.1.4
+      define-properties: 1.2.1
+      es-abstract: 1.23.9
+      es-object-atoms: 1.1.1
+      has-property-descriptors: 1.0.2
+
+  string.prototype.trimend@1.0.9:
+    dependencies:
+      call-bind: 1.0.8
+      call-bound: 1.0.4
+      define-properties: 1.2.1
+      es-object-atoms: 1.1.1
+
+  string.prototype.trimstart@1.0.8:
+    dependencies:
+      call-bind: 1.0.8
+      define-properties: 1.2.1
+      es-object-atoms: 1.1.1
+
+  string_decoder@1.3.0:
+    dependencies:
+      safe-buffer: 5.2.1
+
+  strip-ansi@3.0.1:
+    dependencies:
+      ansi-regex: 2.1.1
+
+  strip-literal@2.1.1:
+    dependencies:
+      js-tokens: 9.0.1
+
+  supports-color@2.0.0: {}
+
+  supports-color@3.2.3:
+    dependencies:
+      has-flag: 1.0.0
+
+  supports-color@7.2.0:
+    dependencies:
+      has-flag: 4.0.0
+
+  svg-baker@1.7.0:
+    dependencies:
+      bluebird: 3.7.2
+      clone: 2.1.2
+      he: 1.2.0
+      image-size: 0.5.5
+      loader-utils: 1.4.2
+      merge-options: 1.0.1
+      micromatch: 3.1.0
+      postcss: 5.2.18
+      postcss-prefix-selector: 1.16.1(postcss@5.2.18)
+      posthtml-rename-id: 1.0.12
+      posthtml-svg-mode: 1.0.3
+      query-string: 4.3.4
+      traverse: 0.6.11
+    transitivePeerDependencies:
+      - supports-color
+
+  svg-pathdata@6.0.3: {}
+
+  svgo@2.8.0:
+    dependencies:
+      '@trysound/sax': 0.2.0
+      commander: 7.2.0
+      css-select: 4.3.0
+      css-tree: 1.1.3
+      csso: 4.2.0
+      picocolors: 1.1.1
+      stable: 0.1.8
+
+  text-segmentation@1.0.3:
+    dependencies:
+      utrie: 1.0.2
+
+  to-object-path@0.3.0:
+    dependencies:
+      kind-of: 3.2.2
+
+  to-regex-range@2.1.1:
+    dependencies:
+      is-number: 3.0.0
+      repeat-string: 1.6.1
+
+  to-regex-range@5.0.1:
+    dependencies:
+      is-number: 7.0.0
+
+  to-regex@3.0.2:
+    dependencies:
+      define-property: 2.0.2
+      extend-shallow: 3.0.2
+      regex-not: 1.0.2
+      safe-regex: 1.1.0
+
+  traverse@0.6.11:
+    dependencies:
+      gopd: 1.2.0
+      typedarray.prototype.slice: 1.0.5
+      which-typed-array: 1.1.18
+
+  tslib@2.3.0: {}
+
+  typed-array-buffer@1.0.3:
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      is-typed-array: 1.1.15
+
+  typed-array-byte-length@1.0.3:
+    dependencies:
+      call-bind: 1.0.8
+      for-each: 0.3.5
+      gopd: 1.2.0
+      has-proto: 1.2.0
+      is-typed-array: 1.1.15
+
+  typed-array-byte-offset@1.0.4:
+    dependencies:
+      available-typed-arrays: 1.0.7
+      call-bind: 1.0.8
+      for-each: 0.3.5
+      gopd: 1.2.0
+      has-proto: 1.2.0
+      is-typed-array: 1.1.15
+      reflect.getprototypeof: 1.0.10
+
+  typed-array-length@1.0.7:
+    dependencies:
+      call-bind: 1.0.8
+      for-each: 0.3.5
+      gopd: 1.2.0
+      is-typed-array: 1.1.15
+      possible-typed-array-names: 1.1.0
+      reflect.getprototypeof: 1.0.10
+
+  typedarray.prototype.slice@1.0.5:
+    dependencies:
+      call-bind: 1.0.8
+      define-properties: 1.2.1
+      es-abstract: 1.23.9
+      es-errors: 1.3.0
+      get-proto: 1.0.1
+      math-intrinsics: 1.1.0
+      typed-array-buffer: 1.0.3
+      typed-array-byte-offset: 1.0.4
+
+  ufo@1.5.4: {}
+
+  unbox-primitive@1.1.0:
+    dependencies:
+      call-bound: 1.0.4
+      has-bigints: 1.1.0
+      has-symbols: 1.1.0
+      which-boxed-primitive: 1.1.1
+
+  undici-types@6.20.0: {}
+
+  unimport@3.14.6(rollup@4.34.9):
+    dependencies:
+      '@rollup/pluginutils': 5.1.4(rollup@4.34.9)
+      acorn: 8.14.1
+      escape-string-regexp: 5.0.0
+      estree-walker: 3.0.3
+      fast-glob: 3.3.3
+      local-pkg: 1.1.1
+      magic-string: 0.30.17
+      mlly: 1.7.4
+      pathe: 2.0.3
+      picomatch: 4.0.2
+      pkg-types: 1.3.1
+      scule: 1.3.0
+      strip-literal: 2.1.1
+      unplugin: 1.16.1
+    transitivePeerDependencies:
+      - rollup
+
+  union-value@1.0.1:
+    dependencies:
+      arr-union: 3.1.0
+      get-value: 2.0.6
+      is-extendable: 0.1.1
+      set-value: 2.0.1
+
+  universalify@2.0.1: {}
+
+  unplugin-auto-import@0.17.6(@vueuse/core@10.11.0(vue@3.4.31))(rollup@4.34.9):
+    dependencies:
+      '@antfu/utils': 0.7.10
+      '@rollup/pluginutils': 5.1.4(rollup@4.34.9)
+      fast-glob: 3.3.3
+      local-pkg: 0.5.1
+      magic-string: 0.30.17
+      minimatch: 9.0.5
+      unimport: 3.14.6(rollup@4.34.9)
+      unplugin: 1.16.1
+    optionalDependencies:
+      '@vueuse/core': 10.11.0(vue@3.4.31)
+    transitivePeerDependencies:
+      - rollup
+
+  unplugin-vue-setup-extend-plus@1.0.1:
+    dependencies:
+      '@vue/compiler-sfc': 3.5.13
+      magic-string: 0.26.7
+      unplugin: 1.16.1
+
+  unplugin@1.16.1:
+    dependencies:
+      acorn: 8.14.1
+      webpack-virtual-modules: 0.6.2
+
+  unset-value@1.0.0:
+    dependencies:
+      has-value: 0.3.1
+      isobject: 3.0.1
+
+  urix@0.1.0: {}
+
+  use@3.1.1: {}
+
+  util-deprecate@1.0.2: {}
+
+  utrie@1.0.2:
+    dependencies:
+      base64-arraybuffer: 1.0.2
+
+  vary@1.1.2: {}
+
+  vite-plugin-compression@0.5.1(vite@5.3.2(@types/node@22.13.9)(sass@1.77.5)):
+    dependencies:
+      chalk: 4.1.2
+      debug: 4.4.0
+      fs-extra: 10.1.0
+      vite: 5.3.2(@types/node@22.13.9)(sass@1.77.5)
+    transitivePeerDependencies:
+      - supports-color
+
+  vite-plugin-svg-icons@2.0.1(vite@5.3.2(@types/node@22.13.9)(sass@1.77.5)):
+    dependencies:
+      '@types/svgo': 2.6.4
+      cors: 2.8.5
+      debug: 4.4.0
+      etag: 1.8.1
+      fs-extra: 10.1.0
+      pathe: 0.2.0
+      svg-baker: 1.7.0
+      svgo: 2.8.0
+      vite: 5.3.2(@types/node@22.13.9)(sass@1.77.5)
+    transitivePeerDependencies:
+      - supports-color
+
+  vite@5.3.2(@types/node@22.13.9)(sass@1.77.5):
+    dependencies:
+      esbuild: 0.21.5
+      postcss: 8.5.3
+      rollup: 4.34.9
+    optionalDependencies:
+      '@types/node': 22.13.9
+      fsevents: 2.3.3
+      sass: 1.77.5
+
+  vue-cropper@1.1.1: {}
+
+  vue-demi@0.14.10(vue@3.4.31):
+    dependencies:
+      vue: 3.4.31
+
+  vue-plugin-hiprint@0.0.58-fix:
+    dependencies:
+      '@claviska/jquery-minicolors': 2.3.6(jquery@3.7.1)
+      '@wtto00/html2canvas': 1.4.3
+      bwip-js: 4.5.1
+      canvg: 3.0.10
+      jquery: 3.7.1
+      jsbarcode: 3.11.6
+      jspdf: 2.5.2
+      lodash: 4.17.21
+      nzh: 1.0.14
+      socket.io-client: 4.8.1
+    transitivePeerDependencies:
+      - bufferutil
+      - supports-color
+      - utf-8-validate
+
+  vue-router@4.4.0(vue@3.4.31):
+    dependencies:
+      '@vue/devtools-api': 6.6.4
+      vue: 3.4.31
+
+  vue@3.4.31:
+    dependencies:
+      '@vue/compiler-dom': 3.4.31
+      '@vue/compiler-sfc': 3.4.31
+      '@vue/runtime-dom': 3.4.31
+      '@vue/server-renderer': 3.4.31(vue@3.4.31)
+      '@vue/shared': 3.4.31
+
+  webpack-virtual-modules@0.6.2: {}
+
+  which-boxed-primitive@1.1.1:
+    dependencies:
+      is-bigint: 1.1.0
+      is-boolean-object: 1.2.2
+      is-number-object: 1.1.1
+      is-string: 1.1.1
+      is-symbol: 1.1.1
+
+  which-builtin-type@1.2.1:
+    dependencies:
+      call-bound: 1.0.4
+      function.prototype.name: 1.1.8
+      has-tostringtag: 1.0.2
+      is-async-function: 2.1.1
+      is-date-object: 1.1.0
+      is-finalizationregistry: 1.1.1
+      is-generator-function: 1.1.0
+      is-regex: 1.2.1
+      is-weakref: 1.1.1
+      isarray: 2.0.5
+      which-boxed-primitive: 1.1.1
+      which-collection: 1.0.2
+      which-typed-array: 1.1.18
+
+  which-collection@1.0.2:
+    dependencies:
+      is-map: 2.0.3
+      is-set: 2.0.3
+      is-weakmap: 2.0.2
+      is-weakset: 2.0.4
+
+  which-typed-array@1.1.18:
+    dependencies:
+      available-typed-arrays: 1.0.7
+      call-bind: 1.0.8
+      call-bound: 1.0.4
+      for-each: 0.3.5
+      gopd: 1.2.0
+      has-tostringtag: 1.0.2
+
+  ws@8.17.1: {}
+
+  xmlhttprequest-ssl@2.1.2: {}
+
+  zrender@5.6.0:
+    dependencies:
+      tslib: 2.3.0
diff --git a/public/favicon.ico b/public/favicon.ico
new file mode 100644
index 0000000..e263760
Binary files /dev/null and b/public/favicon.ico differ
diff --git a/public/print-lock.css b/public/print-lock.css
new file mode 100644
index 0000000..82c1404
--- /dev/null
+++ b/public/print-lock.css
@@ -0,0 +1,352 @@
+@media print {
+  body {
+    margin: 0px;
+    padding: 0px;
+  }
+}
+
+@page {
+  margin: 0;
+}
+
+.hiprint-printPaper * {
+  box-sizing: border-box;
+  -moz-box-sizing: border-box; /* Firefox */
+  -webkit-box-sizing: border-box; /* Safari */
+}
+
+.hiprint-printPaper *:focus {
+  outline: -webkit-focus-ring-color auto 0px;
+}
+
+.hiprint-printPaper {
+  position: relative;
+  padding: 0 0 0 0;
+  page-break-after: always;
+  -webkit-user-select: none; /* Chrome/Safari/Opera */
+  -moz-user-select: none; /* Firefox */
+  user-select: none;
+  overflow-x: hidden;
+  overflow: hidden;
+}
+
+.hiprint-printPaper .hiprint-printPaper-content {
+  position: relative;
+}
+
+/* 火狐浏览器打印 第一页过后 重叠问题 */
+@-moz-document url-prefix() {
+  .hiprint-printPaper .hiprint-printPaper-content {
+    position: relative;
+    margin-top: 20px;
+    top: -20px
+  }
+}
+
+.hiprint-printPaper.design {
+  overflow: visible;
+}
+
+
+.hiprint-printTemplate .hiprint-printPanel {
+  page-break-after: always;
+}
+
+.hiprint-printPaper, hiprint-printPanel {
+  box-sizing: border-box;
+  border: 0px;
+}
+
+.hiprint-printPanel .hiprint-printPaper:last-child {
+  page-break-after: avoid;
+}
+
+.hiprint-printTemplate .hiprint-printPanel:last-child {
+  page-break-after: avoid;
+}
+
+.hiprint-printPaper .hideheaderLinetarget {
+  border-top: 0px dashed rgb(201, 190, 190) !important;
+}
+
+.hiprint-printPaper .hidefooterLinetarget {
+  border-top: 0px dashed rgb(201, 190, 190) !important;
+}
+
+.hiprint-printPaper.design {
+  border: 1px dashed rgba(170, 170, 170, 0.7);
+}
+
+.design .hiprint-printElement-table-content, .design .hiprint-printElement-longText-content {
+  overflow: hidden;
+  box-sizing: border-box;
+}
+
+.design .resize-panel {
+  box-sizing: border-box;
+  border: 1px dotted;
+}
+
+.hiprint-printElement-text {
+  background-color: transparent;
+  background-repeat: repeat;
+  padding: 0 0 0 0;
+  border: 0.75pt none rgb(0, 0, 0);
+  direction: ltr;
+  font-family: 'SimSun';
+  font-size: 9pt;
+  font-style: normal;
+  font-weight: normal;
+  padding-bottom: 0pt;
+  padding-left: 0pt;
+  padding-right: 0pt;
+  padding-top: 0pt;
+  text-align: left;
+  text-decoration: none;
+  line-height: 9.75pt;
+  box-sizing: border-box;
+  word-wrap: break-word;
+  word-break: break-all;
+}
+
+.design .hiprint-printElement-text-content {
+  border: 1px dashed rgb(206, 188, 188);
+  box-sizing: border-box;
+}
+
+.hiprint-printElement-longText {
+  background-color: transparent;
+  background-repeat: repeat;
+  border: 0.75pt none rgb(0, 0, 0);
+  direction: ltr;
+  font-family: 'SimSun';
+  font-size: 9pt;
+  font-style: normal;
+  font-weight: normal;
+  padding-bottom: 0pt;
+  padding-left: 0pt;
+  padding-right: 0pt;
+  padding-top: 0pt;
+  text-align: left;
+  text-decoration: none;
+  line-height: 9.75pt;
+  box-sizing: border-box;
+  word-wrap: break-word;
+  word-break: break-all;
+  /*white-space: pre-wrap*/
+}
+
+
+.hiprint-printElement-table {
+  background-color: transparent;
+  background-repeat: repeat;
+  color: rgb(0, 0, 0);
+  border-color: rgb(0, 0, 0);
+  border-style: none;
+  direction: ltr;
+  font-family: 'SimSun';
+  font-size: 9pt;
+  font-style: normal;
+  font-weight: normal;
+  padding-bottom: 0pt;
+  padding-left: 0pt;
+  padding-right: 0pt;
+  padding-top: 0pt;
+  text-align: left;
+  text-decoration: none;
+  padding: 0 0 0 0;
+  box-sizing: border-box;
+  line-height: 9.75pt;
+}
+
+.hiprint-printElement-table thead {
+  background: #e8e8e8;
+  font-weight: 700;
+}
+
+table.hiprint-printElement-tableTarget {
+  width: 100%;
+}
+
+.hiprint-printElement-tableTarget, .hiprint-printElement-tableTarget tr, .hiprint-printElement-tableTarget td {
+  border-color: rgb(0, 0, 0);
+  /*border-style: none;*/
+  /*border: 1px solid rgb(0, 0, 0);*/
+  font-weight: normal;
+  direction: ltr;
+  padding-bottom: 0pt;
+  padding-left: 4pt;
+  padding-right: 4pt;
+  padding-top: 0pt;
+  text-decoration: none;
+  vertical-align: middle;
+  box-sizing: border-box;
+  word-wrap: break-word;
+  word-break: break-all;
+  /*line-height: 9.75pt;
+  font-size: 9pt;*/
+}
+
+.hiprint-printElement-tableTarget-border-all {
+  border: 1px solid;
+}
+.hiprint-printElement-tableTarget-border-none {
+  border: 0px solid;
+}
+.hiprint-printElement-tableTarget-border-lr {
+  border-left: 1px solid;
+  border-right: 1px solid;
+}
+.hiprint-printElement-tableTarget-border-left {
+  border-left: 1px solid;
+}
+.hiprint-printElement-tableTarget-border-right {
+  border-right: 1px solid;
+}
+.hiprint-printElement-tableTarget-border-tb {
+  border-top: 1px solid;
+  border-bottom: 1px solid;
+}
+.hiprint-printElement-tableTarget-border-top {
+  border-top: 1px solid;
+}
+.hiprint-printElement-tableTarget-border-bottom {
+  border-bottom: 1px solid;
+}
+
+.hiprint-printElement-tableTarget-border-td-none td {
+  border: 0px solid;
+}
+.hiprint-printElement-tableTarget-border-td-all td:not(:nth-last-child(-n+2)) {
+  border-right: 1px solid;
+}
+.hiprint-printElement-tableTarget-border-td-all td:not(last-child) {
+  border-right: 1px solid;
+}
+.hiprint-printElement-tableTarget-border-td-all td:last-child {
+  border-left: 1px solid;
+}
+.hiprint-printElement-tableTarget-border-td-all td:last-child:first-child {
+  border-left: none;
+}
+
+/*.hiprint-printElement-tableTarget tr,*/
+.hiprint-printElement-tableTarget td {
+  height: 18pt;
+}
+
+.hiprint-printPaper .hiprint-paperNumber {
+  font-size: 9pt;
+}
+
+.design .hiprint-printElement-table-handle {
+  position: absolute;
+  height: 21pt;
+  width: 21pt;
+  background: red;
+  z-index: 1;
+}
+
+.hiprint-printPaper .hiprint-paperNumber-disabled {
+  float: right !important;
+  right: 0 !important;
+  color: gainsboro !important;
+}
+
+.hiprint-printElement-vline, .hiprint-printElement-hline {
+  border: 0px none rgb(0, 0, 0);
+
+}
+
+.hiprint-printElement-vline {
+  border-left: 0.75pt solid #000;
+  border-right: 0px none rgb(0, 0, 0) !important;
+  border-bottom: 0px none rgb(0, 0, 0) !important;
+  border-top: 0px none rgb(0, 0, 0) !important;
+}
+
+.hiprint-printElement-hline {
+  border-top: 0.75pt solid #000;
+  border-right: 0px none rgb(0, 0, 0) !important;
+  border-bottom: 0px none rgb(0, 0, 0) !important;
+  border-left: 0px none rgb(0, 0, 0) !important;
+}
+
+.hiprint-printElement-oval, .hiprint-printElement-rect {
+  border: 0.75pt solid #000;
+}
+
+.hiprint-text-content-middle {
+}
+
+.hiprint-text-content-middle > div {
+  display: grid;
+  align-items: center;
+}
+
+.hiprint-text-content-bottom {
+}
+
+.hiprint-text-content-bottom > div {
+  display: grid;
+  align-items: flex-end;
+}
+
+.hiprint-text-content-wrap {
+}
+
+.hiprint-text-content-wrap .hiprint-text-content-wrap-nowrap {
+  white-space: nowrap;
+}
+
+.hiprint-text-content-wrap .hiprint-text-content-wrap-clip {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: clip;
+}
+
+.hiprint-text-content-wrap .hiprint-text-content-wrap-ellipsis {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/*hi-grid-row */
+.hi-grid-row {
+  position: relative;
+  height: auto;
+  margin-right: 0;
+  margin-left: 0;
+  zoom: 1;
+  display: block;
+  box-sizing: border-box;
+}
+
+.hi-grid-row::after, .hi-grid-row::before {
+  display: table;
+  content: '';
+  box-sizing: border-box;
+}
+
+.hi-grid-col {
+  display: block;
+  box-sizing: border-box;
+  position: relative;
+  float: left;
+  flex: 0 0 auto;
+}
+
+.table-grid-row {
+  margin-left: -0pt;
+  margin-right: -0pt;
+}
+
+.tableGridColumnsGutterRow {
+  padding-left: 0pt;
+  padding-right: 0pt;
+}
+
+.hiprint-gridColumnsFooter {
+  text-align: left;
+  clear: both;
+}
diff --git a/src/App.vue b/src/App.vue
new file mode 100644
index 0000000..31839f2
--- /dev/null
+++ b/src/App.vue
@@ -0,0 +1,15 @@
+<template>
+  <router-view />
+</template>
+
+<script setup>
+import useSettingsStore from '@/store/modules/settings'
+import { handleThemeStyle } from '@/utils/theme'
+
+onMounted(() => {
+  nextTick(() => {
+    // 初始化主题样式
+    handleThemeStyle(useSettingsStore().theme)
+  })
+})
+</script>
diff --git a/src/api/brewery/activity.js b/src/api/brewery/activity.js
new file mode 100644
index 0000000..f3509c0
--- /dev/null
+++ b/src/api/brewery/activity.js
@@ -0,0 +1,119 @@
+import request from "@/utils/request";
+
+// 查询营销活动列表
+export function listActivity(query) {
+  return request({
+    url: "/brewery/activity/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询营销活动详细
+export function getActivity(id) {
+  return request({
+    url: "/brewery/activity/" + id,
+    method: "get",
+  });
+}
+
+// 新增营销活动
+export function addActivity(data) {
+  return request({
+    url: "/brewery/activity",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改营销活动
+export function updateActivity(data) {
+  return request({
+    url: "/brewery/activity",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除营销活动
+export function delActivity(id) {
+  return request({
+    url: "/brewery/activity/" + id,
+    method: "delete",
+  });
+}
+
+// 品牌方活动数据统计
+export function activityData() {
+  return request({
+    url: "/brewery/activity/statistics",
+    method: "get",
+  });
+}
+
+// 酒厂啤酒币数据统计
+export function beerCoinData() {
+  return request({
+    url: "/brewery/beerCoin/statistics",
+    method: "get",
+  });
+}
+// 查询持有啤酒币的门店
+
+export function beerCoinBars(data) {
+  return request({
+    url: "/brewery/beerCoin/bars",
+    method: "get",
+    params: data,
+  });
+}
+
+// 中止活动
+export function stopActivity(id) {
+  return request({
+    url: "/brewery/activity/suspend?activityId=" + id,
+    method: "post",
+  });
+}
+
+// 延长活动时间
+export function extendActivity(data) {
+  return request({
+    url: "/brewery/activity/extendTime",
+    method: "post",
+    data: data,
+  });
+}
+
+//
+export function getActivityConsumeList(data) {
+  return request({
+    url: "/brewery/qrcodeScanLog/activityConsumeList",
+    method: "get",
+    params: data,
+  });
+}
+
+//撤销核销记录
+export function cancelConsume(id) {
+  return request({
+    url: "/brewery/qrcodeScanLog/cancelConsume?logId=" + id,
+    method: "post",
+  });
+}
+// 某个活动数据统计
+export function getActivityStatistics(id) {
+  return request({
+    url: "/brewery/qrcodeScanLog/statistics?activityId=" + id,
+    method: "get",
+  });
+}
+
+//查询某个活动参与情况
+export function getActivityBatchList(data) {
+  return request({
+    url: "/brewery/qrcodeScanLog/activityBatchList",
+    method: "get",
+    params: data,
+  });
+}
diff --git a/src/api/brewery/auth.js b/src/api/brewery/auth.js
new file mode 100644
index 0000000..0ec15b4
--- /dev/null
+++ b/src/api/brewery/auth.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询主体认证信息列表
+export function listAuth(query) {
+  return request({
+    url: '/brewery/auth/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询主体认证信息详细
+export function getAuth() {
+  return request({
+    url: '/brewery/auth/authInfo' ,
+    method: 'get'
+  })
+}
+
+// 新增主体认证信息
+export function addAuth(data) {
+  return request({
+    url: '/brewery/auth',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改主体认证信息
+export function updateAuth(data) {
+  return request({
+    url: '/brewery/auth',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除主体认证信息
+export function delAuth(id) {
+  return request({
+    url: '/brewery/auth/' + id,
+    method: 'delete'
+  })
+}
diff --git a/src/api/brewery/banner.js b/src/api/brewery/banner.js
new file mode 100644
index 0000000..9314b96
--- /dev/null
+++ b/src/api/brewery/banner.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询品牌方广告图列表
+export function listBanner(query) {
+  return request({
+    url: '/brewery/banner/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询品牌方广告图详细
+export function getBanner(id) {
+  return request({
+    url: '/brewery/banner/' + id,
+    method: 'get'
+  })
+}
+
+// 新增品牌方广告图
+export function addBanner(data) {
+  return request({
+    url: '/brewery/banner',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改品牌方广告图
+export function updateBanner(data) {
+  return request({
+    url: '/brewery/banner',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品牌方广告图
+export function delBanner(id) {
+  return request({
+    url: '/brewery/banner/' + id,
+    method: 'delete'
+  })
+}
diff --git a/src/api/brewery/batch.js b/src/api/brewery/batch.js
new file mode 100644
index 0000000..1fd41e0
--- /dev/null
+++ b/src/api/brewery/batch.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询批次列表
+export function listBatch(query) {
+  return request({
+    url: '/brewery/batch/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询批次详细
+export function getBatch(id) {
+  return request({
+    url: '/brewery/batch/' + id,
+    method: 'get'
+  })
+}
+
+// 新增批次
+export function addBatch(data) {
+  return request({
+    url: '/brewery/batch',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改批次
+export function updateBatch(data) {
+  return request({
+    url: '/brewery/batch',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除批次
+export function delBatch(id) {
+  return request({
+    url: '/brewery/batch/' + id,
+    method: 'delete'
+  })
+}
diff --git a/src/api/brewery/beer.js b/src/api/brewery/beer.js
new file mode 100644
index 0000000..6a720b3
--- /dev/null
+++ b/src/api/brewery/beer.js
@@ -0,0 +1,110 @@
+import request from "@/utils/request";
+
+// 查询啤酒列表
+export function listBeer(query) {
+  return request({
+    url: "/brewery/beer/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询啤酒详细
+export function getBeer(id) {
+  return request({
+    url: "/brewery/beer/" + id,
+    method: "get",
+  });
+}
+
+// 新增啤酒
+export function addBeer(data) {
+  return request({
+    url: "/brewery/beer",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改啤酒
+export function updateBeer(data) {
+  return request({
+    url: "/brewery/beer",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除啤酒
+export function delBeer(id) {
+  return request({
+    url: "/brewery/beer/" + id,
+    method: "delete",
+  });
+}
+
+// 修改啤酒币数量
+export function updateBeerIcons(data) {
+  return request({
+    url: "/brewery/beer/icons",
+    method: "post",
+    data: data,
+  });
+}
+// 修改酒款上架状态
+export function updateBeerSaleStatus(data) {
+  return request({
+    url: "/brewery/beer/onsale",
+    method: "put",
+    data: data,
+  });
+}
+
+// 查询所有的啤酒
+export function allBeers() {
+  return request({
+    url: "/brewery/beer/all",
+    method: "get",
+  });
+}
+
+// 修改首评赠送啤酒币数量
+export function updateReviewIcons(data) {
+  return request({
+    url: "/brewery/beer/reviewIcons",
+    method: "post",
+    data: data,
+  });
+}
+
+// 查询某酒款有关的营销活动列表
+export function activityListByBeerId(data) {
+  return request({
+    url: "/brewery/beer/activityListByBeerId/" + data.beerId,
+    method: "get",
+    params: {
+      pageNum: data.pageNum,
+      pageSize: data.pageSize,
+    },
+  });
+}
+
+// 查询某酒款有关批次列表
+export function batchListByBeerId(data) {
+  return request({
+    url: "/brewery/beer/batchListByBeerId/" + data.beerId,
+    method: "get",
+    params: {
+      pageNum: data.pageNum,
+      pageSize: data.pageSize,
+    },
+  });
+}
+
+// 酒款风格列表
+export function styleList() {
+  return request({
+    url: "/brewery/beer/styleList",
+    method: "get",
+  });
+}
diff --git a/src/api/brewery/brewery.js b/src/api/brewery/brewery.js
new file mode 100644
index 0000000..23349ae
--- /dev/null
+++ b/src/api/brewery/brewery.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询品牌方列表
+export function listBrewery(query) {
+  return request({
+    url: '/brewery/brewery/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询品牌方详细
+export function getBrewery(id) {
+  return request({
+    url: '/brewery/brewery/' + id,
+    method: 'get'
+  })
+}
+
+// 新增品牌方
+export function addBrewery(data) {
+  return request({
+    url: '/brewery/brewery',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改品牌方
+export function updateBrewery(data) {
+  return request({
+    url: '/brewery/brewery',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品牌方
+export function delBrewery(id) {
+  return request({
+    url: '/brewery/brewery/' + id,
+    method: 'delete'
+  })
+}
diff --git a/src/api/brewery/breweryinfo.js b/src/api/brewery/breweryinfo.js
new file mode 100644
index 0000000..d83478d
--- /dev/null
+++ b/src/api/brewery/breweryinfo.js
@@ -0,0 +1,18 @@
+import request from '@/utils/request'
+
+// 获取品牌方详情
+export function getBreweryInfo() {
+  return request({
+    url: '/brewery/breweryinfo',
+    method: 'get'
+  })
+}
+// 更新品牌方信息
+export function updateBreweryInfo(data) {
+  return request({
+    url: '/brewery/breweryinfo',
+    method: 'put',
+    data
+  })
+}
+
diff --git a/src/api/brewery/goods.js b/src/api/brewery/goods.js
new file mode 100644
index 0000000..8206631
--- /dev/null
+++ b/src/api/brewery/goods.js
@@ -0,0 +1,102 @@
+import request from "@/utils/request";
+
+// 查询兑换商品列表
+export function listGoods(query) {
+  return request({
+    url: "/brewery/goods/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询兑换商品详细
+export function getGoods(id) {
+  return request({
+    url: "/brewery/goods/" + id,
+    method: "get",
+  });
+}
+
+// 新增兑换商品
+export function addGoods(data) {
+  return request({
+    url: "/brewery/goods",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改兑换商品
+export function updateGoods(data) {
+  return request({
+    url: "/brewery/goods",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除兑换商品
+export function delGoods(id) {
+  return request({
+    url: "/brewery/goods/" + id,
+    method: "delete",
+  });
+}
+// 修改商品上架状态
+export function updateGoodsSaleStatus(data) {
+  return request({
+    url: "/brewery/goods/onsale",
+    method: "put",
+    data: data,
+  });
+}
+// 修改啤酒币数量
+export function updateGoodsIcons(data) {
+  return request({
+    url: "/brewery/goods/icons",
+    method: "put",
+    data: data,
+  });
+}
+
+// 修改库存数量
+export function updateGoodsStockNum(data) {
+  return request({
+    url: "/brewery/goods/stock",
+    method: "put",
+    data: data,
+  });
+}
+
+// 查询所有商品
+export function allListGoods(query) {
+  return request({
+    url: "/brewery/goods/all",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询某款兑换商品的返利活动
+export function getGoodsActivityList(data) {
+  return request({
+    url: "/brewery/goods/activityList/" + data.goodsId,
+    method: "get",
+    params: {
+      pageNum: data.pageNum,
+      pageSize: data.pageSize,
+    },
+  });
+}
+
+// 查询某款兑换商品的兑换历史
+export function getGoodsExchangeList(data) {
+  return request({
+    url: "/brewery/goods/exchangeList/" + data.goodsId,
+    method: "get",
+    params: {
+      pageNum: data.pageNum,
+      pageSize: data.pageSize,
+    },
+  });
+}
diff --git a/src/api/brewery/home.js b/src/api/brewery/home.js
new file mode 100644
index 0000000..bbf4bc6
--- /dev/null
+++ b/src/api/brewery/home.js
@@ -0,0 +1,45 @@
+import request from "@/utils/request";
+
+// 查询营销活动列表
+export function recentData(query) {
+  return request({
+    url: "/brewery/data/recent",
+    method: "get",
+  });
+}
+
+// 近期热门酒款
+export function popularBeerData(query) {
+  return request({
+    url: "/brewery/data/recentPopularBeer",
+    method: "get",
+    params: query,
+  });
+}
+
+// 近期核销店铺列表
+export function checkOutBarData(query) {
+  return request({
+    url: "/brewery/data/recentVerifyBars",
+    method: "get",
+    params: query,
+  });
+}
+
+// 月度核销数据
+export function monthVerifyData(query) {
+  return request({
+    url: "/brewery/data/monthlyVerify",
+    method: "get",
+    params: query,
+  });
+}
+
+// 核销城市占比
+export function recentPopularCityData(query) {
+  return request({
+    url: "/brewery/data/recentPopularCity",
+    method: "get",
+    params: query,
+  });
+}
diff --git a/src/api/brewery/like.js b/src/api/brewery/like.js
new file mode 100644
index 0000000..bd5add6
--- /dev/null
+++ b/src/api/brewery/like.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询酒评点赞列表
+export function listLike(query) {
+  return request({
+    url: '/brewery/like/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询酒评点赞详细
+export function getLike(id) {
+  return request({
+    url: '/brewery/like/' + id,
+    method: 'get'
+  })
+}
+
+// 新增酒评点赞
+export function addLike(data) {
+  return request({
+    url: '/brewery/like',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改酒评点赞
+export function updateLike(data) {
+  return request({
+    url: '/brewery/like',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除酒评点赞
+export function delLike(id) {
+  return request({
+    url: '/brewery/like/' + id,
+    method: 'delete'
+  })
+}
diff --git a/src/api/brewery/plan.js b/src/api/brewery/plan.js
new file mode 100644
index 0000000..c536576
--- /dev/null
+++ b/src/api/brewery/plan.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询啤酒币方案列表
+export function listPlan(query) {
+  return request({
+    url: '/brewery/plan/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询啤酒币方案详细
+export function getPlan(id) {
+  return request({
+    url: '/brewery/plan/' + id,
+    method: 'get'
+  })
+}
+
+// 新增啤酒币方案
+export function addPlan(data) {
+  return request({
+    url: '/brewery/plan',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改啤酒币方案
+export function updatePlan(data) {
+  return request({
+    url: '/brewery/plan',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除啤酒币方案
+export function delPlan(id) {
+  return request({
+    url: '/brewery/plan/' + id,
+    method: 'delete'
+  })
+}
diff --git a/src/api/brewery/printTemplate.js b/src/api/brewery/printTemplate.js
new file mode 100644
index 0000000..5420d78
--- /dev/null
+++ b/src/api/brewery/printTemplate.js
@@ -0,0 +1,52 @@
+import request from "@/utils/request";
+
+// 查询品牌方标签套打模板列表
+export function listBreweryTagPrintTemplate(query) {
+  return request({
+    url: "/brewery/breweryTagPrintTemplate/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询品牌方标签套打模板详细
+export function getBreweryTagPrintTemplate(id) {
+  return request({
+    url: "/brewery/breweryTagPrintTemplate/" + id,
+    method: "get",
+  });
+}
+
+// 新增品牌方标签套打模板
+export function addBreweryTagPrintTemplate(data) {
+  return request({
+    url: "/brewery/breweryTagPrintTemplate",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改品牌方标签套打模板
+export function updateBreweryTagPrintTemplate(data) {
+  return request({
+    url: "/brewery/breweryTagPrintTemplate",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除品牌方标签套打模板
+export function delBreweryTagPrintTemplate(id) {
+  return request({
+    url: "/brewery/breweryTagPrintTemplate/" + id,
+    method: "delete",
+  });
+}
+
+// 所有模版
+export function allTemplate() {
+  return request({
+    url: "/brewery/breweryTagPrintTemplate/allList",
+    method: "get",
+  });
+}
diff --git a/src/api/brewery/qrcode.js b/src/api/brewery/qrcode.js
new file mode 100644
index 0000000..9b0fba1
--- /dev/null
+++ b/src/api/brewery/qrcode.js
@@ -0,0 +1,69 @@
+import request from "@/utils/request";
+
+// 查询酒品二维码列表
+export function listQrcode(query) {
+  return request({
+    url: "/brewery/qrcode/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询酒品二维码详细
+export function getQrcode(id) {
+  return request({
+    url: "/brewery/qrcode/" + id,
+    method: "get",
+  });
+}
+
+// 新增酒品二维码
+export function addQrcode(data) {
+  return request({
+    url: "/brewery/qrcode",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改酒品二维码
+export function updateQrcode(data) {
+  return request({
+    url: "/brewery/qrcode",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除酒品二维码
+export function delQrcode(id) {
+  return request({
+    url: "/brewery/qrcode/" + id,
+    method: "delete",
+  });
+}
+
+//  批量生成二维码
+export function generateQrcodeByBatch(batchId) {
+  return request({
+    url: "/brewery/qrcode/batch?batchId=" + batchId,
+    method: "post",
+  });
+}
+
+// 查询某个二维码扫码记录(无效和有效的)
+export function qrcodeScanLogList(qrcodeId) {
+  return request({
+    url: "/brewery/qrcodeScanLog/qrcodeScanLogList?qrcodeId=" + qrcodeId,
+    method: "get",
+  });
+}
+
+// 撤销核销记录
+export function cancelConsume(data) {
+  return request({
+    url: "/brewery/qrcodeScanLog/cancelConsume",
+    method: "post",
+    data,
+  });
+}
diff --git a/src/api/brewery/redeemOrder.js b/src/api/brewery/redeemOrder.js
new file mode 100644
index 0000000..63ad405
--- /dev/null
+++ b/src/api/brewery/redeemOrder.js
@@ -0,0 +1,97 @@
+import request from "@/utils/request";
+
+// 查询兑换订单列表
+export function listRedeemOrder(query) {
+  return request({
+    url: "/brewery/redeemOrder/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询兑换订单详细
+export function getRedeemOrder(id) {
+  return request({
+    url: "/brewery/redeemOrder/" + id,
+    method: "get",
+  });
+}
+
+// 新增兑换订单
+export function addRedeemOrder(data) {
+  return request({
+    url: "/brewery/redeemOrder",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改兑换订单
+export function updateRedeemOrder(data) {
+  return request({
+    url: "/brewery/redeemOrder",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除兑换订单
+export function delRedeemOrder(id) {
+  return request({
+    url: "/brewery/redeemOrder/" + id,
+    method: "delete",
+  });
+}
+
+// 导出兑换订单
+export function exportRedeemOrder(query) {
+  return request({
+    url: "/brewery/redeemOrder/export",
+    method: "post",
+    params: query,
+  });
+}
+
+// 取消订单
+export function cancelRedeemOrder(data) {
+  return request({
+    url: "/brewery/redeemOrder/cancel",
+    method: "post",
+    data: data,
+  });
+}
+
+// 订单发货
+export function deliveryRedeemOrder(data) {
+  return request({
+    url: "/brewery/redeemOrder/delivery",
+    method: "post",
+    data: data,
+  });
+}
+
+// 活动奖励兑付订单接口
+export function activityRedeemOrder(data) {
+  return request({
+    url: "/brewery/order/rewardOrderList",
+    method: "get",
+    data: data,
+  });
+}
+
+// 查询品牌方活动兑付订单详情
+export function getOrderInfo(id) {
+  return request({
+    url: "/brewery/order/" + id,
+    method: "get",
+  });
+}
+
+//  品牌方兑付订单发货
+export function dispatchRew(data) {
+  return request({
+    url: "/brewery/order/dispatchRew",
+    method: "post",
+    data: data,
+  });
+}
diff --git a/src/api/brewery/reply.js b/src/api/brewery/reply.js
new file mode 100644
index 0000000..344b258
--- /dev/null
+++ b/src/api/brewery/reply.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询酒评回复列表
+export function listReply(query) {
+  return request({
+    url: '/brewery/reply/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询酒评回复详细
+export function getReply(id) {
+  return request({
+    url: '/brewery/reply/' + id,
+    method: 'get'
+  })
+}
+
+// 新增酒评回复
+export function addReply(data) {
+  return request({
+    url: '/brewery/reply',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改酒评回复
+export function updateReply(data) {
+  return request({
+    url: '/brewery/reply',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除酒评回复
+export function delReply(id) {
+  return request({
+    url: '/brewery/reply/' + id,
+    method: 'delete'
+  })
+}
diff --git a/src/api/brewery/review.js b/src/api/brewery/review.js
new file mode 100644
index 0000000..a144fe8
--- /dev/null
+++ b/src/api/brewery/review.js
@@ -0,0 +1,71 @@
+import request from "@/utils/request";
+
+// 查询酒评列表
+export function listReview(query) {
+  return request({
+    url: "/brewery/review/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询酒评详细
+export function getReview(id) {
+  return request({
+    url: "/brewery/review/" + id,
+    method: "get",
+  });
+}
+
+// 新增酒评
+export function addReview(data) {
+  return request({
+    url: "/brewery/review",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改酒评
+export function updateReview(data) {
+  return request({
+    url: "/brewery/review",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除酒评
+export function delReview(id) {
+  return request({
+    url: "/brewery/review/" + id,
+    method: "delete",
+  });
+}
+
+// 酒评top10
+export function topReview10BeersList(query) {
+  return request({
+    url: "/brewery/review/top10BeersList",
+    method: "get",
+    params: query,
+  });
+}
+
+// 置顶
+export function setTop(id) {
+  return request({
+    url: "/brewery/review/setTop",
+    method: "post",
+    params: { id: id },
+  });
+}
+
+// 取消置顶
+export function cancelTop(id) {
+  return request({
+    url: "/brewery/review/cancelTop",
+    method: "post",
+    params: { id: id },
+  });
+}
diff --git a/src/api/login.js b/src/api/login.js
new file mode 100644
index 0000000..cf3bfff
--- /dev/null
+++ b/src/api/login.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+// 登录方法
+export function login(username, password, code, uuid) {
+  const data = {
+    username,
+    password,
+    code,
+    uuid
+  }
+  return request({
+    url: '/brewery/login',
+    headers: {
+      isToken: false,
+      repeatSubmit: false
+    },
+    method: 'post',
+    data: data
+  })
+}
+
+// 注册方法
+export function register(data) {
+  return request({
+    url: '/register',
+    headers: {
+      isToken: false
+    },
+    method: 'post',
+    data: data
+  })
+}
+
+// 获取用户详细信息
+export function getInfo() {
+  return request({
+    url: '/brewery/getInfo',
+    method: 'get'
+  })
+}
+
+// 退出方法
+export function logout() {
+  return request({
+    url: '/logout',
+    method: 'post'
+  })
+}
+
+// 获取验证码
+export function getCodeImg() {
+  return request({
+    url: '/captchaImage',
+    headers: {
+      isToken: false
+    },
+    method: 'get',
+    timeout: 20000
+  })
+}
\ No newline at end of file
diff --git a/src/api/menu.js b/src/api/menu.js
new file mode 100644
index 0000000..3442183
--- /dev/null
+++ b/src/api/menu.js
@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+// 获取路由
+export const getRouters = () => {
+  return request({
+    url: '/brewery/getRouters',
+    method: 'get'
+  })
+}
\ No newline at end of file
diff --git a/src/api/monitor/cache.js b/src/api/monitor/cache.js
new file mode 100644
index 0000000..72c5f6a
--- /dev/null
+++ b/src/api/monitor/cache.js
@@ -0,0 +1,57 @@
+import request from '@/utils/request'
+
+// 查询缓存详细
+export function getCache() {
+  return request({
+    url: '/monitor/cache',
+    method: 'get'
+  })
+}
+
+// 查询缓存名称列表
+export function listCacheName() {
+  return request({
+    url: '/monitor/cache/getNames',
+    method: 'get'
+  })
+}
+
+// 查询缓存键名列表
+export function listCacheKey(cacheName) {
+  return request({
+    url: '/monitor/cache/getKeys/' + cacheName,
+    method: 'get'
+  })
+}
+
+// 查询缓存内容
+export function getCacheValue(cacheName, cacheKey) {
+  return request({
+    url: '/monitor/cache/getValue/' + cacheName + '/' + cacheKey,
+    method: 'get'
+  })
+}
+
+// 清理指定名称缓存
+export function clearCacheName(cacheName) {
+  return request({
+    url: '/monitor/cache/clearCacheName/' + cacheName,
+    method: 'delete'
+  })
+}
+
+// 清理指定键名缓存
+export function clearCacheKey(cacheKey) {
+  return request({
+    url: '/monitor/cache/clearCacheKey/' + cacheKey,
+    method: 'delete'
+  })
+}
+
+// 清理全部缓存
+export function clearCacheAll() {
+  return request({
+    url: '/monitor/cache/clearCacheAll',
+    method: 'delete'
+  })
+}
diff --git a/src/api/monitor/job.js b/src/api/monitor/job.js
new file mode 100644
index 0000000..3815569
--- /dev/null
+++ b/src/api/monitor/job.js
@@ -0,0 +1,71 @@
+import request from '@/utils/request'
+
+// 查询定时任务调度列表
+export function listJob(query) {
+  return request({
+    url: '/monitor/job/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询定时任务调度详细
+export function getJob(jobId) {
+  return request({
+    url: '/monitor/job/' + jobId,
+    method: 'get'
+  })
+}
+
+// 新增定时任务调度
+export function addJob(data) {
+  return request({
+    url: '/monitor/job',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改定时任务调度
+export function updateJob(data) {
+  return request({
+    url: '/monitor/job',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除定时任务调度
+export function delJob(jobId) {
+  return request({
+    url: '/monitor/job/' + jobId,
+    method: 'delete'
+  })
+}
+
+// 任务状态修改
+export function changeJobStatus(jobId, status) {
+  const data = {
+    jobId,
+    status
+  }
+  return request({
+    url: '/monitor/job/changeStatus',
+    method: 'put',
+    data: data
+  })
+}
+
+
+// 定时任务立即执行一次
+export function runJob(jobId, jobGroup) {
+  const data = {
+    jobId,
+    jobGroup
+  }
+  return request({
+    url: '/monitor/job/run',
+    method: 'put',
+    data: data
+  })
+}
\ No newline at end of file
diff --git a/src/api/monitor/jobLog.js b/src/api/monitor/jobLog.js
new file mode 100644
index 0000000..6e0be61
--- /dev/null
+++ b/src/api/monitor/jobLog.js
@@ -0,0 +1,26 @@
+import request from '@/utils/request'
+
+// 查询调度日志列表
+export function listJobLog(query) {
+  return request({
+    url: '/monitor/jobLog/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 删除调度日志
+export function delJobLog(jobLogId) {
+  return request({
+    url: '/monitor/jobLog/' + jobLogId,
+    method: 'delete'
+  })
+}
+
+// 清空调度日志
+export function cleanJobLog() {
+  return request({
+    url: '/monitor/jobLog/clean',
+    method: 'delete'
+  })
+}
diff --git a/src/api/monitor/logininfor.js b/src/api/monitor/logininfor.js
new file mode 100644
index 0000000..4d112b7
--- /dev/null
+++ b/src/api/monitor/logininfor.js
@@ -0,0 +1,34 @@
+import request from '@/utils/request'
+
+// 查询登录日志列表
+export function list(query) {
+  return request({
+    url: '/monitor/logininfor/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 删除登录日志
+export function delLogininfor(infoId) {
+  return request({
+    url: '/monitor/logininfor/' + infoId,
+    method: 'delete'
+  })
+}
+
+// 解锁用户登录状态
+export function unlockLogininfor(userName) {
+  return request({
+    url: '/monitor/logininfor/unlock/' + userName,
+    method: 'get'
+  })
+}
+
+// 清空登录日志
+export function cleanLogininfor() {
+  return request({
+    url: '/monitor/logininfor/clean',
+    method: 'delete'
+  })
+}
diff --git a/src/api/monitor/online.js b/src/api/monitor/online.js
new file mode 100644
index 0000000..bd22137
--- /dev/null
+++ b/src/api/monitor/online.js
@@ -0,0 +1,18 @@
+import request from '@/utils/request'
+
+// 查询在线用户列表
+export function list(query) {
+  return request({
+    url: '/monitor/online/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 强退用户
+export function forceLogout(tokenId) {
+  return request({
+    url: '/monitor/online/' + tokenId,
+    method: 'delete'
+  })
+}
diff --git a/src/api/monitor/operlog.js b/src/api/monitor/operlog.js
new file mode 100644
index 0000000..a04bca8
--- /dev/null
+++ b/src/api/monitor/operlog.js
@@ -0,0 +1,26 @@
+import request from '@/utils/request'
+
+// 查询操作日志列表
+export function list(query) {
+  return request({
+    url: '/monitor/operlog/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 删除操作日志
+export function delOperlog(operId) {
+  return request({
+    url: '/monitor/operlog/' + operId,
+    method: 'delete'
+  })
+}
+
+// 清空操作日志
+export function cleanOperlog() {
+  return request({
+    url: '/monitor/operlog/clean',
+    method: 'delete'
+  })
+}
diff --git a/src/api/monitor/server.js b/src/api/monitor/server.js
new file mode 100644
index 0000000..e1f9ca2
--- /dev/null
+++ b/src/api/monitor/server.js
@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+// 获取服务信息
+export function getServer() {
+  return request({
+    url: '/monitor/server',
+    method: 'get'
+  })
+}
\ No newline at end of file
diff --git a/src/api/system/config.js b/src/api/system/config.js
new file mode 100644
index 0000000..a404d82
--- /dev/null
+++ b/src/api/system/config.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+// 查询参数列表
+export function listConfig(query) {
+  return request({
+    url: '/system/config/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询参数详细
+export function getConfig(configId) {
+  return request({
+    url: '/system/config/' + configId,
+    method: 'get'
+  })
+}
+
+// 根据参数键名查询参数值
+export function getConfigKey(configKey) {
+  return request({
+    url: '/system/config/configKey/' + configKey,
+    method: 'get'
+  })
+}
+
+// 新增参数配置
+export function addConfig(data) {
+  return request({
+    url: '/system/config',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改参数配置
+export function updateConfig(data) {
+  return request({
+    url: '/system/config',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除参数配置
+export function delConfig(configId) {
+  return request({
+    url: '/system/config/' + configId,
+    method: 'delete'
+  })
+}
+
+// 刷新参数缓存
+export function refreshCache() {
+  return request({
+    url: '/system/config/refreshCache',
+    method: 'delete'
+  })
+}
diff --git a/src/api/system/dept.js b/src/api/system/dept.js
new file mode 100644
index 0000000..fc943cd
--- /dev/null
+++ b/src/api/system/dept.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+
+// 查询部门列表
+export function listDept(query) {
+  return request({
+    url: '/system/dept/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询部门列表（排除节点）
+export function listDeptExcludeChild(deptId) {
+  return request({
+    url: '/system/dept/list/exclude/' + deptId,
+    method: 'get'
+  })
+}
+
+// 查询部门详细
+export function getDept(deptId) {
+  return request({
+    url: '/system/dept/' + deptId,
+    method: 'get'
+  })
+}
+
+// 新增部门
+export function addDept(data) {
+  return request({
+    url: '/system/dept',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改部门
+export function updateDept(data) {
+  return request({
+    url: '/system/dept',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除部门
+export function delDept(deptId) {
+  return request({
+    url: '/system/dept/' + deptId,
+    method: 'delete'
+  })
+}
\ No newline at end of file
diff --git a/src/api/system/dict/data.js b/src/api/system/dict/data.js
new file mode 100644
index 0000000..6c9eb79
--- /dev/null
+++ b/src/api/system/dict/data.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+
+// 查询字典数据列表
+export function listData(query) {
+  return request({
+    url: '/system/dict/data/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询字典数据详细
+export function getData(dictCode) {
+  return request({
+    url: '/system/dict/data/' + dictCode,
+    method: 'get'
+  })
+}
+
+// 根据字典类型查询字典数据信息
+export function getDicts(dictType) {
+  return request({
+    url: '/system/dict/data/type/' + dictType,
+    method: 'get'
+  })
+}
+
+// 新增字典数据
+export function addData(data) {
+  return request({
+    url: '/system/dict/data',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改字典数据
+export function updateData(data) {
+  return request({
+    url: '/system/dict/data',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除字典数据
+export function delData(dictCode) {
+  return request({
+    url: '/system/dict/data/' + dictCode,
+    method: 'delete'
+  })
+}
diff --git a/src/api/system/dict/type.js b/src/api/system/dict/type.js
new file mode 100644
index 0000000..a0254ba
--- /dev/null
+++ b/src/api/system/dict/type.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+// 查询字典类型列表
+export function listType(query) {
+  return request({
+    url: '/system/dict/type/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询字典类型详细
+export function getType(dictId) {
+  return request({
+    url: '/system/dict/type/' + dictId,
+    method: 'get'
+  })
+}
+
+// 新增字典类型
+export function addType(data) {
+  return request({
+    url: '/system/dict/type',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改字典类型
+export function updateType(data) {
+  return request({
+    url: '/system/dict/type',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除字典类型
+export function delType(dictId) {
+  return request({
+    url: '/system/dict/type/' + dictId,
+    method: 'delete'
+  })
+}
+
+// 刷新字典缓存
+export function refreshCache() {
+  return request({
+    url: '/system/dict/type/refreshCache',
+    method: 'delete'
+  })
+}
+
+// 获取字典选择框列表
+export function optionselect() {
+  return request({
+    url: '/system/dict/type/optionselect',
+    method: 'get'
+  })
+}
diff --git a/src/api/system/menu.js b/src/api/system/menu.js
new file mode 100644
index 0000000..45f3b58
--- /dev/null
+++ b/src/api/system/menu.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+// 查询菜单列表
+export function listMenu(query) {
+  return request({
+    url: '/brewery/menu/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询菜单详细
+export function getMenu(menuId) {
+  return request({
+    url: '/brewery/menu/' + menuId,
+    method: 'get'
+  })
+}
+
+// 查询菜单下拉树结构
+export function treeselect() {
+  return request({
+    url: '/brewery/menu/treeselect',
+    method: 'get'
+  })
+}
+
+// 根据角色ID查询菜单下拉树结构
+export function roleMenuTreeselect(roleId) {
+  return request({
+    url: '/brewery/menu/roleMenuTreeselect/' + roleId,
+    method: 'get'
+  })
+}
+
+// 新增菜单
+export function addMenu(data) {
+  return request({
+    url: '/brewery/menu',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改菜单
+export function updateMenu(data) {
+  return request({
+    url: '/brewery/menu',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除菜单
+export function delMenu(menuId) {
+  return request({
+    url: '/brewery/menu/' + menuId,
+    method: 'delete'
+  })
+}
\ No newline at end of file
diff --git a/src/api/system/notice.js b/src/api/system/notice.js
new file mode 100644
index 0000000..c274ea5
--- /dev/null
+++ b/src/api/system/notice.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询公告列表
+export function listNotice(query) {
+  return request({
+    url: '/system/notice/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询公告详细
+export function getNotice(noticeId) {
+  return request({
+    url: '/system/notice/' + noticeId,
+    method: 'get'
+  })
+}
+
+// 新增公告
+export function addNotice(data) {
+  return request({
+    url: '/system/notice',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改公告
+export function updateNotice(data) {
+  return request({
+    url: '/system/notice',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除公告
+export function delNotice(noticeId) {
+  return request({
+    url: '/system/notice/' + noticeId,
+    method: 'delete'
+  })
+}
\ No newline at end of file
diff --git a/src/api/system/post.js b/src/api/system/post.js
new file mode 100644
index 0000000..1a8e9ca
--- /dev/null
+++ b/src/api/system/post.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询岗位列表
+export function listPost(query) {
+  return request({
+    url: '/system/post/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询岗位详细
+export function getPost(postId) {
+  return request({
+    url: '/system/post/' + postId,
+    method: 'get'
+  })
+}
+
+// 新增岗位
+export function addPost(data) {
+  return request({
+    url: '/system/post',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改岗位
+export function updatePost(data) {
+  return request({
+    url: '/system/post',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除岗位
+export function delPost(postId) {
+  return request({
+    url: '/system/post/' + postId,
+    method: 'delete'
+  })
+}
diff --git a/src/api/system/role.js b/src/api/system/role.js
new file mode 100644
index 0000000..f13e6f4
--- /dev/null
+++ b/src/api/system/role.js
@@ -0,0 +1,119 @@
+import request from '@/utils/request'
+
+// 查询角色列表
+export function listRole(query) {
+  return request({
+    url: '/system/role/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询角色详细
+export function getRole(roleId) {
+  return request({
+    url: '/system/role/' + roleId,
+    method: 'get'
+  })
+}
+
+// 新增角色
+export function addRole(data) {
+  return request({
+    url: '/system/role',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改角色
+export function updateRole(data) {
+  return request({
+    url: '/system/role',
+    method: 'put',
+    data: data
+  })
+}
+
+// 角色数据权限
+export function dataScope(data) {
+  return request({
+    url: '/system/role/dataScope',
+    method: 'put',
+    data: data
+  })
+}
+
+// 角色状态修改
+export function changeRoleStatus(roleId, status) {
+  const data = {
+    roleId,
+    status
+  }
+  return request({
+    url: '/system/role/changeStatus',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除角色
+export function delRole(roleId) {
+  return request({
+    url: '/system/role/' + roleId,
+    method: 'delete'
+  })
+}
+
+// 查询角色已授权用户列表
+export function allocatedUserList(query) {
+  return request({
+    url: '/system/role/authUser/allocatedList',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询角色未授权用户列表
+export function unallocatedUserList(query) {
+  return request({
+    url: '/system/role/authUser/unallocatedList',
+    method: 'get',
+    params: query
+  })
+}
+
+// 取消用户授权角色
+export function authUserCancel(data) {
+  return request({
+    url: '/system/role/authUser/cancel',
+    method: 'put',
+    data: data
+  })
+}
+
+// 批量取消用户授权角色
+export function authUserCancelAll(data) {
+  return request({
+    url: '/system/role/authUser/cancelAll',
+    method: 'put',
+    params: data
+  })
+}
+
+// 授权用户选择
+export function authUserSelectAll(data) {
+  return request({
+    url: '/system/role/authUser/selectAll',
+    method: 'put',
+    params: data
+  })
+}
+
+// 根据角色ID查询部门树结构
+export function deptTreeSelect(roleId) {
+  return request({
+    url: '/system/role/deptTree/' + roleId,
+    method: 'get'
+  })
+}
diff --git a/src/api/system/user.js b/src/api/system/user.js
new file mode 100644
index 0000000..c1df877
--- /dev/null
+++ b/src/api/system/user.js
@@ -0,0 +1,138 @@
+import request from "@/utils/request";
+import { parseStrEmpty } from "@/utils/ruoyi";
+
+// 查询用户列表
+export function listUser(query) {
+  return request({
+    url: "/brewery/user/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询用户详细
+export function getUser(userId) {
+  return request({
+    url: "/brewery/user/" + parseStrEmpty(userId),
+    method: "get",
+  });
+}
+
+// 新增用户
+export function addUser(data) {
+  return request({
+    url: "/brewery/user",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改用户
+export function updateUser(data) {
+  return request({
+    url: "/brewery/user",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除用户
+export function delUser(userId) {
+  return request({
+    url: "/brewery/user/" + userId,
+    method: "delete",
+  });
+}
+
+// 用户密码重置
+export function resetUserPwd(userId, password) {
+  const data = {
+    userId,
+    password,
+  };
+  return request({
+    url: "/brewery/user/resetPwd",
+    method: "put",
+    data: data,
+  });
+}
+
+// 用户状态修改
+export function changeUserStatus(userId, status) {
+  const data = {
+    userId,
+    status,
+  };
+  return request({
+    url: "/system/user/changeStatus",
+    method: "put",
+    data: data,
+  });
+}
+
+// 查询用户个人信息
+export function getUserProfile() {
+  return request({
+    // url: '/system/user/profile',
+    url: "/brewery/user/profile",
+    method: "get",
+  });
+}
+
+// 修改用户个人信息
+export function updateUserProfile(data) {
+  return request({
+    // url: "/system/user/profile",
+    url: "/brewery/user/profile",
+    method: "put",
+    data: data,
+  });
+}
+
+// 用户密码重置
+export function updateUserPwd(oldPassword, newPassword) {
+  const data = {
+    oldPassword,
+    newPassword,
+  };
+  return request({
+    url: "/brewery/user/profile/updatePwd",
+    method: "put",
+    data: data,
+  });
+}
+
+// 用户头像上传
+export function uploadAvatar(data) {
+  return request({
+    url: "/brewery/user/profile/avatar",
+    method: "post",
+    headers: { "Content-Type": "application/x-www-form-urlencoded" },
+    data: data,
+  });
+}
+
+// 查询授权角色
+export function getAuthRole(userId) {
+  return request({
+    url: "/system/user/authRole/" + userId,
+    method: "get",
+  });
+}
+
+// 保存授权角色
+export function updateAuthRole(data) {
+  return request({
+    url: "/system/user/authRole",
+    method: "put",
+    params: data,
+  });
+}
+
+// 查询部门下拉树结构
+export function deptTreeSelect() {
+  return request({
+    url: "/system/user/deptTree",
+    method: "get",
+  });
+}
diff --git a/src/api/tool/gen.js b/src/api/tool/gen.js
new file mode 100644
index 0000000..2075677
--- /dev/null
+++ b/src/api/tool/gen.js
@@ -0,0 +1,85 @@
+import request from '@/utils/request'
+
+// 查询生成表数据
+export function listTable(query) {
+  return request({
+    url: '/tool/gen/list',
+    method: 'get',
+    params: query
+  })
+}
+// 查询db数据库列表
+export function listDbTable(query) {
+  return request({
+    url: '/tool/gen/db/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询表详细信息
+export function getGenTable(tableId) {
+  return request({
+    url: '/tool/gen/' + tableId,
+    method: 'get'
+  })
+}
+
+// 修改代码生成信息
+export function updateGenTable(data) {
+  return request({
+    url: '/tool/gen',
+    method: 'put',
+    data: data
+  })
+}
+
+// 导入表
+export function importTable(data) {
+  return request({
+    url: '/tool/gen/importTable',
+    method: 'post',
+    params: data
+  })
+}
+
+// 创建表
+export function createTable(data) {
+  return request({
+    url: '/tool/gen/createTable',
+    method: 'post',
+    params: data
+  })
+}
+
+// 预览生成代码
+export function previewTable(tableId) {
+  return request({
+    url: '/tool/gen/preview/' + tableId,
+    method: 'get'
+  })
+}
+
+// 删除表数据
+export function delTable(tableId) {
+  return request({
+    url: '/tool/gen/' + tableId,
+    method: 'delete'
+  })
+}
+
+// 生成代码（自定义路径）
+export function genCode(tableName) {
+  return request({
+    url: '/tool/gen/genCode/' + tableName,
+    method: 'get'
+  })
+}
+
+// 同步数据库
+export function synchDb(tableName) {
+  return request({
+    url: '/tool/gen/synchDb/' + tableName,
+    method: 'get'
+  })
+}
diff --git a/src/assets/401_images/401.gif b/src/assets/401_images/401.gif
new file mode 100644
index 0000000..cd6e0d9
Binary files /dev/null and b/src/assets/401_images/401.gif differ
diff --git a/src/assets/404_images/404.png b/src/assets/404_images/404.png
new file mode 100644
index 0000000..3d8e230
Binary files /dev/null and b/src/assets/404_images/404.png differ
diff --git a/src/assets/404_images/404_cloud.png b/src/assets/404_images/404_cloud.png
new file mode 100644
index 0000000..c6281d0
Binary files /dev/null and b/src/assets/404_images/404_cloud.png differ
diff --git a/src/assets/icons/svg/404.svg b/src/assets/icons/svg/404.svg
new file mode 100644
index 0000000..6df5019
--- /dev/null
+++ b/src/assets/icons/svg/404.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M121.718 73.272v9.953c3.957-7.584 6.199-16.05 6.199-24.995C127.917 26.079 99.273 0 63.958 0 28.644 0 0 26.079 0 58.23c0 .403.028.806.028 1.21l22.97-25.953h13.34l-19.76 27.187h6.42V53.77l13.728-19.477v49.361H22.998V73.272H2.158c5.951 20.284 23.608 36.208 45.998 41.399-1.44 3.3-5.618 11.263-12.565 12.674-8.607 1.764 23.358.428 46.163-13.178 17.519-4.611 31.938-15.849 39.77-30.513h-13.506V73.272H85.02V59.464l22.998-25.977h13.008l-19.429 27.187h6.421v-7.433l13.727-19.402v39.433h-.027zm-78.24 2.822a10.516 10.516 0 0 1-.996-4.535V44.548c0-1.613.332-3.124.996-4.535a11.66 11.66 0 0 1 2.713-3.68c1.134-1.032 2.49-1.864 4.04-2.468 1.55-.605 3.21-.908 4.982-.908h11.292c1.77 0 3.431.303 4.981.908 1.522.604 2.85 1.41 3.986 2.418l-12.26 16.303v-2.898a1.96 1.96 0 0 0-.665-1.512c-.443-.403-.996-.604-1.66-.604-.665 0-1.218.201-1.661.604a1.96 1.96 0 0 0-.664 1.512v9.071L44.364 77.606a10.556 10.556 0 0 1-.886-1.512zm35.73-4.535c0 1.613-.332 3.124-.997 4.535a11.66 11.66 0 0 1-2.712 3.68c-1.134 1.032-2.49 1.864-4.04 2.469-1.55.604-3.21.907-4.982.907H55.185c-1.77 0-3.431-.303-4.981-.907-1.55-.605-2.906-1.437-4.041-2.47a12.49 12.49 0 0 1-1.384-1.512l13.727-18.217v6.375c0 .605.222 1.109.665 1.512.442.403.996.604 1.66.604.664 0 1.218-.201 1.66-.604a1.96 1.96 0 0 0 .665-1.512V53.87L75.97 36.838c.913.932 1.66 1.99 2.214 3.175.664 1.41.996 2.922.996 4.535v27.011h.028z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/beerReview.svg b/src/assets/icons/svg/beerReview.svg
new file mode 100644
index 0000000..25b9b00
--- /dev/null
+++ b/src/assets/icons/svg/beerReview.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="60" height="60" viewBox="0 0 60 60"><g><g style="opacity:0.20999999344348907;"><path d="M30,0L37,0Q37.5646,0,38.1286,0.0277045Q38.6925,0.055409,39.2544,0.110751Q39.8163,0.166094,40.3748,0.24894Q40.9333,0.331787,41.4871,0.441938Q42.0408,0.55209,42.5885,0.689281Q43.1362,0.826472,43.6765,0.990372Q44.2169,1.15427,44.7485,1.34449Q45.2801,1.5347,45.8017,1.75077Q46.3234,1.96684,46.8338,2.20825Q47.3442,2.44965,47.8421,2.71581Q48.3401,2.98197,48.8244,3.27224Q49.3087,3.56251,49.7781,3.8762Q50.2476,4.18988,50.7011,4.52623Q51.1546,4.86257,51.591,5.22076Q52.0275,5.57895,52.4459,5.95812Q52.8642,6.3373,53.2635,6.73654Q53.6627,7.13579,54.0419,7.55414Q54.4211,7.9725,54.7792,8.40895Q55.1374,8.84541,55.4738,9.29892Q55.8101,9.75242,56.1238,10.2219Q56.4375,10.6913,56.7278,11.1756Q57.018,11.6599,57.2842,12.1579Q57.5503,12.6558,57.7917,13.1662Q58.0331,13.6766,58.2492,14.1983Q58.4653,14.7199,58.6555,15.2515Q58.8457,15.7831,59.0096,16.3235Q59.1735,16.8638,59.3107,17.4115Q59.4479,17.9592,59.5581,18.5129Q59.6682,19.0667,59.7511,19.6252Q59.8339,20.1837,59.8892,20.7456Q59.9446,21.3075,59.9723,21.8714Q60,22.4354,60,23L60,37Q60,37.5646,59.9723,38.1286Q59.9446,38.6925,59.8892,39.2544Q59.8339,39.8163,59.751,40.3748Q59.6682,40.9333,59.5581,41.4871Q59.4479,42.0408,59.3107,42.5885Q59.1735,43.1362,59.0096,43.6765Q58.8457,44.2169,58.6555,44.7485Q58.4653,45.2801,58.2492,45.8017Q58.0331,46.3234,57.7917,46.8338Q57.5503,47.3442,57.2842,47.8421Q57.018,48.3401,56.7278,48.8244Q56.4375,49.3087,56.1238,49.7781Q55.8101,50.2476,55.4738,50.7011Q55.1374,51.1546,54.7792,51.591Q54.4211,52.0275,54.0419,52.4459Q53.6627,52.8642,53.2635,53.2635Q52.8642,53.6627,52.4459,54.0419Q52.0275,54.4211,51.591,54.7792Q51.1546,55.1374,50.7011,55.4738Q50.2476,55.8101,49.7781,56.1238Q49.3087,56.4375,48.8244,56.7278Q48.3401,57.018,47.8421,57.2842Q47.3442,57.5503,46.8338,57.7917Q46.3234,58.0331,45.8017,58.2492Q45.2801,58.4653,44.7485,58.6555Q44.2169,58.8457,43.6765,59.0096Q43.1362,59.1735,42.5885,59.3107Q42.0408,59.4479,41.4871,59.5581Q40.9333,59.6682,40.3748,59.7511Q39.8163,59.8339,39.2544,59.8892Q38.6925,59.9446,38.1286,59.9723Q37.5646,60,37,60L23,60Q22.4354,60,21.8714,59.9723Q21.3075,59.9446,20.7456,59.8892Q20.1837,59.8339,19.6252,59.751Q19.0667,59.6682,18.5129,59.5581Q17.9592,59.4479,17.4115,59.3107Q16.8638,59.1735,16.3235,59.0096Q15.7831,58.8457,15.2515,58.6555Q14.7199,58.4653,14.1983,58.2492Q13.6766,58.0331,13.1662,57.7917Q12.6558,57.5503,12.1579,57.2842Q11.6599,57.018,11.1756,56.7278Q10.6913,56.4375,10.2219,56.1238Q9.75242,55.8101,9.29892,55.4738Q8.84541,55.1374,8.40895,54.7792Q7.9725,54.4211,7.55414,54.0419Q7.13579,53.6627,6.73654,53.2635Q6.3373,52.8642,5.95812,52.4459Q5.57895,52.0275,5.22076,51.591Q4.86257,51.1546,4.52623,50.7011Q4.18988,50.2476,3.8762,49.7781Q3.56251,49.3087,3.27224,48.8244Q2.98197,48.3401,2.71581,47.8421Q2.44965,47.3442,2.20825,46.8338Q1.96684,46.3234,1.75077,45.8017Q1.5347,45.2801,1.34449,44.7485Q1.15427,44.2169,0.990372,43.6765Q0.826472,43.1362,0.689281,42.5885Q0.55209,42.0408,0.441938,41.4871Q0.331787,40.9333,0.24894,40.3748Q0.166094,39.8163,0.110751,39.2544Q0.055409,38.6925,0.0277045,38.1286Q0,37.5646,0,37L0,23Q0,22.4354,0.0277045,21.8714Q0.055409,21.3075,0.110751,20.7456Q0.166094,20.1837,0.24894,19.6252Q0.331787,19.0667,0.441938,18.5129Q0.55209,17.9592,0.689281,17.4115Q0.826472,16.8638,0.990372,16.3235Q1.15427,15.7831,1.34449,15.2515Q1.5347,14.7199,1.75077,14.1983Q1.96684,13.6766,2.20825,13.1662Q2.44965,12.6558,2.71581,12.1579Q2.98197,11.6599,3.27224,11.1756Q3.56251,10.6913,3.8762,10.2219Q4.18988,9.75242,4.52623,9.29892Q4.86257,8.84541,5.22076,8.40895Q5.57895,7.9725,5.95812,7.55414Q6.3373,7.13579,6.73654,6.73654Q7.13579,6.3373,7.55414,5.95812Q7.9725,5.57895,8.40895,5.22076Q8.84541,4.86257,9.29892,4.52623Q9.75242,4.18988,10.2219,3.8762Q10.6913,3.56251,11.1756,3.27224Q11.6599,2.98197,12.1579,2.71581Q12.6558,2.44965,13.1662,2.20825Q13.6766,1.96684,14.1983,1.75077Q14.7199,1.5347,15.2515,1.34449Q15.7831,1.15427,16.3235,0.990372Q16.8638,0.826472,17.4115,0.689281Q17.9592,0.55209,18.5129,0.441938Q19.0667,0.331787,19.6252,0.24894Q20.1837,0.166094,20.7456,0.110751Q21.3075,0.055409,21.8714,0.0277045Q22.4354,0,23,0L30,0Z" fill-rule="evenodd" fill="#8280FF" fill-opacity="1"/></g><g><g style="opacity:0.5878208875656128;"><path d="M41.9989921875,28.667Q41.9989921875,28.863500000000002,41.979792187499996,29.0591Q41.9604921875,29.2546,41.9221921875,29.447400000000002Q41.8837921875,29.6401,41.826792187500004,29.8281Q41.7696921875,30.016199999999998,41.6944921875,30.197699999999998Q41.6192921875,30.3793,41.526692187500004,30.552599999999998Q41.4340921875,30.7259,41.3248921875,30.8893Q41.2156921875,31.0527,41.091092187499996,31.2046Q40.9663921875,31.3565,40.8274921875,31.4954Q40.6884921875,31.6344,40.5365921875,31.759Q40.3846921875,31.883699999999997,40.2212921875,31.9929Q40.0578921875,32.102000000000004,39.884592187500004,32.1947Q39.7112921875,32.2873,39.5297921875,32.3625Q39.348192187500004,32.4377,39.1601921875,32.4948Q38.972092187499996,32.5518,38.7793921875,32.5901Q38.5866921875,32.6285,38.3910921875,32.6477Q38.1954921875,32.667,37.9989921875,32.667Q37.8024921875,32.667,37.6069921875,32.6477Q37.4113921875,32.6285,37.2186921875,32.5901Q37.0258921875,32.5518,36.8378921875,32.4948Q36.6497921875,32.4377,36.4682921875,32.3625Q36.2866921875,32.2873,36.1133921875,32.1947Q35.9400921875,32.102000000000004,35.776692187500004,31.9929Q35.6133921875,31.883699999999997,35.4614921875,31.759Q35.3095921875,31.6344,35.1705921875,31.4954Q35.0316921875,31.3565,34.9069921875,31.2046Q34.7822921875,31.0527,34.6731921875,30.8893Q34.5639921875,30.7259,34.4712921875,30.552599999999998Q34.3786921875,30.3793,34.3034921875,30.197699999999998Q34.2282921875,30.016199999999998,34.1712921875,29.8281Q34.1141921875,29.6401,34.0758921875,29.447400000000002Q34.037592187499996,29.2546,34.0182921875,29.0591Q33.9989921875,28.863500000000002,33.9989921875,28.667Q33.9989921875,28.4705,34.0182921875,28.274900000000002Q34.037592187499996,28.0794,34.0758921875,27.88663Q34.1141921875,27.6939,34.1712921875,27.505850000000002Q34.2282921875,27.31781,34.3034921875,27.13626Q34.3786921875,26.95471,34.4712921875,26.781399999999998Q34.5639921875,26.6081,34.6731921875,26.44471Q34.7822921875,26.28132,34.9069921875,26.12942Q35.0316921875,25.97752,35.1705921875,25.83856Q35.3095921875,25.69961,35.4614921875,25.57495Q35.6133921875,25.45029,35.776692187500004,25.34111Q35.9400921875,25.23194,36.1133921875,25.139310000000002Q36.2866921875,25.04667,36.4682921875,24.97147Q36.6497921875,24.89627,36.8378921875,24.83923Q37.0258921875,24.78219,37.2186921875,24.743850000000002Q37.4113921875,24.70551,37.6069921875,24.68625Q37.8024921875,24.66699,37.9989921875,24.66699Q38.1954921875,24.66699,38.3910921875,24.68625Q38.5866921875,24.70551,38.7793921875,24.743850000000002Q38.972092187499996,24.78219,39.1601921875,24.83923Q39.348192187500004,24.89627,39.5297921875,24.97147Q39.7112921875,25.04667,39.884592187500004,25.139310000000002Q40.0578921875,25.23194,40.2212921875,25.34111Q40.3846921875,25.45029,40.5365921875,25.57495Q40.6884921875,25.69961,40.8274921875,25.83856Q40.9663921875,25.97752,41.091092187499996,26.12942Q41.2156921875,26.28132,41.3248921875,26.44471Q41.4340921875,26.6081,41.526692187500004,26.781399999999998Q41.6192921875,26.95471,41.6944921875,27.13626Q41.7696921875,27.31781,41.826792187500004,27.505850000000002Q41.8837921875,27.6939,41.9221921875,27.88663Q41.9604921875,28.0794,41.979792187499996,28.274900000000002Q41.9989921875,28.4705,41.9989921875,28.667ZM31.3336921875,23.33333Q31.3336921875,23.46426,31.3271921875,23.59503Q31.3207921875,23.7258,31.3079921875,23.856090000000002Q31.2951921875,23.98639,31.2758921875,24.1159Q31.2566921875,24.2454,31.2311921875,24.37381Q31.205592187500002,24.50222,31.1737921875,24.62923Q31.1419921875,24.756230000000002,31.103992187499998,24.881520000000002Q31.0659921875,25.00681,31.0218921875,25.13008Q30.9777921875,25.25335,30.9276921875,25.37431Q30.8775921875,25.495269999999998,30.821592187500002,25.61363Q30.765592187499998,25.73198,30.7038921875,25.847450000000002Q30.642182187499998,25.96291,30.574882187500002,26.07521Q30.5075721875,26.18751,30.4348321875,26.29637Q30.3620921875,26.40524,30.2841021875,26.5104Q30.2061021875,26.615560000000002,30.1230521875,26.71676Q30.039992187499998,26.817970000000003,29.952062187499997,26.91498Q29.8641421875,27.01199,29.771562187500002,27.104570000000002Q29.6789821875,27.19715,29.5819721875,27.285069999999997Q29.484962187500003,27.372999999999998,29.3837621875,27.45606Q29.282552187500002,27.53911,29.1773921875,27.61711Q29.0722321875,27.6951,28.9633621875,27.76784Q28.8545021875,27.84058,28.7422021875,27.907890000000002Q28.6299021875,27.975189999999998,28.514442187500002,28.0369Q28.3989721875,28.098599999999998,28.2806221875,28.154600000000002Q28.162262187499998,28.2106,28.0413021875,28.2607Q27.9203421875,28.3108,27.7970721875,28.3549Q27.6738021875,28.399,27.548512187500002,28.436999999999998Q27.423222187500002,28.475,27.2962221875,28.5068Q27.1692121875,28.538600000000002,27.040812187500002,28.5642Q26.9123921875,28.5897,26.7828921875,28.6089Q26.6533821875,28.6282,26.523082187500002,28.641Q26.3927921875,28.6538,26.2620221875,28.6602Q26.1312521875,28.6667,26.0003221875,28.6667Q25.8694021875,28.6667,25.738632187500002,28.6602Q25.6078621875,28.6538,25.4775721875,28.641Q25.3472721875,28.6282,25.2177621875,28.6089Q25.0882521875,28.5897,24.9598421875,28.5642Q24.8314321875,28.538600000000002,24.7044321875,28.5068Q24.5774321875,28.475,24.4521421875,28.436999999999998Q24.326852187500002,28.399,24.2035821875,28.3549Q24.0803021875,28.3108,23.9593521875,28.2607Q23.8383921875,28.2106,23.7200321875,28.154600000000002Q23.6016721875,28.098599999999998,23.4862121875,28.0369Q23.3707421875,27.975189999999998,23.258442187500002,27.907890000000002Q23.1461421875,27.84058,23.0372821875,27.76784Q22.9284221875,27.6951,22.8232621875,27.61711Q22.7181021875,27.53911,22.6168921875,27.45606Q22.5156921875,27.372999999999998,22.4186821875,27.285069999999997Q22.3216721875,27.19715,22.2290921875,27.104570000000002Q22.1365121875,27.01199,22.0485821875,26.91498Q21.9606621875,26.817970000000003,21.8776021875,26.71677Q21.7945421875,26.615560000000002,21.7165521875,26.5104Q21.6385591875,26.40524,21.5658211875,26.29637Q21.4930821875,26.18751,21.4257731875,26.07521Q21.3584631875,25.96291,21.2967451875,25.847450000000002Q21.2350271875,25.73198,21.1790491875,25.61363Q21.1230711875,25.495269999999998,21.0729681875,25.37431Q21.0228651875,25.25335,20.9787571875,25.13008Q20.9346491875,25.00681,20.8966441875,24.881520000000002Q20.8586381875,24.756230000000002,20.8268251875,24.62923Q20.7950131875,24.50222,20.7694701875,24.373820000000002Q20.7439282875,24.2454,20.7247174875,24.1159Q20.7055065875,23.98639,20.6926736875,23.856090000000002Q20.6798406875,23.7258,20.6734164175,23.59503Q20.6669921875,23.46426,20.6669921875,23.33333Q20.6669921875,23.20241,20.6734164175,23.071640000000002Q20.6798406875,22.94087,20.6926736875,22.81058Q20.7055065875,22.68028,20.7247174875,22.55077Q20.7439282875,22.42126,20.7694701875,22.29285Q20.7950131875,22.16444,20.8268251875,22.03744Q20.8586381875,21.91044,20.8966441875,21.78515Q20.9346491875,21.659860000000002,20.9787571875,21.53659Q21.0228651875,21.41331,21.0729681875,21.29236Q21.1230711875,21.1714,21.1790491875,21.05304Q21.2350271875,20.93468,21.2967451875,20.81922Q21.3584631875,20.70375,21.4257731875,20.591450000000002Q21.4930821875,20.47915,21.5658211875,20.37029Q21.6385591875,20.26143,21.7165521875,20.15627Q21.7945421875,20.05111,21.8776021875,19.9499Q21.9606621875,19.8487,22.0485821875,19.75169Q22.1365121875,19.65468,22.2290921875,19.5621Q22.3216721875,19.46952,22.4186821875,19.38159Q22.5156921875,19.29367,22.6168921875,19.21061Q22.7181021875,19.12755,22.8232621875,19.04956Q22.9284221875,18.971567,23.0372821875,18.898829Q23.1461421875,18.82609,23.258442187500002,18.758781Q23.3707421875,18.691471,23.4862121875,18.629753Q23.6016721875,18.568035,23.7200321875,18.512057Q23.8383921875,18.456079,23.9593421875,18.405976Q24.0803021875,18.355873,24.2035821875,18.311765Q24.326852187500002,18.267657,24.4521421875,18.229652Q24.5774321875,18.191646,24.7044321875,18.159833Q24.8314321875,18.128021,24.9598421875,18.102478Q25.0882521875,18.0769361,25.2177621875,18.0577253Q25.3472721875,18.0385144,25.4775721875,18.0256815Q25.6078621875,18.0128485,25.738632187500002,18.00642423Q25.8694021875,18,26.0003221875,18Q26.1312521875,18,26.2620221875,18.00642423Q26.3927921875,18.0128485,26.523082187500002,18.0256815Q26.6533821875,18.0385144,26.7828921875,18.0577253Q26.9123921875,18.0769361,27.0408021875,18.102478Q27.1692121875,18.128021,27.2962221875,18.159833Q27.423222187500002,18.191646,27.548512187500002,18.229652Q27.6738021875,18.267657,27.7970721875,18.311765Q27.9203421875,18.355873,28.0413021875,18.405976Q28.162262187499998,18.456079,28.2806221875,18.512057Q28.3989721875,18.568035,28.514442187500002,18.629753Q28.6299021875,18.691471,28.7422021875,18.758781Q28.8545021875,18.82609,28.9633621875,18.898829Q29.0722321875,18.971567,29.1773921875,19.04956Q29.282552187500002,19.12755,29.3837521875,19.21061Q29.484962187500003,19.29367,29.5819721875,19.38159Q29.6789821875,19.46952,29.771562187500002,19.5621Q29.8641421875,19.65468,29.952062187499997,19.75169Q30.039992187499998,19.8487,30.1230521875,19.9499Q30.2061021875,20.05111,30.2841021875,20.15627Q30.3620921875,20.26143,30.4348321875,20.37029Q30.5075721875,20.47915,30.574882187500002,20.591450000000002Q30.642182187499998,20.70375,30.7038921875,20.81922Q30.765592187499998,20.93468,30.821592187500002,21.05304Q30.8775921875,21.1714,30.9276921875,21.29235Q30.9777921875,21.41331,31.0218921875,21.53659Q31.0659921875,21.659860000000002,31.103992187499998,21.78515Q31.1419921875,21.91044,31.1737921875,22.03744Q31.205592187500002,22.16444,31.2311921875,22.29285Q31.2566921875,22.42126,31.2758921875,22.55077Q31.2951921875,22.68028,31.3079921875,22.81058Q31.3207921875,22.94087,31.3271921875,23.071640000000002Q31.3336921875,23.20241,31.3336921875,23.33333Z" fill="#8280FF" fill-opacity="1"/></g><g><path d="M25.977800000000002,31.333333015441895C19.68255,31.333333015441895,14.517678,34.56868301544189,14.000868912,40.93227301544189C13.9727177,41.2789030154419,14.635616,42.00003301544189,14.970003,42.00003301544189L36.995599999999996,42.00003301544189C37.9972,42.00003301544189,38.0128,41.193963015441895,37.9972,40.933333015441896C37.6065,34.39092301544189,32.361599999999996,31.333333015441895,25.977800000000002,31.333333015441895ZM40.1335,41.9999330154419L40.1335,42.00003301544189L45.2739,42.00003301544189C45.997299999999996,42.00003301544189,46.0086,41.3955330154419,45.997299999999996,41.20008301544189C45.718199999999996,36.34691301544189,42.0096,34.0505230154419,37.4675,34.00090301544189Q37.7894,34.430103015441894,38.0757,34.883773015441896Q38.361999999999995,35.33744301544189,38.6109,35.81264301544189Q38.859899999999996,36.2878530154419,39.069900000000004,36.78152301544189Q39.2798,37.27519301544189,39.4494,37.784133015441896Q39.6191,38.29307301544189,39.7472,38.813993015441895Q39.8754,39.334923015441895,39.9613,39.86446301544189Q40.0473,40.39399301544189,40.0904,40.928723015441896Q40.1335,41.46343301544189,40.1335,41.9999330154419Z" fill-rule="evenodd" fill="#8280FF" fill-opacity="1"/></g></g></g></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/biaoge.svg b/src/assets/icons/svg/biaoge.svg
new file mode 100644
index 0000000..1d73d99
--- /dev/null
+++ b/src/assets/icons/svg/biaoge.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="60" height="60" viewBox="0 0 60 60"><g><g style="opacity:0.20999999344348907;"><path d="M30,0L37,0Q37.5646,0,38.1286,0.0277045Q38.6925,0.055409,39.2544,0.110751Q39.8163,0.166094,40.3748,0.24894Q40.9333,0.331787,41.4871,0.441938Q42.0408,0.55209,42.5885,0.689281Q43.1362,0.826472,43.6765,0.990372Q44.2169,1.15427,44.7485,1.34449Q45.2801,1.5347,45.8017,1.75077Q46.3234,1.96684,46.8338,2.20825Q47.3442,2.44965,47.8421,2.71581Q48.3401,2.98197,48.8244,3.27224Q49.3087,3.56251,49.7781,3.8762Q50.2476,4.18988,50.7011,4.52623Q51.1546,4.86257,51.591,5.22076Q52.0275,5.57895,52.4459,5.95812Q52.8642,6.3373,53.2635,6.73654Q53.6627,7.13579,54.0419,7.55414Q54.4211,7.9725,54.7792,8.40895Q55.1374,8.84541,55.4738,9.29892Q55.8101,9.75242,56.1238,10.2219Q56.4375,10.6913,56.7278,11.1756Q57.018,11.6599,57.2842,12.1579Q57.5503,12.6558,57.7917,13.1662Q58.0331,13.6766,58.2492,14.1983Q58.4653,14.7199,58.6555,15.2515Q58.8457,15.7831,59.0096,16.3235Q59.1735,16.8638,59.3107,17.4115Q59.4479,17.9592,59.5581,18.5129Q59.6682,19.0667,59.7511,19.6252Q59.8339,20.1837,59.8892,20.7456Q59.9446,21.3075,59.9723,21.8714Q60,22.4354,60,23L60,37Q60,37.5646,59.9723,38.1286Q59.9446,38.6925,59.8892,39.2544Q59.8339,39.8163,59.751,40.3748Q59.6682,40.9333,59.5581,41.4871Q59.4479,42.0408,59.3107,42.5885Q59.1735,43.1362,59.0096,43.6765Q58.8457,44.2169,58.6555,44.7485Q58.4653,45.2801,58.2492,45.8017Q58.0331,46.3234,57.7917,46.8338Q57.5503,47.3442,57.2842,47.8421Q57.018,48.3401,56.7278,48.8244Q56.4375,49.3087,56.1238,49.7781Q55.8101,50.2476,55.4738,50.7011Q55.1374,51.1546,54.7792,51.591Q54.4211,52.0275,54.0419,52.4459Q53.6627,52.8642,53.2635,53.2635Q52.8642,53.6627,52.4459,54.0419Q52.0275,54.4211,51.591,54.7792Q51.1546,55.1374,50.7011,55.4738Q50.2476,55.8101,49.7781,56.1238Q49.3087,56.4375,48.8244,56.7278Q48.3401,57.018,47.8421,57.2842Q47.3442,57.5503,46.8338,57.7917Q46.3234,58.0331,45.8017,58.2492Q45.2801,58.4653,44.7485,58.6555Q44.2169,58.8457,43.6765,59.0096Q43.1362,59.1735,42.5885,59.3107Q42.0408,59.4479,41.4871,59.5581Q40.9333,59.6682,40.3748,59.7511Q39.8163,59.8339,39.2544,59.8892Q38.6925,59.9446,38.1286,59.9723Q37.5646,60,37,60L23,60Q22.4354,60,21.8714,59.9723Q21.3075,59.9446,20.7456,59.8892Q20.1837,59.8339,19.6252,59.751Q19.0667,59.6682,18.5129,59.5581Q17.9592,59.4479,17.4115,59.3107Q16.8638,59.1735,16.3235,59.0096Q15.7831,58.8457,15.2515,58.6555Q14.7199,58.4653,14.1983,58.2492Q13.6766,58.0331,13.1662,57.7917Q12.6558,57.5503,12.1579,57.2842Q11.6599,57.018,11.1756,56.7278Q10.6913,56.4375,10.2219,56.1238Q9.75242,55.8101,9.29892,55.4738Q8.84541,55.1374,8.40895,54.7792Q7.9725,54.4211,7.55414,54.0419Q7.13579,53.6627,6.73654,53.2635Q6.3373,52.8642,5.95812,52.4459Q5.57895,52.0275,5.22076,51.591Q4.86257,51.1546,4.52623,50.7011Q4.18988,50.2476,3.8762,49.7781Q3.56251,49.3087,3.27224,48.8244Q2.98197,48.3401,2.71581,47.8421Q2.44965,47.3442,2.20825,46.8338Q1.96684,46.3234,1.75077,45.8017Q1.5347,45.2801,1.34449,44.7485Q1.15427,44.2169,0.990372,43.6765Q0.826472,43.1362,0.689281,42.5885Q0.55209,42.0408,0.441938,41.4871Q0.331787,40.9333,0.24894,40.3748Q0.166094,39.8163,0.110751,39.2544Q0.055409,38.6925,0.0277045,38.1286Q0,37.5646,0,37L0,23Q0,22.4354,0.0277045,21.8714Q0.055409,21.3075,0.110751,20.7456Q0.166094,20.1837,0.24894,19.6252Q0.331787,19.0667,0.441938,18.5129Q0.55209,17.9592,0.689281,17.4115Q0.826472,16.8638,0.990372,16.3235Q1.15427,15.7831,1.34449,15.2515Q1.5347,14.7199,1.75077,14.1983Q1.96684,13.6766,2.20825,13.1662Q2.44965,12.6558,2.71581,12.1579Q2.98197,11.6599,3.27224,11.1756Q3.56251,10.6913,3.8762,10.2219Q4.18988,9.75242,4.52623,9.29892Q4.86257,8.84541,5.22076,8.40895Q5.57895,7.9725,5.95812,7.55414Q6.3373,7.13579,6.73654,6.73654Q7.13579,6.3373,7.55414,5.95812Q7.9725,5.57895,8.40895,5.22076Q8.84541,4.86257,9.29892,4.52623Q9.75242,4.18988,10.2219,3.8762Q10.6913,3.56251,11.1756,3.27224Q11.6599,2.98197,12.1579,2.71581Q12.6558,2.44965,13.1662,2.20825Q13.6766,1.96684,14.1983,1.75077Q14.7199,1.5347,15.2515,1.34449Q15.7831,1.15427,16.3235,0.990372Q16.8638,0.826472,17.4115,0.689281Q17.9592,0.55209,18.5129,0.441938Q19.0667,0.331787,19.6252,0.24894Q20.1837,0.166094,20.7456,0.110751Q21.3075,0.055409,21.8714,0.0277045Q22.4354,0,23,0L30,0Z" fill-rule="evenodd" fill="#4AD991" fill-opacity="1"/></g><g><g><path d="M19.11111,40.8889C19.11111,40.8889,42.4444,40.8889,42.4444,40.8889C43.3036,40.8889,44,41.585300000000004,44,42.4444C44,43.3036,43.3036,44,42.4444,44C42.4444,44,17.55556,44,17.55556,44C16.696446,44,16,43.3036,16,42.4444C16,42.4444,16,17.55556,16,17.55556C16,16.696446,16.696446,16,17.55556,16C18.41467,16,19.11111,16.696446,19.11111,17.55556C19.11111,17.55556,19.11111,40.8889,19.11111,40.8889Z" fill="#4AD991" fill-opacity="1"/></g><g style="opacity:0.5;"><path d="M24.91305625,34.17498171386719C24.32547625,34.801781713867186,23.34105625,34.83348171386719,22.71430825,34.24598171386719C22.08755625,33.658381713867186,22.05580125,32.673981713867185,22.64338125,32.04718171386719C22.64338125,32.04718171386719,28.47671625,25.82498171386719,28.47671625,25.82498171386719C29.04497625,25.21884171386719,29.98926625,25.16627171386719,30.62128625,25.70560171386719C30.62128625,25.70560171386719,35.225356250000004,29.63437171386719,35.225356250000004,29.63437171386719C35.225356250000004,29.63437171386719,41.22395625,22.036109713867187,41.22395625,22.036109713867187C41.75625625,21.36180971386719,42.73445625,21.246729713867186,43.408756249999996,21.779072713867187C44.08305625,22.311414713867187,44.19815625,23.28959171386719,43.665856250000004,23.963891713867188C43.665856250000004,23.963891713867188,36.66585625,32.83058171386719,36.66585625,32.83058171386719C36.11905625,33.523081713867185,35.10635625,33.62268171386719,34.43515625,33.04998171386719C34.43515625,33.04998171386719,29.731066249999998,29.035811713867187,29.731066249999998,29.035811713867187C29.731066249999998,29.035811713867187,24.91305625,34.17498171386719,24.91305625,34.17498171386719Z" fill="#4AD991" fill-opacity="1"/></g></g></g></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/bug.svg b/src/assets/icons/svg/bug.svg
new file mode 100644
index 0000000..05a150d
--- /dev/null
+++ b/src/assets/icons/svg/bug.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M127.88 73.143c0 1.412-.506 2.635-1.518 3.669-1.011 1.033-2.209 1.55-3.592 1.55h-17.887c0 9.296-1.783 17.178-5.35 23.645l16.609 17.044c1.011 1.034 1.517 2.257 1.517 3.67 0 1.412-.506 2.635-1.517 3.668-.958 1.033-2.155 1.55-3.593 1.55-1.438 0-2.635-.517-3.593-1.55l-15.811-16.063a15.49 15.49 0 0 1-1.196 1.06c-.532.434-1.65 1.208-3.353 2.322a50.104 50.104 0 0 1-5.192 2.974c-1.758.87-3.94 1.658-6.546 2.364-2.607.706-5.189 1.06-7.748 1.06V47.044H58.89v73.062c-2.716 0-5.417-.367-8.106-1.102-2.688-.734-5.003-1.631-6.945-2.692a66.769 66.769 0 0 1-5.268-3.179c-1.571-1.057-2.73-1.94-3.476-2.65L33.9 109.34l-14.611 16.877c-1.066 1.14-2.344 1.711-3.833 1.711-1.277 0-2.422-.434-3.434-1.304-1.012-.978-1.557-2.187-1.635-3.627-.079-1.44.333-2.705 1.236-3.794l16.129-18.51c-3.087-6.197-4.63-13.644-4.63-22.342H5.235c-1.383 0-2.58-.517-3.592-1.55S.125 74.545.125 73.132c0-1.412.506-2.635 1.518-3.668 1.012-1.034 2.21-1.55 3.592-1.55h17.887V43.939L9.308 29.833c-1.012-1.033-1.517-2.256-1.517-3.669 0-1.412.505-2.635 1.517-3.668 1.012-1.034 2.21-1.55 3.593-1.55s2.58.516 3.593 1.55l13.813 14.106h67.396l13.814-14.106c1.012-1.034 2.21-1.55 3.592-1.55 1.384 0 2.581.516 3.593 1.55 1.012 1.033 1.518 2.256 1.518 3.668 0 1.413-.506 2.636-1.518 3.67l-13.814 14.105v23.975h17.887c1.383 0 2.58.516 3.593 1.55 1.011 1.033 1.517 2.256 1.517 3.668l-.005.01zM89.552 26.175H38.448c0-7.23 2.489-13.386 7.466-18.469C50.892 2.623 56.92.082 64 .082c7.08 0 13.108 2.541 18.086 7.624 4.977 5.083 7.466 11.24 7.466 18.469z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/build.svg b/src/assets/icons/svg/build.svg
new file mode 100644
index 0000000..97c4688
--- /dev/null
+++ b/src/assets/icons/svg/build.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1568899741379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2054" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M960 591.424V368.96c0-0.288 0.16-0.512 0.16-0.768S960 367.68 960 367.424V192a32 32 0 0 0-32-32H96a32 32 0 0 0-32 32v175.424c0 0.288-0.16 0.512-0.16 0.768s0.16 0.48 0.16 0.768v222.464c0 0.288-0.16 0.512-0.16 0.768s0.16 0.48 0.16 0.768V864a32 32 0 0 0 32 32h832a32 32 0 0 0 32-32v-271.04c0-0.288 0.16-0.512 0.16-0.768S960 591.68 960 591.424z m-560-31.232v-160H608v160h-208z m208 64V832h-208v-207.808H608z m-480-224h208v160H128v-160z m544 0h224v160h-224v-160zM896 224v112.192H128V224h768zM128 624.192h208V832H128v-207.808zM672 832v-207.808h224V832h-224z" p-id="2055"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/button.svg b/src/assets/icons/svg/button.svg
new file mode 100644
index 0000000..904fddc
--- /dev/null
+++ b/src/assets/icons/svg/button.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1588670460195" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1314" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M230.4 307.712c13.824 0 25.088-11.264 25.088-25.088 0-100.352 81.92-182.272 182.272-182.272s182.272 81.408 182.272 182.272c0 13.824 11.264 25.088 25.088 25.088s25.088-11.264 24.576-25.088c0-127.488-103.936-231.936-231.936-231.936S205.824 154.624 205.824 282.624c-0.512 14.336 10.752 25.088 24.576 25.088z m564.736 234.496c-11.264 0-21.504 2.048-31.232 6.144 0-44.544-40.448-81.92-88.064-81.92-14.848 0-28.16 3.584-39.936 10.24-13.824-28.16-44.544-48.128-78.848-48.128-12.288 0-24.576 2.56-35.328 7.68V284.16c0-45.568-37.888-81.92-84.48-81.92s-84.48 36.864-84.48 81.92v348.672l-69.12-112.64c-18.432-28.16-58.368-36.864-91.136-19.968-26.624 14.336-46.592 47.104-30.208 88.064 3.072 8.192 76.8 205.312 171.52 311.296 0 0 28.16 24.576 43.008 58.88 4.096 9.728 13.312 15.36 22.528 15.36 3.072 0 6.656-0.512 9.728-2.048 12.288-5.12 18.432-19.968 12.8-32.256-19.456-44.544-53.76-74.752-53.76-74.752C281.6 768 209.408 573.44 208.384 570.88c-5.12-12.8-2.56-20.992 7.168-26.112 9.216-4.608 21.504-4.608 26.112 2.56l113.152 184.32c4.096 8.704 12.8 14.336 22.528 14.336 13.824 0 25.088-10.752 25.088-25.088V284.16c0-17.92 15.36-32.256 34.816-32.256s34.816 14.336 34.816 32.256v284.16c0 13.824 10.24 25.088 24.576 25.088 13.824 0 25.088-11.264 25.088-25.088v-57.344c0-17.92 15.36-32.768 34.816-32.768 19.968 0 37.376 15.36 37.376 32.768v95.232c0 7.168 3.072 13.312 7.68 17.92 4.608 4.608 10.752 7.168 17.92 7.168 13.824 0 24.576-11.264 24.576-25.088V547.84c0-18.432 13.824-32.256 32.256-32.256 20.48 0 38.912 15.36 38.912 32.256v95.232c0 13.824 11.264 25.088 25.088 25.088s24.576-11.264 25.088-25.088v-18.944c0-18.944 12.8-32.256 30.72-32.256 18.432 0 22.528 18.944 22.528 31.744 0 1.024-11.776 99.84-50.688 173.056-30.72 58.368-45.056 112.128-51.2 146.944-2.56 13.312 6.656 26.112 19.968 28.672 1.536 0 3.072 0.512 4.608 0.512 11.776 0 22.016-8.192 24.064-20.48 5.632-31.232 18.432-79.36 46.08-132.608 43.52-81.92 55.808-186.88 56.32-193.536-0.512-50.688-29.696-83.968-72.704-83.968z"></path></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/cascader.svg b/src/assets/icons/svg/cascader.svg
new file mode 100644
index 0000000..e256024
--- /dev/null
+++ b/src/assets/icons/svg/cascader.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1576153230908" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="971" xmlns:xlink="http://www.w3.org/1999/xlink" width="81" height="81"><defs><style type="text/css"></style></defs><path d="M772.87036133 734.06115723c-43.34106445 0-80.00793458 27.93273926-93.76831055 66.57714843H475.90991211c-56.60705567 0-102.66723633-46.06018067-102.66723633-102.66723633V600.82446289h305.859375c13.76037598 38.64440918 50.42724609 66.57714844 93.76831055 66.57714844 55.12390137 0 99.94812012-44.82421875 99.94812012-99.94812012S827.9942627 467.50537109 772.87036133 467.50537109c-43.34106445 0-80.00793458 27.93273926-93.76831055 66.57714844H373.24267578V401.01062011h321.92687989c55.12390137 0 99.94812012-44.82421875 99.94812011-99.94812011V190.07312011C795.11767578 134.94921875 750.29345703 90.125 695.16955567 90.125H251.12963867C196.0057373 90.125 151.18151855 134.94921875 151.18151855 190.07312011V301.0625c0 55.12390137 44.82421875 99.94812012 99.94812012 99.94812012h55.53588867v296.96044921c0 93.35632325 75.97045898 169.32678223 169.32678224 169.32678223h203.19213866c13.76037598 38.64440918 50.42724609 66.57714844 93.76831055 66.57714844 55.12390137 0 99.94812012-44.82421875 99.94812012-99.94812012s-44.90661622-99.86572266-100.03051758-99.86572265z m0-199.89624024c18.37463379 0 33.28857422 14.91394043 33.28857422 33.28857423s-14.91394043 33.28857422-33.28857422 33.28857421-33.28857422-14.91394043-33.28857422-33.28857421 14.91394043-33.28857422 33.28857422-33.28857422zM217.75866699 301.0625V190.07312011c0-18.37463379 14.91394043-33.28857422 33.28857423-33.28857421h444.03991698c18.37463379 0 33.28857422 14.91394043 33.28857422 33.28857422V301.0625c0 18.37463379-14.91394043 33.28857422-33.28857422 33.28857422H251.12963867c-18.37463379 0-33.37097168-14.91394043-33.37097168-33.28857422z m555.11169434 566.23535156c-18.37463379 0-33.28857422-14.91394043-33.28857422-33.28857422 0-18.37463379 14.91394043-33.28857422 33.28857422-33.28857422s33.28857422 14.91394043 33.28857422 33.28857422c0.08239747 18.29223633-14.91394043 33.28857422-33.28857422 33.28857422z" p-id="972"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/chart.svg b/src/assets/icons/svg/chart.svg
new file mode 100644
index 0000000..27728fb
--- /dev/null
+++ b/src/assets/icons/svg/chart.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M0 54.857h36.571V128H0V54.857zM91.429 27.43H128V128H91.429V27.429zM45.714 0h36.572v128H45.714V0z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/checkbox.svg b/src/assets/icons/svg/checkbox.svg
new file mode 100644
index 0000000..013fd3a
--- /dev/null
+++ b/src/assets/icons/svg/checkbox.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1575982282951" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="902" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M828.40625 90.125H195.59375C137.375 90.125 90.125 137.375 90.125 195.59375v632.8125c0 58.21875 47.25 105.46875 105.46875 105.46875h632.8125c58.21875 0 105.46875-47.25 105.46875-105.46875V195.59375c0-58.21875-47.25-105.46875-105.46875-105.46875z m52.734375 738.28125c0 29.16-23.57015625 52.734375-52.734375 52.734375H195.59375c-29.109375 0-52.734375-23.574375-52.734375-52.734375V195.59375c0-29.109375 23.625-52.734375 52.734375-52.734375h632.8125c29.16 0 52.734375 23.625 52.734375 52.734375v632.8125z" p-id="903"></path><path d="M421.52890625 709.55984375a36.28125 36.28125 0 0 1-27.55265625-12.66890625L205.17453125 476.613125a36.28546875 36.28546875 0 0 1 55.10109375-47.22890625l164.986875 192.4846875 342.16171875-298.48078125a36.2896875 36.2896875 0 0 1 47.70984375 54.68765625L445.3859375 700.6203125a36.3234375 36.3234375 0 0 1-23.85703125 8.93953125z" p-id="904"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/class.svg b/src/assets/icons/svg/class.svg
new file mode 100644
index 0000000..0627cae
--- /dev/null
+++ b/src/assets/icons/svg/class.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1733408157220" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9893" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M510 12C233.8 12 10 235.8 10 512s223.8 500 500 500 500-223.8 500-500S786.2 12 510 12z m-20.4 388.2c-2.2 22-3.2 47-3.2 74.8 0 28 0.4 51.2 1.4 70.2l-35.2 0.4c1-15 1.4-36.2 1.4-63.2 0-27.2-1.2-55-3.8-83.6l39.4 1.4z m-184 255c10.6-0.6 27.2-4.2 49.8-10.8V517.8c-17.2 0-31.6 1-43.2 2.8v-41c11.2 1.8 25.8 3 43.2 3.2V372.6c-17.6 0.4-33.2 1.4-47 3.2v-42.4c16 2.2 38.8 3.2 68.8 3.2 29.8 0 52.8-1 68.8-3.2v42.4c-15-1.8-32.4-3-51.8-3.2v110.2c15.4-0.4 28.2-1.4 38.6-3.2v41c-8.4-1.6-21.4-2.4-38.6-2.4V632c21.4-6.6 37.6-12.4 49-17.4-0.6 6-1 12-1 18.2 0 6.2 0.4 12.4 1.4 19C395.6 669 353.8 687 318 706c-2.2-14.6-6.2-31.6-12.4-50.8zM467 714c-9.8-8.4-24.2-14.6-43.2-18.4 28.6-21 50.8-45.6 66.8-73.8 16-28.2 24-77.4 24-147.8 0-30.4-0.6-64-1.6-100.8-1.2-36.8-2.2-59.2-3.6-67.2 9.4 2.2 20.8 3.2 33.8 3.2l14.6-0.4c3.2 0 4.8 1 4.8 3s-1.4 4.2-4.2 6.4c-5.4 3.8-8 19.2-8 46.6 0 79-0.8 134.6-2.6 166.4-1.8 31.8-8.2 61.6-19.2 89.4-11.4 27.8-31.8 59-61.6 93.4z m261.2-13.2c-15.6-1.8-47.4-2.8-95-2.8s-79.6 1-96 2.8V660c20 1.8 45.8 3 77.2 3.2V514c-17.6 0.4-31.2 1.2-41 2.8v-40.4c12.8 1.8 26.6 2.8 41 2.8V369c-19.8 0.4-34.4 1.2-43.8 2.8V330c16.6 2.2 40.6 3.2 72 3.2s55.4-1 72-3.2v42c-16-1.8-36.6-2.8-61.6-2.8v110.6c22-0.4 41-1.4 57-3.2V517c-12-1.8-31-2.8-57-2.8v149.2c31-0.4 56.2-1.4 75.2-3.2v40.6z" fill="#333333" p-id="9894"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/clipboard.svg b/src/assets/icons/svg/clipboard.svg
new file mode 100644
index 0000000..90923ff
--- /dev/null
+++ b/src/assets/icons/svg/clipboard.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M54.857 118.857h64V73.143H89.143c-1.902 0-3.52-.668-4.855-2.002-1.335-1.335-2.002-2.954-2.002-4.855V36.57H54.857v82.286zM73.143 16v-4.571a2.2 2.2 0 0 0-.677-1.61 2.198 2.198 0 0 0-1.609-.676H20.571c-.621 0-1.158.225-1.609.676a2.198 2.198 0 0 0-.676 1.61V16a2.2 2.2 0 0 0 .676 1.61c.451.45.988.676 1.61.676h50.285c.622 0 1.158-.226 1.61-.677.45-.45.676-.987.676-1.609zm18.286 48h21.357L91.43 42.642V64zM128 73.143v48c0 1.902-.667 3.52-2.002 4.855-1.335 1.335-2.953 2.002-4.855 2.002H52.57c-1.901 0-3.52-.667-4.854-2.002-1.335-1.335-2.003-2.953-2.003-4.855v-11.429H6.857c-1.902 0-3.52-.667-4.855-2.002C.667 106.377 0 104.759 0 102.857v-96c0-1.902.667-3.52 2.002-4.855C3.337.667 4.955 0 6.857 0h77.714c1.902 0 3.52.667 4.855 2.002 1.335 1.335 2.003 2.953 2.003 4.855V30.29c1 .622 1.856 1.29 2.569 2.003l29.147 29.147c1.335 1.335 2.478 3.145 3.429 5.43.95 2.287 1.426 4.383 1.426 6.291v-.018z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/code.svg b/src/assets/icons/svg/code.svg
new file mode 100644
index 0000000..5f9c5ab
--- /dev/null
+++ b/src/assets/icons/svg/code.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1546567861908" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2422" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M318.577778 819.2L17.066667 512l301.511111-307.2 45.511111 45.511111L96.711111 512l267.377778 261.688889zM705.422222 819.2l-45.511111-45.511111L927.288889 512l-267.377778-261.688889 45.511111-45.511111L1006.933333 512zM540.785778 221.866667l55.751111 11.150222L483.157333 802.133333l-55.751111-11.093333z" p-id="2423"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/color.svg b/src/assets/icons/svg/color.svg
new file mode 100644
index 0000000..44a81aa
--- /dev/null
+++ b/src/assets/icons/svg/color.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1577252187056" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2508" xmlns:xlink="http://www.w3.org/1999/xlink" width="81" height="81"><defs><style type="text/css"></style></defs><path d="M747.59340925 691.12859384c11.51396329 0.25305413 22.43746719-0.21087818 40.74171707-1.51832482 29.35428085-2.10878421 35.84933734-2.36183835 46.47761114-0.8856895 24.71495444 3.37405491 41.12129828 21.76265671 32.47528161 47.95376084-85.57447632 258.19957947-442.00123984 249.76444099-628.67084683 50.73735554-153.47733892-159.33976008-153.09775772-414.41833795 0.92786545-573.42069196 159.71934128-162.67163983 424.03439521-166.59397897 565.78689185 0.63263534 80.38686649 94.81095318 108.34934958 169.16669549 89.11723508 230.57450162-15.01454608 47.99593598-50.61082928 77.68762207-119.77896259 114.63352789-4.89237973 2.65706845-29.35428085 15.52065436-35.84933652 19.02123633-46.94154346 25.30541465-63.51659033 41.20565021-62.20914449 58.45550757 2.95229856 39.13904114 24.16667102 52.7196135 70.98168823 53.81618115z m44.41100207 50.10472101c-19.82257471 1.43397372-32.05352527 1.940082-45.63409763 1.6448519-70.34905207-1.60267593-115.98314969-30.91478165-121.38163769-101.64341492-3.45840683-46.05585397 24.7571304-73.13264758 89.24376132-107.96976837 6.7902866-3.66928501 31.37871396-16.57504688 36.06021551-19.06341229 57.69634516-30.83042972 85.15271997-53.73183005 94.76877722-84.47790866 12.77923398-40.78389304-9.10994898-98.94417051-79.24812286-181.6507002-121.17075953-142.97559219-350.14258521-139.60153647-489.2380134 2.06660824-134.49827774 138.84237405-134.79350784 362.12048163-0.42175717 501.637667 158.53842169 168.99799328 451.9968783 181.18676788 534.57688175-11.80919339-4.68150156 0.2952301-10.71262573 0.67481131-18.72600705 1.26527069z" p-id="2509"></path><path d="M346.03865637 637.18588562a78.82636652 78.82636652 0 0 0 78.32025825-79.29029883c0-43.69401562-35.005823-79.29029883-78.32025825-79.29029882a78.82636652 78.82636652 0 0 0-78.36243338 79.29029882c0 43.69401562 35.005823 79.29029883 78.36243338 79.29029883z m0-51.7495729a27.07679361 27.07679361 0 0 1-26.5706845-27.54072593c0-15.30977536 11.97789643-27.54072593 26.5706845-27.54072592 14.55061295 0 26.57068533 12.23095057 26.57068533 27.54072592a27.07679361 27.07679361 0 0 1-26.57068533 27.54072593zM475.7289063 807.11174353a78.82636652 78.82636652 0 0 0 78.3624334-79.29029882c0-43.69401562-34.96364785-79.29029883-78.32025825-79.29029883a78.82636652 78.82636652 0 0 0-78.32025742 79.29029883c0 43.69401562 34.96364785 79.29029883 78.32025742 79.29029882z m0-51.74957208a27.07679361 27.07679361 0 0 1-26.57068532-27.54072674c0-15.30977536 12.06224753-27.54072593 26.57068532-27.54072593 14.59278892 0 26.57068533 12.23095057 26.57068453 27.54072593a27.07679361 27.07679361 0 0 1-26.57068453 27.54072674zM601.24376214 377.21492718a78.82636652 78.82636652 0 0 0 78.32025742-79.29029883c0-43.69401562-34.96364785-79.29029883-78.32025742-79.29029882a78.82636652 78.82636652 0 0 0-78.32025823 79.29029883c0 43.69401562 34.96364785 79.29029883 78.32025824 79.29029883z m1e-8-51.74957208a27.07679361 27.07679361 0 0 1-26.57068534-27.54072675c0-15.30977536 11.97789643-27.54072593 26.57068534-27.54072591 14.55061295 0 26.57068533 12.23095057 26.57068451 27.54072592a27.07679361 27.07679361 0 0 1-26.57068451 27.54072674zM378.80916809 433.85687983a78.82636652 78.82636652 0 0 0 78.32025824-79.29029883c0-43.69401562-34.96364785-79.29029883-78.32025824-79.29029802a78.82636652 78.82636652 0 0 0-78.32025742 79.29029802c0 43.69401562 34.96364785 79.29029883 78.32025742 79.29029883z m0-51.74957209a27.07679361 27.07679361 0 0 1-26.57068451-27.54072674c0-15.30977536 11.97789643-27.54072593 26.57068451-27.54072593 14.55061295 0 26.57068533 12.23095057 26.57068533 27.54072593a27.07679361 27.07679361 0 0 1-26.57068533 27.54072674z" p-id="2510"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/component.svg b/src/assets/icons/svg/component.svg
new file mode 100644
index 0000000..29c3458
--- /dev/null
+++ b/src/assets/icons/svg/component.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1575804206892" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3145" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M826.56 470.016c-32.896 0-64.384 12.288-89.984 35.52l0-104.96c0-62.208-50.496-112.832-112.64-113.088L623.936 287.04 519.552 287.104C541.824 262.72 554.56 230.72 554.56 197.12c0-73.536-59.904-133.44-133.504-133.44-73.472 0-133.376 59.904-133.376 133.44 0 32.896 12.224 64.256 35.52 89.984L175.232 287.104l0 0.576C113.728 288.704 64 338.88 64 400.576l0.32 0 0.32 116.48C60.864 544.896 70.592 577.728 100.8 588.48c12.736 4.608 37.632 7.488 60.864-25.28 12.992-18.368 34.24-29.248 56.64-29.248 38.336 0 69.504 31.104 69.504 69.312 0 38.4-31.168 69.504-69.504 69.504-22.656 0-44.032-11.264-57.344-30.4C138.688 610.112 112.576 615.36 102.464 619.136c-29.824 10.752-39.104 43.776-38.144 67.392l0 160.384L64 846.912C64 909.248 114.752 960 177.216 960l446.272 0c62.4 0 113.152-50.752 113.152-113.152l0-145.024c24.384 22.272 56.384 35.008 89.984 35.008 73.536 0 133.44-59.904 133.44-133.504C960 529.92 900.096 470.016 826.56 470.016zM826.56 672.896c-22.72 0-44.032-11.264-57.344-30.4-22.272-32.384-48.448-27.136-58.56-23.36-29.824 10.752-39.04 43.776-38.08 67.392l0 160.384c0 27.136-22.016 49.152-49.152 49.152L177.216 896.064C150.08 896 128 873.984 128 846.848l0.32 0 0-145.024c24.384 22.272 56.384 35.008 89.984 35.008 73.6 0 133.504-59.904 133.504-133.504 0-73.472-59.904-133.376-133.504-133.376-32.896 0-64.32 12.288-89.984 35.52l0-104.96L128 400.512c0-27.072 22.08-49.152 49.216-49.152L177.216 351.04 334.656 350.72c3.776 0.512 7.616 0.832 11.52 0.832 24.896 0 50.752-10.816 60.032-37.056 4.544-12.736 7.424-37.568-25.344-60.736C362.624 240.768 351.68 219.52 351.68 197.12c0-38.272 31.104-69.44 69.376-69.44 38.336 0 69.504 31.168 69.504 69.44 0 22.72-11.264 44.032-30.528 57.472C427.968 276.736 433.088 302.784 436.8 313.024c10.752 29.888 43.072 39.232 67.392 38.08l119.232 0 0 0.384c27.136 0 49.152 22.08 49.152 49.152l0.256 116.48c-3.776 27.84 6.016 60.736 36.224 71.488 12.736 4.608 37.632 7.488 60.8-25.28 13.056-18.368 34.24-29.248 56.704-29.248C864.832 534.016 896 565.12 896 603.392 896 641.728 864.832 672.896 826.56 672.896z" p-id="3146"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/dashboard.svg b/src/assets/icons/svg/dashboard.svg
new file mode 100644
index 0000000..5317d37
--- /dev/null
+++ b/src/assets/icons/svg/dashboard.svg
@@ -0,0 +1 @@
+<svg width="128" height="100" xmlns="http://www.w3.org/2000/svg"><path d="M27.429 63.638c0-2.508-.893-4.65-2.679-6.424-1.786-1.775-3.94-2.662-6.464-2.662-2.524 0-4.679.887-6.465 2.662-1.785 1.774-2.678 3.916-2.678 6.424 0 2.508.893 4.65 2.678 6.424 1.786 1.775 3.94 2.662 6.465 2.662 2.524 0 4.678-.887 6.464-2.662 1.786-1.775 2.679-3.916 2.679-6.424zm13.714-31.801c0-2.508-.893-4.65-2.679-6.424-1.785-1.775-3.94-2.662-6.464-2.662-2.524 0-4.679.887-6.464 2.662-1.786 1.774-2.679 3.916-2.679 6.424 0 2.508.893 4.65 2.679 6.424 1.785 1.774 3.94 2.662 6.464 2.662 2.524 0 4.679-.888 6.464-2.662 1.786-1.775 2.679-3.916 2.679-6.424zM71.714 65.98l7.215-27.116c.285-1.23.107-2.378-.536-3.443-.643-1.064-1.56-1.762-2.75-2.094-1.19-.33-2.333-.177-3.429.462-1.095.639-1.81 1.573-2.143 2.804l-7.214 27.116c-2.857.237-5.405 1.266-7.643 3.088-2.238 1.822-3.738 4.152-4.5 6.992-.952 3.644-.476 7.098 1.429 10.364 1.905 3.265 4.69 5.37 8.357 6.317 3.667.947 7.143.474 10.429-1.42 3.285-1.892 5.404-4.66 6.357-8.305.762-2.84.619-5.607-.429-8.305-1.047-2.697-2.762-4.85-5.143-6.46zm47.143-2.342c0-2.508-.893-4.65-2.678-6.424-1.786-1.775-3.94-2.662-6.465-2.662-2.524 0-4.678.887-6.464 2.662-1.786 1.774-2.679 3.916-2.679 6.424 0 2.508.893 4.65 2.679 6.424 1.786 1.775 3.94 2.662 6.464 2.662 2.524 0 4.679-.887 6.465-2.662 1.785-1.775 2.678-3.916 2.678-6.424zm-45.714-45.43c0-2.509-.893-4.65-2.679-6.425C68.68 10.01 66.524 9.122 64 9.122c-2.524 0-4.679.887-6.464 2.661-1.786 1.775-2.679 3.916-2.679 6.425 0 2.508.893 4.65 2.679 6.424 1.785 1.774 3.94 2.662 6.464 2.662 2.524 0 4.679-.888 6.464-2.662 1.786-1.775 2.679-3.916 2.679-6.424zm32 13.629c0-2.508-.893-4.65-2.679-6.424-1.785-1.775-3.94-2.662-6.464-2.662-2.524 0-4.679.887-6.464 2.662-1.786 1.774-2.679 3.916-2.679 6.424 0 2.508.893 4.65 2.679 6.424 1.785 1.774 3.94 2.662 6.464 2.662 2.524 0 4.679-.888 6.464-2.662 1.786-1.775 2.679-3.916 2.679-6.424zM128 63.638c0 12.351-3.357 23.78-10.071 34.286-.905 1.372-2.19 2.058-3.858 2.058H13.93c-1.667 0-2.953-.686-3.858-2.058C3.357 87.465 0 76.037 0 63.638c0-8.613 1.69-16.847 5.071-24.703C8.452 31.08 13 24.312 18.714 18.634c5.715-5.68 12.524-10.199 20.429-13.559C47.048 1.715 55.333.035 64 .035c8.667 0 16.952 1.68 24.857 5.04 7.905 3.36 14.714 7.88 20.429 13.559 5.714 5.678 10.262 12.446 13.643 20.301 3.38 7.856 5.071 16.09 5.071 24.703z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/date-range.svg b/src/assets/icons/svg/date-range.svg
new file mode 100644
index 0000000..fda571e
--- /dev/null
+++ b/src/assets/icons/svg/date-range.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1579774833889" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1376" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M887.466667 192.853333h-100.693334V119.466667c0-10.24-6.826667-17.066667-17.066666-17.066667s-17.066667 6.826667-17.066667 17.066667v73.386666H303.786667V119.466667c0-10.24-6.826667-17.066667-17.066667-17.066667s-17.066667 6.826667-17.066667 17.066667v73.386666H168.96c-46.08 0-85.333333 37.546667-85.333333 85.333334V836.266667c0 46.08 37.546667 85.333333 85.333333 85.333333H887.466667c46.08 0 85.333333-37.546667 85.333333-85.333333V278.186667c0-47.786667-37.546667-85.333333-85.333333-85.333334z m-718.506667 34.133334h100.693333v66.56c0 10.24 6.826667 17.066667 17.066667 17.066666s17.066667-6.826667 17.066667-17.066666v-66.56h450.56v66.56c0 10.24 6.826667 17.066667 17.066666 17.066666s17.066667-6.826667 17.066667-17.066666v-66.56H887.466667c27.306667 0 51.2 22.186667 51.2 51.2v88.746666H117.76v-88.746666c0-29.013333 22.186667-51.2 51.2-51.2zM887.466667 887.466667H168.96c-27.306667 0-51.2-22.186667-51.2-51.2V401.066667H938.666667V836.266667c0 27.306667-22.186667 51.2-51.2 51.2z" p-id="1377"></path><path d="M858.453333 493.226667H327.68c-10.24 0-17.066667 6.826667-17.066667 17.066666v114.346667h-116.053333c-10.24 0-17.066667 6.826667-17.066667 17.066667v133.12c0 10.24 6.826667 17.066667 17.066667 17.066666H460.8c10.24 0 17.066667-6.826667 17.066667-17.066666v-114.346667h380.586666c10.24 0 17.066667-6.826667 17.066667-17.066667v-133.12c0-10.24-6.826667-17.066667-17.066667-17.066666z m-413.013333 34.133333v97.28h-98.986667v-97.28h98.986667z m-230.4 131.413333h98.986667v98.986667h-98.986667v-98.986667z m131.413333 97.28v-97.28h98.986667v97.28h-98.986667z m133.12-228.693333h97.28v98.986667h-97.28v-98.986667z m131.413334 0h98.986666v98.986667h-98.986666v-98.986667z m230.4 97.28h-98.986667v-98.986667h98.986667v98.986667z" p-id="1378"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/date.svg b/src/assets/icons/svg/date.svg
new file mode 100644
index 0000000..52dc73e
--- /dev/null
+++ b/src/assets/icons/svg/date.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1577186573535" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1068" xmlns:xlink="http://www.w3.org/1999/xlink" width="81" height="81"><defs><style type="text/css"></style></defs><path d="M479.85714249 608.42857168h64.28571502c19.28571417 0 32.14285751-12.85714249 32.14285664-32.14285751s-12.85714249-32.14285751-32.14285664-32.14285664h-64.28571504c-19.28571417 0-32.14285751 12.85714249-32.14285664 32.14285662s12.85714249 32.14285751 32.14285664 32.14285753z m-2e-8 122.14285665h64.28571504c19.28571417 0 32.14285751-12.85714249 32.14285664-32.14285665s-12.85714249-32.14285751-32.14285664-32.14285751h-64.28571504c-19.28571417 0-32.14285751 12.85714249-32.14285664 32.14285751s12.85714249 32.14285751 32.14285664 32.14285664z m353.57142921-559.28571416h-128.57142921v-32.14285664c0-19.28571417-12.85714249-32.14285751-32.14285664-32.14285753s-32.14285751 12.85714249-32.14285751 32.14285753v32.14285664h-257.14285665v-32.14285664c0-19.28571417-12.85714249-32.14285751-32.14285752-32.14285753s-32.14285751 12.85714249-32.14285664 32.14285753v32.14285664h-128.57142919c-70.71428585 0-128.57142832 57.85714249-128.57142832 122.14285751v501.42857081c0 70.71428585 57.85714249 128.57142832 128.57142832 122.14285751h642.85714335c70.71428585 0 128.57142832-57.85714249 128.57142833-122.14285751v-501.42857081c0-70.71428585-57.85714249-122.14285753-128.57142833-122.14285751z m64.28571415 623.57142832c0 32.14285751-32.14285751 64.28571415-64.28571416 64.28571504h-642.85714335c-32.14285751 0-64.28571415-25.71428583-64.28571417-64.28571504v-372.85714249h771.42857168v372.85714249z m0-437.14285664h-771.42857168v-64.28571417c0-32.14285751 32.14285751-64.28571415 64.28571417-64.28571415h128.57142919v32.14285664c0 19.28571417 12.85714249 32.14285751 32.14285664 32.14285751s32.14285751-12.85714249 32.14285753-32.14285751v-32.14285664h257.14285665v32.14285664c0 19.28571417 12.85714249 32.14285751 32.1428575 32.14285751s32.14285751-12.85714249 32.14285664-32.14285751v-32.14285664h128.57142921c32.14285751 0 64.28571415 25.71428583 64.28571415 64.28571415v64.28571417z m-610.71428583 372.85714247h64.28571415c19.28571417 0 32.14285751-12.85714249 32.14285753-32.14285664s-12.85714249-32.14285751-32.14285753-32.14285751h-64.28571415c-19.28571417 0-32.14285751 12.85714249-32.14285751 32.14285751s12.85714249 32.14285751 32.14285751 32.14285665z m385.71428583-122.14285664h64.28571417c19.28571417 0 32.14285751-12.85714249 32.14285751-32.14285751s-12.85714249-32.14285751-32.14285751-32.14285664h-64.28571415c-19.28571417 0-32.14285751 12.85714249-32.14285753 32.14285664s12.85714249 32.14285751 32.14285753 32.14285751z m-385.71428583 0h64.28571415c19.28571417 0 32.14285751-12.85714249 32.14285753-32.14285751s-12.85714249-32.14285751-32.14285753-32.14285664h-64.28571415c-19.28571417 0-32.14285751 12.85714249-32.14285751 32.14285664s12.85714249 32.14285751 32.14285751 32.14285751z m385.71428583 122.14285665h64.28571417c19.28571417 0 32.14285751-12.85714249 32.14285751-32.14285665s-12.85714249-32.14285751-32.14285751-32.14285751h-64.28571415c-19.28571417 0-32.14285751 12.85714249-32.14285753 32.14285751s12.85714249 32.14285751 32.14285753 32.14285665z" p-id="1069"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/dict.svg b/src/assets/icons/svg/dict.svg
new file mode 100644
index 0000000..4849377
--- /dev/null
+++ b/src/assets/icons/svg/dict.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1566035680909" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3601" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M1002.0848 744.672l-33.568 10.368c0.96 7.264 2.144 14.304 2.144 21.76 0 7.328-1.184 14.432-2.368 21.568l33.792 10.56c7.936 2.24 14.496 7.616 18.336 14.752 3.84 7.328 4.672 15.808 1.952 23.552-5.376 16-23.168 24.672-39.936 19.68l-34.176-10.624c-7.136 12.8-15.776 24.672-26.208 35.2l20.8 27.488a28.96 28.96 0 0 1 5.824 22.816 29.696 29.696 0 0 1-12.704 19.616 32.544 32.544 0 0 1-44.416-6.752l-20.8-27.552c-13.696 6.56-28.192 11.2-43.008 13.888v33.632c0 16.736-14.112 30.432-31.648 30.432-17.6 0-31.872-13.696-31.872-30.432v-33.632a167.616 167.616 0 0 1-42.88-13.888l-20.928 27.552c-10.72 13.76-30.08 16.64-44.288 6.752a29.632 29.632 0 0 1-12.704-19.616 29.28 29.28 0 0 1 5.696-22.816l20.896-27.808a166.72 166.72 0 0 1-27.008-34.688l-33.376 10.432c-16.8 5.184-34.56-3.552-39.936-19.616a29.824 29.824 0 0 1 20.224-38.24l33.472-10.432c-0.8-7.264-2.016-14.304-2.016-21.824 0-7.36 1.184-14.496 2.304-21.632l-33.792-10.368c-16.672-5.376-25.632-22.496-20.224-38.432 5.376-16 23.136-24.672 39.936-19.68l34.016 10.752c7.328-12.672 15.84-24.8 26.336-35.328l-20.8-27.552a29.44 29.44 0 0 1 6.944-42.432 32.704 32.704 0 0 1 44.384 6.752l20.832 27.616c13.696-6.432 28.224-11.2 43.104-13.952v-33.568c0-16.736 14.048-30.432 31.648-30.432 17.536 0 31.808 13.568 31.808 30.432v33.504c15.072 2.688 29.344 7.808 42.848 14.016l20.992-27.616a32.48 32.48 0 0 1 44.224-6.752 29.568 29.568 0 0 1 7.136 42.432l-21.024 27.808c10.432 10.432 19.872 21.888 27.04 34.752l33.376-10.432c16.768-5.12 34.56 3.68 39.936 19.68 5.536 15.936-3.712 33.056-20.32 38.304z m-206.016-74.432c-61.344 0-111.136 47.808-111.136 106.56 0 58.88 49.792 106.496 111.136 106.496 61.312 0 111.104-47.616 111.104-106.496 0-58.752-49.792-106.56-111.104-106.56z" p-id="3602"></path><path d="M802.7888 57.152h-76.448c0-22.08-21.024-38.24-42.848-38.24H39.3968a39.68 39.68 0 0 0-39.36 40.032v795.616s41.888 120.192 110.752 120.192H673.2848a227.488 227.488 0 0 1-107.04-97.44H117.6368s-40.608-13.696-40.608-41.248l470.304-0.256 1.664 3.36a227.68 227.68 0 0 1-12.64-73.632c0-60.576 24-118.624 66.88-161.44a228.352 228.352 0 0 1 123.552-63.392l-3.2 0.288 2.144-424.672h38.208l0.576 421.024c27.04 0 52.672 4.8 76.64 13.344V101.536c0.032 0-6.304-44.384-38.368-44.384zM149.7648 514.336H72.3888v-77.408H149.7648v77.408z m0-144.32H72.3888v-77.44H149.7648v77.44z m0-137.248H72.3888v-77.44H149.7648v77.44z m501.856 281.568H206.0848v-77.408h445.536v77.408z m0-144.32H206.0848v-77.44h445.536v77.44z m0-137.248H206.0848v-77.44h445.536v77.44z" p-id="3603"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/documentation.svg b/src/assets/icons/svg/documentation.svg
new file mode 100644
index 0000000..7043122
--- /dev/null
+++ b/src/assets/icons/svg/documentation.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M71.984 44.815H115.9L71.984 9.642v35.173zM16.094.05h63.875l47.906 38.37v76.74c0 3.392-1.682 6.645-4.677 9.044-2.995 2.399-7.056 3.746-11.292 3.746H16.094c-4.236 0-8.297-1.347-11.292-3.746-2.995-2.399-4.677-5.652-4.677-9.044V12.84C.125 5.742 7.23.05 16.094.05zm71.86 102.32V89.58h-71.86v12.79h71.86zm23.952-25.58V64H16.094v12.79h95.812z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/download.svg b/src/assets/icons/svg/download.svg
new file mode 100644
index 0000000..c896951
--- /dev/null
+++ b/src/assets/icons/svg/download.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1569915748289" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3062" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M768.35456 416a256 256 0 1 0-512 0 192 192 0 1 0 0 384v64a256 256 0 0 1-58.88-505.216 320.128 320.128 0 0 1 629.76 0A256.128 256.128 0 0 1 768.35456 864v-64a192 192 0 0 0 0-384z m-512 384h64v64H256.35456v-64z m448 0h64v64h-64v-64z" fill="#333333" p-id="3063"></path><path d="M539.04256 845.248V512.192a32.448 32.448 0 0 0-32-32.192c-17.664 0-32 14.912-32 32.192v333.056l-36.096-36.096a32.192 32.192 0 0 0-45.056 0.192 31.616 31.616 0 0 0-0.192 45.056l90.88 90.944a31.36 31.36 0 0 0 22.528 9.088 30.08 30.08 0 0 0 22.4-9.088l90.88-90.88a32.192 32.192 0 0 0-0.192-45.12 31.616 31.616 0 0 0-45.056-0.192l-36.096 36.096z" fill="#333333" p-id="3064"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/dpgl.svg b/src/assets/icons/svg/dpgl.svg
new file mode 100644
index 0000000..ecdf823
--- /dev/null
+++ b/src/assets/icons/svg/dpgl.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735046312579" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4598" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M503.160681 869.8819 213.232452 869.8819c-13.924127 0-25.64917-12.992919-25.64917-28.398794L187.583283 462.622406c2.676969 0.164752 5.373381 0.258896 8.090259 0.258896 43.022862 0 81.295538-21.11797 105.353466-53.728692 24.040533 32.629141 62.313208 53.764508 105.353466 53.764508 43.022862 0 81.278141-21.11797 105.33607-53.711296 24.040533 32.646538 62.330604 53.7993 105.370863 53.7993 42.971697 0 81.20958-21.065781 105.267509-53.572126 24.040533 32.750915 62.348 53.973262 105.439424 53.973262 72.618924 0 131.692345-59.901275 131.692345-133.578298 0-1.344624-0.103354-2.625804-0.291642-3.954055L924.07722 88.534406c-1.938142-13.117762-13.015432-22.64372-26.047236-22.64372L125.437897 65.890686c-13.031804 0-24.109094 9.525957-26.047236 22.64372L64.272839 325.780785c-0.188288 1.327228-0.291642 2.65548-0.291642 4.000104 0 51.127448 28.667923 95.601358 70.607104 117.887944l0 393.814274c0 44.768623 35.929304 82.381266 78.643128 82.381266l289.928229 0c14.541181 0 26.337855-12.17939 26.337855-26.990724C529.498536 882.06129 517.701862 869.8819 503.160681 869.8819zM148.107199 118.723985l727.254505 0 31.43085 212.698287c-0.994654 43.231617-36.043914 78.322833-78.998215 78.322833-43.571355 0-79.015611-36.227086-79.015611-80.751139 0-14.812357-11.797697-26.830065-26.338878-26.830065-14.541181 0-26.337855 12.017708-26.337855 26.830065 0 44.296879-35.443233 80.348979-79.015611 80.348979s-79.015611-36.122709-79.015611-80.541361c0-14.812357-11.797697-26.830065-26.338878-26.830065-14.541181 0-26.337855 12.015661-26.337855 26.828019 0 44.366464-35.443233 80.450287-79.015611 80.450287s-79.015611-36.128849-79.015611-80.513732c0-14.812357-11.797697-26.843368-26.337855-26.843368-14.541181 0-26.337855 11.989055-26.337855 26.801413 0 44.366464-35.443233 80.414471-79.015611 80.414471-42.954301 0-78.003562-34.751478-78.998215-77.685313L148.107199 118.723985z" p-id="4599"></path><path d="M930.130076 703.43603c16.324804-21.083178 18.365276-49.732681 5.178953-72.982198l-10.957563-19.360953c-12.929474-22.776749-37.929868-35.43914-63.444984-32.102139l-20.268626 2.571568c-13.374612 1.711991-25.669636-5.964852-30.196743-17.668405l-8.075933-24.559349c-10.18599-26.375717-34.689057-45.031613-59.58712-45.031613l-20.936845 0c-24.915459 0-49.435922 18.673292-59.759035 45.502333l-7.476275 21.345144c-4.989641 12.925381-17.696034 20.995173-31.139208 19.230993l-19.256576-2.235924c-25.961278-3.580548-50.996464 9.152451-64.114227 32.401967l-10.957563 19.546172c-13.066597 23.178909-11.059893 51.754734 5.126764 72.785723l12.346189 16.034185c8.247848 10.707876 8.247848 25.65838-0.017396 36.383652l-12.226462 15.841803c-16.255219 21.065781-18.261922 49.674353-5.126764 72.888054l10.425444 18.405185c13.237489 23.301705 39.627533 36.075637 65.657372 31.761378l18.639522-3.080152c13.323447-2.218528 26.252921 5.123694 31.962969 19.254529l6.189979 12.134365c9.328459 23.26589 31.483038 36.966936 59.278081 36.966936l21.828145 0c27.813462 0 49.967018-13.701047 59.003835-36.356023l7.184633-16.006556c4.88731-12.19167 17.678638-19.336394 30.762631-17.187451l19.581987 3.476171c26.166963 4.139274 51.801806-8.244778 65.005526-31.458479l10.425444-18.165732c13.254885-23.301705 11.248182-51.982932-5.110391-73.083505l-11.917424-15.35471c-8.299013-10.725272-8.299013-25.730011 0-36.437887L930.130076 703.43603zM904.83804 825.758983l-10.425444 18.162662c-5.933129 10.444886-17.198707 16.010649-28.979008 14.159488l-19.581987-3.488451c-29.664623-4.558829-57.924247 11.416004-68.692498 38.33305l-7.184633 16.159028c-5.178953 12.942777-18.98233 14.780635-26.750247 14.780635l-21.828145 0c-7.767917 0-21.571295-1.836835-27.367301-16.160051l-6.189979-12.125155c-9.996678-24.943089-33.402761-40.593534-59.072397-40.593534-3.429099 0-6.910387 0.279363-10.408047 0.855484l-18.639522 3.056616c-11.711739 2.026146-23.662933-3.825119-29.630854-14.340613l-10.425444-18.410302c-5.933129-10.463306-5.024433-23.388686 2.314719-32.908504l12.226462-15.842827c18.296715-23.702841 18.313088-56.8201 0.051165-80.557734l-12.346189-16.033162c-7.30436-9.502421-8.214079-22.406313-2.297322-32.921807l10.957563-19.537985c5.966898-10.532891 17.216103-16.229636 29.305443-14.674211l19.273972 2.266623c28.532847 3.894703 57.340963-13.510712 68.314898-42.051745l7.476275-20.977777c4.852518-12.593829 16.427134-21.850657 26.903743-21.850657l20.936845 0c10.476609 0 22.027689 9.256828 26.589588 21.012569l8.069793 24.173562c10.717086 27.789926 38.448684 44.558845 67.565838 40.872896l20.243043-2.602268c11.608386-1.502213 22.773679 4.227278 28.586059 14.480806l10.858302 19.35379c0 0 0 0 0 0.017396 5.637394 10.480702 5.140067 23.406083-2.232854 32.908504l-11.869329 15.458063c-18.399045 23.772426-18.399045 56.977689 0 80.767512l11.93482 15.370059C909.896242 802.372344 910.788565 815.314097 904.83804 825.758983z" p-id="4600"></path><path d="M732.301452 646.5136c-47.429219 0-86.028329 39.318494-86.028329 87.650269 0 48.314379 38.59911 87.632873 86.028329 87.632873 47.446615 0 86.045725-39.318494 86.045725-87.632873C818.346153 685.833117 779.748067 646.5136 732.301452 646.5136zM732.301452 786.025027c-28.070312 0-50.910507-23.26589-50.910507-51.860135 0-28.611641 22.840194-51.877531 50.910507-51.877531 28.087709 0 50.927903 23.266913 50.927903 51.877531C783.228331 762.758114 760.388137 786.025027 732.301452 786.025027z" p-id="4601"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/drag.svg b/src/assets/icons/svg/drag.svg
new file mode 100644
index 0000000..4185d3c
--- /dev/null
+++ b/src/assets/icons/svg/drag.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M73.137 29.08h-9.209 29.7L63.886.093 34.373 29.08h20.49v27.035H27.238v17.948h27.625v27.133h18.274V74.063h27.41V56.115h-27.41V29.08zm-9.245 98.827l27.518-26.711H36.59l27.302 26.71zM.042 64.982l27.196 27.029V38.167L.042 64.982zm100.505-26.815V92.01l27.41-27.029-27.41-26.815z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/druid.svg b/src/assets/icons/svg/druid.svg
new file mode 100644
index 0000000..a2b4b4e
--- /dev/null
+++ b/src/assets/icons/svg/druid.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1566036347051" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5853" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M832 128H192a64.19 64.19 0 0 0-64 64v640a64.19 64.19 0 0 0 64 64h640a64.19 64.19 0 0 0 64-64V192a64.19 64.19 0 0 0-64-64z m0 703.89l-0.11 0.11H192.11l-0.11-0.11V768h640zM832 544H720L605.6 696.54 442.18 435.07 333.25 544H192v-64h114.75l147.07-147.07L610.4 583.46 688 480h144z m0-288H192v-63.89l0.11-0.11h639.78l0.11 0.11z" p-id="5854"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/edit.svg b/src/assets/icons/svg/edit.svg
new file mode 100644
index 0000000..d26101f
--- /dev/null
+++ b/src/assets/icons/svg/edit.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M106.133 67.2a4.797 4.797 0 0 0-4.8 4.8c0 .187.014.36.027.533h-.027V118.4H9.6V26.667h50.133c2.654 0 4.8-2.147 4.8-4.8 0-2.654-2.146-4.8-4.8-4.8H9.6a9.594 9.594 0 0 0-9.6 9.6V118.4c0 5.307 4.293 9.6 9.6 9.6h91.733c5.307 0 9.6-4.293 9.6-9.6V72.533h-.026c.013-.173.026-.346.026-.533 0-2.653-2.146-4.8-4.8-4.8z"/><path d="M125.16 13.373L114.587 2.8c-3.747-3.747-9.854-3.72-13.6.027l-52.96 52.96a4.264 4.264 0 0 0-.907 1.36L33.813 88.533c-.746 1.76-.226 3.534.907 4.68 1.133 1.147 2.92 1.667 4.693.92l31.4-13.293c.507-.213.96-.52 1.36-.907l52.96-52.96c3.747-3.746 3.774-9.853.027-13.6zM66.107 72.4l-18.32 7.76 7.76-18.32L92.72 24.667l10.56 10.56L66.107 72.4zm52.226-52.227l-8.266 8.267-10.56-10.56 8.266-8.267.027-.026 10.56 10.56-.027.026z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/education.svg b/src/assets/icons/svg/education.svg
new file mode 100644
index 0000000..7bfb01d
--- /dev/null
+++ b/src/assets/icons/svg/education.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M88.883 119.565c-7.284 0-19.434 2.495-21.333 8.25v.127c-4.232.13-5.222 0-7.108 0-1.895-5.76-14.045-8.256-21.333-8.256H0V0h42.523c9.179 0 17.109 5.47 21.47 13.551C68.352 5.475 76.295 0 85.478 0H128v119.57l-39.113-.005h-.004zM60.442 24.763c0-9.651-8.978-16.507-17.777-16.507H7.108V111.43H39.11c7.054-.14 18.177.082 21.333 6.12v-4.628c-.134-5.722-.004-13.522 0-13.832V27.413l.004-2.655-.004.005zm60.442-16.517h-35.55c-8.802 0-17.78 6.856-17.78 16.493v74.259c.004.32.138 8.115 0 13.813v4.627c3.155-6.022 14.279-6.26 21.333-6.114h32V8.25l-.003-.005z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/email.svg b/src/assets/icons/svg/email.svg
new file mode 100644
index 0000000..74d25e2
--- /dev/null
+++ b/src/assets/icons/svg/email.svg
@@ -0,0 +1 @@
+<svg width="128" height="96" xmlns="http://www.w3.org/2000/svg"><path d="M64.125 56.975L120.188.912A12.476 12.476 0 0 0 115.5 0h-103c-1.588 0-3.113.3-4.513.838l56.138 56.137z"/><path d="M64.125 68.287l-62.3-62.3A12.42 12.42 0 0 0 0 12.5v71C0 90.4 5.6 96 12.5 96h103c6.9 0 12.5-5.6 12.5-12.5v-71a12.47 12.47 0 0 0-1.737-6.35L64.125 68.287z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/example.svg b/src/assets/icons/svg/example.svg
new file mode 100644
index 0000000..46f42b5
--- /dev/null
+++ b/src/assets/icons/svg/example.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M96.258 57.462h31.421C124.794 27.323 100.426 2.956 70.287.07v31.422a32.856 32.856 0 0 1 25.971 25.97zm-38.796-25.97V.07C27.323 2.956 2.956 27.323.07 57.462h31.422a32.856 32.856 0 0 1 25.97-25.97zm12.825 64.766v31.421c30.46-2.885 54.507-27.253 57.713-57.712H96.579c-2.886 13.466-13.146 23.726-26.292 26.291zM31.492 70.287H.07c2.886 30.46 27.253 54.507 57.713 57.713V96.579c-13.466-2.886-23.726-13.146-26.291-26.292z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/excel.svg b/src/assets/icons/svg/excel.svg
new file mode 100644
index 0000000..74d97b8
--- /dev/null
+++ b/src/assets/icons/svg/excel.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M78.208 16.576v8.384h38.72v5.376h-38.72v8.704h38.72v5.376h-38.72v8.576h38.72v5.376h-38.72v8.576h38.72v5.376h-38.72v8.576h38.72v5.376h-38.72v8.512h38.72v5.376h-38.72v11.136H128v-94.72H78.208zM0 114.368L72.128 128V0L0 13.632v100.736z"/><path d="M28.672 82.56h-11.2l14.784-23.488-14.08-22.592h11.52l8.192 14.976 8.448-14.976h11.136l-14.08 22.208L58.368 82.56H46.656l-8.768-15.68z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/exit-fullscreen.svg b/src/assets/icons/svg/exit-fullscreen.svg
new file mode 100644
index 0000000..485c128
--- /dev/null
+++ b/src/assets/icons/svg/exit-fullscreen.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M49.217 41.329l-.136-35.24c-.06-2.715-2.302-4.345-5.022-4.405h-3.65c-2.712-.06-4.866 2.303-4.806 5.016l.152 19.164-24.151-23.79a6.698 6.698 0 0 0-9.499 0 6.76 6.76 0 0 0 0 9.526l23.93 23.713-18.345.074c-2.712-.069-5.228 1.813-5.64 5.02v3.462c.069 2.721 2.31 4.97 5.022 5.03l35.028-.207c.052.005.087.025.133.025l2.457.054a4.626 4.626 0 0 0 3.436-1.38c.88-.874 1.205-2.096 1.169-3.462l-.262-2.465c0-.048.182-.081.182-.136h.002zm52.523 51.212l18.32-.073c2.713.06 5.224-1.609 5.64-4.815v-3.462c-.068-2.722-2.317-4.97-5.021-5.04l-34.58.21c-.053 0-.086-.021-.138-.021l-2.451-.06a4.64 4.64 0 0 0-3.445 1.381c-.885.868-1.201 2.094-1.174 3.46l.27 2.46c.005.06-.177.095-.177.141l.141 34.697c.069 2.713 2.31 4.338 5.022 4.397l3.45.006c2.705.062 4.867-2.31 4.8-5.026l-.153-18.752 24.151 23.946a6.69 6.69 0 0 0 9.494 0 6.747 6.747 0 0 0 0-9.523L101.74 92.54v.001zM48.125 80.662a4.636 4.636 0 0 0-3.437-1.382l-2.457.06c-.05 0-.082.022-.137.022l-35.025-.21c-2.712.07-4.957 2.318-5.022 5.04v3.462c.409 3.206 2.925 4.874 5.633 4.814l18.554.06-24.132 23.928c-2.62 2.626-2.62 6.89 0 9.524a6.694 6.694 0 0 0 9.496 0l24.155-23.79-.155 18.866c-.06 2.722 2.094 5.093 4.801 5.025h3.65c2.72-.069 4.962-1.685 5.022-4.406l.141-34.956c0-.05-.182-.082-.182-.136l.262-2.46c.03-1.366-.286-2.592-1.166-3.46h-.001zM80.08 47.397a4.62 4.62 0 0 0 3.443 1.374l2.45-.054c.055 0 .088-.02.143-.028l35.08.21c2.712-.062 4.953-2.312 5.021-5.033l.009-3.463c-.417-3.211-2.937-5.084-5.64-5.025l-18.615-.073 23.917-23.715c2.63-2.623 2.63-6.879.008-9.513a6.691 6.691 0 0 0-9.494 0L92.251 26.016l.155-19.312c.065-2.713-2.097-5.085-4.802-5.025h-3.45c-2.713.069-4.954 1.693-5.022 4.406l-.139 35.247c0 .054.18.088.18.136l-.267 2.465c-.028 1.366.288 2.588 1.174 3.463v.001z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/eye-open.svg b/src/assets/icons/svg/eye-open.svg
new file mode 100644
index 0000000..88dcc98
--- /dev/null
+++ b/src/assets/icons/svg/eye-open.svg
@@ -0,0 +1 @@
+<svg class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="128" height="128"><defs><style/></defs><path d="M512 128q69.675 0 135.51 21.163t115.498 54.997 93.483 74.837 73.685 82.006 51.67 74.837 32.17 54.827L1024 512q-2.347 4.992-6.315 13.483T998.87 560.17t-31.658 51.669-44.331 59.99-56.832 64.34-69.504 60.16-82.347 51.5-94.848 34.687T512 896q-69.675 0-135.51-21.163t-115.498-54.826-93.483-74.326-73.685-81.493-51.67-74.496-32.17-54.997L0 513.707q2.347-4.992 6.315-13.483t18.816-34.816 31.658-51.84 44.331-60.33 56.832-64.683 69.504-60.331 82.347-51.84 94.848-34.816T512 128.085zm0 85.333q-46.677 0-91.648 12.331t-81.152 31.83-70.656 47.146-59.648 54.485-48.853 57.686-37.675 52.821-26.325 43.99q12.33 21.674 26.325 43.52t37.675 52.351 48.853 57.003 59.648 53.845T339.2 767.02t81.152 31.488T512 810.667t91.648-12.331 81.152-31.659 70.656-46.848 59.648-54.186 48.853-57.344 37.675-52.651T927.957 512q-12.33-21.675-26.325-43.648t-37.675-52.65-48.853-57.345-59.648-54.186-70.656-46.848-81.152-31.659T512 213.334zm0 128q70.656 0 120.661 50.006T682.667 512 632.66 632.661 512 682.667 391.339 632.66 341.333 512t50.006-120.661T512 341.333zm0 85.334q-35.328 0-60.33 25.002T426.666 512t25.002 60.33T512 597.334t60.33-25.002T597.334 512t-25.002-60.33T512 426.666z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/eye.svg b/src/assets/icons/svg/eye.svg
new file mode 100644
index 0000000..16ed2d8
--- /dev/null
+++ b/src/assets/icons/svg/eye.svg
@@ -0,0 +1 @@
+<svg width="128" height="64" xmlns="http://www.w3.org/2000/svg"><path d="M127.072 7.994c1.37-2.208.914-5.152-.914-6.87-2.056-1.717-4.797-1.226-6.396.982-.229.245-25.586 32.382-55.74 32.382-29.24 0-55.74-32.382-55.968-32.627-1.6-1.963-4.57-2.208-6.397-.49C-.17 3.086-.399 6.275 1.2 8.238c.457.736 5.94 7.36 14.62 14.72L4.17 35.96c-1.828 1.963-1.6 5.152.228 6.87.457.98 1.6 1.471 2.742 1.471s2.284-.49 3.198-1.472l12.564-13.983c5.94 4.416 13.021 8.587 20.788 11.53l-4.797 17.418c-.685 2.699.686 5.397 3.198 6.133h1.37c2.057 0 3.884-1.472 4.341-3.68L52.6 42.83c3.655.736 7.538 1.227 11.422 1.227 3.883 0 7.767-.49 11.422-1.227l4.797 17.173c.457 2.208 2.513 3.68 4.34 3.68.457 0 .914 0 1.143-.246 2.513-.736 3.883-3.434 3.198-6.133l-4.797-17.172c7.767-2.944 14.848-7.114 20.788-11.53l12.336 13.738c.913.981 2.056 1.472 3.198 1.472s2.284-.49 3.198-1.472c1.828-1.963 1.828-4.906.228-6.87l-11.65-13.001c9.366-7.36 14.849-14.474 14.849-14.474z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/fangkuai.svg b/src/assets/icons/svg/fangkuai.svg
new file mode 100644
index 0000000..131381b
--- /dev/null
+++ b/src/assets/icons/svg/fangkuai.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="60" height="60" viewBox="0 0 60 60"><g><g style="opacity:0.20999999344348907;"><path d="M30,0L37,0Q37.5646,0,38.1286,0.0277045Q38.6925,0.055409,39.2544,0.110751Q39.8163,0.166094,40.3748,0.24894Q40.9333,0.331787,41.4871,0.441938Q42.0408,0.55209,42.5885,0.689281Q43.1362,0.826472,43.6765,0.990372Q44.2169,1.15427,44.7485,1.34449Q45.2801,1.5347,45.8017,1.75077Q46.3234,1.96684,46.8338,2.20825Q47.3442,2.44965,47.8421,2.71581Q48.3401,2.98197,48.8244,3.27224Q49.3087,3.56251,49.7781,3.8762Q50.2476,4.18988,50.7011,4.52623Q51.1546,4.86257,51.591,5.22076Q52.0275,5.57895,52.4459,5.95812Q52.8642,6.3373,53.2635,6.73654Q53.6627,7.13579,54.0419,7.55414Q54.4211,7.9725,54.7792,8.40895Q55.1374,8.84541,55.4738,9.29892Q55.8101,9.75242,56.1238,10.2219Q56.4375,10.6913,56.7278,11.1756Q57.018,11.6599,57.2842,12.1579Q57.5503,12.6558,57.7917,13.1662Q58.0331,13.6766,58.2492,14.1983Q58.4653,14.7199,58.6555,15.2515Q58.8457,15.7831,59.0096,16.3235Q59.1735,16.8638,59.3107,17.4115Q59.4479,17.9592,59.5581,18.5129Q59.6682,19.0667,59.7511,19.6252Q59.8339,20.1837,59.8892,20.7456Q59.9446,21.3075,59.9723,21.8714Q60,22.4354,60,23L60,37Q60,37.5646,59.9723,38.1286Q59.9446,38.6925,59.8892,39.2544Q59.8339,39.8163,59.751,40.3748Q59.6682,40.9333,59.5581,41.4871Q59.4479,42.0408,59.3107,42.5885Q59.1735,43.1362,59.0096,43.6765Q58.8457,44.2169,58.6555,44.7485Q58.4653,45.2801,58.2492,45.8017Q58.0331,46.3234,57.7917,46.8338Q57.5503,47.3442,57.2842,47.8421Q57.018,48.3401,56.7278,48.8244Q56.4375,49.3087,56.1238,49.7781Q55.8101,50.2476,55.4738,50.7011Q55.1374,51.1546,54.7792,51.591Q54.4211,52.0275,54.0419,52.4459Q53.6627,52.8642,53.2635,53.2635Q52.8642,53.6627,52.4459,54.0419Q52.0275,54.4211,51.591,54.7792Q51.1546,55.1374,50.7011,55.4738Q50.2476,55.8101,49.7781,56.1238Q49.3087,56.4375,48.8244,56.7278Q48.3401,57.018,47.8421,57.2842Q47.3442,57.5503,46.8338,57.7917Q46.3234,58.0331,45.8017,58.2492Q45.2801,58.4653,44.7485,58.6555Q44.2169,58.8457,43.6765,59.0096Q43.1362,59.1735,42.5885,59.3107Q42.0408,59.4479,41.4871,59.5581Q40.9333,59.6682,40.3748,59.7511Q39.8163,59.8339,39.2544,59.8892Q38.6925,59.9446,38.1286,59.9723Q37.5646,60,37,60L23,60Q22.4354,60,21.8714,59.9723Q21.3075,59.9446,20.7456,59.8892Q20.1837,59.8339,19.6252,59.751Q19.0667,59.6682,18.5129,59.5581Q17.9592,59.4479,17.4115,59.3107Q16.8638,59.1735,16.3235,59.0096Q15.7831,58.8457,15.2515,58.6555Q14.7199,58.4653,14.1983,58.2492Q13.6766,58.0331,13.1662,57.7917Q12.6558,57.5503,12.1579,57.2842Q11.6599,57.018,11.1756,56.7278Q10.6913,56.4375,10.2219,56.1238Q9.75242,55.8101,9.29892,55.4738Q8.84541,55.1374,8.40895,54.7792Q7.9725,54.4211,7.55414,54.0419Q7.13579,53.6627,6.73654,53.2635Q6.3373,52.8642,5.95812,52.4459Q5.57895,52.0275,5.22076,51.591Q4.86257,51.1546,4.52623,50.7011Q4.18988,50.2476,3.8762,49.7781Q3.56251,49.3087,3.27224,48.8244Q2.98197,48.3401,2.71581,47.8421Q2.44965,47.3442,2.20825,46.8338Q1.96684,46.3234,1.75077,45.8017Q1.5347,45.2801,1.34449,44.7485Q1.15427,44.2169,0.990372,43.6765Q0.826472,43.1362,0.689281,42.5885Q0.55209,42.0408,0.441938,41.4871Q0.331787,40.9333,0.24894,40.3748Q0.166094,39.8163,0.110751,39.2544Q0.055409,38.6925,0.0277045,38.1286Q0,37.5646,0,37L0,23Q0,22.4354,0.0277045,21.8714Q0.055409,21.3075,0.110751,20.7456Q0.166094,20.1837,0.24894,19.6252Q0.331787,19.0667,0.441938,18.5129Q0.55209,17.9592,0.689281,17.4115Q0.826472,16.8638,0.990372,16.3235Q1.15427,15.7831,1.34449,15.2515Q1.5347,14.7199,1.75077,14.1983Q1.96684,13.6766,2.20825,13.1662Q2.44965,12.6558,2.71581,12.1579Q2.98197,11.6599,3.27224,11.1756Q3.56251,10.6913,3.8762,10.2219Q4.18988,9.75242,4.52623,9.29892Q4.86257,8.84541,5.22076,8.40895Q5.57895,7.9725,5.95812,7.55414Q6.3373,7.13579,6.73654,6.73654Q7.13579,6.3373,7.55414,5.95812Q7.9725,5.57895,8.40895,5.22076Q8.84541,4.86257,9.29892,4.52623Q9.75242,4.18988,10.2219,3.8762Q10.6913,3.56251,11.1756,3.27224Q11.6599,2.98197,12.1579,2.71581Q12.6558,2.44965,13.1662,2.20825Q13.6766,1.96684,14.1983,1.75077Q14.7199,1.5347,15.2515,1.34449Q15.7831,1.15427,16.3235,0.990372Q16.8638,0.826472,17.4115,0.689281Q17.9592,0.55209,18.5129,0.441938Q19.0667,0.331787,19.6252,0.24894Q20.1837,0.166094,20.7456,0.110751Q21.3075,0.055409,21.8714,0.0277045Q22.4354,0,23,0L30,0Z" fill-rule="evenodd" fill="#FEC53D" fill-opacity="1"/></g><g><g><path d="M45.0013,37.4248663772583L45.0013,24.1184663772583L31.7579,31.7645763772583C31.7282,31.781706377258303,31.6982,31.7978163772583,31.668,31.8129263772583L31.668,46.3846663772583L44.081199999999995,39.0384663772583C44.6515,38.7009663772583,45.0013,38.0875663772583,45.0013,37.4248663772583ZM27.9005,31.7645663772583L15,24.3164643772583L15,37.4248663772583C15,38.0875663772583,15.349784,38.7009663772583,15.920065,39.0384663772583L28.3333,46.3846663772583L28.3333,31.9394663772583C28.1851,31.9026963772583,28.0394,31.844766377258303,27.9005,31.7645663772583Z" fill-rule="evenodd" fill="#FEC53D" fill-opacity="1"/></g><g style="opacity:0.499209463596344;"><path d="M15.405221909284593,20.70142C15.562796909284591,20.50244,15.761684909284591,20.33426,15.993563909284592,20.21076C15.993563909284592,20.21076,29.118521909284592,13.2201,29.118521909284592,13.2201C29.66952190928459,12.9266335,30.330421909284592,12.9266335,30.88142190928459,13.2201C30.88142190928459,13.2201,44.00642190928459,20.21076,44.00642190928459,20.21076C44.18522190928459,20.30596,44.34432190928459,20.42771,44.48002190928459,20.56966C44.48002190928459,20.56966,30.08992190928459,28.8778,30.08992190928459,28.8778C29.99522190928459,28.932499999999997,29.908021909284592,28.994999999999997,29.82852190928459,29.064C29.749021909284593,28.994999999999997,29.66182190928459,28.932499999999997,29.56712190928459,28.8778C29.56712190928459,28.8778,15.405221909284593,20.70142,15.405221909284593,20.70142Z" fill-rule="evenodd" fill="#FEC53D" fill-opacity="1"/></g></g></g></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/form.svg b/src/assets/icons/svg/form.svg
new file mode 100644
index 0000000..dcbaa18
--- /dev/null
+++ b/src/assets/icons/svg/form.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M84.068 23.784c-1.02 0-1.877-.32-2.572-.96a8.588 8.588 0 0 1-1.738-2.237 11.524 11.524 0 0 1-1.042-2.621c-.232-.895-.348-1.641-.348-2.238V0h.278c.834 0 1.622.085 2.363.256.742.17 1.645.575 2.711 1.214 1.066.64 2.363 1.535 3.892 2.686 1.53 1.15 3.453 2.664 5.77 4.54 2.502 2.045 4.494 3.771 5.977 5.178 1.483 1.406 2.618 2.6 3.406 3.58.787.98 1.274 1.812 1.46 2.494.185.682.277 1.278.277 1.79v2.046H84.068zM127.3 84.01c.278.682.464 1.535.556 2.558.093 1.023-.37 2.003-1.39 2.94-.463.427-.88.832-1.25 1.215-.372.384-.696.704-.974.96a6.69 6.69 0 0 1-.973.767l-11.816-10.741a44.331 44.331 0 0 0 1.877-1.535 31.028 31.028 0 0 1 1.737-1.406c1.112-.938 2.317-1.343 3.615-1.215 1.297.128 2.363.405 3.197.83.927.427 1.923 1.173 2.989 2.239 1.065 1.065 1.876 2.195 2.432 3.388zM78.23 95.902c2.038 0 3.752-.511 5.143-1.534l-26.969 25.83H18.037c-1.761 0-3.684-.47-5.77-1.407a24.549 24.549 0 0 1-5.838-3.709 21.373 21.373 0 0 1-4.518-5.306c-1.204-2.003-1.807-4.07-1.807-6.202V16.495c0-1.79.44-3.665 1.32-5.626A18.41 18.41 0 0 1 5.04 5.562a21.798 21.798 0 0 1 5.213-3.964C12.198.533 14.237 0 16.37 0h53.24v15.984c0 1.62.278 3.367.834 5.242a16.704 16.704 0 0 0 2.572 5.179c1.159 1.577 2.665 2.898 4.518 3.964 1.853 1.066 4.078 1.598 6.673 1.598h20.295v42.325L85.458 92.45c1.02-1.364 1.529-2.856 1.529-4.476 0-2.216-.857-4.113-2.572-5.69-1.714-1.577-3.776-2.366-6.186-2.366H26.1c-2.409 0-4.448.789-6.116 2.366-1.668 1.577-2.502 3.474-2.502 5.69 0 2.217.834 4.092 2.502 5.626 1.668 1.535 3.707 2.302 6.117 2.302h52.13zM26.1 47.951c-2.41 0-4.449.789-6.117 2.366-1.668 1.577-2.502 3.473-2.502 5.69 0 2.216.834 4.092 2.502 5.626 1.668 1.534 3.707 2.302 6.117 2.302h52.13c2.409 0 4.47-.768 6.185-2.302 1.715-1.534 2.572-3.41 2.572-5.626 0-2.217-.857-4.113-2.572-5.69-1.714-1.577-3.776-2.366-6.186-2.366H26.1zm52.407 64.063l1.807-1.663 3.476-3.196a479.75 479.75 0 0 0 4.587-4.284 500.757 500.757 0 0 1 5.004-4.667c3.985-3.666 8.48-7.758 13.485-12.276l11.677 10.741-13.485 12.404-5.004 4.603-4.587 4.22a179.46 179.46 0 0 0-3.267 3.068c-.88.853-1.367 1.322-1.46 1.407-.463.341-.973.703-1.529 1.087-.556.383-1.112.703-1.668.959-.556.256-1.413.575-2.572.959a83.5 83.5 0 0 1-3.545 1.087 72.2 72.2 0 0 1-3.475.895c-1.112.256-1.946.426-2.502.511-1.112.17-1.854.043-2.224-.383-.371-.426-.464-1.151-.278-2.174.092-.511.278-1.279.556-2.302.278-1.023.602-2.067.973-3.132l1.042-3.005c.325-.938.58-1.577.765-1.918a10.157 10.157 0 0 1 2.224-2.941z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/fullscreen.svg b/src/assets/icons/svg/fullscreen.svg
new file mode 100644
index 0000000..0e86b6f
--- /dev/null
+++ b/src/assets/icons/svg/fullscreen.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M38.47 52L52 38.462l-23.648-23.67L43.209 0H.035L0 43.137l14.757-14.865L38.47 52zm74.773 47.726L89.526 76 76 89.536l23.648 23.672L84.795 128h43.174L128 84.863l-14.757 14.863zM89.538 52l23.668-23.648L128 43.207V.038L84.866 0 99.73 14.76 76 38.472 89.538 52zM38.46 76L14.792 99.651 0 84.794v43.173l43.137.033-14.865-14.757L52 89.53 38.46 76z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/github.svg b/src/assets/icons/svg/github.svg
new file mode 100644
index 0000000..db0a0d4
--- /dev/null
+++ b/src/assets/icons/svg/github.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1581238998885" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4187" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M511.542857 14.057143C228.914286 13.942857 0 242.742857 0 525.142857 0 748.457143 143.2 938.285714 342.628571 1008c26.857143 6.742857 22.742857-12.342857 22.742858-25.371429v-88.571428c-155.085714 18.171429-161.371429-84.457143-171.771429-101.6C172.571429 756.571429 122.857143 747.428571 137.714286 730.285714c35.314286-18.171429 71.314286 4.571429 113.028571 66.171429 30.171429 44.685714 89.028571 37.142857 118.857143 29.714286 6.514286-26.857143 20.457143-50.857143 39.657143-69.485715-160.685714-28.8-227.657143-126.857143-227.657143-243.428571 0-56.571429 18.628571-108.571429 55.2-150.514286-23.314286-69.142857 2.171429-128.342857 5.6-137.142857 66.4-5.942857 135.428571 47.542857 140.8 51.771429 37.714286-10.171429 80.8-15.542857 129.028571-15.542858 48.457143 0 91.657143 5.6 129.714286 15.885715 12.914286-9.828571 76.914286-55.771429 138.628572-50.171429 3.314286 8.8 28.228571 66.628571 6.285714 134.857143 37.028571 42.057143 55.885714 94.514286 55.885714 151.2 0 116.8-67.428571 214.971429-228.571428 243.314286a145.714286 145.714286 0 0 1 43.542857 104v128.571428c0.914286 10.285714 0 20.457143 17.142857 20.457143 202.4-68.228571 348.114286-259.428571 348.114286-484.685714 0-282.514286-229.028571-511.2-511.428572-511.2z" p-id="4188"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/golden.svg b/src/assets/icons/svg/golden.svg
new file mode 100644
index 0000000..1822692
--- /dev/null
+++ b/src/assets/icons/svg/golden.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1733409332414" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="48419" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M105.43627479 143.34864043H101.06177106a91.86457827 91.86457827 0 0 0-91.59945684 91.59945683v4.10938229a95.97396057 95.97396057 0 0 1 95.97396057-95.70883912zM633.2930579 156.60471233H447.04524768v8.74900746a212.09715042 212.09715042 0 0 1-384.42608513 121.2930579v570.80645605A91.86457827 91.86457827 0 0 0 154.08605867 949.45037275h479.20699923a91.86457827 91.86457827 0 0 0 91.59945684-91.59945686v-609.77930744a91.86457827 91.86457827 0 0 0-91.59945684-91.46689612zM481.37847391 690.02904563a21.87251863 21.87251863 0 0 1-37.38212276 15.50960413l-50.10795179-50.10795179-50.24051251 49.97539108a22.2702008 22.2702008 0 0 1-6.89315738 4.63962516 21.60739721 21.60739721 0 0 1-8.48388602 1.72328934 21.87251863 21.87251863 0 0 1-15.11192197-6.3629145 22.53532223 22.53532223 0 0 1-4.63962516-6.8931574 21.87251863 21.87251863 0 0 1-1.72328935-8.48388602V618.0485752a152.7099483 152.7099483 0 0 0 174.98014909 0z m-87.49007455-66.2803595a131.23511182 131.23511182 0 1 1 131.23511182-131.23511183 131.23511182 131.23511182 0 0 1-131.23511182 131.89791543z" fill="#FF7E00" p-id="48420"></path><path d="M828.554997 260.13463387L777.12143803 246.87856197a15.90728628 15.90728628 0 0 0-19.61898642 15.50960413v647.6916731h1.19304647c3.97682157-1.06048575 10.60485751-4.63962516 20.14922929-28.36799388 1.85585006-4.63962516 4.10938229-10.86997897 6.36291452-18.29337922l115.0627041-489.01649244A95.97396057 95.97396057 0 0 0 828.554997 260.13463387zM985.50688831 428.75186846l-31.54945112-16.30496844a15.90728628 15.90728628 0 0 0-22.80044368 10.33973609l-117.44879704 470.85567392h1.45816791a41.35894433 41.35894433 0 0 0 19.35386497-16.57008987 106.0485752 106.0485752 0 0 0 8.08620388-12.46070759l174.05222405-338.29495492a72.64327402 72.64327402 0 0 0-31.15176897-97.56468919z" fill="#FF7E00" p-id="48421"></path><path d="M393.88839936 493.04381718m-131.23511182 0a131.23511182 131.23511182 0 1 0 262.47022364 0 131.23511182 131.23511182 0 1 0-262.47022364 0Z" fill="#FFFFFF" p-id="48422"></path><path d="M306.39832481 618.0485752v71.31766684a21.87251863 21.87251863 0 0 0 1.72328936 8.48388601 22.53532223 22.53532223 0 0 0 4.63962516 6.89315739 21.87251863 21.87251863 0 0 0 15.50960412 6.36291451 21.60739721 21.60739721 0 0 0 8.48388602-1.72328934 22.2702008 22.2702008 0 0 0 6.89315738-4.63962517l50.10795178-50.10795179 50.10795179 50.10795179a21.87251863 21.87251863 0 0 0 37.38212277-15.50960413V618.0485752a152.7099483 152.7099483 0 0 1-174.9801491 0z" fill="#FFFFFF" p-id="48423"></path><path d="M235.87602229 376.92062733a212.09715042 212.09715042 0 0 0 212.09715042-212.09715042v-8.74900746H158.4605624a95.97396057 95.97396057 0 0 0-95.70883913 95.70883913V286.64677769a211.16922539 211.16922539 0 0 0 173.12429902 90.27384964z" fill="#FF7E00" p-id="48424"></path><path d="M235.87602229 376.92062733a212.09715042 212.09715042 0 0 0 212.09715042-212.09715042v-8.74900746H158.4605624a95.97396057 95.97396057 0 0 0-95.70883913 95.70883913V286.64677769a211.16922539 211.16922539 0 0 0 173.12429902 90.27384964z" fill="#FD973F" p-id="48425"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/guide.svg b/src/assets/icons/svg/guide.svg
new file mode 100644
index 0000000..b271001
--- /dev/null
+++ b/src/assets/icons/svg/guide.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M1.482 70.131l36.204 16.18 69.932-65.485-61.38 70.594 46.435 18.735c1.119.425 2.397-.17 2.797-1.363v-.085L127.998.047 1.322 65.874c-1.12.597-1.519 1.959-1.04 3.151.32.511.72.937 1.2 1.107zm44.676 57.821L64.22 107.26l-18.062-7.834v28.527z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/icon.svg b/src/assets/icons/svg/icon.svg
new file mode 100644
index 0000000..82be8ee
--- /dev/null
+++ b/src/assets/icons/svg/icon.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M115.147.062a13 13 0 0 1 4.94.945c1.55.63 2.907 1.526 4.069 2.688a13.148 13.148 0 0 1 2.761 4.069c.678 1.55 1.017 3.245 1.017 5.086v102.3c0 3.681-1.187 6.733-3.56 9.155-2.373 2.422-5.352 3.633-8.937 3.633H12.992c-3.875 0-7-1.26-9.373-3.779-2.373-2.518-3.56-5.667-3.56-9.445V12.704c0-3.39 1.163-6.345 3.488-8.863C5.872 1.32 8.972.062 12.847.062h102.3zM81.434 109.047c1.744 0 3.003-.412 3.778-1.235.775-.824 1.163-1.914 1.163-3.27 0-1.26-.388-2.325-1.163-3.197-.775-.872-2.034-1.307-3.778-1.307H72.57c.097-.194.145-.485.145-.872V27.09h9.01c1.743 0 2.954-.436 3.633-1.308.678-.872 1.017-1.938 1.017-3.197 0-1.26-.34-2.325-1.017-3.197-.679-.872-1.89-1.308-3.633-1.308H46.268c-1.743 0-2.954.436-3.632 1.308-.678.872-1.018 1.938-1.018 3.197 0 1.26.34 2.325 1.018 3.197.678.872 1.889 1.308 3.632 1.308h8.138v72.075c0 .193.024.339.073.436.048.096.072.242.072.436H46.56c-1.744 0-3.003.435-3.778 1.307-.775.872-1.163 1.938-1.163 3.197 0 1.356.388 2.446 1.163 3.27.775.823 2.034 1.235 3.778 1.235h34.875z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/input.svg b/src/assets/icons/svg/input.svg
new file mode 100644
index 0000000..ab91381
--- /dev/null
+++ b/src/assets/icons/svg/input.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1575802859706" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3102" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M896 224H128c-35.2 0-64 28.8-64 64v448c0 35.2 28.8 64 64 64h768c35.2 0 64-28.8 64-64V288c0-35.2-28.8-64-64-64z m0 480c0 19.2-12.8 32-32 32H160c-19.2 0-32-12.8-32-32V320c0-19.2 12.8-32 32-32h704c19.2 0 32 12.8 32 32v384z" p-id="3103"></path><path d="M224 352c-19.2 0-32 12.8-32 32v256c0 16 12.8 32 32 32s32-12.8 32-32V384c0-16-12.8-32-32-32z" p-id="3104"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/international.svg b/src/assets/icons/svg/international.svg
new file mode 100644
index 0000000..e9b56ee
--- /dev/null
+++ b/src/assets/icons/svg/international.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M83.287 103.01c-1.57-3.84-6.778-10.414-15.447-19.548-2.327-2.444-2.182-4.306-1.338-9.862v-.64c.553-3.81 1.513-6.05 14.313-8.087 6.516-1.018 8.203 1.57 10.589 5.178l.785 1.193a12.625 12.625 0 0 0 6.43 5.207c1.134.524 2.53 1.164 4.421 2.24 4.596 2.53 4.596 5.41 4.596 11.753v.727a26.91 26.91 0 0 1-5.178 17.454 59.055 59.055 0 0 1-19.025 11.026c3.49-6.546.814-14.313 0-16.553l-.146-.087zM64 5.12a58.502 58.502 0 0 1 25.484 5.818 54.313 54.313 0 0 0-12.859 10.327c-.93 1.28-1.716 2.473-2.472 3.579-2.444 3.694-3.637 5.352-5.818 5.614a25.105 25.105 0 0 1-4.219 0c-4.276-.29-10.094-.64-11.956 4.422-1.193 3.23-1.396 11.956 2.444 16.495.66 1.077.778 2.4.32 3.578a7.01 7.01 0 0 1-2.066 3.229 18.938 18.938 0 0 1-2.909-2.91 18.91 18.91 0 0 0-8.32-6.603c-1.25-.349-2.647-.64-3.985-.93-3.782-.786-8.03-1.688-9.019-3.812a14.895 14.895 0 0 1-.727-5.818 21.935 21.935 0 0 0-1.396-9.25 8.873 8.873 0 0 0-5.557-4.946A58.705 58.705 0 0 1 64 5.12zM0 64c0 35.346 28.654 64 64 64 35.346 0 64-28.654 64-64 0-35.346-28.654-64-64-64C28.654 0 0 28.654 0 64z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/job.svg b/src/assets/icons/svg/job.svg
new file mode 100644
index 0000000..2a93a25
--- /dev/null
+++ b/src/assets/icons/svg/job.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1566036191400" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5472" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M934.912 1016.832H192c-14.336 0-25.6-11.264-25.6-25.6v-189.44c0-14.336 11.264-25.6 25.6-25.6s25.6 11.264 25.6 25.6v163.84h691.712V64H217.6v148.48c0 14.336-11.264 25.6-25.6 25.6s-25.6-11.264-25.6-25.6v-174.08c0-14.336 11.264-25.6 25.6-25.6h742.912c14.336 0 25.6 11.264 25.6 25.6v952.832c0 14.336-11.264 25.6-25.6 25.6z" p-id="5473"></path><path d="M232.96 371.2h-117.76c-14.336 0-25.6-11.264-25.6-25.6s11.264-25.6 25.6-25.6h117.76c14.336 0 25.6 11.264 25.6 25.6s-11.264 25.6-25.6 25.6zM232.96 540.16h-117.76c-14.336 0-25.6-11.264-25.6-25.6s11.264-25.6 25.6-25.6h117.76c14.336 0 25.6 11.264 25.6 25.6s-11.264 25.6-25.6 25.6zM232.96 698.88h-117.76c-14.336 0-25.6-11.264-25.6-25.6s11.264-25.6 25.6-25.6h117.76c14.336 0 25.6 11.264 25.6 25.6s-11.264 25.6-25.6 25.6zM574.464 762.88c-134.144 0-243.2-109.056-243.2-243.2S440.32 276.48 574.464 276.48s243.2 109.056 243.2 243.2-109.056 243.2-243.2 243.2z m0-435.2c-105.984 0-192 86.016-192 192S468.48 711.68 574.464 711.68s192-86.016 192-192S680.448 327.68 574.464 327.68z" p-id="5474"></path><path d="M663.04 545.28h-87.04c-14.336 0-25.6-11.264-25.6-25.6s11.264-25.6 25.6-25.6h87.04c14.336 0 25.6 11.264 25.6 25.6s-11.264 25.6-25.6 25.6z" p-id="5475"></path><path d="M576 545.28c-14.336 0-25.6-11.264-25.6-25.6v-87.04c0-14.336 11.264-25.6 25.6-25.6s25.6 11.264 25.6 25.6v87.04c0 14.336-11.264 25.6-25.6 25.6z" p-id="5476"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/language.svg b/src/assets/icons/svg/language.svg
new file mode 100644
index 0000000..0082b57
--- /dev/null
+++ b/src/assets/icons/svg/language.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M84.742 36.8c2.398 7.2 5.595 12.8 11.19 18.4 4.795-4.8 7.992-11.2 10.39-18.4h-21.58zm-52.748 40h20.78l-10.39-28-10.39 28z"/><path d="M111.916 0H16.009C7.218 0 .025 7.2.025 16v96c0 8.8 7.193 16 15.984 16h95.907c8.791 0 15.984-7.2 15.984-16V16c0-8.8-6.394-16-15.984-16zM72.754 103.2c-1.598 1.6-3.197 1.6-4.795 1.6-.8 0-2.398 0-3.197-.8-.8-.8-1.599 0-1.599-.8s-.799-1.6-1.598-3.2c-.8-1.6-.8-2.4-1.599-4l-3.196-8.8H28.797L25.6 96c-1.598 3.2-2.398 5.6-3.197 7.2-.8 1.6-2.398 1.6-4.795 1.6-1.599 0-3.197-.8-4.796-1.6-1.598-1.6-2.397-2.4-2.397-4 0-.8 0-1.6.799-3.2.8-1.6.8-2.4 1.598-4l17.583-44.8c.8-1.6.8-3.2 1.599-4.8.799-1.6 1.598-3.2 2.397-4 .8-.8 1.599-2.4 3.197-3.2 1.599-.8 3.197-.8 4.796-.8 1.598 0 3.196 0 4.795.8 1.598.8 2.398 1.6 3.197 3.2.799.8 1.598 2.4 2.397 4 .8 1.6 1.599 3.2 2.398 5.6l17.583 44c1.598 3.2 2.398 5.6 2.398 7.2-.8.8-1.599 2.4-2.398 4zM116.711 72c-8.791-3.2-15.185-7.2-20.78-12-5.594 5.6-12.787 9.6-21.579 12l-2.397-4c8.791-2.4 15.984-5.6 21.579-11.2C87.939 51.2 83.144 44 81.545 36h-7.992v-3.2h21.58c-1.6-2.4-3.198-5.6-4.796-8l2.397-.8c1.599 2.4 3.997 5.6 5.595 8.8h19.98v4h-7.992c-2.397 8-6.393 15.2-11.189 20 5.595 4.8 11.988 8.8 20.78 11.2l-3.197 4z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/link.svg b/src/assets/icons/svg/link.svg
new file mode 100644
index 0000000..48197ba
--- /dev/null
+++ b/src/assets/icons/svg/link.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M115.625 127.937H.063V12.375h57.781v12.374H12.438v90.813h90.813V70.156h12.374z"/><path d="M116.426 2.821l8.753 8.753-56.734 56.734-8.753-8.745z"/><path d="M127.893 37.982h-12.375V12.375H88.706V0h39.187z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/list.svg b/src/assets/icons/svg/list.svg
new file mode 100644
index 0000000..20259ed
--- /dev/null
+++ b/src/assets/icons/svg/list.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M1.585 12.087c0 6.616 3.974 11.98 8.877 11.98 4.902 0 8.877-5.364 8.877-11.98 0-6.616-3.975-11.98-8.877-11.98-4.903 0-8.877 5.364-8.877 11.98zM125.86.107H35.613c-1.268 0-2.114 1.426-2.114 2.852v18.255c0 1.712 1.057 2.853 2.114 2.853h90.247c1.268 0 2.114-1.426 2.114-2.853V2.96c0-1.711-1.057-2.852-2.114-2.852zM.106 62.86c0 6.615 3.974 11.979 8.876 11.979 4.903 0 8.877-5.364 8.877-11.98 0-6.616-3.974-11.98-8.877-11.98-4.902 0-8.876 5.364-8.876 11.98zM124.17 50.88H33.921c-1.268 0-2.114 1.425-2.114 2.851v18.256c0 1.711 1.057 2.852 2.114 2.852h90.247c1.268 0 2.114-1.426 2.114-2.852V53.73c0-1.426-.846-2.852-2.114-2.852zM.106 115.913c0 6.616 3.974 11.98 8.876 11.98 4.903 0 8.877-5.364 8.877-11.98 0-6.616-3.974-11.98-8.877-11.98-4.902 0-8.876 5.364-8.876 11.98zm124.064-11.98H33.921c-1.268 0-2.114 1.426-2.114 2.853v18.255c0 1.711 1.057 2.852 2.114 2.852h90.247c1.268 0 2.114-1.426 2.114-2.852v-18.255c0-1.427-.846-2.853-2.114-2.853z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/lock.svg b/src/assets/icons/svg/lock.svg
new file mode 100644
index 0000000..74fee54
--- /dev/null
+++ b/src/assets/icons/svg/lock.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M119.88 49.674h-7.987V39.52C111.893 17.738 90.45.08 63.996.08 37.543.08 16.1 17.738 16.1 39.52v10.154H8.113c-4.408 0-7.987 2.94-7.987 6.577v65.13c0 3.637 3.57 6.577 7.987 6.577H119.88c4.407 0 7.987-2.94 7.987-6.577v-65.13c-.008-3.636-3.58-6.577-7.987-6.577zm-23.953 0H32.065V39.52c0-14.524 14.301-26.295 31.931-26.295 17.63 0 31.932 11.777 31.932 26.295v10.153z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/log.svg b/src/assets/icons/svg/log.svg
new file mode 100644
index 0000000..d879d33
--- /dev/null
+++ b/src/assets/icons/svg/log.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1566035943711" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4805" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M208.736 566.336H64.384v59.328h144.352v-59.328z m0-336.096H165.44V74.592c0-7.968 4.896-14.848 10.464-14.848h502.016V0.448H175.936c-38.72 1.248-69.248 34.368-68.192 74.144v155.648H64.384V289.6h144.352V230.24z m0 168.096H64.384v59.328h144.352v-59.328z m714.656 76.576h-57.76v474.496c0 7.936-4.896 14.848-10.464 14.848H175.936c-5.568 0-10.464-6.912-10.464-14.848v-155.68h43.296v-59.296H64.384v59.296h43.328v155.68c-1.024 39.776 29.472 72.896 68.192 74.144h679.232c38.72-1.184 69.248-34.368 68.256-74.144V474.912z m14.944-290.336l-83.072-85.312a71.264 71.264 0 0 0-52.544-21.728 71.52 71.52 0 0 0-51.616 23.872L386.528 507.264a30.496 30.496 0 0 0-6.176 10.72L308.16 740.512a30.016 30.016 0 0 0 6.976 30.24c7.712 7.968 19.2 10.752 29.568 7.2l216.544-74.112a28.736 28.736 0 0 0 12.128-7.936L940.448 287.456a75.552 75.552 0 0 0-2.112-102.88z m-557.12 518.272l39.104-120.64 78.336 80.416-117.44 40.224z m170.048-70.016l-103.552-106.016 200.16-222.4 103.52 106.304-200.128 222.112zM897.952 247.072l-0.256 0.224-107.136 119.168-103.52-106.528 106.432-118.624a14.144 14.144 0 0 1 10.304-4.736 13.44 13.44 0 0 1 10.464 4.288l83.264 85.696c5.472 5.6 5.664 14.72 0.448 20.512z" p-id="4806"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/logininfor.svg b/src/assets/icons/svg/logininfor.svg
new file mode 100644
index 0000000..267f844
--- /dev/null
+++ b/src/assets/icons/svg/logininfor.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1566036016814" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5261" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M896 128h-85.333333a42.666667 42.666667 0 0 0 0 85.333333h42.666666v640H170.666667V213.333333h42.666666a42.666667 42.666667 0 0 0 0-85.333333H128a42.666667 42.666667 0 0 0-42.666667 42.666667v725.333333a42.666667 42.666667 0 0 0 42.666667 42.666667h768a42.666667 42.666667 0 0 0 42.666667-42.666667V170.666667a42.666667 42.666667 0 0 0-42.666667-42.666667z" p-id="5262"></path><path d="M341.333333 298.666667a42.666667 42.666667 0 0 0 42.666667-42.666667V128a42.666667 42.666667 0 0 0-85.333333 0v128a42.666667 42.666667 0 0 0 42.666666 42.666667zM512 298.666667a42.666667 42.666667 0 0 0 42.666667-42.666667V128a42.666667 42.666667 0 0 0-85.333334 0v128a42.666667 42.666667 0 0 0 42.666667 42.666667zM682.666667 298.666667a42.666667 42.666667 0 0 0 42.666666-42.666667V128a42.666667 42.666667 0 0 0-85.333333 0v128a42.666667 42.666667 0 0 0 42.666667 42.666667zM341.333333 768a42.666667 42.666667 0 0 0 42.666667-42.666667 128 128 0 0 1 256 0 42.666667 42.666667 0 0 0 85.333333 0 213.333333 213.333333 0 0 0-107.52-184.32A128 128 0 0 0 640 469.333333a128 128 0 0 0-256 0 128 128 0 0 0 22.186667 71.68A213.333333 213.333333 0 0 0 298.666667 725.333333a42.666667 42.666667 0 0 0 42.666666 42.666667z m128-298.666667a42.666667 42.666667 0 1 1 42.666667 42.666667 42.666667 42.666667 0 0 1-42.666667-42.666667z" p-id="5263"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/message.svg b/src/assets/icons/svg/message.svg
new file mode 100644
index 0000000..14ca817
--- /dev/null
+++ b/src/assets/icons/svg/message.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M0 20.967v59.59c0 11.59 8.537 20.966 19.075 20.966h28.613l1 26.477L76.8 101.523h32.125c10.538 0 19.075-9.377 19.075-20.966v-59.59C128 9.377 119.463 0 108.925 0h-89.85C8.538 0 0 9.377 0 20.967zm82.325 33.1c0-5.524 4.013-9.935 9.037-9.935 5.026 0 9.038 4.41 9.038 9.934 0 5.524-4.025 9.934-9.038 9.934-5.024 0-9.037-4.41-9.037-9.934zm-27.613 0c0-5.524 4.013-9.935 9.038-9.935s9.037 4.41 9.037 9.934c0 5.524-4.025 9.934-9.037 9.934-5.025 0-9.038-4.41-9.038-9.934zm-27.1 0c0-5.524 4.013-9.935 9.038-9.935s9.038 4.41 9.038 9.934c0 5.524-4.026 9.934-9.05 9.934-5.013 0-9.025-4.41-9.025-9.934z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/money.svg b/src/assets/icons/svg/money.svg
new file mode 100644
index 0000000..c1580de
--- /dev/null
+++ b/src/assets/icons/svg/money.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M54.122 127.892v-28.68H7.513V87.274h46.609v-12.4H7.513v-12.86h38.003L.099 0h22.6l32.556 45.07c3.617 5.144 6.44 9.611 8.487 13.385 1.788-3.05 4.89-7.779 9.301-14.186L103.93 0h24.01L82.385 62.013h38.34v12.862h-46.41v12.4h46.41v11.937h-46.41v28.68H54.123z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/monitor.svg b/src/assets/icons/svg/monitor.svg
new file mode 100644
index 0000000..bc308cb
--- /dev/null
+++ b/src/assets/icons/svg/monitor.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1543827393750" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4695" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: rbicon; src: url("chrome-extension://dipiagiiohfljcicegpgffpbnjmgjcnf/fonts/rbicon.woff2") format("woff2"); font-weight: normal; font-style: normal; }
+</style></defs><path d="M64 64V640H896V64H64zM0 0h960v704H0V0z" p-id="4696"></path><path d="M192 896H768v64H192zM448 640H512v256h-64z" p-id="4697"></path><path d="M479.232 561.604267l309.9904-348.330667-47.803733-42.5472-259.566934 291.669333L303.957333 240.008533 163.208533 438.6048l52.224 37.009067 91.6224-129.28z" p-id="4698"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/moon.svg b/src/assets/icons/svg/moon.svg
new file mode 100644
index 0000000..ec72d77
--- /dev/null
+++ b/src/assets/icons/svg/moon.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1733303018722" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1447" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M368.832 67.2c51.328-16.384 89.216 34.112 75.712 76.416a346.816 346.816 0 0 0 435.84 435.84c42.304-13.44 92.8 24.384 76.48 75.712A467.968 467.968 0 1 1 368.832 67.2z m-35.776 122.688a368.832 368.832 0 1 0 501.056 501.056 445.952 445.952 0 0 1-501.056-501.056z" p-id="1448"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/mp.svg b/src/assets/icons/svg/mp.svg
new file mode 100644
index 0000000..33927af
--- /dev/null
+++ b/src/assets/icons/svg/mp.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1733409034463" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="35210" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M613.888 1019.904c-7.168 0.512-13.824-2.048-18.944-6.656-9.216-7.168-12.8-20.992-9.216-33.28 64-151.552 67.584-156.672 69.12-158.208l227.84-250.88c15.36-17.408 44.032-18.432 61.952-3.072l57.344 51.2c17.408 15.36 18.432 43.008 3.072 61.44l-227.84 250.88c-1.536 1.536-6.144 6.656-150.528 84.48-3.072 2.048-8.192 4.096-12.8 4.096z m17.408-52.224c-1.024 2.56 0.512 3.584 1.536 4.608 1.536 1.024 2.56 0 3.584-0.512 48.64-27.136 99.84-56.832 109.056-62.976l218.112-242.176c7.168-7.168 6.144-18.432-1.024-24.576l-39.936-34.816c-6.656-6.144-18.432-5.632-24.576 1.024L694.784 834.56c-6.656 10.752-41.984 80.896-63.488 133.12z m293.888-241.152l-89.088-84.48c-4.608-4.608 1.024-19.968 5.632-24.576 4.096-4.608 16.896-4.608 21.504 0L952.32 701.44c4.608 4.608 1.024 16.384-3.072 20.992-2.56 2.56-5.12 4.096-8.192 4.096-3.584 0.512-13.824 2.048-15.872 0z m-168.448 189.44l-89.088-84.48c-4.608-4.608 1.024-19.968 5.632-24.576 4.096-4.608 16.896-4.608 21.504 0l89.088 83.968c4.608 4.608 1.024 16.384-3.072 20.992-2.56 2.56-5.12 4.096-8.192 4.096-3.584 0-13.824 1.536-15.872 0z" p-id="35211"></path><path d="M518.656 977.408c-4.096 16.896-19.456 28.672-36.864 27.648-3.584 0-6.656-0.512-9.728-0.512-259.072-20.48-463.36-237.056-463.36-501.248C9.216 225.28 233.984 0 512 0c264.192 0 480.768 203.776 501.248 462.848 1.536 19.968-13.312 36.864-32.768 38.4h-2.56c-203.776 3.072-380.416 170.496-455.168 460.288-1.536 4.608-2.56 9.728-4.096 15.872z m96.768-492.032c3.072 7.68 22.016 15.872 30.208 13.824 36.864-9.216 62.976-33.28 84.48-72.704 26.112-46.592 26.112-105.984 0-146.944-51.712-81.92-165.888-88.064-225.28-27.136-6.144 6.144-11.776 12.8-16.384 19.456-17.408 25.088-26.624 54.784-26.624 84.992l1.024 132.608 1.024 108.544v4.096c-0.512 25.6-10.752 49.664-28.672 67.584-44.032 44.032-110.08 33.792-144.896-22.528-18.944-30.72-18.944-62.464 0-93.696 14.336-23.552 35.84-38.4 52.224-43.008 16.896-4.096 26.624-18.432 18.432-36.864-6.144-14.848-28.672-15.36-36.352-13.312-34.304 9.728-61.44 35.84-81.408 69.12-27.648 46.08-24.064 105.984 5.632 150.528 48.128 72.704 158.72 87.04 220.16 30.208 1.536-1.536 3.584-3.072 4.608-4.608 5.632-5.632 10.752-11.776 14.848-17.92l1.536-1.536c0-0.512 0.512-1.024 0.512-1.024 4.096-5.632 7.168-11.776 10.24-17.92 0.512-1.024 1.024-1.536 1.024-2.56 2.56-5.632 5.12-11.776 7.168-17.92 0-0.512 0.512-1.024 0.512-2.048 2.048-6.144 3.584-12.8 4.608-19.456 0-1.536 0.512-3.072 0.512-4.608 1.024-6.656 1.536-13.312 1.536-19.456V356.864c0.512-24.576 6.144-47.616 25.088-66.048 44.032-44.032 109.056-40.448 143.872 15.872 18.944 30.72 18.944 65.024 0 95.744-14.336 23.04-28.672 37.376-51.712 43.52-16.896 4.096-25.088 21.504-17.92 39.424z" p-id="35212"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/nested.svg b/src/assets/icons/svg/nested.svg
new file mode 100644
index 0000000..06713a8
--- /dev/null
+++ b/src/assets/icons/svg/nested.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M.002 9.2c0 5.044 3.58 9.133 7.998 9.133 4.417 0 7.997-4.089 7.997-9.133 0-5.043-3.58-9.132-7.997-9.132S.002 4.157.002 9.2zM31.997.066h95.981V18.33H31.997V.066zm0 45.669c0 5.044 3.58 9.132 7.998 9.132 4.417 0 7.997-4.088 7.997-9.132 0-3.263-1.524-6.278-3.998-7.91-2.475-1.63-5.524-1.63-7.998 0-2.475 1.632-4 4.647-4 7.91zM63.992 36.6h63.986v18.265H63.992V36.6zm-31.995 82.2c0 5.043 3.58 9.132 7.998 9.132 4.417 0 7.997-4.089 7.997-9.132 0-5.044-3.58-9.133-7.997-9.133s-7.998 4.089-7.998 9.133zm31.995-9.131h63.986v18.265H63.992V109.67zm0-27.404c0 5.044 3.58 9.133 7.998 9.133 4.417 0 7.997-4.089 7.997-9.133 0-3.263-1.524-6.277-3.998-7.909-2.475-1.631-5.524-1.631-7.998 0-2.475 1.632-4 4.646-4 7.91zm31.995-9.13h31.991V91.4H95.987V73.135z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/number.svg b/src/assets/icons/svg/number.svg
new file mode 100644
index 0000000..ad5ce9a
--- /dev/null
+++ b/src/assets/icons/svg/number.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1575802851180" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2867" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M279.272727 791.272727h512a46.545455 46.545455 0 0 1 0 93.090909H279.272727a46.545455 46.545455 0 0 1 0-93.090909z m33.838546-617.984V651.636364H193.722182V395.170909c0-37.003636-0.884364-59.298909-2.653091-66.746182a24.948364 24.948364 0 0 0-14.615273-16.989091c-8.005818-3.863273-25.786182-5.771636-53.341091-5.771636h-11.822545v-55.854545c57.716364-12.381091 101.562182-37.888 131.490909-76.520728h70.283636z m303.709091 396.8V651.636364H354.164364v-68.235637c77.777455-127.255273 124.043636-206.010182 138.705454-236.218182 14.661818-30.254545 22.016-53.853091 22.016-70.74909 0-13.032727-2.234182-22.714182-6.656-29.137455-4.421818-6.376727-11.170909-9.588364-20.247273-9.588364a22.248727 22.248727 0 0 0-20.200727 10.612364c-4.468364 7.121455-6.656 21.178182-6.656 42.263273v45.521454H354.164364v-17.454545c0-26.763636 1.396364-47.941818 4.142545-63.348364 2.746182-15.499636 9.541818-30.72 20.386909-45.661091 10.798545-14.987636 24.901818-26.298182 42.216727-33.978182 17.361455-7.68 38.167273-11.543273 62.37091-11.543272 47.476364 0 83.316364 11.776 107.706181 35.328 24.296727 23.552 36.445091 53.341091 36.445091 89.367272 0 27.368727-6.842182 56.32-20.48 86.853819-13.730909 30.533818-54.039273 95.325091-121.018182 194.420363h130.885819z m270.615272-189.393454c18.152727 6.097455 31.650909 16.104727 40.494546 29.975272 8.843636 13.917091 13.312 46.452364 13.312 97.652364 0 38.027636-4.328727 67.490909-13.032727 88.529455-8.657455 20.945455-23.598545 36.910545-44.869819 47.848727-21.271273 10.938182-48.593455 16.384-81.873454 16.384-37.794909 0-67.490909-6.330182-89.088-19.083636-21.550545-12.660364-35.746909-28.253091-42.542546-46.638546-6.795636-18.432-10.193455-50.362182-10.193454-95.883636v-37.841455h119.389091v77.730909c0 20.666182 1.210182 33.838545 3.723636 39.424 2.420364 5.585455 7.912727 8.424727 16.337455 8.424728 9.309091 0 15.36-3.537455 18.338909-10.612364 2.932364-7.121455 4.421818-25.6 4.421818-55.575273v-33.047273c0-18.338909-2.048-31.744-6.190546-40.215272a30.72 30.72 0 0 0-18.338909-16.709818c-8.052364-2.653091-23.738182-4.189091-46.964363-4.561455V357.050182c28.392727 0 45.893818-1.070545 52.596363-3.258182a22.946909 22.946909 0 0 0 14.475637-14.149818c2.932364-7.307636 4.421818-18.711273 4.421818-34.257455v-26.624c0-16.756364-1.722182-27.741091-5.12-33.047272-3.490909-5.352727-8.843636-8.005818-16.151273-8.005819-8.285091 0-13.963636 2.792727-16.989091 8.378182-3.025455 5.632-4.561455 17.640727-4.561454 35.933091v39.284364h-119.389091v-40.773818c0-45.661091 10.472727-76.567273 31.325091-92.625455 20.898909-16.058182 54.085818-24.064 99.607272-24.064 56.878545 0 95.511273 11.170909 115.805091 33.373091 20.293818 22.248727 30.394182 53.201455 30.394182 92.765091 0 26.810182-3.630545 46.173091-10.891636 58.088727-7.307636 11.915636-20.107636 22.807273-38.446546 32.628364z" p-id="2868"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/online.svg b/src/assets/icons/svg/online.svg
new file mode 100644
index 0000000..330a202
--- /dev/null
+++ b/src/assets/icons/svg/online.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1568899557259" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="535" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M356.246145 681.56286c-68.156286-41.949414-107.246583-103.84102-107.246583-169.805384 0-65.966411 39.090297-127.860063 107.246583-169.809477 12.046361-7.414877 15.800871-23.190165 8.385994-35.236526-7.413853-12.046361-23.191188-15.801894-35.236526-8.387018-39.640836 24.399713-72.539106 56.044434-95.137801 91.515297-23.86657 37.461193-36.481889 79.620385-36.481889 121.917724 0 42.297338 12.615319 84.454484 36.481889 121.914654 22.598694 35.469839 55.496965 67.11456 95.137801 91.51325 4.185322 2.576685 8.821923 3.804652 13.400195 3.804652 8.598842 0 16.998139-4.329609 21.836331-12.190647C372.047016 704.752002 368.291482 688.976714 356.246145 681.56286zM263.943926 754.580874c-92.603071-61.111846-145.713686-149.623739-145.713686-242.840794 0-93.195565 53.094242-181.682899 145.667637-242.774279 11.805884-7.79043 15.061021-23.677259 7.269567-35.483142-7.79043-11.805884-23.677259-15.062044-35.483142-7.269567C128.487861 296.954249 67.006602 401.024489 67.006602 511.74008c0 110.73708 61.496609 214.830857 168.721703 285.593504 4.343935 2.867304 9.240455 4.238534 14.08274 4.238534 8.317433 0 16.476253-4.046153 21.400403-11.507078C279.003923 778.258133 275.748786 762.372328 263.943926 754.580874zM788.660552 226.213092c-11.80486-7.791453-27.692712-4.536316-35.483142 7.269567-7.79043 11.805884-4.536316 27.692712 7.269567 35.483142 92.575442 61.092403 145.670707 149.579737 145.670707 242.774279 0 93.216032-53.111638 181.727924-145.715733 242.840794-11.805884 7.79043-15.059997 23.678282-7.269567 35.484166 4.925173 7.461949 13.081946 11.507078 21.400403 11.507078 4.841262 0 9.739828-1.37123 14.083763-4.238534 107.22714-70.761624 168.724773-174.857447 168.724773-285.593504C957.341323 401.025513 895.860063 296.955272 788.660552 226.213092zM790.090111 633.67213c23.865547-37.459147 36.480866-79.617315 36.480866-121.914654 0-42.298362-12.615319-84.45653-36.480866-121.917724-22.598694-35.470863-55.496965-67.115584-95.139847-91.515297-12.047384-7.413853-27.821649-3.659343-35.236526 8.387018-7.414877 12.045337-3.659343 27.821649 8.385994 35.236526 68.156286 41.949414 107.247606 103.842043 107.247606 169.809477 0 65.964364-39.090297 127.85597-107.247606 169.804361-12.045337 7.414877-15.800871 23.190165-8.385994 35.237549 4.838192 7.861038 13.236466 12.190647 21.835308 12.190647 4.579295 0 9.215896-1.227967 13.400195-3.804652C734.591099 700.786691 767.490394 669.142993 790.090111 633.67213zM567.129086 518.274914c24.12342-17.150612 39.887452-45.305859 39.887452-77.07133 0-52.128241-42.452881-94.538143-94.634334-94.538143-52.18043 0-94.633311 42.408879-94.633311 94.538143 0 31.695886 15.696494 59.797921 39.730886 76.958766-49.875944 21.128203-84.917018 70.234621-84.917018 127.301338 0 2.366907 0.061398 4.762467 0.182149 7.119141l1.249457 24.296359 276.373515 0 1.238201-24.308639c0.119727-2.358721 0.181125-4.750187 0.181125-7.106862C651.786185 588.497255 616.865861 539.465538 567.129086 518.274914zM512.381182 397.889079c23.937179 0 43.411719 19.430538 43.411719 43.314505 0 23.882943-19.47454 43.313481-43.411719 43.313481-23.936155 0-43.409672-19.430538-43.409672-43.313481C468.971509 417.320641 488.445026 397.889079 512.381182 397.889079zM426.08884 625.656573c9.119705-38.542828 44.254923-67.337641 86.085634-67.337641s76.966952 28.794813 86.085634 67.337641L426.08884 625.656573z" p-id="536"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/password.svg b/src/assets/icons/svg/password.svg
new file mode 100644
index 0000000..6c64def
--- /dev/null
+++ b/src/assets/icons/svg/password.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1575802846045" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2750" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M868.593046 403.832442c-30.081109-28.844955-70.037123-44.753273-112.624057-44.753273L265.949606 359.079168c-42.554188 0-82.510202 15.908318-112.469538 44.690852-30.236652 28.782533-46.857191 67.222007-46.857191 108.198258l0 294.079782c0 40.977273 16.619516 79.414701 46.702672 108.136859 29.959336 28.844955 70.069869 44.814672 112.624057 44.814672l490.019383 0c42.585911 0 82.696444-15.969717 112.624057-44.814672 30.082132-28.844955 46.579875-67.222007 46.579875-108.136859L915.172921 511.968278C915.171897 471.053426 898.675178 432.677397 868.593046 403.832442zM841.821309 806.049083c0 22.098297-8.882298 42.772152-25.099654 58.306964-16.154935 15.661701-37.81935 24.203238-60.752666 24.203238L265.949606 888.559285c-22.934339 0-44.567032-8.54256-60.877509-24.264637-16.186657-15.474436-25.067932-36.148291-25.067932-58.246589L180.004165 511.968278c0-22.035876 8.881274-42.772152 25.192775-58.307987 16.186657-15.536858 37.81935-24.139793 60.753689-24.139793l490.019383 0c22.933315 0 44.597731 8.602935 60.752666 24.139793 16.21838 15.535835 25.099654 36.272112 25.099654 58.307987L841.822332 806.049083zM510.974136 135.440715c114.914216 0 208.318536 89.75214 208.318536 200.055338l73.350588 0c0-149.113109-126.366036-270.496667-281.669124-270.496667-155.333788 0-281.699824 121.383558-281.699824 270.496667l73.350588 0C302.623877 225.193879 396.059919 135.440715 510.974136 135.440715zM474.299865 747.244792l73.350588 0L547.650453 629.576859l-73.350588 0L474.299865 747.244792z" p-id="2751"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/pdf.svg b/src/assets/icons/svg/pdf.svg
new file mode 100644
index 0000000..957aa0c
--- /dev/null
+++ b/src/assets/icons/svg/pdf.svg
@@ -0,0 +1 @@
+<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="128" height="128"><path d="M869.073 277.307H657.111V65.344l211.962 211.963zm-238.232 26.27V65.344l-476.498-.054v416.957h714.73v-178.67H630.841zm-335.836 360.57c-5.07-3.064-10.944-5.133-17.61-6.201-6.67-1.064-13.603-1.6-20.81-1.6h-48.821v85.641h48.822c7.206 0 14.14-.532 20.81-1.6 6.665-1.065 12.54-3.133 17.609-6.202 5.064-3.063 9.134-7.406 12.208-13.007 3.065-5.602 4.6-12.937 4.6-22.011 0-9.07-1.535-16.408-4.6-22.01-3.074-5.603-7.144-9.94-12.208-13.01zM35.82 541.805v416.904h952.358V541.805H35.821zm331.421 191.179c-3.6 11.071-9.343 20.879-17.209 29.413-7.874 8.542-18.078 15.408-30.617 20.61-12.544 5.206-27.747 7.807-45.621 7.807h-66.036v102.45h-62.831V607.517h128.867c17.874 0 33.077 2.6 45.62 7.802 12.541 5.207 22.745 12.076 30.618 20.615 7.866 8.538 13.604 18.277 17.21 29.212 3.6 10.943 5.401 22.278 5.401 34.018 0 11.477-1.8 22.752-5.402 33.819zM644.9 806.417c-5.343 17.61-13.408 32.818-24.212 45.627-10.807 12.803-24.283 22.879-40.423 30.213-16.146 7.343-35.155 11.007-57.03 11.007h-123.26V607.518h123.26c18.41 0 35.552 2.941 51.428 8.808 15.873 5.869 29.618 14.671 41.22 26.412 11.608 11.744 20.674 26.411 27.217 44.02 6.535 17.61 9.803 38.288 9.803 62.035 0 20.81-2.67 40.02-8.003 57.624zm245.362-146.07h-138.07v66.03h119.66v48.829h-119.66v118.058h-62.83V607.518h200.9v52.829h-.001zm-318.2 25.611c-6.402-8.266-14.877-14.604-25.412-19.01-10.544-4.402-23.551-6.602-39.019-6.602h-44.825v180.088h56.029c9.07 0 17.872-1.463 26.415-4.401 8.535-2.932 16.14-7.802 22.812-14.609 6.665-6.8 12.007-15.667 16.007-26.61 4.003-10.94 6.003-24.275 6.003-40.021 0-14.408-1.4-27.416-4.202-39.019-2.8-11.607-7.406-21.542-13.808-29.816zm0 0"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/people.svg b/src/assets/icons/svg/people.svg
new file mode 100644
index 0000000..2bd54ae
--- /dev/null
+++ b/src/assets/icons/svg/people.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M104.185 95.254c8.161 7.574 13.145 17.441 13.145 28.28 0 1.508-.098 2.998-.285 4.466h-10.784c.238-1.465.403-2.948.403-4.465 0-8.983-4.36-17.115-11.419-23.216C86 104.66 75.355 107.162 64 107.162c-11.344 0-21.98-2.495-31.22-6.83-7.064 6.099-11.444 14.218-11.444 23.203 0 1.517.165 3 .403 4.465H10.955a35.444 35.444 0 0 1-.285-4.465c0-10.838 4.974-20.713 13.127-28.291C9.294 85.42.003 70.417.003 53.58.003 23.99 28.656.001 64 .001s63.997 23.988 63.997 53.58c0 16.842-9.299 31.85-23.812 41.673zM64 36.867c-29.454 0-53.33-10.077-53.33 15.342 0 25.418 23.876 46.023 53.33 46.023 29.454 0 53.33-20.605 53.33-46.023 0-25.419-23.876-15.342-53.33-15.342zm24.888 25.644c-3.927 0-7.111-2.665-7.111-5.953 0-3.288 3.184-5.954 7.11-5.954 3.928 0 7.111 2.666 7.111 5.954s-3.183 5.953-7.11 5.953zm-3.556 16.372c0 4.11-9.55 7.442-21.332 7.442-11.781 0-21.332-3.332-21.332-7.442 0-1.06.656-2.064 1.8-2.976 3.295 2.626 10.79 4.465 19.532 4.465 8.743 0 16.237-1.84 19.531-4.465 1.145.912 1.801 1.916 1.801 2.976zm-46.22-16.372c-3.927 0-7.11-2.665-7.11-5.953 0-3.288 3.183-5.954 7.11-5.954 3.927 0 7.111 2.666 7.111 5.954s-3.184 5.953-7.11 5.953z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/peoples.svg b/src/assets/icons/svg/peoples.svg
new file mode 100644
index 0000000..aab852e
--- /dev/null
+++ b/src/assets/icons/svg/peoples.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M95.648 118.762c0 5.035-3.563 9.121-7.979 9.121H7.98c-4.416 0-7.979-4.086-7.979-9.121C0 100.519 15.408 83.47 31.152 76.75c-9.099-6.43-15.216-17.863-15.216-30.987v-9.128c0-20.16 14.293-36.518 31.893-36.518s31.894 16.358 31.894 36.518v9.122c0 13.137-6.123 24.556-15.216 30.993 15.738 6.726 31.141 23.769 31.141 42.012z"/><path d="M106.032 118.252h15.867c3.376 0 6.101-3.125 6.101-6.972 0-13.957-11.787-26.984-23.819-32.123 6.955-4.919 11.638-13.66 11.638-23.704v-6.985c0-15.416-10.928-27.926-24.39-27.926-1.674 0-3.306.193-4.89.561 1.936 4.713 3.018 9.974 3.018 15.526v9.121c0 13.137-3.056 23.111-11.066 30.993 14.842 4.41 27.312 23.42 27.541 41.509z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/phone.svg b/src/assets/icons/svg/phone.svg
new file mode 100644
index 0000000..ab8e8c4
--- /dev/null
+++ b/src/assets/icons/svg/phone.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1567417214476" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2266" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M761.503029 2.90619 242.121921 2.90619c-32.405037 0-58.932204 26.060539-58.932204 58.527998l0 902.302287c0 32.156374 26.217105 58.216913 58.932204 58.216913l519.381108 0c32.344662 0 58.591443-26.060539 58.591443-58.216913L820.094472 61.123103C820.094472 28.966729 793.847691 2.90619 761.503029 2.90619M452.878996 61.123103l98.147344 0c6.780427 0 12.31549 5.536087 12.31549 12.253068 0 6.748704-5.535063 12.253068-12.31549 12.253068l-98.147344 0c-6.779404 0-12.345166-5.504364-12.345166-12.253068C440.532807 66.659189 446.099592 61.123103 452.878996 61.123103M501.641583 980.593398c-29.636994 0-53.987588-23.946388-53.987588-53.677527 0-29.356608 24.039509-53.614082 53.987588-53.614082 29.91738 0 53.987588 23.883967 53.987588 53.614082C555.629171 956.647009 531.559986 980.593398 501.641583 980.593398M766.35657 803.142893c0 16.23373-13.186324 29.107945-29.233811 29.107945l-470.618521 0c-16.35755 0-29.325909-13.186324-29.325909-29.107945L237.178329 163.500794c0-16.232706 13.279445-29.138644 29.325909-29.138644l470.246037 0c16.420995 0 29.357632 13.1853 29.357632 29.138644l0 639.642099L766.35657 803.142893zM766.35657 803.142893" p-id="2267"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/pjgl.svg b/src/assets/icons/svg/pjgl.svg
new file mode 100644
index 0000000..7f80582
--- /dev/null
+++ b/src/assets/icons/svg/pjgl.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735046363354" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6698" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M871.659508 288.887153c0-14.894182-12.095275-26.989457-26.989457-26.989457H178.930105c-14.894182 0-26.989457 12.095275-26.989457 26.989457s12.095275 26.989457 26.989457 26.989458h665.739946c14.894182 0 26.989457-12.095275 26.989457-26.989458zM178.930105 511.800078c-14.894182 0-26.989457 12.095275-26.989457 26.989457s12.095275 26.989457 26.989457 26.989458h305.880516c14.894182 0 26.989457-12.095275 26.989457-26.989458s-12.095275-26.989457-26.989457-26.989457H178.930105zM1001.208903 764.101523h-2.09918c-30.188208 0-54.778602-24.590394-54.778602-54.778602 0-9.996095 4.698165-20.891839 4.798125-20.891839 4.698165-10.4959 1.09957-23.390863-8.39672-29.988286l-0.499804-0.399844-52.679423-29.288559-0.599765-0.199922c-3.09879-1.399453-6.497462-1.999219-10.196017-1.999219-7.497071 0-14.894182 2.998829-19.692308 7.996876-6.397501 6.597423-26.689574 23.890668-43.083171 23.890668-16.493557 0-36.885592-17.593128-43.383053-24.290512-4.798126-5.098009-12.295197-8.196798-19.792269-8.196798-3.598594 0-6.897306 0.699727-9.996095 1.999219l-0.599766 0.199922-54.478719 29.988286-0.499805 0.399844c-9.39633 6.597423-12.994924 19.392425-8.39672 29.888325 0.099961 0.099961 4.798126 10.995705 4.798126 20.9918 0 30.188208-24.590394 54.778602-54.778602 54.778602h-2.199141c-8.596642 0-15.69387 7.696993-17.893011 19.592347-0.199922 0.99961-4.398282 23.490824-4.398282 41.283873 0 17.79305 4.19836 40.284264 4.398282 41.283874 2.299102 11.895353 9.296369 19.592347 17.893011 19.592346h2.09918c30.188208 0 54.778602 24.590394 54.778602 54.778602 0 9.996095-4.698165 20.891839-4.798126 20.9918-4.698165 10.4959-1.09957 23.390863 8.296759 29.988286l0.499805 0.399844 51.679813 28.888715 0.499804 0.199922c3.09879 1.399453 6.497462 2.09918 10.096057 2.09918 7.597032 0 14.994143-3.09879 19.792268-8.296759 6.097618-6.597423 27.089418-25.390082 43.982819-25.390082 16.993362 0 37.78524 18.692698 44.282702 25.889887 4.798126 5.29793 12.295197 8.496681 19.89223 8.496681 3.498633 0 6.897306-0.699727 9.996095-1.999219l0.599766-0.199922 53.579071-29.588442 0.499804-0.399844c9.39633-6.597423 12.994924-19.492386 8.396721-29.888325 0-0.099961-4.798126-10.995705-4.798126-20.9918 0-30.188208 24.590394-54.778602 54.778602-54.778602h2.09918c8.696603 0 15.69387-7.696993 17.992971-19.592347 0.199922-0.899649 4.398282-23.490824 4.398282-41.283873 0-17.79305-4.19836-40.284264-4.398282-41.283874-1.999219-12.295197-8.996486-19.89223-17.693088-19.892229z m-32.187427 71.871925c-45.382273 13.094885-78.66927 54.978524-78.66927 104.459195 0 5.697774 0.599766 11.195627 1.499414 16.293636l-11.895353 6.597423c-15.793831-12.994924-40.084342-28.188989-67.973448-28.188989-27.389301 0-51.779774 15.094104-67.273721 27.589223l-10.4959-5.797735c0.899649-5.098009 1.499414-10.695822 1.499414-16.493558 0-49.480672-33.286997-91.364311-78.66927-104.459195-0.399844-3.998438-0.599766-7.896915-0.599765-11.095666 0-3.298711 0.299883-7.197189 0.599765-11.095666 45.382273-13.094885 78.66927-54.978524 78.66927-104.459195 0-5.697774-0.599766-11.195627-1.499414-16.193675l13.394768-7.39711c15.493948 12.295197 39.384615 26.589613 66.474033 26.589613 26.789535 0 50.480281-13.994533 65.874268-25.989847l11.895353 6.597422c-0.899649 5.19797-1.499414 10.695822-1.499414 16.393597 0 49.480672 33.286997 91.464272 78.66927 104.459195 0.399844 3.998438 0.599766 7.896915 0.599766 11.095666 0 3.298711-0.299883 7.197189-0.599766 11.095666z" p-id="6699"></path><path d="M812.982429 751.806326c-40.184303 0-72.971496 32.687232-72.971496 72.971495 0 40.184303 32.687232 72.971496 72.971496 72.971496 40.184303 0 72.971496-32.687232 72.971495-72.971496s-32.687232-72.971496-72.971495-72.971495z m0 91.864115c-10.4959 0-18.992581-8.496681-18.992581-18.992581s8.496681-18.992581 18.992581-18.992581 18.992581 8.496681 18.992581 18.992581-8.496681 18.992581-18.992581 18.992581z" p-id="6700"></path><path d="M910.944162 0H112.755955C50.480281 0 0 50.480281 0 112.755955v630.253807C0 805.185474 50.480281 855.665756 112.755955 855.665756H256.899649l123.951581 167.9344 124.051542-167.9344H522.795783c14.894182 0 26.989457-12.095275 26.989457-26.989458s-12.095275-26.989457-26.989457-26.989457h-17.893011c-17.693089 0-34.186646 8.596642-44.282702 23.09098L380.85123 929.237017l-79.76884-104.459196c-10.096056-14.494338-26.589613-23.09098-44.282702-23.09098H112.755955C80.268645 801.686841 53.978914 775.397111 53.978914 743.009762V112.755955C53.978914 80.268645 80.268645 53.978914 112.755955 53.978914h798.188207c32.387349 0 58.77704 26.289731 58.777041 58.777041V653.744631c0 14.894182 12.095275 26.989457 26.989457 26.989457s26.989457-12.095275 26.989457-26.989457V112.755955C1023.600156 50.480281 973.119875 0 910.944162 0z" p-id="6701"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/post.svg b/src/assets/icons/svg/post.svg
new file mode 100644
index 0000000..2922c61
--- /dev/null
+++ b/src/assets/icons/svg/post.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1566035724641" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3998" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M136.4 434.3h77.7c21.5 0 38.9-17.4 38.9-38.9s-17.4-38.9-38.9-38.9h-77.7c-21.5 0-38.9 17.4-38.9 38.9s17.4 38.9 38.9 38.9zM252.9 628.6c0-21.5-17.4-38.9-38.9-38.9h-77.7c-21.5 0-38.9 17.4-38.9 38.9s17.4 38.9 38.9 38.9H214c21.5-0.1 38.9-17.5 38.9-38.9z" p-id="3999"></path><path d="M874.7 97.5H227c-28.6 0-51.8 23.2-51.8 51.8v194.3h38.9c28.6 0 51.8 23.2 51.8 51.8 0 28.6-23.2 51.8-51.8 51.8h-38.9v129.5h38.9c28.6 0 51.8 23.2 51.8 51.8 0 28.6-23.2 51.8-51.8 51.8h-38.9v194.3c0 28.6 23.2 51.8 51.8 51.8h647.7c28.6 0 51.8-23.2 51.8-51.8V149.3c0-28.6-23.2-51.8-51.8-51.8z m-311.3 723c-15.6 0-146.7-71.6-146.7-91 0-19.4 102-368.6 102-368.6l-83.6-104s-12.3-23.1 24.6-23.1h208.9c36.9 0 18.4 23.1 18.4 23.1l-79 104s102 351.3 102 368.6c0.1 17.3-131 91-146.6 91z m169.2-253.6l-27.9 40.2-74.5-240 103.4 171.7c4.6 7.9 4.2 20.6-1 28.1z" p-id="4000"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/qq.svg b/src/assets/icons/svg/qq.svg
new file mode 100644
index 0000000..ee13d4e
--- /dev/null
+++ b/src/assets/icons/svg/qq.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M18.448 57.545l-.244-.744-.198-.968-.132-.53v-2.181l.236-.859.24-.908.317-.953.428-1.06.561-1.103.794-1.104v-.773l.077-.724.123-.984.34-1.106.313-1.194.25-.548.289-.511.371-.569.405-.423v-2.73l.234-1.407.236-1.633.42-1.955.577-2.035.43-1.118.426-1.217.468-1.135.559-1.216.57-1.332.655-1.247.737-1.331.929-1.33.43-.762.457-.624.995-1.406 1.025-1.403 1.163-1.444 1.246-1.405 1.352-1.384 1.41-1.423 1.708-1.536 1.083-.934 1.322-1.008 1.34-.89 1.448-.855 1.392-.76 1.57-.63 1.667-.775 1.657-.532 1.653-.552 1.787-.548 1.785-.417 1.876-.347L59.128.68l1.879-.245 1.876-.252 2.002-.106h5.912l1.97.243 1.981.231 2.019.207 1.874.441 1.979.413 1.857.475 2.035.53 1.862.646 1.782.738 1.904.78 1.736.853 1.689.95 1.655 1.044 1.425.971.662.548.693.401 1.323 1.1 1.115 1.064 1.112 1.1 1.083 1.214.894 1.178 1.064 1.217.74 1.306.752 1.162.798 1.352.661 1.175 1.113 2.489.546 1.286.428 1.192.428 1.294.384 1.217.267 1.047.347 1.231.607 2.198.388 1.924.253 1.861.217 1.497.342 2.28.077.362.274.41.737 1.18.473.8.42.832.534.892.472 1.07.307 1.093.334 1.2.252 1.232.115.605.106.746v.648l-.106.643v.8l-.192.774-.35 1.5-.403.76-.299.852v.213l.142.264.4.623 1.746 2.53 1.377 1.9.66 1.267.889 1.389.774 1.52.893 1.627.894 1.828 1.006 2.069.567 1.268.518 1.239.447 1.307.44 1.175.336 1.235.342 1.16.432 2.261.343 2.31.235 2.05v2.891l-.158 1.025-.226 1.768-.308 1.59-.48 1.44-.18.588-.336.707-.28.493-.375.607-.33.383-.42.494-.375.4-.401.34-.48.207-.432.207-.355.114h-.543l-.346-.114-.66-.32-.302-.212-.317-.223-.347-.304-.35-.342-.579-.63-.684-.89-.539-.917-.538-.734-.526-.855-.741-1.517-.833-1.579-.098-.055h-.138l-.338.247-.196.415-.326.516-.567 1.533-.856 2.182-1.096 2.626-.824 1.308-.864 1.366-1.027 1.536-1.09 1.503-.557.68-.676.743-1.555 1.497.136.135.21.214.777.446 3.235 1.524 1.41.779 1.347.756 1.332.953 1.187.982.574.443.432.511.445.593.367.643.198.533.242.64.105.554.115.647-.115.433v.44l-.105.454-.242.415-.092.325-.22.394-.587.784-.543.627-.42.47-.35.348-.893.638-1.01.556-1.077.532-1.155.511-1.287.495-.693.207-.608.167-1.496.342-1.545.325-1.552.323-1.689.27-1.74.072-1.785.21h-5.539l-1.998-.114-1.86-.168-2.005-.27-1.99-.209-2.095-.286-2.03-.495-1.981-.374-1.968-.552-2.019-.707-1.98-.585-1.044-.342-.927-.323-.586-.223-.582-.12h-1.647l-1.904-.131-.962-.096-1.24-.135-.795.705-1.085.665-1.471.701-1.628.875-.99.475-1.033.376-2.281.914-1.24.305-1.3.343-1.803.344-1.13.086-1.193.1-1.246.135-1.45.053h-5.926l-3.346-.053-3.25-.321-1.644-.23-1.589-.23-1.546-.227-1.547-.305-1.442-.456-1.434-.325-1.294-.51-1.223-.474-1.142-.533-.99-.583-.984-.71-.336-.343-.44-.415-.334-.362-.3-.417-.278-.415-.215-.42-.311-.89-.109-.46-.138-.51v-.473l.138-.533v-.53l.109-.53v-1.069l.052-.564.259-.647.215-.646.39-.779.286-.3.236-.348.615-.738.49-.38.464-.266.428-.338.676-.21.543-.324.676-.341.77-.227.775-.231.897-.192.85-.11 1.008-.13 1.093-.081.284-.092h.063l.137-.115v-.13l-.2-.266-.58-.27-1.45-1.231-.975-.761-1.127-.967-1.136-1.082-1.181-1.382-1.36-1.558-.508-.843-.672-.87-.58-1.007-.522-1.1-.704-1.047-.459-1.194-.547-1.192-.546-1.33-.397-1.273-.378-1.575-.112-.057h-.115l-.059-.113h-.14l-.23.113-.114.057-.158.264-.057.321-.119.286-.206.477-.664 1.157-.345.701-.546.612-.58.736-.641.816-.677.724-.795.701-.734.658-.814.524-.89.546-.855.325-1.008.247-.99.095h-.233l-.228-.095-.18-.384-.29-.188-.38-.912-.237-.493-.255-.707-.21-.734-.113-.724-.313-1.648-.12-.972v-3.185l.12-2.379.196-1.214.23-1.252.21-1.347.374-1.254.42-1.443.431-1.407.578-1.448.545-1.38.754-1.4.699-1.52.855-1.425 1.006-1.538 1.023-1.382 1.069-1.538.891-1.071 1.142-1.227 1.202-1.237.56-.59.678-.662.985-.836 1.012-.853 1.647-1.446 1.242-.889z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/question.svg b/src/assets/icons/svg/question.svg
new file mode 100644
index 0000000..cf75bd4
--- /dev/null
+++ b/src/assets/icons/svg/question.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1581238842264" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1409" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M512 0C229.233778 0 0 229.233778 0 512s229.233778 512 512 512 512-229.233778 512-512A512 512 0 0 0 512 0z m0 938.666667C276.366222 938.666667 85.333333 747.633778 85.333333 512 85.333333 276.366222 276.366222 85.333333 512 85.333333c235.633778 0 426.666667 191.032889 426.666667 426.666667a426.666667 426.666667 0 0 1-426.666667 426.666667z m0-717.653334a170.666667 170.666667 0 0 0-170.666667 170.666667 42.666667 42.666667 0 0 0 85.333334 0 85.333333 85.333333 0 1 1 85.333333 85.333333 42.666667 42.666667 0 0 0-42.666667 42.666667v111.36a42.666667 42.666667 0 0 0 85.333334 0v-74.24A170.666667 170.666667 0 0 0 512 221.013333z m-42.666667 542.293334a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 0 0-85.333334 0z" p-id="1410"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/radio.svg b/src/assets/icons/svg/radio.svg
new file mode 100644
index 0000000..0cde345
--- /dev/null
+++ b/src/assets/icons/svg/radio.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1575966775973" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="879" xmlns:xlink="http://www.w3.org/1999/xlink" width="81" height="81"><defs><style type="text/css"></style></defs><path d="M507.39346659 71.84873358c241.53533667 0 437.39770766 195.85422109 437.39770767 437.37442191 0 241.53766571-195.86237099 437.38955776-437.39770767 437.38955776-241.50040803 0-437.34997219-195.85189205-437.34997219-437.38955776C70.0434944 267.70295467 265.89189347 71.84873358 507.39346659 71.84873358L507.39346659 71.84873358zM507.39346659 282.81899805c-125.00686734 0-226.37039389 101.38914133-226.37039388 226.41813048 0 125.01268821 101.36352768 226.39717262 226.37039388 226.39717262 125.04295993 0 226.42395136-101.38448441 226.42395136-226.39717262C733.81625401 384.20813938 632.43642653 282.81899805 507.39346659 282.81899805L507.39346659 282.81899805zM507.39346659 120.78172615c-214.46664192 0-388.42047261 173.95150279-388.4204726 388.44026539 0 214.51204949 173.95499463 388.46122325 388.4204726 388.46122325 214.52369237 0 388.46005817-173.94800981 388.46005818-388.46122325C895.85236082 294.73322894 721.91715897 120.78172615 507.39346659 120.78172615z" p-id="880"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/rate.svg b/src/assets/icons/svg/rate.svg
new file mode 100644
index 0000000..aa3b14d
--- /dev/null
+++ b/src/assets/icons/svg/rate.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1577246781606" class="icon" viewBox="0 0 1069 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1098" xmlns:xlink="http://www.w3.org/1999/xlink" width="84.5595703125" height="81"><defs><style type="text/css"></style></defs><path d="M633.72929961 378.02038203l9.49872568 18.68789795 20.78025469 2.79745225 206.61592412 27.33248408a11.46496817 11.46496817 0 0 1 6.6095543 19.47324902l-147.2675168 147.35350284-14.89299345 14.89299345 3.8006376 20.68280244 37.84585956 204.89044571a11.46496817 11.46496817 0 0 1-16.4808914 12.2961788L554.68980898 751.84713388l-18.68789794-9.49299345-18.48726123 9.99171915-183.23885392 99.34968163a11.46496817 11.46496817 0 0 1-16.78471347-11.8662416l32.5433127-205.79617881 3.29617793-20.78598692-15.19108243-14.49172002-151.03375839-143.48407587a11.46496817 11.46496817 0 0 1 6.09936328-19.63949062l205.79617881-32.63503185 20.78598691-3.2961788L428.87898125 380.72038203 518.59235674 192.64331182a11.46496817 11.46496817 0 0 1 20.56815264-0.26369385l94.56879023 185.63503183zM496.64840732 85.52038203l-121.75796162 254.98089229L95.76433145 384.76178369A34.3949045 34.3949045 0 0 0 77.46050938 443.66879023l204.87324901 194.66369385-44.16879023 279.1146498a34.3949045 34.3949045 0 0 0 50.36560489 35.61592325l248.4-134.67898038 251.84522285 128.27579591a34.3949045 34.3949045 0 0 0 49.43694287-36.89426777l-51.30573223-277.85350284 199.73120977-199.90891758a34.3949045 34.3949045 0 0 0-19.82866201-58.40827998l-280.11783428-37.03184736L558.32993633 84.71210205a34.3949045 34.3949045 0 0 0-61.68152901 0.80254775z" p-id="1099"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/redis-list.svg b/src/assets/icons/svg/redis-list.svg
new file mode 100644
index 0000000..98a15b2
--- /dev/null
+++ b/src/assets/icons/svg/redis-list.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1656035183065" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3395" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M958.88 730.06H65.12c-18.28 0-33.12-14.82-33.12-33.12V68.91c0-18.29 14.83-33.12 33.12-33.12h893.77c18.28 0 33.12 14.82 33.12 33.12v628.03c-0.01 18.3-14.84 33.12-33.13 33.12zM98.23 663.83h827.53v-561.8H98.23v561.8z" p-id="3396"></path><path d="M512 954.55c-18.28 0-33.12-14.82-33.12-33.12V733.92c0-18.29 14.83-33.12 33.12-33.12s33.12 14.82 33.12 33.12v187.51c0 18.3-14.84 33.12-33.12 33.12z" p-id="3397"></path><path d="M762.01 988.21H261.99c-18.28 0-33.12-14.82-33.12-33.12 0-18.29 14.83-33.12 33.12-33.12h500.03c18.28 0 33.12 14.82 33.12 33.12-0.01 18.29-14.84 33.12-33.13 33.12zM514.74 578.55c-21.63 0-43.31-3.87-64.21-11.65-45.95-17.13-82.49-51.13-102.86-95.74-5.07-11.08-0.19-24.19 10.89-29.26 11.08-5.09 24.19-0.18 29.26 10.91 15.5 33.88 43.25 59.7 78.14 72.71 34.93 12.99 72.79 11.64 106.66-3.85 33.22-15.17 58.8-42.26 72.03-76.3 4.42-11.37 17.21-17.01 28.57-12.58 11.36 4.42 16.99 17.22 12.57 28.58-17.42 44.82-51.1 80.5-94.82 100.47-24.34 11.12-50.25 16.71-76.23 16.71z" p-id="3398"></path><path d="M325.27 528.78c-1.66 0-3.34-0.18-5.02-0.57-11.88-2.77-19.28-14.63-16.49-26.51l18.84-81c1.34-5.82 5-10.84 10.13-13.92 5.09-3.09 11.3-3.96 17.03-2.41l80.51 21.43c11.79 3.14 18.8 15.23 15.67 27.02-3.15 11.79-15.42 18.75-27.02 15.65l-58.49-15.57-13.69 58.81c-2.37 10.2-11.45 17.07-21.47 17.07zM360.8 351.01c-2.65 0-5.37-0.49-8-1.51-11.36-4.41-16.99-17.21-12.59-28.57 17.4-44.79 51.06-80.47 94.8-100.48 92.15-42.06 201.25-1.39 243.31 90.68 5.07 11.08 0.19 24.19-10.89 29.26-11.13 5.07-24.19 0.17-29.26-10.91-31.97-69.91-114.9-100.82-184.79-68.86-33.22 15.19-58.8 42.28-71.99 76.29-3.41 8.74-11.75 14.1-20.59 14.1z" p-id="3399"></path><path d="M684.68 376.74c-1.47 0-2.95-0.15-4.42-0.44l-81.61-16.68c-11.94-2.45-19.64-14.11-17.21-26.06 2.44-11.96 14.1-19.64 26.04-17.22l59.29 12.12 10.23-59.5c2.05-12 13.52-20.19 25.48-18.01 12.03 2.06 20.09 13.48 18.02 25.5l-14.08 81.96a22.089 22.089 0 0 1-9.29 14.49c-3.7 2.51-8.03 3.84-12.45 3.84z" p-id="3400"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/redis.svg b/src/assets/icons/svg/redis.svg
new file mode 100644
index 0000000..2f1d62d
--- /dev/null
+++ b/src/assets/icons/svg/redis.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1605865043777" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="856" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M1023.786667 611.84c-0.426667 9.770667-13.354667 20.693333-39.893334 34.56-54.613333 28.458667-337.749333 144.896-397.994666 176.298667-60.288 31.402667-93.738667 31.104-141.354667 8.32-47.616-22.741333-348.842667-144.469333-403.114667-170.368-27.093333-12.970667-40.917333-23.893333-41.386666-34.218667v103.509333c0 10.325333 14.250667 21.290667 41.386666 34.261334 54.272 25.941333 355.541333 147.626667 403.114667 170.368 47.616 22.784 81.066667 23.082667 141.354667-8.362667 60.245333-31.402667 343.338667-147.797333 397.994666-176.298667 27.776-14.464 40.106667-25.728 40.106667-35.925333v-102.058667l-0.213333-0.085333z m0-168.746667c-0.512 9.770667-13.397333 20.650667-39.893334 34.517334-54.613333 28.458667-337.749333 144.896-397.994666 176.298666-60.288 31.402667-93.738667 31.104-141.354667 8.362667-47.616-22.741333-348.842667-144.469333-403.114667-170.410667-27.093333-12.928-40.917333-23.893333-41.386666-34.176v103.509334c0 10.325333 14.250667 21.248 41.386666 34.218666 54.272 25.941333 355.498667 147.626667 403.114667 170.368 47.616 22.784 81.066667 23.082667 141.354667-8.32 60.245333-31.402667 343.338667-147.84 397.994666-176.298666 27.776-14.506667 40.106667-25.770667 40.106667-35.968v-102.058667l-0.256-0.042667z m0-175.018666c0.469333-10.410667-13.141333-19.541333-40.533334-29.610667-53.248-19.498667-334.634667-131.498667-388.522666-151.253333-53.888-19.712-75.818667-18.901333-139.093334 3.84C392.234667 113.706667 92.629333 231.253333 39.338667 252.074667c-26.666667 10.496-39.68 20.181333-39.253334 30.506666V386.133333c0 10.325333 14.250667 21.248 41.386667 34.218667 54.272 25.941333 355.498667 147.669333 403.114667 170.410667 47.616 22.741333 81.066667 23.04 141.354666-8.362667 60.245333-31.402667 343.338667-147.84 397.994667-176.298667 27.776-14.506667 40.106667-25.770667 40.106667-35.968V268.074667h-0.341334zM366.677333 366.08l237.269334-36.437333-71.68 105.088-165.546667-68.650667z m524.8-94.634667l-140.330666 55.466667-15.232 5.973333-140.245334-55.466666 155.392-61.44 140.373334 55.466666z m-411.989333-101.674666l-22.954667-42.325334 71.594667 27.989334 67.498667-22.101334-18.261334 43.733334 68.778667 25.770666-88.704 9.216-19.882667 47.786667-32.085333-53.290667-102.4-9.216 76.416-27.562666z m-176.768 59.733333c70.058667 0 126.805333 21.973333 126.805333 49.109333s-56.746667 49.152-126.805333 49.152-126.848-22.058667-126.848-49.152c0-27.136 56.789333-49.152 126.848-49.152z" p-id="857"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/resume.svg b/src/assets/icons/svg/resume.svg
new file mode 100644
index 0000000..d4fa632
--- /dev/null
+++ b/src/assets/icons/svg/resume.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1733408899400" class="icon" viewBox="0 0 1029 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="30602" xmlns:xlink="http://www.w3.org/1999/xlink" width="64.3125" height="64"><path d="M356.937143 463.725714c-26.331429 0-48.274286 21.942857-48.274286 48.274286l0 32.182857c0 26.331429 21.942857 48.274286 48.274286 48.274286s48.274286-21.942857 48.274286-48.274286l0-32.182857C403.748571 485.668571 383.268571 463.725714 356.937143 463.725714z" p-id="30603"></path><path d="M356.937143 655.36c-70.217143 0-105.325714 33.645714-119.954286 54.125714 32.182857 26.331429 74.605714 42.422857 119.954286 42.422857s86.308571-16.091429 119.954286-42.422857C460.8 689.005714 425.691429 655.36 356.937143 655.36z" p-id="30604"></path><path d="M356.937143 367.177143c-105.325714 0-191.634286 86.308571-191.634286 191.634286 0 49.737143 19.017143 93.622857 49.737143 127.268571 20.48-26.331429 62.902857-64.365714 143.36-64.365714-43.885714 0-80.457143-35.108571-80.457143-80.457143l0-32.182857c0-43.885714 35.108571-80.457143 80.457143-80.457143s80.457143 35.108571 80.457143 80.457143l0 32.182857c0 43.885714-35.108571 80.457143-80.457143 80.457143 80.457143 0 122.88 36.571429 143.36 64.365714 30.72-33.645714 49.737143-78.994286 49.737143-127.268571C548.571429 453.485714 462.262857 367.177143 356.937143 367.177143z" p-id="30605"></path><path d="M964.022857 175.542857l-128.731429 0 0-80.457143c0-8.777143-7.314286-16.091429-16.091429-16.091429l-96.548571 0c-8.777143 0-16.091429 7.314286-16.091429 16.091429l0 80.457143-384.731429 0 0-80.457143c0-8.777143-7.314286-16.091429-16.091429-16.091429l-96.548571 0c-8.777143 0-16.091429 7.314286-16.091429 16.091429l0 80.457143-128.731429 0c-35.108571 0-64.365714 29.257143-64.365714 64.365714L0 879.177143c0 35.108571 29.257143 64.365714 64.365714 64.365714l896.731429 0c35.108571 0 64.365714-29.257143 64.365714-64.365714l0-640.731429C1028.388571 204.8 999.131429 175.542857 964.022857 175.542857zM659.748571 399.36l96.548571 0c8.777143 0 16.091429 7.314286 16.091429 16.091429 0 8.777143-7.314286 16.091429-16.091429 16.091429l-96.548571 0c-8.777143 0-16.091429-7.314286-16.091429-16.091429C643.657143 406.674286 650.971429 399.36 659.748571 399.36zM356.937143 784.091429c-124.342857 0-223.817143-100.937143-223.817143-223.817143 0-124.342857 100.937143-223.817143 223.817143-223.817143s223.817143 100.937143 223.817143 223.817143C580.754286 683.154286 479.817143 784.091429 356.937143 784.091429zM885.028571 719.725714l-223.817143 0c-8.777143 0-16.091429-7.314286-16.091429-16.091429 0-8.777143 7.314286-16.091429 16.091429-16.091429l223.817143 0c8.777143 0 16.091429 7.314286 16.091429 16.091429C899.657143 712.411429 893.805714 719.725714 885.028571 719.725714zM643.657143 608.548571c0-8.777143 7.314286-16.091429 16.091429-16.091429l159.451429 0c8.777143 0 16.091429 7.314286 16.091429 16.091429 0 8.777143-7.314286 16.091429-16.091429 16.091429l-159.451429 0C650.971429 623.177143 643.657143 617.325714 643.657143 608.548571zM885.028571 528.091429l-223.817143 0c-8.777143 0-16.091429-7.314286-16.091429-16.091429 0-8.777143 7.314286-16.091429 16.091429-16.091429l223.817143 0c8.777143 0 16.091429 7.314286 16.091429 16.091429C899.657143 520.777143 893.805714 528.091429 885.028571 528.091429z" p-id="30606"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/row.svg b/src/assets/icons/svg/row.svg
new file mode 100644
index 0000000..0780992
--- /dev/null
+++ b/src/assets/icons/svg/row.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1579339929870" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1182" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M152 854.856875h325.7146875V237.715625H134.856875v600q0 6.99375 5.0746875 12.0684375T152 854.856875z m737.143125-17.1421875v-600H546.284375v617.1421875H872q6.99375 0 12.0684375-5.07375t5.0746875-12.0684375z m68.5715625-651.429375V837.715625q0 35.3821875-25.16625 60.5484375T872 923.4284375H152q-35.383125 0-60.5484375-25.1653125T66.284375 837.7146875V186.284375q0-35.3821875 25.16625-60.5484375T152 100.5715625h720q35.383125 0 60.5484375 25.1653125t25.16625 60.5484375z" p-id="1183"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/search.svg b/src/assets/icons/svg/search.svg
new file mode 100644
index 0000000..84233dd
--- /dev/null
+++ b/src/assets/icons/svg/search.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M124.884 109.812L94.256 79.166c-.357-.357-.757-.629-1.129-.914a50.366 50.366 0 0 0 8.186-27.59C101.327 22.689 78.656 0 50.67 0 22.685 0 0 22.688 0 50.663c0 27.989 22.685 50.663 50.656 50.663 10.186 0 19.643-3.03 27.6-8.201.286.385.557.771.9 1.114l30.628 30.632a10.633 10.633 0 0 0 7.543 3.129c2.728 0 5.457-1.043 7.543-3.115 4.171-4.157 4.171-10.915.014-15.073M50.671 85.338C31.557 85.338 16 69.78 16 50.663c0-19.102 15.557-34.661 34.67-34.661 19.115 0 34.657 15.559 34.657 34.675 0 19.102-15.557 34.661-34.656 34.661"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/select.svg b/src/assets/icons/svg/select.svg
new file mode 100644
index 0000000..d628382
--- /dev/null
+++ b/src/assets/icons/svg/select.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1575803481213" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="804" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M62 511.97954521C62 263.86590869 263.90681826 62 511.97954521 62s449.97954521 201.825 449.97954521 449.97954521c0 248.19545479-201.90681826 449.97954521-449.97954521 449.97954521C263.90681826 962 62 760.175 62 511.97954521M901.98636348 511.97954521c0-215.24318174-175.00909131-390.41590869-390.00681827-390.41590869-215.03863652 0-389.96590869 175.17272695-389.96590868 390.41590869 0 215.28409131 175.00909131 390.45681826 389.96590868 390.45681826C727.01818174 902.47727305 901.98636348 727.30454521 901.98636348 511.97954521M264.17272695 430.28409131c0-5.76818174 2.12727305-11.51590869 6.64772696-15.87272696 8.71363652-8.75454521 22.88863652-8.75454521 31.725 0l209.4340913 208.22727305L721.45454521 414.53409131c8.75454521-8.71363652 22.97045479-8.71363652 31.90909132 0 8.71363652 8.75454521 8.71363652 22.88863652 0 31.60227304L511.97954521 685.74090869 270.71818174 446.01363653C266.27954521 441.77954521 264.17272695 436.05227305 264.17272695 430.28409131" p-id="805"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/server.svg b/src/assets/icons/svg/server.svg
new file mode 100644
index 0000000..eb287e3
--- /dev/null
+++ b/src/assets/icons/svg/server.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1547360688278" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6717" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M890 120H134a70 70 0 0 0-70 70v500a70 70 0 0 0 70 70h756a70 70 0 0 0 70-70V190a70 70 0 0 0-70-70z m-10 520a40 40 0 0 1-40 40H712V448a40 40 0 0 0-80 0v232h-80V368a40 40 0 0 0-80 0v312h-80V512a40 40 0 0 0-80 0v168H184a40 40 0 0 1-40-40V240a40 40 0 0 1 40-40h656a40 40 0 0 1 40 40zM696 824H328a40 40 0 0 0 0 80h368a40 40 0 0 0 0-80z" p-id="6718"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/shizhong.svg b/src/assets/icons/svg/shizhong.svg
new file mode 100644
index 0000000..3a674c7
--- /dev/null
+++ b/src/assets/icons/svg/shizhong.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="60" height="60" viewBox="0 0 60 60"><g><g style="opacity:0.30000001192092896;"><path d="M30,0L37,0Q37.5646,0,38.1286,0.0277045Q38.6925,0.055409,39.2544,0.110751Q39.8163,0.166094,40.3748,0.24894Q40.9333,0.331787,41.4871,0.441938Q42.0408,0.55209,42.5885,0.689281Q43.1362,0.826472,43.6765,0.990372Q44.2169,1.15427,44.7485,1.34449Q45.2801,1.5347,45.8017,1.75077Q46.3234,1.96684,46.8338,2.20825Q47.3442,2.44965,47.8421,2.71581Q48.3401,2.98197,48.8244,3.27224Q49.3087,3.56251,49.7781,3.8762Q50.2476,4.18988,50.7011,4.52623Q51.1546,4.86257,51.591,5.22076Q52.0275,5.57895,52.4459,5.95812Q52.8642,6.3373,53.2635,6.73654Q53.6627,7.13579,54.0419,7.55414Q54.4211,7.9725,54.7792,8.40895Q55.1374,8.84541,55.4738,9.29892Q55.8101,9.75242,56.1238,10.2219Q56.4375,10.6913,56.7278,11.1756Q57.018,11.6599,57.2842,12.1579Q57.5503,12.6558,57.7917,13.1662Q58.0331,13.6766,58.2492,14.1983Q58.4653,14.7199,58.6555,15.2515Q58.8457,15.7831,59.0096,16.3235Q59.1735,16.8638,59.3107,17.4115Q59.4479,17.9592,59.5581,18.5129Q59.6682,19.0667,59.7511,19.6252Q59.8339,20.1837,59.8892,20.7456Q59.9446,21.3075,59.9723,21.8714Q60,22.4354,60,23L60,37Q60,37.5646,59.9723,38.1286Q59.9446,38.6925,59.8892,39.2544Q59.8339,39.8163,59.751,40.3748Q59.6682,40.9333,59.5581,41.4871Q59.4479,42.0408,59.3107,42.5885Q59.1735,43.1362,59.0096,43.6765Q58.8457,44.2169,58.6555,44.7485Q58.4653,45.2801,58.2492,45.8017Q58.0331,46.3234,57.7917,46.8338Q57.5503,47.3442,57.2842,47.8421Q57.018,48.3401,56.7278,48.8244Q56.4375,49.3087,56.1238,49.7781Q55.8101,50.2476,55.4738,50.7011Q55.1374,51.1546,54.7792,51.591Q54.4211,52.0275,54.0419,52.4459Q53.6627,52.8642,53.2635,53.2635Q52.8642,53.6627,52.4459,54.0419Q52.0275,54.4211,51.591,54.7792Q51.1546,55.1374,50.7011,55.4738Q50.2476,55.8101,49.7781,56.1238Q49.3087,56.4375,48.8244,56.7278Q48.3401,57.018,47.8421,57.2842Q47.3442,57.5503,46.8338,57.7917Q46.3234,58.0331,45.8017,58.2492Q45.2801,58.4653,44.7485,58.6555Q44.2169,58.8457,43.6765,59.0096Q43.1362,59.1735,42.5885,59.3107Q42.0408,59.4479,41.4871,59.5581Q40.9333,59.6682,40.3748,59.7511Q39.8163,59.8339,39.2544,59.8892Q38.6925,59.9446,38.1286,59.9723Q37.5646,60,37,60L23,60Q22.4354,60,21.8714,59.9723Q21.3075,59.9446,20.7456,59.8892Q20.1837,59.8339,19.6252,59.751Q19.0667,59.6682,18.5129,59.5581Q17.9592,59.4479,17.4115,59.3107Q16.8638,59.1735,16.3235,59.0096Q15.7831,58.8457,15.2515,58.6555Q14.7199,58.4653,14.1983,58.2492Q13.6766,58.0331,13.1662,57.7917Q12.6558,57.5503,12.1579,57.2842Q11.6599,57.018,11.1756,56.7278Q10.6913,56.4375,10.2219,56.1238Q9.75242,55.8101,9.29892,55.4738Q8.84541,55.1374,8.40895,54.7792Q7.9725,54.4211,7.55414,54.0419Q7.13579,53.6627,6.73654,53.2635Q6.3373,52.8642,5.95812,52.4459Q5.57895,52.0275,5.22076,51.591Q4.86257,51.1546,4.52623,50.7011Q4.18988,50.2476,3.8762,49.7781Q3.56251,49.3087,3.27224,48.8244Q2.98197,48.3401,2.71581,47.8421Q2.44965,47.3442,2.20825,46.8338Q1.96684,46.3234,1.75077,45.8017Q1.5347,45.2801,1.34449,44.7485Q1.15427,44.2169,0.990372,43.6765Q0.826472,43.1362,0.689281,42.5885Q0.55209,42.0408,0.441938,41.4871Q0.331787,40.9333,0.24894,40.3748Q0.166094,39.8163,0.110751,39.2544Q0.055409,38.6925,0.0277045,38.1286Q0,37.5646,0,37L0,23Q0,22.4354,0.0277045,21.8714Q0.055409,21.3075,0.110751,20.7456Q0.166094,20.1837,0.24894,19.6252Q0.331787,19.0667,0.441938,18.5129Q0.55209,17.9592,0.689281,17.4115Q0.826472,16.8638,0.990372,16.3235Q1.15427,15.7831,1.34449,15.2515Q1.5347,14.7199,1.75077,14.1983Q1.96684,13.6766,2.20825,13.1662Q2.44965,12.6558,2.71581,12.1579Q2.98197,11.6599,3.27224,11.1756Q3.56251,10.6913,3.8762,10.2219Q4.18988,9.75242,4.52623,9.29892Q4.86257,8.84541,5.22076,8.40895Q5.57895,7.9725,5.95812,7.55414Q6.3373,7.13579,6.73654,6.73654Q7.13579,6.3373,7.55414,5.95812Q7.9725,5.57895,8.40895,5.22076Q8.84541,4.86257,9.29892,4.52623Q9.75242,4.18988,10.2219,3.8762Q10.6913,3.56251,11.1756,3.27224Q11.6599,2.98197,12.1579,2.71581Q12.6558,2.44965,13.1662,2.20825Q13.6766,1.96684,14.1983,1.75077Q14.7199,1.5347,15.2515,1.34449Q15.7831,1.15427,16.3235,0.990372Q16.8638,0.826472,17.4115,0.689281Q17.9592,0.55209,18.5129,0.441938Q19.0667,0.331787,19.6252,0.24894Q20.1837,0.166094,20.7456,0.110751Q21.3075,0.055409,21.8714,0.0277045Q22.4354,0,23,0L30,0Z" fill-rule="evenodd" fill="#FF9066" fill-opacity="1"/></g><g><g style="opacity:0.7799999713897705;"><path d="M29.131204620056153,23.34718894958496C29.266914620056152,23.34718894958496,29.414974620056153,23.34718894958496,29.54978462005615,23.34718894958496C29.806664620056154,23.34718894958496,30.018844620056154,23.535619949584962,30.044404620056152,23.79122094958496C30.19346462005615,25.28180894958496,30.666664620056153,30.01385894958496,30.666664620056153,30.01385894958496C30.666664620056153,30.01385894958496,34.09809462005615,31.97466894958496,35.076054620056155,32.53350894958496C35.23184462005615,32.62252894958496,35.33333462005615,32.78909894958496,35.33333462005615,32.96851894958496C35.33333462005615,33.083318949584964,35.33333462005615,33.22053894958496,35.33333462005615,33.35718894958496C35.33333462005615,33.68688894958496,35.02413462005615,33.929488949584965,34.706064620056154,33.84278894958496C33.23941462005615,33.44278894958496,29.618494620056154,32.45526894958496,28.404297620056152,32.12411894958496C28.17291862005615,32.06101894958496,28.013044620056153,31.84427894958496,28.031438700056153,31.60515894958496C28.14242162005615,30.162378949584962,28.51541362005615,25.31347894958496,28.63172562005615,23.80142994958496C28.65176362005615,23.54093094958496,28.86993662005615,23.34718894958496,29.131204620056153,23.34718894958496" fill-rule="evenodd" fill="#FF9066" fill-opacity="1"/></g><g style="opacity:0.9012742042541504;"><path d="M21.85181,15.186670420288086L20.21491,22.049181420288086C20.13724,22.374831420288086,20.387990000000002,22.672721420288084,20.72224,22.653781420288084L27.7818,22.253731420288087C28.192700000000002,22.230451420288084,28.3968,21.749391420288084,28.1323,21.434111420288087L26.3306,19.286931420288084C27.4958,18.888661420288088,28.731299999999997,18.680631420288087,30,18.680631420288087C36.2592,18.680631420288087,41.3333,23.754741420288084,41.3333,30.013971420288087C41.3333,36.27317142028809,36.2592,41.34727142028808,30,41.34727142028808C23.74077,41.34727142028808,18.66667,36.27317142028809,18.66667,30.013971420288087C18.66667,28.963171420288084,18.80896,27.934071420288085,19.08641,26.944871420288088L16.518845,26.224671420288086C16.180793,27.429871420288087,16,28.700771420288085,16,30.013971420288087C16,37.745971420288086,22.26801,44.01397142028809,30,44.01397142028809C37.732,44.01397142028809,44,37.745971420288086,44,30.013971420288087C44,22.281981420288087,37.732,16.013971420288087,30,16.013971420288087C28.0548,16.013971420288087,26.202199999999998,16.410701420288085,24.51876,17.127661420288085L22.72224,14.986655420288086C22.45814,14.671907420288086,21.94714,14.787008320288086,21.85181,15.186670420288086Z" fill-rule="evenodd" fill="#FF9066" fill-opacity="1"/></g></g></g></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/shopping.svg b/src/assets/icons/svg/shopping.svg
new file mode 100644
index 0000000..87513e7
--- /dev/null
+++ b/src/assets/icons/svg/shopping.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M42.913 101.36c1.642 0 3.198.332 4.667.996a12.28 12.28 0 0 1 3.89 2.772c1.123 1.184 1.987 2.582 2.592 4.193.605 1.612.908 3.318.908 5.118 0 1.8-.303 3.507-.908 5.118-.605 1.611-1.469 3.01-2.593 4.194a13.3 13.3 0 0 1-3.889 2.843 10.582 10.582 0 0 1-4.667 1.066c-1.729 0-3.306-.355-4.732-1.066a13.604 13.604 0 0 1-3.825-2.843c-1.123-1.185-1.988-2.583-2.593-4.194a14.437 14.437 0 0 1-.907-5.118c0-1.8.302-3.506.907-5.118.605-1.61 1.47-3.009 2.593-4.193a12.515 12.515 0 0 1 3.825-2.772c1.426-.664 3.003-.996 4.732-.996zm53.932.285c1.643 0 3.22.331 4.733.995a11.386 11.386 0 0 1 3.889 2.772c1.08 1.185 1.945 2.583 2.593 4.194.648 1.61.972 3.317.972 5.118 0 1.8-.324 3.506-.972 5.117-.648 1.611-1.513 3.01-2.593 4.194a12.253 12.253 0 0 1-3.89 2.843 11 11 0 0 1-4.732 1.066 10.58 10.58 0 0 1-4.667-1.066 12.478 12.478 0 0 1-3.824-2.843c-1.08-1.185-1.945-2.583-2.593-4.194a13.581 13.581 0 0 1-.973-5.117c0-1.801.325-3.507.973-5.118.648-1.611 1.512-3.01 2.593-4.194a11.559 11.559 0 0 1 3.824-2.772 11.212 11.212 0 0 1 4.667-.995zm21.781-80.747c2.42 0 4.3.355 5.64 1.066 1.34.71 2.29 1.587 2.852 2.63a6.427 6.427 0 0 1 .778 3.34c-.044 1.185-.195 2.204-.454 3.057-.26.853-.8 2.606-1.62 5.26a589.268 589.268 0 0 1-2.788 8.743 1236.373 1236.373 0 0 0-3.047 9.453c-.994 3.128-1.75 5.592-2.269 7.393-1.123 3.79-2.55 6.42-4.278 7.89-1.728 1.469-3.846 2.203-6.352 2.203H39.023l1.945 12.795h65.342c4.148 0 6.223 1.943 6.223 5.828 0 1.896-.41 3.53-1.232 4.905-.821 1.374-2.442 2.061-4.862 2.061H38.505c-1.729 0-3.176-.426-4.343-1.28-1.167-.852-2.14-1.966-2.917-3.34a21.277 21.277 0 0 1-1.88-4.478 44.128 44.128 0 0 1-1.102-4.55c-.087-.568-.324-1.942-.713-4.122-.39-2.18-.865-4.904-1.426-8.174l-1.88-10.947c-.692-4.027-1.383-8.079-2.075-12.154-1.642-9.572-3.5-20.234-5.574-31.986H6.87c-1.296 0-2.377-.356-3.24-1.067a9.024 9.024 0 0 1-2.14-2.558 10.416 10.416 0 0 1-1.167-3.2C.108 8.53 0 7.488 0 6.54c0-1.896.583-3.46 1.75-4.69C2.917.615 4.494 0 6.482 0h13.095c1.728 0 3.111.284 4.148.853 1.037.569 1.858 1.28 2.463 2.132a8.548 8.548 0 0 1 1.297 2.701c.26.948.475 1.754.648 2.417.173.758.346 1.825.519 3.199.173 1.374.345 2.772.518 4.193.26 1.706.519 3.507.778 5.403h88.678z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/size.svg b/src/assets/icons/svg/size.svg
new file mode 100644
index 0000000..ddb25b8
--- /dev/null
+++ b/src/assets/icons/svg/size.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M0 54.857h54.796v18.286H36.531V128H18.265V73.143H0V54.857zm127.857-36.571H91.935V128H72.456V18.286H36.534V0h91.326l-.003 18.286z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/skill.svg b/src/assets/icons/svg/skill.svg
new file mode 100644
index 0000000..a3b7312
--- /dev/null
+++ b/src/assets/icons/svg/skill.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M31.652 93.206h33.401c1.44 2.418 3.077 4.663 4.93 6.692h-38.33v-6.692zm0-10.586h28.914a44.8 44.8 0 0 1-1.264-6.688h-27.65v6.688zm0-17.27H59.39c.288-2.286.714-4.532 1.34-6.687H31.65v6.687h.003zm53.913 44.84v5.85c0 2.798-2.095 5.075-4.667 5.075h-70.07c-2.576 0-4.663-2.277-4.663-5.075V31.26l23.22-20.96v22.25H17.16v6.688h18.39V6.688h45.348c2.576 0 4.667 2.277 4.667 5.066v20.009c1.987-.675 4.053-1.128 6.17-1.445v-18.56C91.738 5.28 86.874 0 80.902 0H31.15L0 28.118v87.917c0 6.48 4.859 11.759 10.832 11.759h70.07c5.974 0 10.837-5.27 10.837-11.759v-4.41c-2.117-.312-4.183-.765-6.17-1.435h-.004zM23.279 58.667h-7.96v6.688h7.96v-6.688zm-7.956 41.23h7.96v-6.691h-7.96v6.692zm7.956-23.96h-7.96v6.687h7.96v-6.688zm89.718-15.042l-4.896-4.07-12.447 17.613-11.19-9.305-3.762 5.311 16.091 13.38 16.204-22.929zM128 70.978c0-18.632-13.97-33.782-31.147-33.782-17.168 0-31.135 15.155-31.135 33.782 0 18.628 13.97 33.783 31.135 33.783 17.172 0 31.143-15.15 31.143-33.783H128zm-6.17 0c0 14.933-11.203 27.1-24.981 27.1-13.77 0-24.987-12.158-24.987-27.1 0-14.941 11.195-27.099 24.987-27.099 13.778 0 24.982 12.158 24.982 27.1z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/slider.svg b/src/assets/icons/svg/slider.svg
new file mode 100644
index 0000000..fbe4f39
--- /dev/null
+++ b/src/assets/icons/svg/slider.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1577185310368" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1238" xmlns:xlink="http://www.w3.org/1999/xlink" width="81" height="81"><defs><style type="text/css"></style></defs><path d="M951.453125 476.84375H523.671875a131.8359375 131.8359375 0 0 0-254.1796875 0H72.546875v70.3125h196.9453125a131.8359375 131.8359375 0 0 0 254.1796875 0H951.453125z" p-id="1239"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/spdl.svg b/src/assets/icons/svg/spdl.svg
new file mode 100644
index 0000000..1521acc
--- /dev/null
+++ b/src/assets/icons/svg/spdl.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735046283849" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3574" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M965.632 198.656h-210.944C728.064 89.4976 629.3504 8.192 512 8.192S295.936 89.4976 269.312 198.656h-202.752C38.912 198.656 16.384 221.184 16.384 248.832v655.36C16.384 965.8368 66.3552 1015.808 128 1015.808h776.192c61.6448 0 111.616-49.9712 111.616-111.616v-655.36C1015.808 221.184 993.28 198.656 965.632 198.656zM512 59.392c88.8832 0 164.2496 58.5728 189.6448 139.264H322.3552c25.3952-80.6912 100.7616-139.264 189.6448-139.264z m452.608 844.8c0 33.3824-27.0336 60.416-60.416 60.416h-776.192C94.6176 964.608 67.584 937.5744 67.584 904.192V249.856h194.7648c0 2.6624-0.2048 5.5296-0.2048 8.192v113.664c-46.8992 11.4688-81.92 53.8624-81.92 104.448 0 59.1872 48.3328 107.52 107.52 107.52s107.52-48.3328 107.52-107.52c0-50.3808-35.0208-92.9792-81.92-104.448V258.048c0-2.6624 0-5.5296 0.2048-8.192h396.9024c0.2048 2.6624 0.2048 5.5296 0.2048 8.192v113.664c-46.8992 11.4688-81.92 53.8624-81.92 104.448 0 59.1872 48.3328 107.52 107.52 107.52s107.52-48.3328 107.52-107.52c0-50.3808-35.0208-92.9792-81.92-104.448V258.048c0-2.6624 0-5.5296-0.2048-8.192H964.608v654.336zM287.744 419.84c31.1296 0 56.32 25.1904 56.32 56.32S318.8736 532.48 287.744 532.48 231.424 507.2896 231.424 476.16s25.1904-56.32 56.32-56.32z m448.512 0c31.1296 0 56.32 25.1904 56.32 56.32S767.3856 532.48 736.256 532.48 679.936 507.2896 679.936 476.16s25.1904-56.32 56.32-56.32z" p-id="3575"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/star.svg b/src/assets/icons/svg/star.svg
new file mode 100644
index 0000000..6cf86e6
--- /dev/null
+++ b/src/assets/icons/svg/star.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M70.66 4.328l14.01 29.693c1.088 2.29 3.177 3.882 5.603 4.25l31.347 4.76c6.087.926 8.528 8.756 4.117 13.247L103.05 79.395c-1.75 1.78-2.544 4.352-2.132 6.867l5.352 32.641c1.043 6.337-5.33 11.182-10.778 8.19l-28.039-15.409a7.13 7.13 0 0 0-6.91 0l-28.039 15.41c-5.448 2.99-11.821-1.854-10.777-8.19l5.352-32.642c.415-2.515-.387-5.088-2.136-6.867L2.264 56.278C-2.146 51.787.286 43.957 6.38 43.031l31.343-4.76c2.419-.368 4.51-1.96 5.595-4.25L57.334 4.328c2.728-5.77 10.605-5.77 13.325 0z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/student.svg b/src/assets/icons/svg/student.svg
new file mode 100644
index 0000000..f126240
--- /dev/null
+++ b/src/assets/icons/svg/student.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1733408476348" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="26064" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M757.248 746.325333c-124.074667-24.405333-124.074667-51.2-124.074667-70.485333v-25.941333a257.877333 257.877333 0 0 0 73.898667-115.541334c41.301333-13.653333 55.808-68.266667 55.808-94.72a40.277333 40.277333 0 0 1 0-4.266666 92.330667 92.330667 0 0 0-17.066667-68.266667 54.442667 54.442667 0 0 0-17.066666-12.288v-136.533333l170.666666-36.522667a25.6 25.6 0 0 0-1.706666-51.2l-382.293334-54.613333h-7.168L126.122667 131.584a25.6 25.6 0 0 0-1.706667 51.2l6.997333 1.536v300.373333a25.6 25.6 0 0 0 51.2 0v-290.133333l112.64 24.064v136.533333c-19.456 8.874667-40.96 31.573333-40.96 88.234667 0 32.256 13.994667 77.994667 51.2 90.624A243.712 243.712 0 0 0 377.173333 648.533333v31.402667c0 17.066667 0 42.666667-121.173333 66.048C121.856 771.925333 80.213333 870.4 76.8 919.893333a26.282667 26.282667 0 0 0 6.826667 18.773334 25.429333 25.429333 0 0 0 18.773333 8.533333h819.2a25.6 25.6 0 0 0 25.6-25.6c0-5.632-2.218667-138.922667-189.952-175.274667zM287.744 791.893333a457.386667 457.386667 0 0 0 62.805333-17.066666L512 890.197333l160.085333-113.152a549.376 549.376 0 0 0 64.341334 17.066667l-144.042667 102.4h-159.914667z m218.965333-527.872a27.648 27.648 0 0 0 10.581334 0l160.256-34.133333v41.472L512 294.912l-165.546667-23.552v-41.642667z m-155.306666 242.858667a25.6 25.6 0 0 0-25.088-20.48C307.2 486.4 305.493333 443.733333 305.493333 443.733333c0-10.069333 1.024-42.666667 15.36-42.666666a25.6 25.6 0 0 0 25.6-25.6v-52.394667l161.962667 23.210667h7.168l161.962667-23.210667V375.466667a25.6 25.6 0 0 0 24.746666 25.6 8.704 8.704 0 0 1 5.632 1.536c4.949333 5.290667 4.266667 24.405333 3.925334 30.549333v6.485333c0 9.557333-7.68 46.762667-24.917334 46.762667a25.6 25.6 0 0 0-24.917333 19.626667A208.213333 208.213333 0 0 1 574.293333 631.466667a26.112 26.112 0 0 0-7.168 7.168l-122.538666-1.706667a27.306667 27.306667 0 0 0-6.485334-5.973333 170.666667 170.666667 0 0 1-15.701333-10.752 24.746667 24.746667 0 0 0-6.826667-5.802667 192.682667 192.682667 0 0 1-64.170666-107.52z" fill="#333333" p-id="26065"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/sunny.svg b/src/assets/icons/svg/sunny.svg
new file mode 100644
index 0000000..cc628bf
--- /dev/null
+++ b/src/assets/icons/svg/sunny.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1733303115132" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12397" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 890.432c18.432 0 33.408 14.976 33.408 33.408v66.752a33.408 33.408 0 0 1-66.816 0v-66.752c0-18.432 14.976-33.408 33.408-33.408z m-267.52-110.848a33.408 33.408 0 0 1 0 47.232l-47.296 47.232a33.408 33.408 0 0 1-47.232-47.232l47.232-47.232a33.408 33.408 0 0 1 47.232 0z m582.336 0l47.232 47.232a33.408 33.408 0 0 1-47.232 47.232l-47.232-47.232a33.408 33.408 0 1 1 47.232-47.232zM512 200.32a311.68 311.68 0 1 1 0 623.296 311.68 311.68 0 0 1 0-623.36z m0 66.752a244.864 244.864 0 1 0 0 489.728 244.864 244.864 0 0 0 0-489.728zM100.16 478.592a33.408 33.408 0 1 1 0 66.816H33.408a33.408 33.408 0 0 1 0-66.816h66.752z m890.432 0a33.408 33.408 0 0 1 0 66.816h-66.752a33.408 33.408 0 1 1 0-66.816h66.752zM197.184 149.952l47.232 47.232a33.408 33.408 0 1 1-47.232 47.232l-47.232-47.232a33.408 33.408 0 0 1 47.232-47.232z m676.864 0a33.408 33.408 0 0 1 0 47.232l-47.232 47.232a33.408 33.408 0 1 1-47.232-47.232l47.232-47.232a33.408 33.408 0 0 1 47.232 0zM512 0c18.432 0 33.408 14.976 33.408 33.408v66.752a33.408 33.408 0 1 1-66.816 0V33.408C478.592 14.976 493.568 0 512 0z" p-id="12398"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/swagger.svg b/src/assets/icons/svg/swagger.svg
new file mode 100644
index 0000000..05d4e7b
--- /dev/null
+++ b/src/assets/icons/svg/swagger.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1566036776944" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6463" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M64 223.995345h168.001164v47.997673c0 26.428509 18.878836 47.997673 41.984 47.997673h140.036654c23.095855 0 41.984-21.569164 41.984-47.997673v-47.997673h504.003491a32.004655 32.004655 0 0 0 0-64.009309H455.996509V111.988364c0-26.428509-18.878836-47.997673-41.984-47.997673H273.985164c-23.095855 0-41.984 21.569164-41.984 47.997673v47.997672H64a32.004655 32.004655 0 0 0 0 64.009309zM288.004655 128h111.997672V256H288.004655V128zM960 479.995345H791.998836v-47.997672c0-26.372655-18.878836-47.997673-41.984-47.997673H609.978182c-23.095855 0-41.984 21.634327-41.984 47.997673v47.997672H64a32.004655 32.004655 0 0 0 0 64.00931h504.003491v47.997672c0 26.363345 18.878836 47.997673 41.984 47.997673h140.036654c23.095855 0 41.984-21.634327 41.984-47.997673v-47.997672h168.001164a32.004655 32.004655 0 1 0-0.009309-64.00931zM735.995345 576H623.997673v-128h111.997672v128zM960 800.293236v-0.288581H455.996509v-47.997673c0-26.363345-18.878836-47.997673-41.984-47.997673H274.050327c-23.105164 0-41.984 21.634327-41.984 47.997673v47.997673H64v0.288581a32.004655 32.004655 0 0 0 0 64.009309c0.986764 0 1.917673-0.195491 2.885818-0.288581h165.115346v47.997672c0 26.363345 18.878836 47.997673 41.984 47.997673h140.036654c23.095855 0 41.984-21.634327 41.984-47.997673v-47.997672h501.108364c0.968145 0.093091 1.899055 0.288582 2.895127 0.288581a32.004655 32.004655 0 1 0-0.009309-64.009309zM400.002327 896H288.004655V768h111.997672v128z" fill="" p-id="6464"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/switch.svg b/src/assets/icons/svg/switch.svg
new file mode 100644
index 0000000..0ba61e3
--- /dev/null
+++ b/src/assets/icons/svg/switch.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1576042673958" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1110" xmlns:xlink="http://www.w3.org/1999/xlink" width="81" height="81"><defs><style type="text/css"></style></defs><path d="M692 792H332c-150 0-270-120-270-270s120-270 270-270h360c150 0 270 120 270 270 0 147-120 270-270 270zM332 312c-117 0-210 93-210 210s93 210 210 210h360c117 0 210-93 210-210s-93-210-210-210H332z" p-id="1111"></path><path d="M341 522m-150 0a150 150 0 1 0 300 0 150 150 0 1 0-300 0Z" p-id="1112"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/system.svg b/src/assets/icons/svg/system.svg
new file mode 100644
index 0000000..5992593
--- /dev/null
+++ b/src/assets/icons/svg/system.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1543827724451" class="icon" style="" viewBox="0 0 1084 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10233" xmlns:xlink="http://www.w3.org/1999/xlink" width="211.71875" height="200"><defs><style type="text/css">@font-face { font-family: rbicon; src: url("chrome-extension://dipiagiiohfljcicegpgffpbnjmgjcnf/fonts/rbicon.woff2") format("woff2"); font-weight: normal; font-style: normal; }
+</style></defs><path d="M1080.09609 434.500756c-4.216302-23.731757-26.9241-47.945376-50.595623-53.185637l-17.648235-4.095836a175.940257 175.940257 0 0 1-101.612877-80.832531 177.807476 177.807476 0 0 1-18.732427-129.801867l5.541425-16.684509c7.10748-23.129428-2.108151-54.992624-20.599646-70.833873 0 0-16.624276-14.094495-63.244529-41.199293-46.800951-26.984332-66.858502-34.513443-66.858502-34.513443-22.76803-8.372371-54.631227-0.361397-71.255503 17.407304l-12.287509 13.251234a173.470708 173.470708 0 0 1-120.465769 48.065842A174.13327 174.13327 0 0 1 421.329029 33.590675L409.583617 20.761071C393.140039 2.99237 361.096144-4.898138 338.267881 3.353767c0 0-20.358715 7.529111-67.099434 34.513443-46.800951 27.34573-63.244529 41.440225-63.244529 41.440225-18.431263 15.66055-27.646894 47.222582-20.539413 70.592941l5.059562 16.865207a178.048407 178.048407 0 0 1-18.672194 129.621169 174.916297 174.916297 0 0 1-102.275439 81.073463l-17.045906 3.854904c-23.310126 5.42096-46.258856 29.333415-50.595623 53.185637 0 0-3.854905 21.382674-3.854905 75.712737 0 54.330062 3.854905 75.712736 3.854905 75.712736 4.216302 23.972688 26.9241 47.945376 50.595623 53.185637l16.624276 3.854905a174.253736 174.253736 0 0 1 102.395904 81.314394c23.310126 40.837896 28.911785 87.337683 18.732427 129.801867l-4.81863 16.443578c-7.10748 23.129428 2.108151 54.992624 20.599646 70.833872 0 0 16.624276 14.094495 63.244529 41.199293 46.800951 27.104798 66.918735 34.513443 66.918735 34.513443 22.707798 8.372371 54.631227 0.361397 71.255503-17.407303l11.624947-12.588673a175.096996 175.096996 0 0 1 242.256662 0.120465l11.624947 12.648906c16.383345 17.708468 48.427239 25.598976 71.255503 17.347071 0 0 20.358715-7.529111 67.159666-34.513443 46.740719-27.104798 63.124063-41.199293 63.124064-41.199293 18.491496-15.600317 27.707127-47.463513 20.599646-70.833873l-5.059562-17.106139a176.723284 176.723284 0 0 1 18.672194-129.139305 176.060722 176.060722 0 0 1 102.395904-81.314394l16.68451-3.854905c23.310126-5.42096 46.258856-29.333415 50.595623-53.185637 0 0 3.854905-21.382674 3.854904-75.712737-0.240932-54.330062-4.095836-75.833202-4.095836-75.833202z m-537.819428 293.334149c-119.261112 0-216.175824-97.336342-216.175824-217.621412a216.657687 216.657687 0 0 1 216.236057-217.320249c119.200879 0 216.115591 97.276109 216.11559 217.56118-0.240932 120.044139-96.974945 217.320248-216.175823 217.320249z" p-id="10234"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/tab.svg b/src/assets/icons/svg/tab.svg
new file mode 100644
index 0000000..b4b48e4
--- /dev/null
+++ b/src/assets/icons/svg/tab.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M78.921.052H49.08c-1.865 0-3.198 1.599-3.198 3.464v6.661c0 1.865 1.6 3.464 3.198 3.464h29.84c1.865 0 3.198-1.599 3.198-3.464V3.516C82.385 1.65 80.786.052 78.92.052zm45.563 0H94.642c-1.865 0-3.464 1.599-3.464 3.464v6.661c0 1.865 1.599 3.464 3.464 3.464h29.842c1.865-.266 3.464-1.599 3.464-3.464V3.516c0-1.865-1.599-3.464-3.464-3.464zm0 22.382H40.02c-1.866 0-3.464-1.599-3.464-3.464V3.516c0-1.865-1.599-3.464-3.464-3.464H3.516C1.65.052.052 1.651.052 3.516V124.75c0 1.598 1.599 3.197 3.464 3.197h120.968c1.865 0 3.464-1.599 3.464-3.464V25.898c0-1.865-1.599-3.464-3.464-3.464z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/table.svg b/src/assets/icons/svg/table.svg
new file mode 100644
index 0000000..0e3dc9d
--- /dev/null
+++ b/src/assets/icons/svg/table.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M.006.064h127.988v31.104H.006V.064zm0 38.016h38.396v41.472H.006V38.08zm0 48.384h38.396v41.472H.006V86.464zM44.802 38.08h38.396v41.472H44.802V38.08zm0 48.384h38.396v41.472H44.802V86.464zM89.598 38.08h38.396v41.472H89.598zm0 48.384h38.396v41.472H89.598z"/><path d="M.006.064h127.988v31.104H.006V.064zm0 38.016h38.396v41.472H.006V38.08zm0 48.384h38.396v41.472H.006V86.464zM44.802 38.08h38.396v41.472H44.802V38.08zm0 48.384h38.396v41.472H44.802V86.464zM89.598 38.08h38.396v41.472H89.598zm0 48.384h38.396v41.472H89.598z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/textarea.svg b/src/assets/icons/svg/textarea.svg
new file mode 100644
index 0000000..2709f29
--- /dev/null
+++ b/src/assets/icons/svg/textarea.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1575802855098" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2984" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M896 160H128c-35.2 0-64 28.8-64 64v576c0 35.2 28.8 64 64 64h768c35.2 0 64-28.8 64-64V224c0-35.2-28.8-64-64-64z m0 608c0 16-12.8 32-32 32H160c-19.2 0-32-12.8-32-32V256c0-16 12.8-32 32-32h704c19.2 0 32 12.8 32 32v512z" p-id="2985"></path><path d="M224 288c-19.2 0-32 12.8-32 32v256c0 16 12.8 32 32 32s32-12.8 32-32V320c0-16-12.8-32-32-32z m608 480c19.2 0 32-12.8 32-32V608L704 768h128z" p-id="2986"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/theme.svg b/src/assets/icons/svg/theme.svg
new file mode 100644
index 0000000..5982a2f
--- /dev/null
+++ b/src/assets/icons/svg/theme.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M125.5 36.984L95.336 2.83C93.735 1.018 91.565 0 89.3 0c-2.263 0-4.433 1.018-6.033 2.83l-3.786 4.286c-1.6 1.812-3.77 2.83-6.032 2.831H54.553c-2.263 0-4.434-1.018-6.033-2.83L44.734 2.83C43.134 1.018 40.964 0 38.701 0c-2.263 0-4.434 1.018-6.034 2.83L2.5 36.984C.9 38.796 0 41.254 0 43.815c0 2.562.899 5.02 2.5 6.831L14.565 64.31c2.178 2.468 5.367 3.403 8.33 2.444 1.35-.435 2.709.592 2.709 2.18v49.407c0 5.313 3.84 9.66 8.532 9.66h59.726c4.693 0 8.532-4.347 8.532-9.66V68.934c0-1.59 1.36-2.616 2.71-2.181 2.962.96 6.15.024 8.329-2.444L125.5 50.646c1.6-1.811 2.499-4.269 2.499-6.83 0-2.563-.899-5.02-2.5-6.832z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/time-range.svg b/src/assets/icons/svg/time-range.svg
new file mode 100644
index 0000000..13c1202
--- /dev/null
+++ b/src/assets/icons/svg/time-range.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1579774825624" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1248" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M498.595712 482.290351 345.420077 482.290351l0 57.307194 210.477712 0L555.897789 274.196942l-57.301054 0L498.596735 482.290351zM498.595712 482.290351" p-id="1249"></path><path d="M577.685002 644.98478l379.879913 0 0 57.302077L577.685002 702.286858 577.685002 644.98478 577.685002 644.98478zM577.685002 644.98478" p-id="1250"></path><path d="M577.685002 773.764795l379.879913 0 0 57.307194L577.685002 831.071989 577.685002 773.764795 577.685002 773.764795zM577.685002 773.764795" p-id="1251"></path><path d="M577.685002 902.549927l379.879913 0 0 57.307194L577.685002 959.857121 577.685002 902.549927 577.685002 902.549927zM577.685002 902.549927" p-id="1252"></path><path d="M102.523001 382.290823c4.450359 2.615571 9.470699 3.954055 14.530948 3.954055 2.969635 0 5.952572-0.461511 8.836249-1.394766l190.809767-61.886489c15.052834-4.882194 23.297612-21.040199 18.415418-36.08894-4.882194-15.052834-21.040199-23.297612-36.093033-18.415418L175.676092 308.458257c15.994276-26.115797 35.170011-50.537 57.370639-72.743768 73.767074-73.767074 171.845857-114.388237 276.16783-114.388237 104.32095 0 202.39564 40.622186 276.16169 114.388237s114.393353 171.845857 114.393353 276.16783c0 26.427906-2.615571 52.449559-7.709589 77.780481l58.302871 0c4.464685-25.499767 6.708795-51.470255 6.708795-77.780481 0-60.449767-11.845793-119.102608-35.204803-174.336584-22.559808-53.334719-54.850236-101.226472-95.968725-142.349055-41.122583-41.122583-89.017406-73.408917-142.348032-95.968725C628.317169 75.866898 569.659211 64.021106 509.215584 64.021106c-60.448744 0-119.106702 11.845793-174.336584 35.207873-53.334719 22.559808-101.230566 54.846142-142.349055 95.968725-23.980157 23.980157-44.934398 50.278103-62.727647 78.601172l-20.738323-105.655342c-3.043313-15.527648-18.105357-25.642007-33.631982-22.599717-15.527648 3.048429-25.64303 18.105357-22.599717 33.637098l36.102243 183.932126C90.51348 371.153158 95.460142 378.13313 102.523001 382.290823L102.523001 382.290823zM102.523001 382.290823" p-id="1253"></path><path d="M126.020158 587.9416 67.768453 587.9416c5.759167 33.679054 15.368012 66.544579 28.789697 98.278327 22.559808 53.333696 54.850236 101.225449 95.971795 142.348032 41.122583 41.122583 89.014336 73.408917 142.349055 95.968725 54.112432 22.88829 111.517863 34.71157 170.668031 35.18229L505.547031 902.395408c-102.94972-0.941442-199.594851-41.445948-272.499277-114.349351C177.545672 732.543975 140.810003 663.275355 126.020158 587.9416L126.020158 587.9416zM126.020158 587.9416" p-id="1254"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/time.svg b/src/assets/icons/svg/time.svg
new file mode 100644
index 0000000..b376e32
--- /dev/null
+++ b/src/assets/icons/svg/time.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1577099827399" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1008" xmlns:xlink="http://www.w3.org/1999/xlink" width="81" height="81"><defs><style type="text/css"></style></defs><path d="M520 559h204c17.673 0 32 14.327 32 32 0 17.673-14.327 32-32 32H488c-17.673 0-32-14.327-32-32 0-0.167 0.001-0.334 0.004-0.5a32.65 32.65 0 0 1-0.004-0.5V277c0-17.673 14.327-32 32-32 17.673 0 32 14.327 32 32v282z m-8 401C264.576 960 64 759.424 64 512S264.576 64 512 64s448 200.576 448 448-200.576 448-448 448z m0-64c212.077 0 384-171.923 384-384S724.077 128 512 128 128 299.923 128 512s171.923 384 384 384z" p-id="1009"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/tool.svg b/src/assets/icons/svg/tool.svg
new file mode 100644
index 0000000..48e0e35
--- /dev/null
+++ b/src/assets/icons/svg/tool.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1553828490559" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1684" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M898.831744 900.517641 103.816972 900.517641c-36.002982 0-65.363683-29.286-65.363683-65.313541l0-554.949184c0-36.041868 29.361725-65.326844 65.363683-65.326844l795.015795 0c36.002982 0 65.198931 29.284977 65.198931 65.326844l0 554.949184C964.030675 871.231641 934.834726 900.517641 898.831744 900.517641L898.831744 900.517641zM103.816972 255.593236c-13.576203 0-24.711821 11.085476-24.711821 24.662703l0 554.949184c0 13.576203 11.136641 24.662703 24.711821 24.662703l795.015795 0c13.577227 0 24.547069-11.086499 24.547069-24.662703l0-554.949184c0-13.577227-10.970866-24.662703-24.547069-24.662703L103.816972 255.593236 103.816972 255.593236zM664.346245 251.774257c-11.161201 0-20.332071-9.080819-20.332071-20.332071l0-101.278661c0-13.576203-11.047614-24.623817-24.699542-24.623817L383.181611 105.539708c-13.576203 0-24.712845 11.04659-24.712845 24.623817l0 101.278661c0 11.252275-9.041934 20.332071-20.332071 20.332071-11.20111 0-20.319791-9.080819-20.319791-20.332071l0-101.278661c0-35.989679 29.323862-65.275679 65.364707-65.275679l236.133022 0c36.06745 0 65.402569 29.284977 65.402569 65.275679l0 101.278661C684.717202 242.694461 675.636383 251.774257 664.346245 251.774257L664.346245 251.774257zM413.233044 521.725502 75.694471 521.725502c-11.163247 0-20.333094-9.117658-20.333094-20.35663 0-11.252275 9.169847-20.332071 20.333094-20.332071l337.538573 0c11.277858 0 20.319791 9.080819 20.319791 20.332071C433.552835 512.607844 424.510902 521.725502 413.233044 521.725502L413.233044 521.725502zM912.894018 521.725502 575.367725 521.725502c-11.213389 0-20.332071-9.117658-20.332071-20.35663 0-11.252275 9.118682-20.332071 20.332071-20.332071l337.526293 0c11.290137 0 20.332071 9.080819 20.332071 20.332071C933.226089 512.607844 924.184155 521.725502 912.894018 521.725502L912.894018 521.725502zM557.56322 634.217552 445.085496 634.217552c-11.213389 0-20.332071-9.079796-20.332071-20.331048l0-168.763658c0-11.251252 9.118682-20.332071 20.332071-20.332071l112.478747 0c11.290137 0 20.370956 9.080819 20.370956 20.332071l0 168.763658C577.934177 625.137757 568.853357 634.217552 557.56322 634.217552L557.56322 634.217552zM465.417567 593.514525l71.827909 0L537.245476 465.454918l-71.827909 0L465.417567 593.514525 465.417567 593.514525z" p-id="1685"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/tree-table.svg b/src/assets/icons/svg/tree-table.svg
new file mode 100644
index 0000000..8aafdb8
--- /dev/null
+++ b/src/assets/icons/svg/tree-table.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M44.8 0h79.543C126.78 0 128 1.422 128 4.267v23.466c0 2.845-1.219 4.267-3.657 4.267H44.8c-2.438 0-3.657-1.422-3.657-4.267V4.267C41.143 1.422 42.362 0 44.8 0zm22.857 48h56.686c2.438 0 3.657 1.422 3.657 4.267v23.466c0 2.845-1.219 4.267-3.657 4.267H67.657C65.22 80 64 78.578 64 75.733V52.267C64 49.422 65.219 48 67.657 48zm0 48h56.686c2.438 0 3.657 1.422 3.657 4.267v23.466c0 2.845-1.219 4.267-3.657 4.267H67.657C65.22 128 64 126.578 64 123.733v-23.466C64 97.422 65.219 96 67.657 96zM50.286 68.267c2.02 0 3.657-1.91 3.657-4.267 0-2.356-1.638-4.267-3.657-4.267H17.37V32h6.4c2.02 0 3.658-1.91 3.658-4.267V4.267C27.429 1.91 25.79 0 23.77 0H3.657C1.637 0 0 1.91 0 4.267v23.466C0 30.09 1.637 32 3.657 32h6.4v80c0 2.356 1.638 4.267 3.657 4.267h36.572c2.02 0 3.657-1.91 3.657-4.267 0-2.356-1.638-4.267-3.657-4.267H17.37V68.267h32.915z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/tree.svg b/src/assets/icons/svg/tree.svg
new file mode 100644
index 0000000..dd4b7dd
--- /dev/null
+++ b/src/assets/icons/svg/tree.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M126.713 90.023c.858.985 1.287 2.134 1.287 3.447v29.553c0 1.423-.429 2.6-1.287 3.53-.858.93-1.907 1.395-3.146 1.395H97.824c-1.145 0-2.146-.465-3.004-1.395-.858-.93-1.287-2.107-1.287-3.53V93.47c0-.875.19-1.696.572-2.462.382-.766.906-1.368 1.573-1.806a3.84 3.84 0 0 1 2.146-.657h9.725V69.007a3.84 3.84 0 0 0-.43-1.806 3.569 3.569 0 0 0-1.143-1.313 2.714 2.714 0 0 0-1.573-.492h-36.47v23.149h9.725c1.144 0 2.145.492 3.004 1.478.858.985 1.287 2.134 1.287 3.447v29.553c0 .876-.191 1.696-.573 2.463-.38.766-.905 1.368-1.573 1.806a3.84 3.84 0 0 1-2.145.656H51.915a3.84 3.84 0 0 1-2.145-.656c-.668-.438-1.216-1.04-1.645-1.806a4.96 4.96 0 0 1-.644-2.463V93.47c0-1.313.43-2.462 1.288-3.447.858-.986 1.907-1.478 3.146-1.478h9.582v-23.15h-37.9c-.953 0-1.74.356-2.359 1.068-.62.711-.93 1.56-.93 2.544v19.538h9.726c1.239 0 2.264.492 3.074 1.478.81.985 1.216 2.134 1.216 3.447v29.553c0 1.423-.405 2.6-1.216 3.53-.81.93-1.835 1.395-3.074 1.395H4.29c-.476 0-.93-.082-1.358-.246a4.1 4.1 0 0 1-1.144-.657 4.658 4.658 0 0 1-.93-1.067 5.186 5.186 0 0 1-.643-1.395 5.566 5.566 0 0 1-.215-1.56V93.47c0-.437.048-.875.143-1.313a3.95 3.95 0 0 1 .429-1.15c.19-.328.429-.656.715-.984.286-.329.572-.602.858-.821.286-.22.62-.383 1.001-.493.382-.11.763-.164 1.144-.164h9.726V61.619c0-.985.31-1.833.93-2.544.619-.712 1.358-1.068 2.216-1.068h44.335V39.62h-9.582c-1.24 0-2.288-.492-3.146-1.477a5.09 5.09 0 0 1-1.287-3.448V5.14c0-1.423.429-2.627 1.287-3.612.858-.985 1.907-1.477 3.146-1.477h25.743c.763 0 1.478.246 2.145.739a5.17 5.17 0 0 1 1.573 1.888c.382.766.573 1.587.573 2.462v29.553c0 1.313-.43 2.463-1.287 3.448-.859.985-1.86 1.477-3.004 1.477h-9.725v18.389h42.762c.954 0 1.74.355 2.36 1.067.62.711.93 1.56.93 2.545v26.925h9.582c1.239 0 2.288.492 3.146 1.478z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/upload.svg b/src/assets/icons/svg/upload.svg
new file mode 100644
index 0000000..bae49c0
--- /dev/null
+++ b/src/assets/icons/svg/upload.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1577540289643" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7922" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M530.944 458.24l4.8 3.456 122.176 106.816a32 32 0 0 1-37.44 51.584l-4.672-3.392L546.56 556.16v280.704a32 32 0 0 1-26.24 31.488l-5.76 0.512a32 32 0 0 1-31.424-26.24l-0.512-5.76-0.064-280.704-69.12 60.48a32 32 0 0 1-40.96 0.896l-4.16-3.968a32 32 0 0 1-0.96-40.96l4.032-4.16 122.176-106.816a32 32 0 0 1 37.312-3.456zM497.92 128c128.128 0 239.168 82.304 275.52 199.04 123.968 11.264 221.312 113.088 221.312 237.44 0 128.128-103.68 232.96-234.88 238.272h-5.888l-35.52 0.192a32 32 0 0 1-0.192-64l35.264-0.128 4.672-0.064c96.384-3.84 172.544-80.896 172.544-174.272 0-96.128-80.512-174.464-179.584-174.464h-1.984a32 32 0 0 1-32-25.28C695.872 264.96 604.736 192 497.92 192 381.824 192 285.44 277.76 274.816 388.48a32 32 0 0 1-28.352 28.8c-83.968 9.152-147.84 78.208-147.84 159.552l0.192 7.936c3.84 85.76 77.056 154.112 166.592 154.112h45.632a32 32 0 0 1 0 64h-45.632C142.016 802.944 40.32 708.032 34.88 586.88l-0.192-9.28c0-106.88 76.352-197.184 179.968-219.904C239.488 226.112 357.76 128 497.856 128z" p-id="7923"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/user.svg b/src/assets/icons/svg/user.svg
new file mode 100644
index 0000000..0ba0716
--- /dev/null
+++ b/src/assets/icons/svg/user.svg
@@ -0,0 +1 @@
+<svg width="130" height="130" xmlns="http://www.w3.org/2000/svg"><path d="M63.444 64.996c20.633 0 37.359-14.308 37.359-31.953 0-17.649-16.726-31.952-37.359-31.952-20.631 0-37.36 14.303-37.358 31.952 0 17.645 16.727 31.953 37.359 31.953zM80.57 75.65H49.434c-26.652 0-48.26 18.477-48.26 41.27v2.664c0 9.316 21.608 9.325 48.26 9.325H80.57c26.649 0 48.256-.344 48.256-9.325v-2.663c0-22.794-21.605-41.271-48.256-41.271z" stroke="#979797"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/validCode.svg b/src/assets/icons/svg/validCode.svg
new file mode 100644
index 0000000..cfb1021
--- /dev/null
+++ b/src/assets/icons/svg/validCode.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1569580729849" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1939" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M513.3 958.5c-142.2 0-397.9-222.1-401.6-440.5V268c1.7-39.6 31.7-72.3 71.1-77.3 49-4.6 97.1-16.5 142.7-35.3 47.8-14 91.9-38.3 129.4-71.1 30.3-24.4 72.9-26.3 105.3-4.6 39.9 30.7 83.8 55.9 130.5 74.6 48.6 14.7 98.2 25.9 148.4 33.7 38.5 7.6 67.1 40.3 69.5 79.5 3.3 84.9 2.5 169.9-2.6 254.7-33.7 281.6-253.7 436.4-392.7 436.3z m-0.1-813.7c-7.2-0.2-14.3 2-20 6.4-39.7 35.2-86.8 61.1-137.7 75.7-46.8 19.2-96.2 31-146.6 35.2-11 3.2-18.8 13-19.5 24.4v230.1c3.5 180.3 223.3 361 323.9 361s287.3-120.2 317.6-360.5c7.3-142.7 0-228.6 0-229.6-1.3-13.3-11-24.3-24-27.3-49.6-7.7-98.6-19-146.5-33.7-46.3-19.5-89.7-45.3-129-76.7-5.8-3.8-12.7-5.5-19.5-4.9l1.3-0.1z" fill="#C6CCDA" p-id="1940"></path><path d="M750.1 428L490.7 673.2c-11.7 11.1-29.5 12.9-43.1 4.2l-6.8-5.8-141.2-149.4c-9.3-9.3-12.7-22.9-9-35.5 3.8-12.6 14.1-22.1 27-24.8 12.9-2.7 26.1 1.9 34.6 11.9L469 597.5l233.7-221c14.6-12.8 36.8-11.6 49.9 2.7 13.2 14.2 11.5 35.3-2.5 48.8" fill="#C6CCDA" p-id="1941"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/videoCourse.svg b/src/assets/icons/svg/videoCourse.svg
new file mode 100644
index 0000000..8013ed6
--- /dev/null
+++ b/src/assets/icons/svg/videoCourse.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1733409097552" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="38882" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M930.9 104.7H93.1C41.7 104.7 0 146.4 0 197.8v628.4c0 51.4 41.7 93.1 93.1 93.1h837.8c51.4 0 93.1-41.7 93.1-93.1V197.8c0-51.4-41.7-93.1-93.1-93.1zM394.7 640.3V383.7c0-28.7 33-44.9 55.7-27.3l165.5 128.2c17.9 13.8 17.9 40.8 0 54.7L450.5 667.6c-22.7 17.6-55.8 1.4-55.8-27.3z m428.6-489h107.6c25.7 0 46.5 20.9 46.5 46.5V273H823.3V151.3z m-192 0h145.5V273H631.3V151.3z m-192 0h145.5V273H439.3V151.3z m-192 0h145.5V273H247.3V151.3zM46.5 197.8c0-25.7 20.9-46.5 46.5-46.5h107.6V273H46.5v-75.2z m154.2 674.9H93.1c-25.7 0-46.5-20.9-46.5-46.5V751h154.2l-0.1 121.7z m192 0H247.3V751h145.5l-0.1 121.7z m192 0H439.3V751h145.5l-0.1 121.7z m192 0H631.3V751h145.5l-0.1 121.7z m200.8-46.5c0 25.7-20.9 46.5-46.5 46.5H823.3V751h154.2v75.2z" fill="#2c2c2c" p-id="38883"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/wechat.svg b/src/assets/icons/svg/wechat.svg
new file mode 100644
index 0000000..c586e55
--- /dev/null
+++ b/src/assets/icons/svg/wechat.svg
@@ -0,0 +1 @@
+<svg width="128" height="110" xmlns="http://www.w3.org/2000/svg"><path d="M86.635 33.334c1.467 0 2.917.113 4.358.283C87.078 14.392 67.58.111 45.321.111 20.44.111.055 17.987.055 40.687c0 13.104 6.781 23.863 18.115 32.209l-4.527 14.352 15.82-8.364c5.666 1.182 10.207 2.395 15.858 2.395 1.42 0 2.829-.073 4.227-.189-.886-3.19-1.398-6.53-1.398-9.996 0-20.845 16.98-37.76 38.485-37.76zm-24.34-12.936c3.407 0 5.665 2.363 5.665 5.954 0 3.576-2.258 5.97-5.666 5.97-3.392 0-6.795-2.395-6.795-5.97 0-3.591 3.403-5.954 6.795-5.954zM30.616 32.323c-3.393 0-6.818-2.395-6.818-5.971 0-3.591 3.425-5.954 6.818-5.954 3.392 0 5.65 2.363 5.65 5.954 0 3.576-2.258 5.97-5.65 5.97z"/><path d="M127.945 70.52c0-19.075-18.108-34.623-38.448-34.623-21.537 0-38.5 15.548-38.5 34.623 0 19.108 16.963 34.622 38.5 34.622 4.508 0 9.058-1.2 13.584-2.395l12.414 7.167-3.404-11.923c9.087-7.184 15.854-16.712 15.854-27.471zm-50.928-5.97c-2.254 0-4.53-2.362-4.53-4.773 0-2.378 2.276-4.771 4.53-4.771 3.422 0 5.665 2.393 5.665 4.771 0 2.41-2.243 4.773-5.665 4.773zm24.897 0c-2.24 0-4.498-2.362-4.498-4.773 0-2.378 2.258-4.771 4.498-4.771 3.392 0 5.665 2.393 5.665 4.771 0 2.41-2.273 4.773-5.665 4.773z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/yxtg.svg b/src/assets/icons/svg/yxtg.svg
new file mode 100644
index 0000000..74bc388
--- /dev/null
+++ b/src/assets/icons/svg/yxtg.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735046449047" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9624" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M312.7296 729.7024H20.48a20.48 20.48 0 0 1-20.48-20.48v-428.032a20.48 20.48 0 0 1 20.48-20.48h292.2496a20.48 20.48 0 0 1 20.48 20.48v428.032a20.48 20.48 0 0 1-20.48 20.48zM40.96 688.7424h251.2896v-387.072H40.96z" fill="#333333" p-id="9625"></path><path d="M817.7664 977.1008a20.48 20.48 0 0 1-9.0112-2.048L303.7184 727.6544a20.48 20.48 0 0 1-11.4688-18.432v-428.032a20.48 20.48 0 0 1 11.4688-18.432L808.7552 15.36a20.48 20.48 0 0 1 20.48 1.024 20.48 20.48 0 0 1 9.6256 17.408v922.8288a20.48 20.48 0 0 1-9.6256 17.408 20.48 20.48 0 0 1-11.4688 3.072zM333.2096 696.32l464.0768 227.328V66.7648L333.2096 293.888z" fill="#333333" p-id="9626"></path><path d="M821.248 704.9216h-3.4816a20.48 20.48 0 0 1-20.48-20.48V319.6928a20.48 20.48 0 0 1 20.48-20.48h3.4816a202.9568 202.9568 0 0 1 0 405.7088z m16.9984-363.9296v321.9456a161.792 161.792 0 0 0 0-321.9456zM156.4672 1010.688a106.9056 106.9056 0 0 1-106.7008-106.7008v-194.7648a20.48 20.48 0 0 1 20.48-20.48h172.2368a20.48 20.48 0 0 1 20.48 20.48v194.7648a106.9056 106.9056 0 0 1-106.496 106.7008zM90.7264 729.7024v174.2848a65.7408 65.7408 0 1 0 131.2768 0v-174.2848z" fill="#333333" p-id="9627"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/zip.svg b/src/assets/icons/svg/zip.svg
new file mode 100644
index 0000000..f806fc4
--- /dev/null
+++ b/src/assets/icons/svg/zip.svg
@@ -0,0 +1 @@
+<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M78.527 116.793c.178.008.348.024.527.024h40.233c4.711-.005 8.53-3.677 8.534-8.21V18.895c-.004-4.532-3.823-8.204-8.534-8.209H79.054c-.179 0-.353.016-.527.024V0L0 10.082v107.406l78.527 10.342v-11.037zm0-101.362c.174-.024.348-.052.527-.052h40.233c2.018 0 3.659 1.578 3.659 3.52v89.713c-.003 1.942-1.64 3.517-3.659 3.519H79.054c-.179 0-.353-.028-.527-.052V15.431zM30.262 75.757l-18.721-.46V72.37l11.3-16.673v-.148l-10.266.164v-4.51l17.504-.44v3.264L18.696 70.76v.144l11.566.176v4.678zm9.419.231l-5.823-.144V50.671l5.823-.144v25.461zm22.255-11.632c-2.168 1.922-5.353 2.76-9.02 2.736-.702.004-1.402-.04-2.097-.131v9.303l-5.997-.148V50.743c1.852-.352 4.473-.647 8.218-.743 3.838-.096 6.608.539 8.48 1.913 1.807 1.306 3.032 3.5 3.032 6.112s-.926 4.833-2.612 6.331h-.004zM53.36 54.45c-.856-.01-1.71.083-2.541.275v7.682c.523.116 1.167.152 2.06.152 3.301-.004 5.36-1.614 5.36-4.314 0-2.425-1.772-3.843-4.875-3.791l-.004-.004zm39.847-37.066h9.564v3.795h-9.564v-3.795zm-9.568 5.68h9.564v3.8h-9.564v-3.8zm9.568 6.216h9.564v3.799h-9.564V29.28zm0 12h9.564v3.794h-9.564V41.28zm-9.568-6.096h9.564v3.795h-9.564v-3.795zm9.472 47.064c2.512 0 4.921-.96 6.697-2.67 1.776-1.708 2.773-4.026 2.772-6.442l-1.748-15.263c0-5.033-2.492-9.112-7.725-9.112-5.232 0-7.72 4.079-7.72 9.112l-1.752 15.263c-.001 2.417.996 4.735 2.773 6.444 1.777 1.71 4.187 2.669 6.7 2.668h.003zm-3.135-16.75h6.27v12.743h-6.27V65.5z"/></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/zzfw.svg b/src/assets/icons/svg/zzfw.svg
new file mode 100644
index 0000000..3f22267
--- /dev/null
+++ b/src/assets/icons/svg/zzfw.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735046421522" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8577" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><path d="M993.7 343.2c-10.2-28.6-22.4-56.6-37.7-83.1l20.4 3.1c19.9 3.1 38.3-11.2 41.3-31.1 3.1-19.9-11.2-38.3-31.1-41.3L884 175.9c-25-3.6-47.9 13.8-52 38.8l-14.8 102.5c-3.1 19.9 11.2 38.3 31.1 41.3 1.5 0 3.6 0.5 5.1 0.5 17.8 0 33.7-13.3 36.2-31.1l4.1-29.1c36.3 65 55.3 138.2 55.1 212.7 0 241.2-196.3 437.1-437.1 437.1-76 0-151-19.9-216.8-57.1-17.3-10.2-39.8-4.1-50 13.8-10.2 17.3-4.1 39.8 13.8 50 76.5 43.9 164.2 66.8 253 66.8 68.9 0 135.7-13.3 198.4-40.3 60.7-25.5 115.3-62.7 162.2-109.1C918.9 826.1 956 771 981.4 710.4a508.44 508.44 0 0 0 40.3-198.4c0.5-57.6-9.1-114.7-28-168.8zM512.2 74.9c73.4 0 145.9 18.4 209.6 53.5 17.8 9.7 39.8 3.1 49.5-14.3 9.6-17.6 3.2-39.7-14.3-49.5C682.6 23.4 597.9 2 512.2 2c-68.8 0-135.7 13.3-198.4 40.3-60.6 25.5-115.2 62.7-162.1 109.1C105.1 197.9 68 253 42.5 313.6 15.5 376.3 2.2 443.1 2.2 512c0 85.7 21.4 170.3 62.7 244.8L44 755.3C24.2 753.7 6.8 769 5.3 789.4c-1.5 19.9 13.8 37.2 34.2 38.8l103 6.6h3.1c11-0.1 21.7-4 30.1-11.2 9.2-8.2 14.8-19.4 15.3-31.6l6.6-103c1.5-19.9-13.8-37.2-34.2-38.8-19.9-1.5-37.2 13.8-38.8 34.2l-2 27C91.2 649.6 74.8 581.3 74.7 512 75.2 270.8 271 74.9 512.2 74.9zM345.5 670.6c4.6 0.5 9.2 0.5 13.8 0.5 4.6 0 9.2 0 13.8-0.5h339.1c40.7-8 75.1-35.1 92.3-72.9 7.7-16.3 11.7-34.2 11.7-53 0-55.7-35.8-105.1-88.7-122.4-22.1-86.1-99.8-146.4-188.7-146.4-73.3 0-140.4 40.9-173.9 106.1h-5.6c-79.9-0.1-144.8 64.7-144.8 144.6v0.2c0 26 6.6 50.5 18.9 71.4 23.2 41 65.1 68.1 112.1 72.4z m-1.6-214.7c5.1-1 10.2-1.5 15.3-1.5 22.6 0 43.9 10.6 57.6 28.6-0.5-4.1-0.5-8.2-0.5-11.7 0-25 7.6-47.9 20.4-67.3 22.4-34.5 60.9-55.2 102-55.1 67.6 0 122.4 54.8 122.4 122.4v0.5c0 9.2-1 17.9-3.1 26.5 9-5.8 19.4-8.8 30.1-8.7 16.8 0 32.1 7.6 42.3 19.4 8.7 9.7 13.3 22.4 13.3 36.2 0 24.5-16.2 46.1-39.8 53H349c-35.2-4.6-62.2-35.2-62.2-71.4 0-34.7 24.5-63.8 57.1-70.9z" p-id="8578"></path></svg>
\ No newline at end of file
diff --git a/src/assets/images/dark.svg b/src/assets/images/dark.svg
new file mode 100644
index 0000000..f646bd7
--- /dev/null
+++ b/src/assets/images/dark.svg
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="52px" height="45px" viewBox="0 0 52 45" version="1.1" 
+    xmlns="http://www.w3.org/2000/svg" 
+    xmlns:xlink="http://www.w3.org/1999/xlink">
+    <defs>
+        <filter x="-9.4%" y="-6.2%" width="118.8%" height="122.5%" filterUnits="objectBoundingBox" id="filter-1">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.15 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
+            <feMerge>
+                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+                <feMergeNode in="SourceGraphic"></feMergeNode>
+            </feMerge>
+        </filter>
+        <rect id="path-2" x="0" y="0" width="48" height="40" rx="4"></rect>
+        <filter x="-4.2%" y="-2.5%" width="108.3%" height="110.0%" filterUnits="objectBoundingBox" id="filter-4">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+    </defs>
+    <g id="配置面板" width="48" height="40" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="setting-copy-2" width="48" height="40" transform="translate(-1190.000000, -136.000000)">
+            <g id="Group-8" width="48" height="40" transform="translate(1167.000000, 0.000000)">
+                <g id="Group-5-Copy-5" filter="url(#filter-1)" transform="translate(25.000000, 137.000000)">
+                    <mask id="mask-3" fill="white">
+                        <use xlink:href="#path-2"></use>
+                    </mask>
+                    <g id="Rectangle-18">
+                        <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-2"></use>
+                        <use fill="#F0F2F5" fill-rule="evenodd" xlink:href="#path-2"></use>
+                    </g>
+                    <rect id="Rectangle-11" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="48" height="10"></rect>
+                    <rect id="Rectangle-18" fill="#303648" mask="url(#mask-3)" x="0" y="0" width="16" height="40"></rect>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/images/light.svg b/src/assets/images/light.svg
new file mode 100644
index 0000000..ab7cc08
--- /dev/null
+++ b/src/assets/images/light.svg
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="52px" height="45px" viewBox="0 0 52 45" version="1.1" 
+    xmlns="http://www.w3.org/2000/svg" 
+    xmlns:xlink="http://www.w3.org/1999/xlink">
+    <defs>
+        <filter x="-9.4%" y="-6.2%" width="118.8%" height="122.5%" filterUnits="objectBoundingBox" id="filter-1">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.15 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
+            <feMerge>
+                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+                <feMergeNode in="SourceGraphic"></feMergeNode>
+            </feMerge>
+        </filter>
+        <rect id="path-2" x="0" y="0" width="48" height="40" rx="4"></rect>
+        <filter x="-4.2%" y="-2.5%" width="108.3%" height="110.0%" filterUnits="objectBoundingBox" id="filter-4">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+    </defs>
+    <g id="配置面板" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="setting-copy-2" transform="translate(-1254.000000, -136.000000)">
+            <g id="Group-8" transform="translate(1167.000000, 0.000000)">
+                <g id="Group-5" filter="url(#filter-1)" transform="translate(89.000000, 137.000000)">
+                    <mask id="mask-3" fill="white">
+                        <use xlink:href="#path-2"></use>
+                    </mask>
+                    <g id="Rectangle-18">
+                        <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-2"></use>
+                        <use fill="#F0F2F5" fill-rule="evenodd" xlink:href="#path-2"></use>
+                    </g>
+                    <rect id="Rectangle-18" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="16" height="40"></rect>
+                    <rect id="Rectangle-11" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="48" height="10"></rect>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/images/login-background.jpg b/src/assets/images/login-background.jpg
new file mode 100644
index 0000000..8a89eb8
Binary files /dev/null and b/src/assets/images/login-background.jpg differ
diff --git a/src/assets/images/login_bg.jpeg b/src/assets/images/login_bg.jpeg
new file mode 100644
index 0000000..a6b2dab
Binary files /dev/null and b/src/assets/images/login_bg.jpeg differ
diff --git a/src/assets/images/login_bg.png b/src/assets/images/login_bg.png
new file mode 100644
index 0000000..9eb00c5
Binary files /dev/null and b/src/assets/images/login_bg.png differ
diff --git a/src/assets/images/pay.png b/src/assets/images/pay.png
new file mode 100644
index 0000000..bb8b967
Binary files /dev/null and b/src/assets/images/pay.png differ
diff --git a/src/assets/images/profile.jpg b/src/assets/images/profile.jpg
new file mode 100644
index 0000000..b3a940b
Binary files /dev/null and b/src/assets/images/profile.jpg differ
diff --git a/src/assets/logo/logo.png b/src/assets/logo/logo.png
new file mode 100644
index 0000000..9379b34
Binary files /dev/null and b/src/assets/logo/logo.png differ
diff --git a/src/assets/styles/btn.scss b/src/assets/styles/btn.scss
new file mode 100644
index 0000000..3590d8d
--- /dev/null
+++ b/src/assets/styles/btn.scss
@@ -0,0 +1,99 @@
+@import './variables.module.scss';
+
+@mixin colorBtn($color) {
+  background: $color;
+
+  &:hover {
+    color: $color;
+
+    &:before,
+    &:after {
+      background: $color;
+    }
+  }
+}
+
+.blue-btn {
+  @include colorBtn($blue)
+}
+
+.light-blue-btn {
+  @include colorBtn($light-blue)
+}
+
+.red-btn {
+  @include colorBtn($red)
+}
+
+.pink-btn {
+  @include colorBtn($pink)
+}
+
+.green-btn {
+  @include colorBtn($green)
+}
+
+.tiffany-btn {
+  @include colorBtn($tiffany)
+}
+
+.yellow-btn {
+  @include colorBtn($yellow)
+}
+
+.pan-btn {
+  font-size: 14px;
+  color: #fff;
+  padding: 14px 36px;
+  border-radius: 8px;
+  border: none;
+  outline: none;
+  transition: 600ms ease all;
+  position: relative;
+  display: inline-block;
+
+  &:hover {
+    background: #fff;
+
+    &:before,
+    &:after {
+      width: 100%;
+      transition: 600ms ease all;
+    }
+  }
+
+  &:before,
+  &:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    right: 0;
+    height: 2px;
+    width: 0;
+    transition: 400ms ease all;
+  }
+
+  &::after {
+    right: inherit;
+    top: inherit;
+    left: 0;
+    bottom: 0;
+  }
+}
+
+.custom-button {
+  display: inline-block;
+  line-height: 1;
+  white-space: nowrap;
+  cursor: pointer;
+  background: #fff;
+  color: #fff;
+  -webkit-appearance: none;
+  text-align: center;
+  box-sizing: border-box;
+  outline: 0;
+  margin: 0;
+  padding: 10px 15px;
+  font-size: 14px;
+  border-radius: 4px;
+}
diff --git a/src/assets/styles/element-ui.scss b/src/assets/styles/element-ui.scss
new file mode 100644
index 0000000..0f175f2
--- /dev/null
+++ b/src/assets/styles/element-ui.scss
@@ -0,0 +1,96 @@
+// cover some element-ui styles
+
+.el-breadcrumb__inner,
+.el-breadcrumb__inner a {
+  font-weight: 400 !important;
+}
+
+.el-upload {
+  input[type="file"] {
+    display: none !important;
+  }
+}
+
+.el-upload__input {
+  display: none;
+}
+
+.cell {
+  .el-tag {
+    margin-right: 0px;
+  }
+}
+
+.small-padding {
+  .cell {
+    padding-left: 5px;
+    padding-right: 5px;
+  }
+}
+
+.fixed-width {
+  .el-button--mini {
+    padding: 7px 10px;
+    width: 60px;
+  }
+}
+
+.status-col {
+  .cell {
+    padding: 0 10px;
+    text-align: center;
+
+    .el-tag {
+      margin-right: 0px;
+    }
+  }
+}
+
+// to fixed https://github.com/ElemeFE/element/issues/2461
+.el-dialog {
+  transform: none;
+  left: 0;
+  position: relative;
+  margin: 0 auto;
+}
+
+// refine element ui upload
+.upload-container {
+  .el-upload {
+    width: 100%;
+
+    .el-upload-dragger {
+      width: 100%;
+      height: 200px;
+    }
+  }
+}
+
+// dropdown
+.el-dropdown-menu {
+  a {
+    display: block
+  }
+}
+
+// fix date-picker ui bug in filter-item
+.el-range-editor.el-input__inner {
+  display: inline-flex !important;
+}
+
+// to fix el-date-picker css style
+.el-range-separator {
+  box-sizing: content-box;
+}
+
+.el-menu--collapse
+  > div
+  > .el-submenu
+  > .el-submenu__title
+  .el-submenu__icon-arrow {
+  display: none;
+}
+
+.el-dropdown .el-dropdown-link{
+  color: var(--el-color-primary) !important;
+}
\ No newline at end of file
diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
new file mode 100644
index 0000000..1940bb8
--- /dev/null
+++ b/src/assets/styles/index.scss
@@ -0,0 +1,201 @@
+@import './variables.module.scss';
+@import './mixin.scss';
+@import './transition.scss';
+@import './element-ui.scss';
+@import './sidebar.scss';
+@import './btn.scss';
+@import './ruoyi.scss';
+
+body {
+  height: 100%;
+  margin: 0;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  text-rendering: optimizeLegibility;
+  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+}
+
+label {
+  font-weight: 700;
+}
+
+html {
+  height: 100%;
+  box-sizing: border-box;
+}
+
+#app {
+  height: 100%;
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+}
+
+.no-padding {
+  padding: 0px !important;
+}
+
+.padding-content {
+  padding: 4px 0;
+}
+
+a:focus,
+a:active {
+  outline: none;
+}
+
+a,
+a:focus,
+a:hover {
+  cursor: pointer;
+  color: inherit;
+  text-decoration: none;
+}
+
+div:focus {
+  outline: none;
+}
+
+.fr {
+  float: right;
+}
+
+.fl {
+  float: left;
+}
+
+.pr-5 {
+  padding-right: 5px;
+}
+
+.pl-5 {
+  padding-left: 5px;
+}
+
+.block {
+  display: block;
+}
+
+.pointer {
+  cursor: pointer;
+}
+
+.inlineBlock {
+  display: block;
+}
+
+.clearfix {
+  &:after {
+    visibility: hidden;
+    display: block;
+    font-size: 0;
+    content: " ";
+    clear: both;
+    height: 0;
+  }
+}
+
+aside {
+  background: #eef1f6;
+  padding: 8px 24px;
+  margin-bottom: 20px;
+  border-radius: 2px;
+  display: block;
+  line-height: 32px;
+  font-size: 16px;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+  color: #2c3e50;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+
+  a {
+    color: #337ab7;
+    cursor: pointer;
+
+    &:hover {
+      color: rgb(32, 160, 255);
+    }
+  }
+}
+
+//main-container全局样式
+.app-container {
+  padding: 20px;
+  background-color: #F5F6FA;
+  height: calc(100vh - 50px);
+  overflow-y: auto;
+}
+
+.components-container {
+  margin: 30px 50px;
+  position: relative;
+}
+
+.pagination-container {
+  margin-top: 30px;
+}
+
+.text-center {
+  text-align: center
+}
+
+.sub-navbar {
+  height: 50px;
+  line-height: 50px;
+  position: relative;
+  width: 100%;
+  text-align: right;
+  padding-right: 20px;
+  transition: 600ms ease position;
+  background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
+
+  .subtitle {
+    font-size: 20px;
+    color: #fff;
+  }
+
+  &.draft {
+    background: #d0d0d0;
+  }
+
+  &.deleted {
+    background: #d0d0d0;
+  }
+}
+
+.link-type,
+.link-type:focus {
+  color: #337ab7;
+  cursor: pointer;
+
+  &:hover {
+    color: rgb(32, 160, 255);
+  }
+}
+
+.filter-container {
+  padding-bottom: 10px;
+
+  .filter-item {
+    display: inline-block;
+    vertical-align: middle;
+    margin-bottom: 10px;
+  }
+}
+
+.zd-table {
+  border: 1px solid #ebeef5; 
+  border-bottom: none
+}
+.zd-card {
+  border-radius: 14px;
+  background: #ffffff;
+  box-sizing: border-box;
+  border: 0.3px solid #b9b9b9;
+  border: 0.3px solid #fff;
+  padding: 0px 30px 10px;
+  margin-bottom: 14px;
+}
\ No newline at end of file
diff --git a/src/assets/styles/mixin.scss b/src/assets/styles/mixin.scss
new file mode 100644
index 0000000..06fa061
--- /dev/null
+++ b/src/assets/styles/mixin.scss
@@ -0,0 +1,66 @@
+@mixin clearfix {
+  &:after {
+    content: "";
+    display: table;
+    clear: both;
+  }
+}
+
+@mixin scrollBar {
+  &::-webkit-scrollbar-track-piece {
+    background: #d3dce6;
+  }
+
+  &::-webkit-scrollbar {
+    width: 6px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background: #99a9bf;
+    border-radius: 20px;
+  }
+}
+
+@mixin relative {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+
+@mixin pct($pct) {
+  width: #{$pct};
+  position: relative;
+  margin: 0 auto;
+}
+
+@mixin triangle($width, $height, $color, $direction) {
+  $width: $width/2;
+  $color-border-style: $height solid $color;
+  $transparent-border-style: $width solid transparent;
+  height: 0;
+  width: 0;
+
+  @if $direction==up {
+    border-bottom: $color-border-style;
+    border-left: $transparent-border-style;
+    border-right: $transparent-border-style;
+  }
+
+  @else if $direction==right {
+    border-left: $color-border-style;
+    border-top: $transparent-border-style;
+    border-bottom: $transparent-border-style;
+  }
+
+  @else if $direction==down {
+    border-top: $color-border-style;
+    border-left: $transparent-border-style;
+    border-right: $transparent-border-style;
+  }
+
+  @else if $direction==left {
+    border-right: $color-border-style;
+    border-top: $transparent-border-style;
+    border-bottom: $transparent-border-style;
+  }
+}
diff --git a/src/assets/styles/ruoyi.scss b/src/assets/styles/ruoyi.scss
new file mode 100644
index 0000000..252be35
--- /dev/null
+++ b/src/assets/styles/ruoyi.scss
@@ -0,0 +1,301 @@
+/**
+ * 通用css样式布局处理
+ * Copyright (c) 2019 ruoyi
+ */
+
+ /** 基础通用 **/
+.pt5 {
+	padding-top: 5px;
+}
+.pr5 {
+	padding-right: 5px;
+}
+.pb5 {
+	padding-bottom: 5px;
+}
+.mt5 {
+	margin-top: 5px;
+}
+.mr5 {
+	margin-right: 5px;
+}
+.mb5 {
+	margin-bottom: 5px;
+}
+.mb8 {
+	margin-bottom: 8px;
+}
+.ml5 {
+	margin-left: 5px;
+}
+.mt10 {
+	margin-top: 10px;
+}
+.mr10 {
+	margin-right: 10px;
+}
+.mb10 {
+	margin-bottom: 10px;
+}
+.ml10 {
+	margin-left: 10px;
+}
+.mt20 {
+	margin-top: 20px;
+}
+.mr20 {
+	margin-right: 20px;
+}
+.mb20 {
+	margin-bottom: 20px;
+}
+.ml20 {
+	margin-left: 20px;
+}
+
+.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
+	font-family: inherit;
+	font-weight: 500;
+	line-height: 1.1;
+	color: inherit;
+}
+
+.el-form .el-form-item__label {
+	font-weight: 700;
+}
+.el-dialog:not(.is-fullscreen) {
+	margin-top: 6vh !important;
+}
+
+.el-dialog.scrollbar .el-dialog__body {
+	overflow: auto;
+	overflow-x: hidden;
+	max-height: 70vh;
+	padding: 10px 20px 0;
+}
+
+.el-table {
+	.el-table__header-wrapper, .el-table__fixed-header-wrapper {
+		th {
+			word-break: break-word;
+			background-color: #f8f8f9 !important;
+			color: #515a6e;
+			height: 40px !important;
+			font-size: 13px;
+		}
+	}
+	.el-table__body-wrapper {
+		.el-button [class*="el-icon-"] + span {
+			margin-left: 1px;
+		}
+	}
+}
+
+/** 表单布局 **/
+.form-header {
+    font-size:15px;
+	color:#6379bb;
+	border-bottom:1px solid #ddd;
+	margin:8px 10px 25px 10px;
+	padding-bottom:5px
+}
+
+/** 表格布局 **/
+.pagination-container {
+  position: relative;
+  height: 25px;
+  margin-bottom: 10px;
+  margin-top: 15px;
+  padding: 10px 20px !important;
+  background-color: transparent !important;
+}
+
+/* 分页器定位 */
+.pagination-container .el-pagination {
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+
+/* 弹窗中的分页器 */
+.el-dialog .pagination-container {
+  position: static !important;
+  margin: 10px 0 0 0;
+  padding: 0 !important;
+  
+  .el-pagination {
+    position: static;
+  }
+}
+
+/* 移动端适配 */
+@media (max-width: 768px) {
+  .pagination-container {
+    .el-pagination {
+      > .el-pagination__jump {
+        display: none !important;
+      }
+      > .el-pagination__sizes {
+        display: none !important;
+      }
+    }
+  }
+}
+
+/* tree border */
+.tree-border {
+    margin-top: 5px;
+    border: 1px solid var(--el-border-color-light, #e5e6e7);
+    background: var(--el-bg-color, #FFFFFF) none;
+    border-radius:4px;
+    width: 100%;
+}
+
+.el-table .fixed-width .el-button--small {
+	padding-left: 0;
+	padding-right: 0;
+	width: inherit;
+}
+
+/** 表格更多操作下拉样式 */
+.el-table .el-dropdown-link {
+	cursor: pointer;
+	color: #409EFF;
+	margin-left: 10px;
+}
+
+.el-table .el-dropdown, .el-icon-arrow-down {
+	font-size: 12px;
+}
+
+.el-tree-node__content > .el-checkbox {
+	margin-right: 8px;
+}
+
+.list-group-striped > .list-group-item {
+	border-left: 0;
+	border-right: 0;
+	border-radius: 0;
+	padding-left: 0;
+	padding-right: 0;
+}
+
+.list-group {
+	padding-left: 0px;
+	list-style: none;
+}
+
+.list-group-item {
+	border-bottom: 1px solid #e7eaec;
+	border-top: 1px solid #e7eaec;
+	margin-bottom: -1px;
+	padding: 11px 0px;
+	font-size: 13px;
+}
+
+.pull-right {
+	float: right !important;
+}
+
+.el-card__header {
+	padding: 14px 15px 7px !important;
+	min-height: 40px;
+}
+
+.el-card__body {
+	padding: 15px 20px 20px 20px !important;
+}
+
+.card-box {
+	padding-right: 15px;
+	padding-left: 15px;
+	margin-bottom: 10px;
+}
+
+/* button color */
+.el-button--cyan.is-active,
+.el-button--cyan:active {
+  background: #20B2AA;
+  border-color: #20B2AA;
+  color: #FFFFFF;
+}
+
+.el-button--cyan:focus,
+.el-button--cyan:hover {
+  background: #48D1CC;
+  border-color: #48D1CC;
+  color: #FFFFFF;
+}
+
+.el-button--cyan {
+  background-color: #20B2AA;
+  border-color: #20B2AA;
+  color: #FFFFFF;
+}
+
+/* text color */
+.text-navy {
+	color: #1ab394;
+}
+
+.text-primary {
+	color: inherit;
+}
+
+.text-success {
+	color: #1c84c6;
+}
+
+.text-info {
+	color: #23c6c8;
+}
+
+.text-warning {
+	color: #f8ac59;
+}
+
+.text-danger {
+	color: #ed5565;
+}
+
+.text-muted {
+	color: #888888;
+}
+
+/* image */
+.img-circle {
+	border-radius: 50%;
+}
+
+.img-lg {
+	width: 120px;
+	height: 120px;
+}
+
+.avatar-upload-preview {
+	position: absolute;
+	top: 50%;
+	transform: translate(50%, -50%);
+	width: 200px;
+	height: 200px;
+	border-radius: 50%;
+	box-shadow: 0 0 4px #ccc;
+	overflow: hidden;
+}
+
+/* 拖拽列样式 */
+.sortable-ghost{
+	opacity: .8;
+	color: #fff!important;
+	background: #42b983!important;
+}
+
+/* 表格右侧工具栏样式 */
+.top-right-btn {
+	margin-left: auto;
+}
+
+/* 分割面板样式 */
+.splitpanes.default-theme .splitpanes__pane {
+  background-color: var(--splitpanes-default-bg) !important;
+}
diff --git a/src/assets/styles/sidebar.scss b/src/assets/styles/sidebar.scss
new file mode 100644
index 0000000..7758f8b
--- /dev/null
+++ b/src/assets/styles/sidebar.scss
@@ -0,0 +1,236 @@
+#app {
+
+  .main-container {
+    min-height: 100%;
+    transition: margin-left .28s;
+    margin-left: $base-sidebar-width;
+    position: relative;
+  }
+
+  .sidebarHide {
+    margin-left: 0!important;
+  }
+
+  .sidebar-container {
+    transition: width 0.28s;
+    width: $base-sidebar-width !important;
+    height: 100%;
+    position: fixed;
+    font-size: 0px;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 1001;
+    overflow: hidden;
+    -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35);
+    box-shadow: 2px 0 6px rgba(0,21,41,.35);
+
+    // reset element-ui css
+    .horizontal-collapse-transition {
+      transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
+    }
+
+    .scrollbar-wrapper {
+      overflow-x: hidden !important;
+    }
+
+    .el-scrollbar__bar.is-vertical {
+      right: 0px;
+    }
+
+    .el-scrollbar {
+      height: 100%;
+    }
+
+    &.has-logo {
+      .el-scrollbar {
+        height: calc(100% - 50px);
+      }
+    }
+
+    .is-horizontal {
+      display: none;
+    }
+
+    a {
+      display: inline-block;
+      width: 100%;
+      overflow: hidden;
+    }
+
+    .svg-icon {
+      margin-right: 16px;
+    }
+
+    .el-menu {
+      border: none;
+      height: 100%;
+      width: 100% !important;
+    }
+
+    .el-menu-item, .menu-title {
+      overflow: hidden !important;
+      text-overflow: ellipsis !important;
+      white-space: nowrap !important;
+    }
+
+    .el-menu-item .el-menu-tooltip__trigger {
+      display: inline-block !important;
+    }
+
+    // menu hover
+    .sub-menu-title-noDropdown,
+    .el-sub-menu__title {
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.06) !important;
+      }
+    }
+
+    & .theme-dark .is-active > .el-sub-menu__title {
+      color: $base-menu-color-active !important;
+    }
+
+    & .nest-menu .el-sub-menu>.el-sub-menu__title,
+    & .el-sub-menu .el-menu-item {
+      min-width: $base-sidebar-width !important;
+
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.06) !important;
+      }
+    }
+
+    & .theme-dark .nest-menu .el-sub-menu>.el-sub-menu__title,
+    & .theme-dark .el-sub-menu .el-menu-item {
+      background-color: $base-sub-menu-background;
+
+      &:hover {
+        background-color: $base-sub-menu-hover !important;
+      }
+    }
+  }
+
+  .hideSidebar {
+    .sidebar-container {
+      width: 54px !important;
+    }
+
+    .main-container {
+      margin-left: 54px;
+    }
+
+    .sub-menu-title-noDropdown {
+      padding: 0 !important;
+      position: relative;
+
+      .el-tooltip {
+        padding: 0 !important;
+
+        .svg-icon {
+          margin-left: 20px;
+        }
+      }
+    }
+
+    .el-sub-menu {
+      overflow: hidden;
+
+      &>.el-sub-menu__title {
+        padding: 0 !important;
+
+        .svg-icon {
+          margin-left: 20px;
+        }
+
+      }
+    }
+
+    .el-menu--collapse {
+      .el-sub-menu {
+        &>.el-sub-menu__title {
+          &>span {
+            height: 0;
+            width: 0;
+            overflow: hidden;
+            visibility: hidden;
+            display: inline-block;
+          }
+          &>i {
+            height: 0;
+            width: 0;
+            overflow: hidden;
+            visibility: hidden;
+            display: inline-block;
+          }
+        }
+      }
+    }
+  }
+
+  .el-menu--collapse .el-menu .el-sub-menu {
+    min-width: $base-sidebar-width !important;
+  }
+
+  // mobile responsive
+  .mobile {
+    .main-container {
+      margin-left: 0px;
+    }
+
+    .sidebar-container {
+      transition: transform .28s;
+      width: $base-sidebar-width !important;
+    }
+
+    &.hideSidebar {
+      .sidebar-container {
+        pointer-events: none;
+        transition-duration: 0.3s;
+        transform: translate3d(-$base-sidebar-width, 0, 0);
+      }
+    }
+  }
+
+  .withoutAnimation {
+
+    .main-container,
+    .sidebar-container {
+      transition: none;
+    }
+  }
+}
+
+// when menu collapsed
+.el-menu--vertical {
+  &>.el-menu {
+    .svg-icon {
+      margin-right: 16px;
+    }
+  }
+
+  .nest-menu .el-sub-menu>.el-sub-menu__title,
+  .el-menu-item {
+    &:hover {
+      // you can use $sub-menuHover
+      background-color: rgba(0, 0, 0, 0.06) !important;
+    }
+  }
+
+  // the scroll bar appears when the sub-menu is too long
+  >.el-menu--popup {
+    max-height: 100vh;
+    overflow-y: auto;
+
+    &::-webkit-scrollbar-track-piece {
+      background: #d3dce6;
+    }
+
+    &::-webkit-scrollbar {
+      width: 6px;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      background: #99a9bf;
+      border-radius: 20px;
+    }
+  }
+}
diff --git a/src/assets/styles/transition.scss b/src/assets/styles/transition.scss
new file mode 100644
index 0000000..073f8c6
--- /dev/null
+++ b/src/assets/styles/transition.scss
@@ -0,0 +1,49 @@
+// global transition css
+
+/* fade */
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.28s;
+}
+
+.fade-enter,
+.fade-leave-active {
+  opacity: 0;
+}
+
+/* fade-transform */
+.fade-transform--move,
+.fade-transform-leave-active,
+.fade-transform-enter-active {
+  transition: all .5s;
+}
+
+.fade-transform-enter {
+  opacity: 0;
+  transform: translateX(-30px);
+}
+
+.fade-transform-leave-to {
+  opacity: 0;
+  transform: translateX(30px);
+}
+
+/* breadcrumb transition */
+.breadcrumb-enter-active,
+.breadcrumb-leave-active {
+  transition: all .5s;
+}
+
+.breadcrumb-enter,
+.breadcrumb-leave-active {
+  opacity: 0;
+  transform: translateX(20px);
+}
+
+.breadcrumb-move {
+  transition: all .5s;
+}
+
+.breadcrumb-leave-active {
+  position: absolute;
+}
diff --git a/src/assets/styles/variables.module.scss b/src/assets/styles/variables.module.scss
new file mode 100644
index 0000000..1e9460b
--- /dev/null
+++ b/src/assets/styles/variables.module.scss
@@ -0,0 +1,218 @@
+// base color
+$blue: #324157;
+$light-blue: #3A71A8;
+$red: #C03639;
+$pink: #E65D6E;
+$green: #30B08F;
+$tiffany: #4AB7BD;
+$yellow: #FEC171;
+$panGreen: #30B08F;
+
+// 默认主题变量
+$menuText: #bfcbd9;
+$menuActiveText: #409eff;
+$menuBg: #304156;
+$menuHover: #263445;
+
+// 浅色主题theme-light
+$menuLightBg: #ffffff;
+$menuLightHover: #f0f1f5;
+$menuLightText: #303133;
+$menuLightActiveText: #409EFF;
+
+// 基础变量
+$base-sidebar-width: 200px;
+$sideBarWidth: 200px;
+
+// 菜单暗色变量
+$base-menu-color: #bfcbd9;
+$base-menu-color-active: #f4f4f5;
+$base-menu-background: #304156;
+$base-sub-menu-background: #1f2d3d;
+$base-sub-menu-hover: #001528;
+
+// 组件变量
+$--color-primary: #409EFF;
+$--color-success: #67C23A;
+$--color-warning: #E6A23C;
+$--color-danger: #F56C6C;
+$--color-info: #909399;
+
+:export {
+  menuText: $menuText;
+  menuActiveText: $menuActiveText;
+  menuBg: $menuBg;
+  menuHover: $menuHover;
+  menuLightBg: $menuLightBg;
+  menuLightHover: $menuLightHover;
+  menuLightText: $menuLightText;
+  menuLightActiveText: $menuLightActiveText;
+  sideBarWidth: $sideBarWidth;
+  // 导出基础颜色
+  blue: $blue;
+  lightBlue: $light-blue;
+  red: $red;
+  pink: $pink;
+  green: $green;
+  tiffany: $tiffany;
+  yellow: $yellow;
+  panGreen: $panGreen;
+  // 导出组件颜色
+  colorPrimary: $--color-primary;
+  colorSuccess: $--color-success;
+  colorWarning: $--color-warning;
+  colorDanger: $--color-danger;
+  colorInfo: $--color-info;
+}
+
+// CSS变量定义
+:root {
+  /* 亮色模式变量 */
+  --sidebar-bg: #{$menuBg};
+  --sidebar-text: #{$menuText};
+  --menu-hover: #{$menuHover};
+  
+  --navbar-bg: #ffffff;
+  --navbar-text: #303133;
+  
+  /* splitpanes default-theme 变量 */
+  --splitpanes-default-bg: #ffffff;
+
+}
+
+// 暗黑模式变量
+html.dark {
+  /* 默认通用 */
+  --el-bg-color: #141414;
+  --el-bg-color-overlay: #1d1e1f;
+  --el-text-color-primary: #ffffff;
+  --el-text-color-regular: #d0d0d0;
+  --el-border-color: #434343;
+  --el-border-color-light: #434343;
+
+  /* 侧边栏 */
+  --sidebar-bg: #141414;
+  --sidebar-text: #ffffff;
+  --menu-hover: #2d2d2d;
+  --menu-active-text: #{$menuActiveText};
+
+  /* 顶部导航栏 */
+  --navbar-bg: #141414;
+  --navbar-text: #ffffff;
+  --navbar-hover: #141414;
+
+  /* 标签栏 */
+  --tags-bg: #141414;
+  --tags-item-bg: #1d1e1f;
+  --tags-item-border: #303030;
+  --tags-item-text: #d0d0d0;
+  --tags-item-hover: #2d2d2d;
+  --tags-close-hover: #64666a;
+
+  /* splitpanes 组件暗黑模式变量 */
+  --splitpanes-bg: #141414;
+  --splitpanes-border: #303030;
+  --splitpanes-splitter-bg: #1d1e1f;
+  --splitpanes-splitter-hover-bg: #2d2d2d;
+
+  /* blockquote 暗黑模式变量 */
+  --blockquote-bg: #1d1e1f;
+  --blockquote-border: #303030;
+  --blockquote-text: #d0d0d0;
+  
+  /* Cron 时间表达式 模式变量 */
+  --cron-border: #303030;
+
+  /* splitpanes default-theme 暗黑模式变量 */
+  --splitpanes-default-bg: #141414;
+
+  /* 侧边栏菜单覆盖 */
+   .sidebar-container {
+    & .theme-dark .nest-menu .el-sub-menu>.el-sub-menu__title,
+    & .theme-dark .el-sub-menu .el-menu-item {
+      background-color: var(--el-bg-color) !important;
+    }
+  }
+
+  /* 顶部栏栏菜单覆盖 */
+  .el-menu--horizontal {
+    .el-menu-item {
+      &:not(.is-disabled) {
+        &:hover,
+        &:focus {
+          background-color: var(--navbar-hover) !important;
+        }
+      }
+    }
+  }
+
+  /* 分割窗格覆盖 */
+  .splitpanes {
+    background-color: var(--splitpanes-bg);
+
+    .splitpanes__pane {
+      background-color: var(--splitpanes-bg);
+      border-color: var(--splitpanes-border);
+    }
+
+    .splitpanes__splitter {
+      background-color: var(--splitpanes-splitter-bg);
+      border-color: var(--splitpanes-border);
+
+      &:hover {
+        background-color: var(--splitpanes-splitter-hover-bg);
+      }
+
+      &:before,
+      &:after {
+        background-color: var(--splitpanes-border);
+      }
+    }
+  }
+
+  /* 表格样式覆盖 */
+  .el-table {
+    --el-table-header-bg-color: var(--el-bg-color-overlay) !important;
+    --el-table-header-text-color: var(--el-text-color-regular) !important;
+    --el-table-border-color: var(--el-border-color-light) !important;
+    --el-table-row-hover-bg-color: var(--el-bg-color-overlay) !important;
+
+    .el-table__header-wrapper, .el-table__fixed-header-wrapper {
+      th {
+        background-color: var(--el-bg-color-overlay, #f8f8f9) !important;
+        color: var(--el-text-color-regular, #515a6e);
+      }
+    }
+  }
+
+  /* 树组件高亮样式覆盖 */
+  .el-tree {
+    .el-tree-node.is-current > .el-tree-node__content {
+      background-color: var(--el-bg-color-overlay) !important;
+      color: var(--el-color-primary);
+    }
+
+    .el-tree-node__content:hover {
+      background-color: var(--el-bg-color-overlay);
+    }
+  }
+  
+  /* 下拉菜单样式覆盖 */
+  .el-dropdown-menu__item:not(.is-disabled):focus, .el-dropdown-menu__item:not(.is-disabled):hover{
+    background-color: var(--navbar-hover) !important;
+  }
+
+  /* blockquote样式覆盖 */
+  blockquote {
+    background-color: var(--blockquote-bg) !important;
+    border-left-color: var(--blockquote-border) !important;
+    color: var(--blockquote-text) !important;
+  }
+  
+  /* 时间表达式标题样式覆盖 */
+  .popup-result .title {
+    background: var(--cron-border);
+  }
+
+}
+
diff --git a/src/components/Breadcrumb/index.vue b/src/components/Breadcrumb/index.vue
new file mode 100644
index 0000000..b702bc0
--- /dev/null
+++ b/src/components/Breadcrumb/index.vue
@@ -0,0 +1,107 @@
+<template>
+  <el-breadcrumb class="app-breadcrumb" separator="/">
+    <transition-group name="breadcrumb">
+      <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
+        <span
+          v-if="item.redirect === 'noRedirect' || index == levelList.length - 1"
+          class="no-redirect"
+          >{{ item.meta.title }}</span
+        >
+        <a v-else @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
+      </el-breadcrumb-item>
+    </transition-group>
+  </el-breadcrumb>
+</template>
+
+<script setup>
+import usePermissionStore from "@/store/modules/permission";
+
+const route = useRoute();
+const router = useRouter();
+const permissionStore = usePermissionStore();
+const levelList = ref([]);
+
+function getBreadcrumb() {
+  // only show routes with meta.title
+  let matched = [];
+  const pathNum = findPathNum(route.path);
+  // multi-level menu
+  if (pathNum > 2) {
+    const reg = /\/\w+/gi;
+    const pathList = route.path.match(reg).map((item, index) => {
+      if (index !== 0) item = item.slice(1);
+      return item;
+    });
+    getMatched(pathList, permissionStore.defaultRoutes, matched);
+  } else {
+    matched = route.matched.filter((item) => item.meta && item.meta.title);
+  }
+  // 判断是否为首页
+  if (!isDashboard(matched[0])) {
+    matched = [{ path: "/index", meta: { title: "首页" } }].concat(matched);
+  }
+  levelList.value = matched.filter(
+    (item) => item.meta && item.meta.title && item.meta.breadcrumb !== false
+  );
+}
+function findPathNum(str, char = "/") {
+  let index = str.indexOf(char);
+  let num = 0;
+  while (index !== -1) {
+    num++;
+    index = str.indexOf(char, index + 1);
+  }
+  return num;
+}
+function getMatched(pathList, routeList, matched) {
+  let data = routeList.find(
+    (item) =>
+      item.path == pathList[0] || (item.name += "").toLowerCase() == pathList[0]
+  );
+  if (data) {
+    matched.push(data);
+    if (data.children && pathList.length) {
+      pathList.shift();
+      getMatched(pathList, data.children, matched);
+    }
+  }
+}
+function isDashboard(route) {
+  const name = route && route.name;
+  if (!name) {
+    return false;
+  }
+  return name.trim() === "Index";
+}
+function handleLink(item) {
+  const { redirect, path } = item;
+  if (redirect) {
+    router.push(redirect);
+    return;
+  }
+  router.push(path);
+}
+
+watchEffect(() => {
+  // if you go to the redirect page, do not update the breadcrumbs
+  if (route.path.startsWith("/redirect/")) {
+    return;
+  }
+  getBreadcrumb();
+});
+getBreadcrumb();
+</script>
+
+<style lang="scss" scoped>
+.app-breadcrumb.el-breadcrumb {
+  display: inline-block;
+  font-size: 14px;
+  line-height: 50px;
+  margin-left: 8px;
+
+  .no-redirect {
+    color: #97a8be;
+    cursor: text;
+  }
+}
+</style>
diff --git a/src/components/Crontab/day.vue b/src/components/Crontab/day.vue
new file mode 100644
index 0000000..39263f5
--- /dev/null
+++ b/src/components/Crontab/day.vue
@@ -0,0 +1,174 @@
+<template>
+    <el-form>
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="1">
+                日，允许的通配符[, - * ? / L W]
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="2">
+                不指定
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="3">
+                周期从
+                <el-input-number v-model='cycle01' :min="1" :max="30" /> -
+                <el-input-number v-model='cycle02' :min="cycle01 + 1" :max="31" /> 日
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="4">
+                从
+                <el-input-number v-model='average01' :min="1" :max="30" /> 号开始，每
+                <el-input-number v-model='average02' :min="1" :max="31 - average01" /> 日执行一次
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="5">
+                每月
+                <el-input-number v-model='workday' :min="1" :max="31" /> 号最近的那个工作日
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="6">
+                本月最后一天
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="7">
+                指定
+                <el-select clearable v-model="checkboxList" placeholder="可多选" multiple :multiple-limit="10">
+                    <el-option v-for="item in 31" :key="item" :label="item" :value="item" />
+                </el-select>
+            </el-radio>
+        </el-form-item>
+    </el-form>
+</template>
+<script setup>
+const emit = defineEmits(['update'])
+const props = defineProps({
+    cron: {
+        type: Object,
+        default: {
+            second: "*",
+            min: "*",
+            hour: "*",
+            day: "*",
+            month: "*",
+            week: "?",
+            year: "",
+        }
+    },
+    check: {
+        type: Function,
+        default: () => {
+        }
+    }
+})
+const radioValue = ref(1)
+const cycle01 = ref(1)
+const cycle02 = ref(2)
+const average01 = ref(1)
+const average02 = ref(1)
+const workday = ref(1)
+const checkboxList = ref([])
+const checkCopy = ref([1])
+const cycleTotal = computed(() => {
+    cycle01.value = props.check(cycle01.value, 1, 30)
+    cycle02.value = props.check(cycle02.value, cycle01.value + 1, 31)
+    return cycle01.value + '-' + cycle02.value
+})
+const averageTotal = computed(() => {
+    average01.value = props.check(average01.value, 1, 30)
+    average02.value = props.check(average02.value, 1, 31 - average01.value)
+    return average01.value + '/' + average02.value
+})
+const workdayTotal = computed(() => {
+    workday.value = props.check(workday.value, 1, 31)
+    return workday.value + 'W'
+})
+const checkboxString = computed(() => {
+    return checkboxList.value.join(',')
+})
+watch(() => props.cron.day, value => changeRadioValue(value))
+watch([radioValue, cycleTotal, averageTotal, workdayTotal, checkboxString], () => onRadioChange())
+function changeRadioValue(value) {
+    if (value === "*") {
+        radioValue.value = 1
+    } else if (value === "?") {
+        radioValue.value = 2
+    } else if (value.indexOf("-") > -1) {
+        const indexArr = value.split('-')
+        cycle01.value = Number(indexArr[0])
+        cycle02.value = Number(indexArr[1])
+        radioValue.value = 3
+    } else if (value.indexOf("/") > -1) {
+        const indexArr = value.split('/')
+        average01.value = Number(indexArr[0])
+        average02.value = Number(indexArr[1])
+        radioValue.value = 4
+    } else if (value.indexOf("W") > -1) {
+        const indexArr = value.split("W")
+        workday.value = Number(indexArr[0])
+        radioValue.value = 5
+    } else if (value === "L") {
+        radioValue.value = 6
+    } else {
+        checkboxList.value = [...new Set(value.split(',').map(item => Number(item)))]
+        radioValue.value = 7
+    }
+}
+// 单选按钮值变化时
+function onRadioChange() {
+    if (radioValue.value === 2 && props.cron.week === '?') {
+        emit('update', 'week', '*', 'day')
+    }
+    if (radioValue.value !== 2 && props.cron.week !== '?') {
+        emit('update', 'week', '?', 'day')
+    }
+    switch (radioValue.value) {
+        case 1:
+            emit('update', 'day', '*', 'day')
+            break
+        case 2:
+            emit('update', 'day', '?', 'day')
+            break
+        case 3:
+            emit('update', 'day', cycleTotal.value, 'day')
+            break
+        case 4:
+            emit('update', 'day', averageTotal.value, 'day')
+            break
+        case 5:
+            emit('update', 'day', workdayTotal.value, 'day')
+            break
+        case 6:
+            emit('update', 'day', 'L', 'day')
+            break
+        case 7:
+            if (checkboxList.value.length === 0) {
+                checkboxList.value.push(checkCopy.value[0])
+            } else {
+                checkCopy.value = checkboxList.value
+            }
+            emit('update', 'day', checkboxString.value, 'day')
+            break
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-input-number--small, .el-select, .el-select--small {
+    margin: 0 0.2rem;
+}
+.el-select, .el-select--small {
+    width: 18.8rem;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Crontab/hour.vue b/src/components/Crontab/hour.vue
new file mode 100644
index 0000000..8e7c21c
--- /dev/null
+++ b/src/components/Crontab/hour.vue
@@ -0,0 +1,133 @@
+<template>
+    <el-form>
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="1">
+                小时，允许的通配符[, - * /]
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="2">
+                周期从
+                <el-input-number v-model='cycle01' :min="0" :max="22" /> -
+                <el-input-number v-model='cycle02' :min="cycle01 + 1" :max="23" /> 时
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="3">
+                从
+                <el-input-number v-model='average01' :min="0" :max="22" /> 时开始，每
+                <el-input-number v-model='average02' :min="1" :max="23 - average01" /> 小时执行一次
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="4">
+                指定
+                <el-select clearable v-model="checkboxList" placeholder="可多选" multiple :multiple-limit="10">
+                    <el-option v-for="item in 24" :key="item" :label="item - 1" :value="item - 1" />
+                </el-select>
+            </el-radio>
+        </el-form-item>
+    </el-form>
+</template>
+
+<script setup>
+const emit = defineEmits(['update'])
+const props = defineProps({
+    cron: {
+        type: Object,
+        default: {
+            second: "*",
+            min: "*",
+            hour: "*",
+            day: "*",
+            month: "*",
+            week: "?",
+            year: "",
+        }
+    },
+    check: {
+        type: Function,
+        default: () => {
+        }
+    }
+})
+const radioValue = ref(1)
+const cycle01 = ref(0)
+const cycle02 = ref(1)
+const average01 = ref(0)
+const average02 = ref(1)
+const checkboxList = ref([])
+const checkCopy = ref([0])
+const cycleTotal = computed(() => {
+    cycle01.value = props.check(cycle01.value, 0, 22)
+    cycle02.value = props.check(cycle02.value, cycle01.value + 1, 23)
+    return cycle01.value + '-' + cycle02.value
+})
+const averageTotal = computed(() => {
+    average01.value = props.check(average01.value, 0, 22)
+    average02.value = props.check(average02.value, 1, 23 - average01.value)
+    return average01.value + '/' + average02.value
+})
+const checkboxString = computed(() => {
+    return checkboxList.value.join(',')
+})
+watch(() => props.cron.hour, value => changeRadioValue(value))
+watch([radioValue, cycleTotal, averageTotal, checkboxString], () => onRadioChange())
+function changeRadioValue(value) {
+    if (props.cron.min === '*') {
+        emit('update', 'min', '0', 'hour');
+    }
+    if (props.cron.second === '*') {
+        emit('update', 'second', '0', 'hour');
+    }
+    if (value === '*') {
+        radioValue.value = 1
+    } else if (value.indexOf('-') > -1) {
+        const indexArr = value.split('-')
+        cycle01.value = Number(indexArr[0])
+        cycle02.value = Number(indexArr[1])
+        radioValue.value = 2
+    } else if (value.indexOf('/') > -1) {
+        const indexArr = value.split('/')
+        average01.value = Number(indexArr[0])
+        average02.value = Number(indexArr[1])
+        radioValue.value = 3
+    } else {
+        checkboxList.value = [...new Set(value.split(',').map(item => Number(item)))]
+        radioValue.value = 4
+    }
+}
+function onRadioChange() {
+    switch (radioValue.value) {
+        case 1:
+            emit('update', 'hour', '*', 'hour')
+            break
+        case 2:
+            emit('update', 'hour', cycleTotal.value, 'hour')
+            break
+        case 3:
+            emit('update', 'hour', averageTotal.value, 'hour')
+            break
+        case 4:
+            if (checkboxList.value.length === 0) {
+                checkboxList.value.push(checkCopy.value[0])
+            } else {
+                checkCopy.value = checkboxList.value
+            }
+            emit('update', 'hour', checkboxString.value, 'hour')
+            break
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-input-number--small, .el-select, .el-select--small {
+    margin: 0 0.2rem;
+}
+.el-select, .el-select--small {
+    width: 18.8rem;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Crontab/index.vue b/src/components/Crontab/index.vue
new file mode 100644
index 0000000..103cf4c
--- /dev/null
+++ b/src/components/Crontab/index.vue
@@ -0,0 +1,309 @@
+<template>
+    <div>
+        <el-tabs type="border-card">
+            <el-tab-pane label="秒" v-if="shouldHide('second')">
+                <CrontabSecond
+                    @update="updateCrontabValue"
+                    :check="checkNumber"
+                    :cron="crontabValueObj"
+                    ref="cronsecond"
+                />
+            </el-tab-pane>
+
+            <el-tab-pane label="分钟" v-if="shouldHide('min')">
+                <CrontabMin
+                    @update="updateCrontabValue"
+                    :check="checkNumber"
+                    :cron="crontabValueObj"
+                    ref="cronmin"
+                />
+            </el-tab-pane>
+
+            <el-tab-pane label="小时" v-if="shouldHide('hour')">
+                <CrontabHour
+                    @update="updateCrontabValue"
+                    :check="checkNumber"
+                    :cron="crontabValueObj"
+                    ref="cronhour"
+                />
+            </el-tab-pane>
+
+            <el-tab-pane label="日" v-if="shouldHide('day')">
+                <CrontabDay
+                    @update="updateCrontabValue"
+                    :check="checkNumber"
+                    :cron="crontabValueObj"
+                    ref="cronday"
+                />
+            </el-tab-pane>
+
+            <el-tab-pane label="月" v-if="shouldHide('month')">
+                <CrontabMonth
+                    @update="updateCrontabValue"
+                    :check="checkNumber"
+                    :cron="crontabValueObj"
+                    ref="cronmonth"
+                />
+            </el-tab-pane>
+
+            <el-tab-pane label="周" v-if="shouldHide('week')">
+                <CrontabWeek
+                    @update="updateCrontabValue"
+                    :check="checkNumber"
+                    :cron="crontabValueObj"
+                    ref="cronweek"
+                />
+            </el-tab-pane>
+
+            <el-tab-pane label="年" v-if="shouldHide('year')">
+                <CrontabYear
+                    @update="updateCrontabValue"
+                    :check="checkNumber"
+                    :cron="crontabValueObj"
+                    ref="cronyear"
+                />
+            </el-tab-pane>
+        </el-tabs>
+
+        <div class="popup-main">
+            <div class="popup-result">
+                <p class="title">时间表达式</p>
+                <table>
+                    <thead>
+                        <th v-for="item of tabTitles" :key="item">{{item}}</th>
+                        <th>Cron 表达式</th>
+                    </thead>
+                    <tbody>
+                        <td>
+                            <span v-if="crontabValueObj.second.length < 10">{{crontabValueObj.second}}</span>
+                            <el-tooltip v-else :content="crontabValueObj.second" placement="top"><span>{{crontabValueObj.second}}</span></el-tooltip>
+                        </td>
+                        <td>
+                            <span v-if="crontabValueObj.min.length < 10">{{crontabValueObj.min}}</span>
+                            <el-tooltip v-else :content="crontabValueObj.min" placement="top"><span>{{crontabValueObj.min}}</span></el-tooltip>
+                        </td>
+                        <td>
+                            <span v-if="crontabValueObj.hour.length < 10">{{crontabValueObj.hour}}</span>
+                            <el-tooltip v-else :content="crontabValueObj.hour" placement="top"><span>{{crontabValueObj.hour}}</span></el-tooltip>
+                        </td>
+                        <td>
+                            <span v-if="crontabValueObj.day.length < 10">{{crontabValueObj.day}}</span>
+                            <el-tooltip v-else :content="crontabValueObj.day" placement="top"><span>{{crontabValueObj.day}}</span></el-tooltip>
+                        </td>
+                        <td>
+                            <span v-if="crontabValueObj.month.length < 10">{{crontabValueObj.month}}</span>
+                            <el-tooltip v-else :content="crontabValueObj.month" placement="top"><span>{{crontabValueObj.month}}</span></el-tooltip>
+                        </td>
+                        <td>
+                            <span v-if="crontabValueObj.week.length < 10">{{crontabValueObj.week}}</span>
+                            <el-tooltip v-else :content="crontabValueObj.week" placement="top"><span>{{crontabValueObj.week}}</span></el-tooltip>
+                        </td>
+                        <td>
+                            <span v-if="crontabValueObj.year.length < 10">{{crontabValueObj.year}}</span>
+                            <el-tooltip v-else :content="crontabValueObj.year" placement="top"><span>{{crontabValueObj.year}}</span></el-tooltip>
+                        </td>
+                        <td class="result">
+                            <span v-if="crontabValueString.length < 90">{{crontabValueString}}</span>
+                            <el-tooltip v-else :content="crontabValueString" placement="top"><span>{{crontabValueString}}</span></el-tooltip>
+                        </td>
+                    </tbody>
+                </table>
+            </div>
+            <CrontabResult :ex="crontabValueString"></CrontabResult>
+
+            <div class="pop_btn">
+                <el-button type="primary" @click="submitFill">确定</el-button>
+                <el-button type="warning" @click="clearCron">重置</el-button>
+                <el-button @click="hidePopup">取消</el-button>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import CrontabSecond from "./second.vue"
+import CrontabMin from "./min.vue"
+import CrontabHour from "./hour.vue"
+import CrontabDay from "./day.vue"
+import CrontabMonth from "./month.vue"
+import CrontabWeek from "./week.vue"
+import CrontabYear from "./year.vue"
+import CrontabResult from "./result.vue"
+const { proxy } = getCurrentInstance()
+const emit = defineEmits(['hide', 'fill'])
+const props = defineProps({
+    hideComponent: {
+        type: Array,
+        default: () => [],
+    },
+    expression: {
+        type: String,
+        default: ""
+    }
+})
+const tabTitles = ref(["秒", "分钟", "小时", "日", "月", "周", "年"])
+const tabActive = ref(0)
+const hideComponent = ref([])
+const expression = ref('')
+const crontabValueObj = ref({
+    second: "*",
+    min: "*",
+    hour: "*",
+    day: "*",
+    month: "*",
+    week: "?",
+    year: "",
+})
+const crontabValueString = computed(() => {
+    const obj = crontabValueObj.value
+    return obj.second
+        + " "
+        + obj.min
+        + " "
+        + obj.hour
+        + " "
+        + obj.day
+        + " "
+        + obj.month
+        + " "
+        + obj.week
+        + (obj.year === "" ? "" : " " + obj.year)
+})
+watch(expression, () => resolveExp())
+function shouldHide(key) {
+    return !(hideComponent.value && hideComponent.value.includes(key))
+}
+function resolveExp() {
+    // 反解析 表达式
+    if (expression.value) {
+        const arr = expression.value.split(/\s+/)
+        if (arr.length >= 6) {
+            //6 位以上是合法表达式
+            let obj = {
+                second: arr[0],
+                min: arr[1],
+                hour: arr[2],
+                day: arr[3],
+                month: arr[4],
+                week: arr[5],
+                year: arr[6] ? arr[6] : ""
+            }
+            crontabValueObj.value = {
+                ...obj,
+            }
+        }
+    } else {
+        // 没有传入的表达式 则还原
+        clearCron()
+    }
+}
+// tab切换值
+function tabCheck(index) {
+    tabActive.value = index
+}
+// 由子组件触发，更改表达式组成的字段值
+function updateCrontabValue(name, value, from) {
+    crontabValueObj.value[name] = value
+}
+// 表单选项的子组件校验数字格式（通过-props传递）
+function checkNumber(value, minLimit, maxLimit) {
+    // 检查必须为整数
+    value = Math.floor(value)
+    if (value < minLimit) {
+        value = minLimit
+    } else if (value > maxLimit) {
+        value = maxLimit
+    }
+    return value
+}
+// 隐藏弹窗
+function hidePopup() {
+    emit("hide")
+}
+// 填充表达式
+function submitFill() {
+    emit("fill", crontabValueString.value)
+    hidePopup()
+}
+function clearCron() {
+    // 还原选择项
+    crontabValueObj.value = {
+        second: "*",
+        min: "*",
+        hour: "*",
+        day: "*",
+        month: "*",
+        week: "?",
+        year: "",
+    }
+}
+onMounted(() => {
+    expression.value = props.expression
+    hideComponent.value = props.hideComponent
+})
+</script>
+
+<style lang="scss" scoped>
+.pop_btn {
+    text-align: center;
+    margin-top: 20px;
+}
+.popup-main {
+    position: relative;
+    margin: 10px auto;
+    border-radius: 5px;
+    font-size: 12px;
+    overflow: hidden;
+}
+.popup-title {
+    overflow: hidden;
+    line-height: 34px;
+    padding-top: 6px;
+    background: #f2f2f2;
+}
+.popup-result {
+    box-sizing: border-box;
+    line-height: 24px;
+    margin: 25px auto;
+    padding: 15px 10px 10px;
+    border: 1px solid #ccc;
+    position: relative;
+}
+.popup-result .title {
+    position: absolute;
+    top: -28px;
+    left: 50%;
+    width: 140px;
+    font-size: 14px;
+    margin-left: -70px;
+    text-align: center;
+    line-height: 30px;
+    background: #fff;
+}
+.popup-result table {
+    text-align: center;
+    width: 100%;
+    margin: 0 auto;
+}
+.popup-result table td:not(.result) {
+    width: 3.5rem;
+    min-width: 3.5rem;
+    max-width: 3.5rem;
+}
+.popup-result table span {
+    display: block;
+    width: 100%;
+    font-family: arial;
+    line-height: 30px;
+    height: 30px;
+    white-space: nowrap;
+    overflow: hidden;
+    border: 1px solid #e8e8e8;
+}
+.popup-result-scroll {
+    font-size: 12px;
+    line-height: 24px;
+    height: 10em;
+    overflow-y: auto;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Crontab/min.vue b/src/components/Crontab/min.vue
new file mode 100644
index 0000000..65f0946
--- /dev/null
+++ b/src/components/Crontab/min.vue
@@ -0,0 +1,126 @@
+<template>
+    <el-form>
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="1">
+                分钟，允许的通配符[, - * /]
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="2">
+                周期从
+                <el-input-number v-model='cycle01' :min="0" :max="58" /> -
+                <el-input-number v-model='cycle02' :min="cycle01 + 1" :max="59" /> 分钟
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="3">
+                从
+                <el-input-number v-model='average01' :min="0" :max="58" /> 分钟开始， 每
+                <el-input-number v-model='average02' :min="1" :max="59 - average01" /> 分钟执行一次
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="4">
+                指定
+                <el-select clearable v-model="checkboxList" placeholder="可多选" multiple :multiple-limit="10">
+                    <el-option v-for="item in 60" :key="item" :label="item - 1" :value="item - 1" />
+                </el-select>
+            </el-radio>
+        </el-form-item>
+    </el-form>
+</template>
+<script setup>
+const emit = defineEmits(['update'])
+const props = defineProps({
+    cron: {
+        type: Object,
+        default: {
+            second: "*",
+            min: "*",
+            hour: "*",
+            day: "*",
+            month: "*",
+            week: "?",
+            year: "",
+        }
+    },
+    check: {
+        type: Function,
+        default: () => {
+        }
+    }
+})
+const radioValue = ref(1)
+const cycle01 = ref(0)
+const cycle02 = ref(1)
+const average01 = ref(0)
+const average02 = ref(1)
+const checkboxList = ref([])
+const checkCopy = ref([0])
+const cycleTotal = computed(() => {
+    cycle01.value = props.check(cycle01.value, 0, 58)
+    cycle02.value = props.check(cycle02.value, cycle01.value + 1, 59)
+    return cycle01.value + '-' + cycle02.value
+})
+const averageTotal = computed(() => {
+    average01.value = props.check(average01.value, 0, 58)
+    average02.value = props.check(average02.value, 1, 59 - average01.value)
+    return average01.value + '/' + average02.value
+})
+const checkboxString = computed(() => {
+    return checkboxList.value.join(',')
+})
+watch(() => props.cron.min, value => changeRadioValue(value))
+watch([radioValue, cycleTotal, averageTotal, checkboxString], () => onRadioChange())
+function changeRadioValue(value) {
+    if (value === '*') {
+        radioValue.value = 1
+    } else if (value.indexOf('-') > -1) {
+        const indexArr = value.split('-')
+        cycle01.value = Number(indexArr[0])
+        cycle02.value = Number(indexArr[1])
+        radioValue.value = 2
+    } else if (value.indexOf('/') > -1) {
+        const indexArr = value.split('/')
+        average01.value = Number(indexArr[0])
+        average02.value = Number(indexArr[1])
+        radioValue.value = 3
+    } else {
+        checkboxList.value = [...new Set(value.split(',').map(item => Number(item)))]
+        radioValue.value = 4
+    }
+}
+function onRadioChange() {
+    switch (radioValue.value) {
+        case 1:
+            emit('update', 'min', '*', 'min')
+            break
+        case 2:
+            emit('update', 'min', cycleTotal.value, 'min')
+            break
+        case 3:
+            emit('update', 'min', averageTotal.value, 'min')
+            break
+        case 4:
+            if (checkboxList.value.length === 0) {
+                checkboxList.value.push(checkCopy.value[0])
+            } else {
+                checkCopy.value = checkboxList.value
+            }
+            emit('update', 'min', checkboxString.value, 'min')
+            break
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-input-number--small, .el-select, .el-select--small {
+    margin: 0 0.2rem;
+}
+.el-select, .el-select--small {
+    width: 19.8rem;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Crontab/month.vue b/src/components/Crontab/month.vue
new file mode 100644
index 0000000..e561ba4
--- /dev/null
+++ b/src/components/Crontab/month.vue
@@ -0,0 +1,141 @@
+<template>
+    <el-form>
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="1">
+                月，允许的通配符[, - * /]
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="2">
+                周期从
+                <el-input-number v-model='cycle01' :min="1" :max="11" /> -
+                <el-input-number v-model='cycle02' :min="cycle01 + 1" :max="12" /> 月
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="3">
+                从
+                <el-input-number v-model='average01' :min="1" :max="11" /> 月开始，每
+                <el-input-number v-model='average02' :min="1" :max="12 - average01" /> 月月执行一次
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="4">
+                指定
+                <el-select clearable v-model="checkboxList" placeholder="可多选" multiple :multiple-limit="8">
+                    <el-option v-for="item in monthList" :key="item.key" :label="item.value" :value="item.key" />
+                </el-select>
+            </el-radio>
+        </el-form-item>
+    </el-form>
+</template>
+
+<script setup>
+const emit = defineEmits(['update'])
+const props = defineProps({
+    cron: {
+        type: Object,
+        default: {
+            second: "*",
+            min: "*",
+            hour: "*",
+            day: "*",
+            month: "*",
+            week: "?",
+            year: "",
+        }
+    },
+    check: {
+        type: Function,
+        default: () => {
+        }
+    }
+})
+const radioValue = ref(1)
+const cycle01 = ref(1)
+const cycle02 = ref(2)
+const average01 = ref(1)
+const average02 = ref(1)
+const checkboxList = ref([])
+const checkCopy = ref([1])
+const monthList = ref([
+    {key: 1, value: '一月'},
+    {key: 2, value: '二月'},
+    {key: 3, value: '三月'},
+    {key: 4, value: '四月'},
+    {key: 5, value: '五月'},
+    {key: 6, value: '六月'},
+    {key: 7, value: '七月'},
+    {key: 8, value: '八月'},
+    {key: 9, value: '九月'},
+    {key: 10, value: '十月'},
+    {key: 11, value: '十一月'},
+    {key: 12, value: '十二月'}
+])
+const cycleTotal = computed(() => {
+    cycle01.value = props.check(cycle01.value, 1, 11)
+    cycle02.value = props.check(cycle02.value, cycle01.value + 1, 12)
+    return cycle01.value + '-' + cycle02.value
+})
+const averageTotal = computed(() => {
+    average01.value = props.check(average01.value, 1, 11)
+    average02.value = props.check(average02.value, 1, 12 - average01.value)
+    return average01.value + '/' + average02.value
+})
+const checkboxString = computed(() => {
+    return checkboxList.value.join(',')
+})
+watch(() => props.cron.month, value => changeRadioValue(value))
+watch([radioValue, cycleTotal, averageTotal, checkboxString], () => onRadioChange())
+function changeRadioValue(value) {
+    if (value === '*') {
+        radioValue.value = 1
+    } else if (value.indexOf('-') > -1) {
+        const indexArr = value.split('-')
+        cycle01.value = Number(indexArr[0])
+        cycle02.value = Number(indexArr[1])
+        radioValue.value = 2
+    } else if (value.indexOf('/') > -1) {
+        const indexArr = value.split('/')
+        average01.value = Number(indexArr[0])
+        average02.value = Number(indexArr[1])
+        radioValue.value = 3
+    } else {
+        checkboxList.value = [...new Set(value.split(',').map(item => Number(item)))]
+        radioValue.value = 4
+    }
+}
+function onRadioChange() {
+    switch (radioValue.value) {
+        case 1:
+            emit('update', 'month', '*', 'month')
+            break
+        case 2:
+            emit('update', 'month', cycleTotal.value, 'month')
+            break
+        case 3:
+            emit('update', 'month', averageTotal.value, 'month')
+            break
+        case 4:
+            if (checkboxList.value.length === 0) {
+                checkboxList.value.push(checkCopy.value[0])
+            } else {
+                checkCopy.value = checkboxList.value
+            }
+            emit('update', 'month', checkboxString.value, 'month')
+            break
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-input-number--small, .el-select, .el-select--small {
+    margin: 0 0.2rem;
+}
+.el-select, .el-select--small {
+    width: 18.8rem;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Crontab/result.vue b/src/components/Crontab/result.vue
new file mode 100644
index 0000000..5a812ee
--- /dev/null
+++ b/src/components/Crontab/result.vue
@@ -0,0 +1,540 @@
+<template>
+	<div class="popup-result">
+		<p class="title">最近5次运行时间</p>
+		<ul class="popup-result-scroll">
+			<template v-if='isShow'>
+				<li v-for='item in resultList' :key="item">{{item}}</li>
+			</template>
+			<li v-else>计算结果中...</li>
+		</ul>
+	</div>
+</template>
+
+<script setup>
+const props = defineProps({
+    ex: {
+        type: String,
+        default: ''
+    }
+})
+const dayRule = ref('')
+const dayRuleSup = ref('')
+const dateArr = ref([])
+const resultList = ref([])
+const isShow = ref(false)
+watch(() => props.ex, () => expressionChange())
+// 表达式值变化时，开始去计算结果
+function expressionChange() {
+    // 计算开始-隐藏结果
+    isShow.value = false;
+    // 获取规则数组[0秒、1分、2时、3日、4月、5星期、6年]
+    let ruleArr = props.ex.split(' ');
+    // 用于记录进入循环的次数
+    let nums = 0;
+    // 用于暂时存符号时间规则结果的数组
+    let resultArr = [];
+    // 获取当前时间精确至[年、月、日、时、分、秒]
+    let nTime = new Date();
+    let nYear = nTime.getFullYear();
+    let nMonth = nTime.getMonth() + 1;
+    let nDay = nTime.getDate();
+    let nHour = nTime.getHours();
+    let nMin = nTime.getMinutes();
+    let nSecond = nTime.getSeconds();
+    // 根据规则获取到近100年可能年数组、月数组等等
+    getSecondArr(ruleArr[0]);
+    getMinArr(ruleArr[1]);
+    getHourArr(ruleArr[2]);
+    getDayArr(ruleArr[3]);
+    getMonthArr(ruleArr[4]);
+    getWeekArr(ruleArr[5]);
+    getYearArr(ruleArr[6], nYear);
+    // 将获取到的数组赋值-方便使用
+    let sDate = dateArr.value[0];
+    let mDate = dateArr.value[1];
+    let hDate = dateArr.value[2];
+    let DDate = dateArr.value[3];
+    let MDate = dateArr.value[4];
+    let YDate = dateArr.value[5];
+    // 获取当前时间在数组中的索引
+    let sIdx = getIndex(sDate, nSecond);
+    let mIdx = getIndex(mDate, nMin);
+    let hIdx = getIndex(hDate, nHour);
+    let DIdx = getIndex(DDate, nDay);
+    let MIdx = getIndex(MDate, nMonth);
+    let YIdx = getIndex(YDate, nYear);
+    // 重置月日时分秒的函数(后面用的比较多)
+    const resetSecond = function () {
+        sIdx = 0;
+        nSecond = sDate[sIdx]
+    }
+    const resetMin = function () {
+        mIdx = 0;
+        nMin = mDate[mIdx]
+        resetSecond();
+    }
+    const resetHour = function () {
+        hIdx = 0;
+        nHour = hDate[hIdx]
+        resetMin();
+    }
+    const resetDay = function () {
+        DIdx = 0;
+        nDay = DDate[DIdx]
+        resetHour();
+    }
+    const resetMonth = function () {
+        MIdx = 0;
+        nMonth = MDate[MIdx]
+        resetDay();
+    }
+    // 如果当前年份不为数组中当前值
+    if (nYear !== YDate[YIdx]) {
+        resetMonth();
+    }
+    // 如果当前月份不为数组中当前值
+    if (nMonth !== MDate[MIdx]) {
+        resetDay();
+    }
+    // 如果当前“日”不为数组中当前值
+    if (nDay !== DDate[DIdx]) {
+        resetHour();
+    }
+    // 如果当前“时”不为数组中当前值
+    if (nHour !== hDate[hIdx]) {
+        resetMin();
+    }
+    // 如果当前“分”不为数组中当前值
+    if (nMin !== mDate[mIdx]) {
+        resetSecond();
+    }
+    // 循环年份数组
+    goYear: for (let Yi = YIdx; Yi < YDate.length; Yi++) {
+        let YY = YDate[Yi];
+        // 如果到达最大值时
+        if (nMonth > MDate[MDate.length - 1]) {
+            resetMonth();
+            continue;
+        }
+        // 循环月份数组
+        goMonth: for (let Mi = MIdx; Mi < MDate.length; Mi++) {
+            // 赋值、方便后面运算
+            let MM = MDate[Mi];
+            MM = MM < 10 ? '0' + MM : MM;
+            // 如果到达最大值时
+            if (nDay > DDate[DDate.length - 1]) {
+                resetDay();
+                if (Mi === MDate.length - 1) {
+                    resetMonth();
+                    continue goYear;
+                }
+                continue;
+            }
+            // 循环日期数组
+            goDay: for (let Di = DIdx; Di < DDate.length; Di++) {
+                // 赋值、方便后面运算
+                let DD = DDate[Di];
+                let thisDD = DD < 10 ? '0' + DD : DD;
+                // 如果到达最大值时
+                if (nHour > hDate[hDate.length - 1]) {
+                    resetHour();
+                    if (Di === DDate.length - 1) {
+                        resetDay();
+                        if (Mi === MDate.length - 1) {
+                            resetMonth();
+                            continue goYear;
+                        }
+                        continue goMonth;
+                    }
+                    continue;
+                }
+                // 判断日期的合法性，不合法的话也是跳出当前循环
+                if (checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true && dayRule.value !== 'workDay' && dayRule.value !== 'lastWeek' && dayRule.value !== 'lastDay') {
+                    resetDay();
+                    continue goMonth;
+                }
+                // 如果日期规则中有值时
+                if (dayRule.value === 'lastDay') {
+                    // 如果不是合法日期则需要将前将日期调到合法日期即月末最后一天
+                    if (checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true) {
+                        while (DD > 0 && checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true) {
+                            DD--;
+                            thisDD = DD < 10 ? '0' + DD : DD;
+                        }
+                    }
+                } else if (dayRule.value === 'workDay') {
+                    // 校验并调整如果是2月30号这种日期传进来时需调整至正常月底
+                    if (checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true) {
+                        while (DD > 0 && checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true) {
+                            DD--;
+                            thisDD = DD < 10 ? '0' + DD : DD;
+                        }
+                    }
+                    // 获取达到条件的日期是星期X
+                    let thisWeek = formatDate(new Date(YY + '-' + MM + '-' + thisDD + ' 00:00:00'), 'week');
+                    // 当星期日时
+                    if (thisWeek === 1) {
+                        // 先找下一个日，并判断是否为月底
+                        DD++;
+                        thisDD = DD < 10 ? '0' + DD : DD;
+                        // 判断下一日已经不是合法日期
+                        if (checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true) {
+                            DD -= 3;
+                        }
+                    } else if (thisWeek === 7) {
+                        // 当星期6时只需判断不是1号就可进行操作
+                        if (dayRuleSup.value !== 1) {
+                            DD--;
+                        } else {
+                            DD += 2;
+                        }
+                    }
+                } else if (dayRule.value === 'weekDay') {
+                    // 如果指定了是星期几
+                    // 获取当前日期是属于星期几
+                    let thisWeek = formatDate(new Date(YY + '-' + MM + '-' + DD + ' 00:00:00'), 'week');
+                    // 校验当前星期是否在星期池（dayRuleSup）中
+                    if (dayRuleSup.value.indexOf(thisWeek) < 0) {
+                        // 如果到达最大值时
+                        if (Di === DDate.length - 1) {
+                            resetDay();
+                            if (Mi === MDate.length - 1) {
+                                resetMonth();
+                                continue goYear;
+                            }
+                            continue goMonth;
+                        }
+                        continue;
+                    }
+                } else if (dayRule.value === 'assWeek') {
+                    // 如果指定了是第几周的星期几
+                    // 获取每月1号是属于星期几
+                    let thisWeek = formatDate(new Date(YY + '-' + MM + '-' + DD + ' 00:00:00'), 'week');
+                    if (dayRuleSup.value[1] >= thisWeek) {
+                        DD = (dayRuleSup.value[0] - 1) * 7 + dayRuleSup.value[1] - thisWeek + 1;
+                    } else {
+                        DD = dayRuleSup.value[0] * 7 + dayRuleSup.value[1] - thisWeek + 1;
+                    }
+                } else if (dayRule.value === 'lastWeek') {
+                    // 如果指定了每月最后一个星期几
+                    // 校验并调整如果是2月30号这种日期传进来时需调整至正常月底
+                    if (checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true) {
+                        while (DD > 0 && checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true) {
+                            DD--;
+                            thisDD = DD < 10 ? '0' + DD : DD;
+                        }
+                    }
+                    // 获取月末最后一天是星期几
+                    let thisWeek = formatDate(new Date(YY + '-' + MM + '-' + thisDD + ' 00:00:00'), 'week');
+                    // 找到要求中最近的那个星期几
+                    if (dayRuleSup.value < thisWeek) {
+                        DD -= thisWeek - dayRuleSup.value;
+                    } else if (dayRuleSup.value > thisWeek) {
+                        DD -= 7 - (dayRuleSup.value - thisWeek)
+                    }
+                }
+                // 判断时间值是否小于10置换成“05”这种格式
+                DD = DD < 10 ? '0' + DD : DD;
+                // 循环“时”数组
+                goHour: for (let hi = hIdx; hi < hDate.length; hi++) {
+                    let hh = hDate[hi] < 10 ? '0' + hDate[hi] : hDate[hi]
+                    // 如果到达最大值时
+                    if (nMin > mDate[mDate.length - 1]) {
+                        resetMin();
+                        if (hi === hDate.length - 1) {
+                            resetHour();
+                            if (Di === DDate.length - 1) {
+                                resetDay();
+                                if (Mi === MDate.length - 1) {
+                                    resetMonth();
+                                    continue goYear;
+                                }
+                                continue goMonth;
+                            }
+                            continue goDay;
+                        }
+                        continue;
+                    }
+                    // 循环"分"数组
+                    goMin: for (let mi = mIdx; mi < mDate.length; mi++) {
+                        let mm = mDate[mi] < 10 ? '0' + mDate[mi] : mDate[mi];
+                        // 如果到达最大值时
+                        if (nSecond > sDate[sDate.length - 1]) {
+                            resetSecond();
+                            if (mi === mDate.length - 1) {
+                                resetMin();
+                                if (hi === hDate.length - 1) {
+                                    resetHour();
+                                    if (Di === DDate.length - 1) {
+                                        resetDay();
+                                        if (Mi === MDate.length - 1) {
+                                            resetMonth();
+                                            continue goYear;
+                                        }
+                                        continue goMonth;
+                                    }
+                                    continue goDay;
+                                }
+                                continue goHour;
+                            }
+                            continue;
+                        }
+                        // 循环"秒"数组
+                        goSecond: for (let si = sIdx; si <= sDate.length - 1; si++) {
+                            let ss = sDate[si] < 10 ? '0' + sDate[si] : sDate[si];
+                            // 添加当前时间（时间合法性在日期循环时已经判断）
+                            if (MM !== '00' && DD !== '00') {
+                                resultArr.push(YY + '-' + MM + '-' + DD + ' ' + hh + ':' + mm + ':' + ss)
+                                nums++;
+                            }
+                            // 如果条数满了就退出循环
+                            if (nums === 5) break goYear;
+                            // 如果到达最大值时
+                            if (si === sDate.length - 1) {
+                                resetSecond();
+                                if (mi === mDate.length - 1) {
+                                    resetMin();
+                                    if (hi === hDate.length - 1) {
+                                        resetHour();
+                                        if (Di === DDate.length - 1) {
+                                            resetDay();
+                                            if (Mi === MDate.length - 1) {
+                                                resetMonth();
+                                                continue goYear;
+                                            }
+                                            continue goMonth;
+                                        }
+                                        continue goDay;
+                                    }
+                                    continue goHour;
+                                }
+                                continue goMin;
+                            }
+                        } //goSecond
+                    } //goMin
+                }//goHour
+            }//goDay
+        }//goMonth
+    }
+    // 判断100年内的结果条数
+    if (resultArr.length === 0) {
+        resultList.value = ['没有达到条件的结果！'];
+    } else {
+        resultList.value = resultArr;
+        if (resultArr.length !== 5) {
+            resultList.value.push('最近100年内只有上面' + resultArr.length + '条结果！')
+        }
+    }
+    // 计算完成-显示结果
+    isShow.value = true;
+}
+// 用于计算某位数字在数组中的索引
+function getIndex(arr, value) {
+    if (value <= arr[0] || value > arr[arr.length - 1]) {
+        return 0;
+    } else {
+        for (let i = 0; i < arr.length - 1; i++) {
+            if (value > arr[i] && value <= arr[i + 1]) {
+                return i + 1;
+            }
+        }
+    }
+}
+// 获取"年"数组
+function getYearArr(rule, year) {
+    dateArr.value[5] = getOrderArr(year, year + 100);
+    if (rule !== undefined) {
+        if (rule.indexOf('-') >= 0) {
+            dateArr.value[5] = getCycleArr(rule, year + 100, false)
+        } else if (rule.indexOf('/') >= 0) {
+            dateArr.value[5] = getAverageArr(rule, year + 100)
+        } else if (rule !== '*') {
+            dateArr.value[5] = getAssignArr(rule)
+        }
+    }
+}
+// 获取"月"数组
+function getMonthArr(rule) {
+    dateArr.value[4] = getOrderArr(1, 12);
+    if (rule.indexOf('-') >= 0) {
+        dateArr.value[4] = getCycleArr(rule, 12, false)
+    } else if (rule.indexOf('/') >= 0) {
+        dateArr.value[4] = getAverageArr(rule, 12)
+    } else if (rule !== '*') {
+        dateArr.value[4] = getAssignArr(rule)
+    }
+}
+// 获取"日"数组-主要为日期规则
+function getWeekArr(rule) {
+    // 只有当日期规则的两个值均为“”时则表达日期是有选项的
+    if (dayRule.value === '' && dayRuleSup.value === '') {
+        if (rule.indexOf('-') >= 0) {
+            dayRule.value = 'weekDay';
+            dayRuleSup.value = getCycleArr(rule, 7, false)
+        } else if (rule.indexOf('#') >= 0) {
+            dayRule.value = 'assWeek';
+            let matchRule = rule.match(/[0-9]{1}/g);
+            dayRuleSup.value = [Number(matchRule[1]), Number(matchRule[0])];
+            dateArr.value[3] = [1];
+            if (dayRuleSup.value[1] === 7) {
+                dayRuleSup.value[1] = 0;
+            }
+        } else if (rule.indexOf('L') >= 0) {
+            dayRule.value = 'lastWeek';
+            dayRuleSup.value = Number(rule.match(/[0-9]{1,2}/g)[0]);
+            dateArr.value[3] = [31];
+            if (dayRuleSup.value === 7) {
+                dayRuleSup.value = 0;
+            }
+        } else if (rule !== '*' && rule !== '?') {
+            dayRule.value = 'weekDay';
+            dayRuleSup.value = getAssignArr(rule)
+        }
+    }
+}
+// 获取"日"数组-少量为日期规则
+function getDayArr(rule) {
+    dateArr.value[3] = getOrderArr(1, 31);
+    dayRule.value = '';
+    dayRuleSup.value = '';
+    if (rule.indexOf('-') >= 0) {
+        dateArr.value[3] = getCycleArr(rule, 31, false)
+        dayRuleSup.value = 'null';
+    } else if (rule.indexOf('/') >= 0) {
+        dateArr.value[3] = getAverageArr(rule, 31)
+        dayRuleSup.value = 'null';
+    } else if (rule.indexOf('W') >= 0) {
+        dayRule.value = 'workDay';
+        dayRuleSup.value = Number(rule.match(/[0-9]{1,2}/g)[0]);
+        dateArr.value[3] = [dayRuleSup.value];
+    } else if (rule.indexOf('L') >= 0) {
+        dayRule.value = 'lastDay';
+        dayRuleSup.value = 'null';
+        dateArr.value[3] = [31];
+    } else if (rule !== '*' && rule !== '?') {
+        dateArr.value[3] = getAssignArr(rule)
+        dayRuleSup.value = 'null';
+    } else if (rule === '*') {
+        dayRuleSup.value = 'null';
+    }
+}
+// 获取"时"数组
+function getHourArr(rule) {
+    dateArr.value[2] = getOrderArr(0, 23);
+    if (rule.indexOf('-') >= 0) {
+        dateArr.value[2] = getCycleArr(rule, 24, true)
+    } else if (rule.indexOf('/') >= 0) {
+        dateArr.value[2] = getAverageArr(rule, 23)
+    } else if (rule !== '*') {
+        dateArr.value[2] = getAssignArr(rule)
+    }
+}
+// 获取"分"数组
+function getMinArr(rule) {
+    dateArr.value[1] = getOrderArr(0, 59);
+    if (rule.indexOf('-') >= 0) {
+        dateArr.value[1] = getCycleArr(rule, 60, true)
+    } else if (rule.indexOf('/') >= 0) {
+        dateArr.value[1] = getAverageArr(rule, 59)
+    } else if (rule !== '*') {
+        dateArr.value[1] = getAssignArr(rule)
+    }
+}
+// 获取"秒"数组
+function getSecondArr(rule) {
+    dateArr.value[0] = getOrderArr(0, 59);
+    if (rule.indexOf('-') >= 0) {
+        dateArr.value[0] = getCycleArr(rule, 60, true)
+    } else if (rule.indexOf('/') >= 0) {
+        dateArr.value[0] = getAverageArr(rule, 59)
+    } else if (rule !== '*') {
+        dateArr.value[0] = getAssignArr(rule)
+    }
+}
+// 根据传进来的min-max返回一个顺序的数组
+function getOrderArr(min, max) {
+    let arr = [];
+    for (let i = min; i <= max; i++) {
+        arr.push(i);
+    }
+    return arr;
+}
+// 根据规则中指定的零散值返回一个数组
+function getAssignArr(rule) {
+    let arr = [];
+    let assiginArr = rule.split(',');
+    for (let i = 0; i < assiginArr.length; i++) {
+        arr[i] = Number(assiginArr[i])
+    }
+    arr.sort(compare)
+    return arr;
+}
+// 根据一定算术规则计算返回一个数组
+function getAverageArr(rule, limit) {
+    let arr = [];
+    let agArr = rule.split('/');
+    let min = Number(agArr[0]);
+    let step = Number(agArr[1]);
+    while (min <= limit) {
+        arr.push(min);
+        min += step;
+    }
+    return arr;
+}
+// 根据规则返回一个具有周期性的数组
+function getCycleArr(rule, limit, status) {
+    // status--表示是否从0开始（则从1开始）
+    let arr = [];
+    let cycleArr = rule.split('-');
+    let min = Number(cycleArr[0]);
+    let max = Number(cycleArr[1]);
+    if (min > max) {
+        max += limit;
+    }
+    for (let i = min; i <= max; i++) {
+        let add = 0;
+        if (status === false && i % limit === 0) {
+            add = limit;
+        }
+        arr.push(Math.round(i % limit + add))
+    }
+    arr.sort(compare)
+    return arr;
+}
+// 比较数字大小（用于Array.sort）
+function compare(value1, value2) {
+    if (value2 - value1 > 0) {
+        return -1;
+    } else {
+        return 1;
+    }
+}
+// 格式化日期格式如：2017-9-19 18:04:33
+function formatDate(value, type) {
+    // 计算日期相关值
+    let time = typeof value == 'number' ? new Date(value) : value;
+    let Y = time.getFullYear();
+    let M = time.getMonth() + 1;
+    let D = time.getDate();
+    let h = time.getHours();
+    let m = time.getMinutes();
+    let s = time.getSeconds();
+    let week = time.getDay();
+    // 如果传递了type的话
+    if (type === undefined) {
+        return Y + '-' + (M < 10 ? '0' + M : M) + '-' + (D < 10 ? '0' + D : D) + ' ' + (h < 10 ? '0' + h : h) + ':' + (m < 10 ? '0' + m : m) + ':' + (s < 10 ? '0' + s : s);
+    } else if (type === 'week') {
+        // 在quartz中 1为星期日
+        return week + 1;
+    }
+}
+// 检查日期是否存在
+function checkDate(value) {
+    let time = new Date(value);
+    let format = formatDate(time)
+    return value === format;
+}
+onMounted(() => {
+    expressionChange()
+})
+</script>
\ No newline at end of file
diff --git a/src/components/Crontab/second.vue b/src/components/Crontab/second.vue
new file mode 100644
index 0000000..15e47a0
--- /dev/null
+++ b/src/components/Crontab/second.vue
@@ -0,0 +1,128 @@
+<template>
+    <el-form>
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="1">
+                秒，允许的通配符[, - * /]
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="2">
+                周期从
+                <el-input-number v-model='cycle01' :min="0" :max="58" /> -
+                <el-input-number v-model='cycle02' :min="cycle01 + 1" :max="59" /> 秒
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="3">
+                从
+                <el-input-number v-model='average01' :min="0" :max="58" /> 秒开始，每
+                <el-input-number v-model='average02' :min="1" :max="59 - average01" /> 秒执行一次
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="4">
+                指定
+                <el-select clearable v-model="checkboxList" placeholder="可多选" multiple :multiple-limit="10">
+                    <el-option v-for="item in 60" :key="item" :label="item - 1" :value="item - 1" />
+                </el-select>
+            </el-radio>
+        </el-form-item>
+    </el-form>
+</template>
+
+<script setup>
+const emit = defineEmits(['update'])
+const props = defineProps({
+    cron: {
+        type: Object,
+        default: {
+            second: "*",
+            min: "*",
+            hour: "*",
+            day: "*",
+            month: "*",
+            week: "?",
+            year: "",
+        }
+    },
+    check: {
+        type: Function,
+        default: () => {
+        }
+    }
+})
+const radioValue = ref(1)
+const cycle01 = ref(0)
+const cycle02 = ref(1)
+const average01 = ref(0)
+const average02 = ref(1)
+const checkboxList = ref([])
+const checkCopy = ref([0])
+const cycleTotal = computed(() => {
+    cycle01.value = props.check(cycle01.value, 0, 58)
+    cycle02.value = props.check(cycle02.value, cycle01.value + 1, 59)
+    return cycle01.value + '-' + cycle02.value
+})
+const averageTotal = computed(() => {
+    average01.value = props.check(average01.value, 0, 58)
+    average02.value = props.check(average02.value, 1, 59 - average01.value)
+    return average01.value + '/' + average02.value
+})
+const checkboxString = computed(() => {
+    return checkboxList.value.join(',')
+})
+watch(() => props.cron.second, value => changeRadioValue(value))
+watch([radioValue, cycleTotal, averageTotal, checkboxString], () => onRadioChange())
+function changeRadioValue(value) {
+    if (value === '*') {
+        radioValue.value = 1
+    } else if (value.indexOf('-') > -1) {
+        const indexArr = value.split('-')
+        cycle01.value = Number(indexArr[0])
+        cycle02.value = Number(indexArr[1])
+        radioValue.value = 2
+    } else if (value.indexOf('/') > -1) {
+        const indexArr = value.split('/')
+        average01.value = Number(indexArr[0])
+        average02.value = Number(indexArr[1])
+        radioValue.value = 3
+    } else {
+        checkboxList.value = [...new Set(value.split(',').map(item => Number(item)))]
+        radioValue.value = 4
+    }
+}
+// 单选按钮值变化时
+function onRadioChange() {
+    switch (radioValue.value) {
+        case 1:
+            emit('update', 'second', '*', 'second')
+            break
+        case 2:
+            emit('update', 'second', cycleTotal.value, 'second')
+            break
+        case 3:
+            emit('update', 'second', averageTotal.value, 'second')
+            break
+        case 4:
+            if (checkboxList.value.length === 0) {
+                checkboxList.value.push(checkCopy.value[0])
+            } else {
+                checkCopy.value = checkboxList.value
+            }
+            emit('update', 'second', checkboxString.value, 'second')
+            break
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-input-number--small, .el-select, .el-select--small {
+    margin: 0 0.2rem;
+}
+.el-select, .el-select--small {
+    width: 18.8rem;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Crontab/week.vue b/src/components/Crontab/week.vue
new file mode 100644
index 0000000..e59da22
--- /dev/null
+++ b/src/components/Crontab/week.vue
@@ -0,0 +1,197 @@
+<template>
+    <el-form>
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="1">
+                周，允许的通配符[, - * ? / L #]
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="2">
+                不指定
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="3">
+                周期从
+                <el-select clearable v-model="cycle01">
+                    <el-option
+                        v-for="(item,index) of weekList"
+                        :key="index"
+                        :label="item.value"
+                        :value="item.key"
+                        :disabled="item.key === 7"
+                    >{{item.value}}</el-option>
+                </el-select>
+                -
+                <el-select clearable v-model="cycle02">
+                    <el-option
+                        v-for="(item,index) of weekList"
+                        :key="index"
+                        :label="item.value"
+                        :value="item.key"
+                        :disabled="item.key <= cycle01"
+                    >{{item.value}}</el-option>
+                </el-select>
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="4">
+                第
+                <el-input-number v-model='average01' :min="1" :max="4" /> 周的
+                <el-select clearable v-model="average02">
+                    <el-option v-for="item in weekList" :key="item.key" :label="item.value" :value="item.key" />
+                </el-select>
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="5">
+                本月最后一个
+                <el-select clearable v-model="weekday">
+                    <el-option v-for="item in weekList" :key="item.key" :label="item.value" :value="item.key" />
+                </el-select>
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio v-model='radioValue' :value="6">
+                指定
+                <el-select class="multiselect" clearable v-model="checkboxList" placeholder="可多选" multiple :multiple-limit="6">
+                    <el-option v-for="item in weekList" :key="item.key" :label="item.value" :value="item.key" />
+                </el-select>
+            </el-radio>
+        </el-form-item>
+
+    </el-form>
+</template>
+
+<script setup>
+const emit = defineEmits(['update'])
+const props = defineProps({
+    cron: {
+        type: Object,
+        default: {
+            second: "*",
+            min: "*",
+            hour: "*",
+            day: "*",
+            month: "*",
+            week: "?",
+            year: ""
+        }
+    },
+    check: {
+        type: Function,
+        default: () => {
+        }
+    }
+})
+const radioValue = ref(2)
+const cycle01 = ref(2)
+const cycle02 = ref(3)
+const average01 = ref(1)
+const average02 = ref(2)
+const weekday = ref(2)
+const checkboxList = ref([])
+const checkCopy = ref([2])
+const weekList = ref([
+    {key: 1, value: '星期日'},
+    {key: 2, value: '星期一'},
+    {key: 3, value: '星期二'},
+    {key: 4, value: '星期三'},
+    {key: 5, value: '星期四'},
+    {key: 6, value: '星期五'},
+    {key: 7, value: '星期六'}
+])
+const cycleTotal = computed(() => {
+    cycle01.value = props.check(cycle01.value, 1, 6)
+    cycle02.value = props.check(cycle02.value, cycle01.value + 1, 7)
+    return cycle01.value + '-' + cycle02.value
+})
+const averageTotal = computed(() => {
+    average01.value = props.check(average01.value, 1, 4)
+    average02.value = props.check(average02.value, 1, 7)
+    return average02.value + '#' + average01.value
+})
+const weekdayTotal = computed(() => {
+    weekday.value = props.check(weekday.value, 1, 7)
+    return weekday.value + 'L'
+})
+const checkboxString = computed(() => {
+    return checkboxList.value.join(',')
+})
+watch(() => props.cron.week, value => changeRadioValue(value))
+watch([radioValue, cycleTotal, averageTotal, weekdayTotal, checkboxString], () => onRadioChange())
+function changeRadioValue(value) {
+    if (value === "*") {
+        radioValue.value = 1
+    } else if (value === "?") {
+        radioValue.value = 2
+    } else if (value.indexOf("-") > -1) {
+        const indexArr = value.split('-')
+        cycle01.value = Number(indexArr[0])
+        cycle02.value = Number(indexArr[1])
+        radioValue.value = 3
+    } else if (value.indexOf("#") > -1) {
+        const indexArr = value.split('#')
+        average01.value = Number(indexArr[1])
+        average02.value = Number(indexArr[0])
+        radioValue.value = 4
+    } else if (value.indexOf("L") > -1) {
+        const indexArr = value.split("L")
+        weekday.value = Number(indexArr[0])
+        radioValue.value = 5
+    } else {
+        checkboxList.value = [...new Set(value.split(',').map(item => Number(item)))]
+        radioValue.value = 6
+    }
+}
+function onRadioChange() {
+    if (radioValue.value === 2 && props.cron.day === '?') {
+        emit('update', 'day', '*', 'week')
+    }
+    if (radioValue.value !== 2 && props.cron.day !== '?') {
+        emit('update', 'day', '?', 'week')
+    }
+    switch (radioValue.value) {
+        case 1:
+            emit('update', 'week', '*', 'week')
+            break
+        case 2:
+            emit('update', 'week', '?', 'week')
+            break
+        case 3:
+            emit('update', 'week', cycleTotal.value, 'week')
+            break
+        case 4:
+            emit('update', 'week', averageTotal.value, 'week')
+            break
+        case 5:
+            emit('update', 'week', weekdayTotal.value, 'week')
+            break
+        case 6:
+            if (checkboxList.value.length === 0) {
+                checkboxList.value.push(checkCopy.value[0])
+            } else {
+                checkCopy.value = checkboxList.value
+            }
+            emit('update', 'week', checkboxString.value, 'week')
+            break
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-input-number--small, .el-select, .el-select--small {
+    margin: 0 0.5rem;
+}
+.el-select, .el-select--small {
+    width: 8rem;
+}
+.el-select.multiselect, .el-select--small.multiselect {
+    width: 17.8rem;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Crontab/year.vue b/src/components/Crontab/year.vue
new file mode 100644
index 0000000..fa921ae
--- /dev/null
+++ b/src/components/Crontab/year.vue
@@ -0,0 +1,149 @@
+<template>
+    <el-form>
+        <el-form-item>
+            <el-radio :value="1" v-model='radioValue'>
+                不填，允许的通配符[, - * /]
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio :value="2" v-model='radioValue'>
+                每年
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio :value="3" v-model='radioValue'>
+                周期从
+                <el-input-number v-model='cycle01' :min='fullYear' :max="2098"/> -
+                <el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : fullYear + 1" :max="2099"/>
+            </el-radio>
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio :value="4" v-model='radioValue'>
+                从
+                <el-input-number v-model='average01' :min='fullYear' :max="2098"/> 年开始，每
+                <el-input-number v-model='average02' :min="1" :max="2099 - average01 || fullYear"/> 年执行一次
+            </el-radio>
+
+        </el-form-item>
+
+        <el-form-item>
+            <el-radio :value="5" v-model='radioValue'>
+                指定
+                <el-select clearable v-model="checkboxList" placeholder="可多选" multiple :multiple-limit="8">
+                    <el-option v-for="item in 9" :key="item" :value="item - 1 + fullYear" :label="item -1 + fullYear" />
+                </el-select>
+            </el-radio>
+        </el-form-item>
+    </el-form>
+</template>
+
+<script setup>
+const emit = defineEmits(['update'])
+const props = defineProps({
+    cron: {
+        type: Object,
+        default: {
+            second: "*",
+            min: "*",
+            hour: "*",
+            day: "*",
+            month: "*",
+            week: "?",
+            year: ""
+        }
+    },
+    check: {
+        type: Function,
+        default: () => {
+        }
+    }
+})
+const fullYear = ref(0)
+const maxFullYear = ref(0)
+const radioValue = ref(1)
+const cycle01 = ref(0)
+const cycle02 = ref(0)
+const average01 = ref(0)
+const average02 = ref(1)
+const checkboxList = ref([])
+const checkCopy = ref([])
+const cycleTotal = computed(() => {
+    cycle01.value = props.check(cycle01.value, fullYear.value, maxFullYear.value - 1)
+    cycle02.value = props.check(cycle02.value, cycle01.value + 1, maxFullYear.value)
+    return cycle01.value + '-' + cycle02.value
+})
+const averageTotal = computed(() => {
+    average01.value = props.check(average01.value, fullYear.value, maxFullYear.value - 1)
+    average02.value = props.check(average02.value, 1, 10)
+    return average01.value + '/' + average02.value
+})
+const checkboxString = computed(() => {
+    return checkboxList.value.join(',')
+})
+watch(() => props.cron.year, value => changeRadioValue(value))
+watch([radioValue, cycleTotal, averageTotal, checkboxString], () => onRadioChange())
+function changeRadioValue(value) {
+    if (value === '') {
+        radioValue.value = 1
+    } else if (value === "*") {
+        radioValue.value = 2
+    } else if (value.indexOf("-") > -1) {
+        const indexArr = value.split('-')
+        cycle01.value = Number(indexArr[0])
+        cycle02.value = Number(indexArr[1])
+        radioValue.value = 3
+    } else if (value.indexOf("/") > -1) {
+        const indexArr = value.split('/')
+        average01.value = Number(indexArr[1])
+        average02.value = Number(indexArr[0])
+        radioValue.value = 4
+    } else {
+        checkboxList.value = [...new Set(value.split(',').map(item => Number(item)))]
+        radioValue.value = 5
+    }
+}
+function onRadioChange() {
+    switch (radioValue.value) {
+        case 1:
+            emit('update', 'year', '', 'year')
+            break
+        case 2:
+            emit('update', 'year', '*', 'year')
+            break
+        case 3:
+            emit('update', 'year', cycleTotal.value, 'year')
+            break
+        case 4:
+            emit('update', 'year', averageTotal.value, 'year')
+            break
+        case 5:
+            if (checkboxList.value.length === 0) {
+                checkboxList.value.push(checkCopy.value[0])
+            } else {
+                checkCopy.value = checkboxList.value
+            }
+            emit('update', 'year', checkboxString.value, 'year')
+            break
+    }
+}
+onMounted(() => {
+    fullYear.value = Number(new Date().getFullYear())
+    maxFullYear.value = fullYear.value + 10
+    cycle01.value = fullYear.value
+    cycle02.value = cycle01.value + 1
+    average01.value = fullYear.value
+    checkCopy.value = [fullYear.value]
+})
+</script>
+
+<style lang="scss" scoped>
+.el-input-number--small, .el-select, .el-select--small {
+    margin: 0 0.2rem;
+}
+.el-select, .el-select--small {
+    width: 18.8rem;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/DictTag/index.vue b/src/components/DictTag/index.vue
new file mode 100644
index 0000000..19e24e4
--- /dev/null
+++ b/src/components/DictTag/index.vue
@@ -0,0 +1,82 @@
+<template>
+  <div>
+    <template v-for="(item, index) in options">
+      <template v-if="values.includes(item.value)">
+        <span
+          v-if="(item.elTagType == 'default' || item.elTagType == '') && (item.elTagClass == '' || item.elTagClass == null)"
+          :key="item.value"
+          :index="index"
+          :class="item.elTagClass"
+        >{{ item.label + " " }}</span>
+        <el-tag
+          v-else
+          :disable-transitions="true"
+          :key="item.value + ''"
+          :index="index"
+          :type="item.elTagType"
+          :class="item.elTagClass"
+        >{{ item.label + " " }}</el-tag>
+      </template>
+    </template>
+    <template v-if="unmatch && showValue">
+      {{ unmatchArray | handleArray }}
+    </template>
+  </div>
+</template>
+
+<script setup>
+// 记录未匹配的项
+const unmatchArray = ref([]);
+
+const props = defineProps({
+  // 数据
+  options: {
+    type: Array,
+    default: null,
+  },
+  // 当前的值
+  value: [Number, String, Array],
+  // 当未找到匹配的数据时，显示value
+  showValue: {
+    type: Boolean,
+    default: true,
+  },
+  separator: {
+    type: String,
+    default: ",",
+  }
+});
+
+const values = computed(() => {
+  if (props.value === null || typeof props.value === 'undefined' || props.value === '') return [];
+  return Array.isArray(props.value) ? props.value.map(item => '' + item) : String(props.value).split(props.separator);
+});
+
+const unmatch = computed(() => {
+  unmatchArray.value = [];
+  // 没有value不显示
+  if (props.value === null || typeof props.value === 'undefined' || props.value === '' || !Array.isArray(props.options) || props.options.length === 0) return false
+  // 传入值为数组
+  let unmatch = false // 添加一个标志来判断是否有未匹配项
+  values.value.forEach(item => {
+    if (!props.options.some(v => v.value === item)) {
+      unmatchArray.value.push(item)
+      unmatch = true // 如果有未匹配项，将标志设置为true
+    }
+  })
+  return unmatch // 返回标志的值
+});
+
+function handleArray(array) {
+  if (array.length === 0) return "";
+  return array.reduce((pre, cur) => {
+    return pre + " " + cur;
+  });
+}
+</script>
+
+<style scoped>
+.el-tag + .el-tag {
+  margin-left: 10px;
+}
+</style>
diff --git a/src/components/Editor/index.vue b/src/components/Editor/index.vue
new file mode 100644
index 0000000..0a696f2
--- /dev/null
+++ b/src/components/Editor/index.vue
@@ -0,0 +1,251 @@
+<template>
+  <div>
+    <el-upload
+      :action="uploadUrl"
+      :before-upload="handleBeforeUpload"
+      :on-success="handleUploadSuccess"
+      :on-error="handleUploadError"
+      name="file"
+      :show-file-list="false"
+      :headers="headers"
+      class="editor-img-uploader"
+      v-if="type == 'url'"
+    >
+      <i ref="uploadRef" class="editor-img-uploader"></i>
+    </el-upload>
+  </div>
+  <div class="editor">
+    <quill-editor
+      ref="quillEditorRef"
+      v-model:content="content"
+      contentType="html"
+      @textChange="(e) => $emit('update:modelValue', content)"
+      :options="options"
+      :style="styles"
+    />
+  </div>
+</template>
+
+<script setup>
+import { QuillEditor } from "@vueup/vue-quill";
+import "@vueup/vue-quill/dist/vue-quill.snow.css";
+import { getToken } from "@/utils/auth";
+
+const { proxy } = getCurrentInstance();
+
+const quillEditorRef = ref();
+const uploadUrl = ref(import.meta.env.VITE_APP_BASE_API + "/common/upload"); // 上传的图片服务器地址
+const headers = ref({
+  Authorization: "Bearer " + getToken()
+});
+
+const props = defineProps({
+  /* 编辑器的内容 */
+  modelValue: {
+    type: String,
+  },
+  /* 高度 */
+  height: {
+    type: Number,
+    default: null,
+  },
+  /* 最小高度 */
+  minHeight: {
+    type: Number,
+    default: null,
+  },
+  /* 只读 */
+  readOnly: {
+    type: Boolean,
+    default: false,
+  },
+  /* 上传文件大小限制(MB) */
+  fileSize: {
+    type: Number,
+    default: 5,
+  },
+  /* 类型（base64格式、url格式） */
+  type: {
+    type: String,
+    default: "url",
+  }
+});
+
+const options = ref({
+  theme: "snow",
+  bounds: document.body,
+  debug: "warn",
+  modules: {
+    // 工具栏配置
+    toolbar: [
+      ["bold", "italic", "underline", "strike"],      // 加粗 斜体 下划线 删除线
+      ["blockquote", "code-block"],                   // 引用  代码块
+      [{ list: "ordered" }, { list: "bullet" }],      // 有序、无序列表
+      [{ indent: "-1" }, { indent: "+1" }],           // 缩进
+      [{ size: ["small", false, "large", "huge"] }],  // 字体大小
+      [{ header: [1, 2, 3, 4, 5, 6, false] }],        // 标题
+      [{ color: [] }, { background: [] }],            // 字体颜色、字体背景颜色
+      [{ align: [] }],                                // 对齐方式
+      ["clean"],                                      // 清除文本格式
+      ["link", "image", "video"]                      // 链接、图片、视频
+    ],
+  },
+  placeholder: "请输入内容",
+  readOnly: props.readOnly
+});
+
+const styles = computed(() => {
+  let style = {};
+  if (props.minHeight) {
+    style.minHeight = `${props.minHeight}px`;
+  }
+  if (props.height) {
+    style.height = `${props.height}px`;
+  }
+  return style;
+});
+
+const content = ref("");
+watch(() => props.modelValue, (v) => {
+  if (v !== content.value) {
+    content.value = v === undefined ? "<p></p>" : v;
+  }
+}, { immediate: true });
+
+// 如果设置了上传地址则自定义图片上传事件
+onMounted(() => {
+  if (props.type == 'url') {
+    let quill = quillEditorRef.value.getQuill();
+    let toolbar = quill.getModule("toolbar");
+    toolbar.addHandler("image", (value) => {
+      if (value) {
+        proxy.$refs.uploadRef.click();
+      } else {
+        quill.format("image", false);
+      }
+    });
+  }
+});
+
+// 上传前校检格式和大小
+function handleBeforeUpload(file) {
+  const type = ["image/jpeg", "image/jpg", "image/png", "image/svg"];
+  const isJPG = type.includes(file.type);
+  //检验文件格式
+  if (!isJPG) {
+    proxy.$modal.msgError(`图片格式错误!`);
+    return false;
+  }
+  // 校检文件大小
+  if (props.fileSize) {
+    const isLt = file.size / 1024 / 1024 < props.fileSize;
+    if (!isLt) {
+      proxy.$modal.msgError(`上传文件大小不能超过 ${props.fileSize} MB!`);
+      return false;
+    }
+  }
+  return true;
+}
+
+// 上传成功处理
+function handleUploadSuccess(res, file) {
+  // 如果上传成功
+  if (res.code == 200) {
+    // 获取富文本实例
+    let quill = toRaw(quillEditorRef.value).getQuill();
+    // 获取光标位置
+    let length = quill.selection.savedRange.index;
+    // 插入图片，res.url为服务器返回的图片链接地址
+    quill.insertEmbed(length, "image", import.meta.env.VITE_APP_BASE_API + res.fileName);
+    // 调整光标到最后
+    quill.setSelection(length + 1);
+  } else {
+    proxy.$modal.msgError("图片插入失败");
+  }
+}
+
+// 上传失败处理
+function handleUploadError() {
+  proxy.$modal.msgError("图片插入失败");
+}
+</script>
+
+<style>
+.editor-img-uploader {
+  display: none;
+}
+.editor, .ql-toolbar {
+  white-space: pre-wrap !important;
+  line-height: normal !important;
+}
+.quill-img {
+  display: none;
+}
+.ql-snow .ql-tooltip[data-mode="link"]::before {
+  content: "请输入链接地址:";
+}
+.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
+  border-right: 0px;
+  content: "保存";
+  padding-right: 0px;
+}
+.ql-snow .ql-tooltip[data-mode="video"]::before {
+  content: "请输入视频地址:";
+}
+.ql-snow .ql-picker.ql-size .ql-picker-label::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item::before {
+  content: "14px";
+}
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
+  content: "10px";
+}
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
+  content: "18px";
+}
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
+  content: "32px";
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item::before {
+  content: "文本";
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
+  content: "标题1";
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
+  content: "标题2";
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
+  content: "标题3";
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
+  content: "标题4";
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
+  content: "标题5";
+}
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
+  content: "标题6";
+}
+.ql-snow .ql-picker.ql-font .ql-picker-label::before,
+.ql-snow .ql-picker.ql-font .ql-picker-item::before {
+  content: "标准字体";
+}
+.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
+.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
+  content: "衬线字体";
+}
+.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before,
+.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
+  content: "等宽字体";
+}
+</style>
diff --git a/src/components/FileUpload/index.vue b/src/components/FileUpload/index.vue
new file mode 100644
index 0000000..a860a40
--- /dev/null
+++ b/src/components/FileUpload/index.vue
@@ -0,0 +1,212 @@
+<template>
+  <div class="upload-file">
+    <el-upload
+      multiple
+      :action="uploadFileUrl"
+      :before-upload="handleBeforeUpload"
+      :file-list="fileList"
+      :limit="limit"
+      :on-error="handleUploadError"
+      :on-exceed="handleExceed"
+      :on-success="handleUploadSuccess"
+      :show-file-list="false"
+      :headers="headers"
+      class="upload-file-uploader"
+      ref="fileUpload"
+    >
+      <!-- 上传按钮 -->
+      <el-button type="primary">选取文件</el-button>
+    </el-upload>
+    <!-- 上传提示 -->
+    <div class="el-upload__tip" v-if="showTip">
+      请上传
+      <template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template>
+      <template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template>
+      的文件
+    </div>
+    <!-- 文件列表 -->
+    <transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
+      <li :key="file.uid" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList">
+        <el-link :href="`${baseUrl}${file.url}`" :underline="false" target="_blank">
+          <span class="el-icon-document"> {{ getFileName(file.name) }} </span>
+        </el-link>
+        <div class="ele-upload-list__item-content-action">
+          <el-link :underline="false" @click="handleDelete(index)" type="danger">删除</el-link>
+        </div>
+      </li>
+    </transition-group>
+  </div>
+</template>
+
+<script setup>
+import { getToken } from "@/utils/auth";
+
+const props = defineProps({
+  modelValue: [String, Object, Array],
+  // 数量限制
+  limit: {
+    type: Number,
+    default: 5,
+  },
+  // 大小限制(MB)
+  fileSize: {
+    type: Number,
+    default: 5,
+  },
+  // 文件类型, 例如['png', 'jpg', 'jpeg']
+  fileType: {
+    type: Array,
+    default: () => ["doc", "xls", "ppt", "txt", "pdf"],
+  },
+  // 是否显示提示
+  isShowTip: {
+    type: Boolean,
+    default: true
+  }
+});
+
+const { proxy } = getCurrentInstance();
+const emit = defineEmits();
+const number = ref(0);
+const uploadList = ref([]);
+const baseUrl = import.meta.env.VITE_APP_BASE_API;
+const uploadFileUrl = ref(import.meta.env.VITE_APP_BASE_API + "/common/upload"); // 上传文件服务器地址
+const headers = ref({ Authorization: "Bearer " + getToken() });
+const fileList = ref([]);
+const showTip = computed(
+  () => props.isShowTip && (props.fileType || props.fileSize)
+);
+
+watch(() => props.modelValue, val => {
+  if (val) {
+    let temp = 1;
+    // 首先将值转为数组
+    const list = Array.isArray(val) ? val : props.modelValue.split(',');
+    // 然后将数组转为对象数组
+    fileList.value = list.map(item => {
+      if (typeof item === "string") {
+        item = { name: item, url: item };
+      }
+      item.uid = item.uid || new Date().getTime() + temp++;
+      return item;
+    });
+  } else {
+    fileList.value = [];
+    return [];
+  }
+},{ deep: true, immediate: true });
+
+// 上传前校检格式和大小
+function handleBeforeUpload(file) {
+  // 校检文件类型
+  if (props.fileType.length) {
+    const fileName = file.name.split('.');
+    const fileExt = fileName[fileName.length - 1];
+    const isTypeOk = props.fileType.indexOf(fileExt) >= 0;
+    if (!isTypeOk) {
+      proxy.$modal.msgError(`文件格式不正确，请上传${props.fileType.join("/")}格式文件!`);
+      return false;
+    }
+  }
+  // 校检文件名是否包含特殊字符
+  if (file.name.includes(',')) {
+    proxy.$modal.msgError('文件名不正确，不能包含英文逗号!');
+    return false;
+  }
+  // 校检文件大小
+  if (props.fileSize) {
+    const isLt = file.size / 1024 / 1024 < props.fileSize;
+    if (!isLt) {
+      proxy.$modal.msgError(`上传文件大小不能超过 ${props.fileSize} MB!`);
+      return false;
+    }
+  }
+  proxy.$modal.loading("正在上传文件，请稍候...");
+  number.value++;
+  return true;
+}
+
+// 文件个数超出
+function handleExceed() {
+  proxy.$modal.msgError(`上传文件数量不能超过 ${props.limit} 个!`);
+}
+
+// 上传失败
+function handleUploadError(err) {
+  proxy.$modal.msgError("上传文件失败");
+}
+
+// 上传成功回调
+function handleUploadSuccess(res, file) {
+  if (res.code === 200) {
+    uploadList.value.push({ name: res.fileName, url: res.fileName });
+    uploadedSuccessfully();
+  } else {
+    number.value--;
+    proxy.$modal.closeLoading();
+    proxy.$modal.msgError(res.msg);
+    proxy.$refs.fileUpload.handleRemove(file);
+    uploadedSuccessfully();
+  }
+}
+
+// 删除文件
+function handleDelete(index) {
+  fileList.value.splice(index, 1);
+  emit("update:modelValue", listToString(fileList.value));
+}
+
+// 上传结束处理
+function uploadedSuccessfully() {
+  if (number.value > 0 && uploadList.value.length === number.value) {
+    fileList.value = fileList.value.filter(f => f.url !== undefined).concat(uploadList.value);
+    uploadList.value = [];
+    number.value = 0;
+    emit("update:modelValue", listToString(fileList.value));
+    proxy.$modal.closeLoading();
+  }
+}
+
+// 获取文件名称
+function getFileName(name) {
+  // 如果是url那么取最后的名字 如果不是直接返回
+  if (name.lastIndexOf("/") > -1) {
+    return name.slice(name.lastIndexOf("/") + 1);
+  } else {
+    return name;
+  }
+}
+
+// 对象转成指定字符串分隔
+function listToString(list, separator) {
+  let strs = "";
+  separator = separator || ",";
+  for (let i in list) {
+    if (list[i].url) {
+      strs += list[i].url + separator;
+    }
+  }
+  return strs != '' ? strs.substr(0, strs.length - 1) : '';
+}
+</script>
+
+<style scoped lang="scss">
+.upload-file-uploader {
+  margin-bottom: 5px;
+}
+.upload-file-list .el-upload-list__item {
+  border: 1px solid #e4e7ed;
+  line-height: 2;
+  margin-bottom: 10px;
+  position: relative;
+}
+.upload-file-list .ele-upload-list__item-content {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  color: inherit;
+}
+.ele-upload-list__item-content-action .el-link {
+  margin-right: 10px;
+}
+</style>
diff --git a/src/components/Hamburger/index.vue b/src/components/Hamburger/index.vue
new file mode 100644
index 0000000..02d58e9
--- /dev/null
+++ b/src/components/Hamburger/index.vue
@@ -0,0 +1,42 @@
+<template>
+  <div style="padding: 0 15px;" @click="toggleClick">
+    <svg
+      :class="{'is-active':isActive}"
+      class="hamburger"
+      viewBox="0 0 1024 1024"
+      xmlns="http://www.w3.org/2000/svg"
+      width="64"
+      height="64"
+      fill="currentColor"
+    >
+      <path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" />
+    </svg>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  isActive: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const emit = defineEmits()
+const toggleClick = () => {
+  emit('toggleClick');
+}
+</script>
+
+<style scoped>
+.hamburger {
+  display: inline-block;
+  vertical-align: middle;
+  width: 20px;
+  height: 20px;
+}
+
+.hamburger.is-active {
+  transform: rotate(180deg);
+}
+</style>
diff --git a/src/components/HeaderSearch/index.vue b/src/components/HeaderSearch/index.vue
new file mode 100644
index 0000000..6ef6d2c
--- /dev/null
+++ b/src/components/HeaderSearch/index.vue
@@ -0,0 +1,187 @@
+<template>
+  <div :class="{ 'show': show }" class="header-search">
+    <svg-icon class-name="search-icon" icon-class="search" @click.stop="click" />
+    <el-select
+      ref="headerSearchSelectRef"
+      v-model="search"
+      :remote-method="querySearch"
+      filterable
+      default-first-option
+      remote
+      placeholder="Search"
+      class="header-search-select"
+      @change="change"
+    >
+      <el-option v-for="option in options" :key="option.item.path" :value="option.item" :label="option.item.title.join(' > ')" />
+    </el-select>
+  </div>
+</template>
+
+<script setup>
+import Fuse from 'fuse.js'
+import { getNormalPath } from '@/utils/ruoyi'
+import { isHttp } from '@/utils/validate'
+import usePermissionStore from '@/store/modules/permission'
+
+const search = ref('');
+const options = ref([]);
+const searchPool = ref([]);
+const show = ref(false);
+const fuse = ref(undefined);
+const headerSearchSelectRef = ref(null);
+const router = useRouter();
+const routes = computed(() => usePermissionStore().routes);
+
+function click() {
+  show.value = !show.value
+  if (show.value) {
+    headerSearchSelectRef.value && headerSearchSelectRef.value.focus()
+  }
+};
+function close() {
+  headerSearchSelectRef.value && headerSearchSelectRef.value.blur()
+  options.value = []
+  show.value = false
+}
+function change(val) {
+  const path = val.path;
+  const query = val.query;
+  if (isHttp(path)) {
+    // http(s):// 路径新窗口打开
+    const pindex = path.indexOf("http");
+    window.open(path.substr(pindex, path.length), "_blank");
+  } else {
+    if (query) {
+      router.push({ path: path, query: JSON.parse(query) });
+    } else {
+      router.push(path)
+    }
+  }
+
+  search.value = ''
+  options.value = []
+  nextTick(() => {
+    show.value = false
+  })
+}
+function initFuse(list) {
+  fuse.value = new Fuse(list, {
+    shouldSort: true,
+    threshold: 0.4,
+    location: 0,
+    distance: 100,
+    minMatchCharLength: 1,
+    keys: [{
+      name: 'title',
+      weight: 0.7
+    }, {
+      name: 'path',
+      weight: 0.3
+    }]
+  })
+}
+// Filter out the routes that can be displayed in the sidebar
+// And generate the internationalized title
+function generateRoutes(routes, basePath = '', prefixTitle = []) {
+  let res = []
+
+  for (const r of routes) {
+    // skip hidden router
+    if (r.hidden) { continue }
+    const p = r.path.length > 0 && r.path[0] === '/' ? r.path : '/' + r.path;
+    const data = {
+      path: !isHttp(r.path) ? getNormalPath(basePath + p) : r.path,
+      title: [...prefixTitle]
+    }
+
+    if (r.meta && r.meta.title) {
+      data.title = [...data.title, r.meta.title]
+
+      if (r.redirect !== 'noRedirect') {
+        // only push the routes with title
+        // special case: need to exclude parent router without redirect
+        res.push(data)
+      }
+    }
+    if (r.query) {
+      data.query = r.query
+    }
+
+    // recursive child routes
+    if (r.children) {
+      const tempRoutes = generateRoutes(r.children, data.path, data.title)
+      if (tempRoutes.length >= 1) {
+        res = [...res, ...tempRoutes]
+      }
+    }
+  }
+  return res
+}
+function querySearch(query) {
+  if (query !== '') {
+    options.value = fuse.value.search(query)
+  } else {
+    options.value = []
+  }
+}
+
+onMounted(() => {
+  searchPool.value = generateRoutes(routes.value);
+})
+
+watchEffect(() => {
+  searchPool.value = generateRoutes(routes.value)
+})
+
+watch(show, (value) => {
+  if (value) {
+    document.body.addEventListener('click', close)
+  } else {
+    document.body.removeEventListener('click', close)
+  }
+})
+
+watch(searchPool, (list) => {
+  initFuse(list)
+})
+</script>
+
+<style lang='scss' scoped>
+.header-search {
+  font-size: 0 !important;
+
+  .search-icon {
+    cursor: pointer;
+    font-size: 18px;
+    vertical-align: middle;
+  }
+
+  .header-search-select {
+    font-size: 18px;
+    transition: width 0.2s;
+    width: 0;
+    overflow: hidden;
+    background: transparent;
+    border-radius: 0;
+    display: inline-block;
+    vertical-align: middle;
+
+    :deep(.el-input__inner) {
+      border-radius: 0;
+      border: 0;
+      padding-left: 0;
+      padding-right: 0;
+      box-shadow: none !important;
+      border-bottom: 1px solid #d9d9d9;
+      vertical-align: middle;
+    }
+  }
+
+  &.show {
+    .header-search-select {
+      width: 210px;
+      margin-left: 10px;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/components/IconSelect/index.vue b/src/components/IconSelect/index.vue
new file mode 100644
index 0000000..517a4af
--- /dev/null
+++ b/src/components/IconSelect/index.vue
@@ -0,0 +1,111 @@
+<template>
+  <div class="icon-body">
+    <el-input
+      v-model="iconName"
+      class="icon-search"
+      clearable
+      placeholder="请输入图标名称"
+      @clear="filterIcons"
+      @input="filterIcons"
+    >
+      <template #suffix><i class="el-icon-search el-input__icon" /></template>
+    </el-input>
+    <div class="icon-list">
+      <div class="list-container">
+        <div v-for="(item, index) in iconList" class="icon-item-wrapper" :key="index" @click="selectedIcon(item)">
+          <div :class="['icon-item', { active: activeIcon === item }]">
+            <svg-icon :icon-class="item" class-name="icon" style="height: 25px;width: 16px;"/>
+            <span>{{ item }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import icons from './requireIcons'
+
+const props = defineProps({
+  activeIcon: {
+    type: String
+  }
+});
+
+const iconName = ref('');
+const iconList = ref(icons);
+const emit = defineEmits(['selected']);
+
+function filterIcons() {
+  iconList.value = icons
+  if (iconName.value) {
+    iconList.value = icons.filter(item => item.indexOf(iconName.value) !== -1)
+  }
+}
+
+function selectedIcon(name) {
+  emit('selected', name)
+  document.body.click()
+}
+
+function reset() {
+  iconName.value = ''
+  iconList.value = icons
+}
+
+defineExpose({
+  reset
+})
+</script>
+
+<style lang='scss' scoped>
+   .icon-body {
+    width: 100%;
+    padding: 10px;
+    .icon-search {
+      position: relative;
+      margin-bottom: 5px;
+    }
+    .icon-list {
+      height: 200px;
+      overflow: auto;
+      .list-container {
+        display: flex;
+        flex-wrap: wrap;
+        .icon-item-wrapper {
+          width: calc(100% / 3);
+          height: 25px;
+          line-height: 25px;
+          cursor: pointer;
+          display: flex;
+          .icon-item {
+            display: flex;
+            max-width: 100%;
+            height: 100%;
+            padding: 0 5px;
+            &:hover {
+              background: #ececec;
+              border-radius: 5px;
+            }
+            .icon {
+              flex-shrink: 0;
+            }
+            span {
+              display: inline-block;
+              vertical-align: -0.15em;
+              fill: currentColor;
+              padding-left: 2px;
+              overflow: hidden;
+              text-overflow: ellipsis;
+              white-space: nowrap;
+            }
+          }
+          .icon-item.active {
+            background: #ececec;
+            border-radius: 5px;
+          }
+        }
+      }
+    }
+  }
+</style>
\ No newline at end of file
diff --git a/src/components/IconSelect/requireIcons.js b/src/components/IconSelect/requireIcons.js
new file mode 100644
index 0000000..ac22fd7
--- /dev/null
+++ b/src/components/IconSelect/requireIcons.js
@@ -0,0 +1,8 @@
+let icons = []
+const modules = import.meta.glob('./../../assets/icons/svg/*.svg');
+for (const path in modules) {
+  const p = path.split('assets/icons/svg/')[1].split('.svg')[0];
+  icons.push(p);
+}
+
+export default icons
\ No newline at end of file
diff --git a/src/components/ImagePreview/index.vue b/src/components/ImagePreview/index.vue
new file mode 100644
index 0000000..7e3d2b6
--- /dev/null
+++ b/src/components/ImagePreview/index.vue
@@ -0,0 +1,92 @@
+<template>
+  <el-image
+    :src="`${realSrc}`"
+    fit="cover"
+    :style="`width:${realWidth};height:${realHeight};`"
+    :preview-src-list="realSrcList"
+    preview-teleported
+  >
+    <template #error>
+      <div class="image-slot">
+        <el-icon><picture-filled /></el-icon>
+      </div>
+    </template>
+  </el-image>
+</template>
+
+<script setup>
+import { isExternal } from "@/utils/validate";
+
+const props = defineProps({
+  src: {
+    type: String,
+    default: ""
+  },
+  width: {
+    type: [Number, String],
+    default: ""
+  },
+  height: {
+    type: [Number, String],
+    default: ""
+  }
+});
+
+const realSrc = computed(() => {
+  if (!props.src) {
+    return;
+  }
+  let real_src = props.src.split(",")[0];
+  if (isExternal(real_src)) {
+    return real_src;
+  }
+  return import.meta.env.VITE_APP_BASE_API + real_src;
+});
+
+const realSrcList = computed(() => {
+  if (!props.src) {
+    return;
+  }
+  let real_src_list = props.src.split(",");
+  let srcList = [];
+  real_src_list.forEach(item => {
+    if (isExternal(item)) {
+      return srcList.push(item);
+    }
+    return srcList.push(import.meta.env.VITE_APP_BASE_API + item);
+  });
+  return srcList;
+});
+
+const realWidth = computed(() =>
+  typeof props.width == "string" ? props.width : `${props.width}px`
+);
+
+const realHeight = computed(() =>
+  typeof props.height == "string" ? props.height : `${props.height}px`
+);
+</script>
+
+<style lang="scss" scoped>
+.el-image {
+  border-radius: 5px;
+  background-color: #ebeef5;
+  box-shadow: 0 0 5px 1px #ccc;
+  :deep(.el-image__inner) {
+    transition: all 0.3s;
+    cursor: pointer;
+    &:hover {
+      transform: scale(1.2);
+    }
+  }
+  :deep(.image-slot) {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    color: #909399;
+    font-size: 30px;
+  }
+}
+</style>
diff --git a/src/components/ImageUpload/index.vue b/src/components/ImageUpload/index.vue
new file mode 100644
index 0000000..ecc8ace
--- /dev/null
+++ b/src/components/ImageUpload/index.vue
@@ -0,0 +1,216 @@
+<template>
+  <div class="component-upload-image">
+    <el-upload
+      multiple
+      :action="uploadImgUrl"
+      list-type="picture-card"
+      :on-success="handleUploadSuccess"
+      :before-upload="handleBeforeUpload"
+      :limit="limit"
+      :on-error="handleUploadError"
+      :on-exceed="handleExceed"
+      ref="imageUpload"
+      :before-remove="handleDelete"
+      :show-file-list="true"
+      :headers="headers"
+      :file-list="fileList"
+      :on-preview="handlePictureCardPreview"
+      :class="{ hide: fileList.length >= limit }"
+    >
+      <el-icon class="avatar-uploader-icon"><plus /></el-icon>
+    </el-upload>
+    <!-- 上传提示 -->
+    <div class="el-upload__tip" v-if="showTip">
+      请上传
+      <template v-if="fileSize">
+        大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b>
+      </template>
+      <template v-if="fileType">
+        格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b>
+      </template>
+      的文件
+    </div>
+
+    <el-dialog
+      v-model="dialogVisible"
+      title="预览"
+      width="800px"
+      append-to-body
+    >
+      <img
+        :src="dialogImageUrl"
+        style="display: block; max-width: 100%; margin: 0 auto"
+      />
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { getToken } from "@/utils/auth";
+import { isExternal } from "@/utils/validate";
+
+const props = defineProps({
+  modelValue: [String, Object, Array],
+  // 图片数量限制
+  limit: {
+    type: Number,
+    default: 5,
+  },
+  // 大小限制(MB)
+  fileSize: {
+    type: Number,
+    default: 5,
+  },
+  // 文件类型, 例如['png', 'jpg', 'jpeg']
+  fileType: {
+    type: Array,
+    default: () => ["png", "jpg", "jpeg"],
+  },
+  // 是否显示提示
+  isShowTip: {
+    type: Boolean,
+    default: true
+  },
+});
+
+const { proxy } = getCurrentInstance();
+const emit = defineEmits();
+const number = ref(0);
+const uploadList = ref([]);
+const dialogImageUrl = ref("");
+const dialogVisible = ref(false);
+const baseUrl = import.meta.env.VITE_APP_BASE_API;
+const uploadImgUrl = ref(import.meta.env.VITE_APP_BASE_API + "/common/upload"); // 上传的图片服务器地址
+const headers = ref({ Authorization: "Bearer " + getToken() });
+const fileList = ref([]);
+const showTip = computed(
+  () => props.isShowTip && (props.fileType || props.fileSize)
+);
+
+watch(() => props.modelValue, val => {
+  if (val) {
+    // 首先将值转为数组
+    const list = Array.isArray(val) ? val : props.modelValue.split(",");
+    // 然后将数组转为对象数组
+    fileList.value = list.map(item => {
+      if (typeof item === "string") {
+        if (item.indexOf(baseUrl) === -1 && !isExternal(item)) {
+          item = { name: baseUrl + item, url: baseUrl + item };
+        } else {
+          item = { name: item, url: item };
+        }
+      }
+      return item;
+    });
+  } else {
+    fileList.value = [];
+    return [];
+  }
+},{ deep: true, immediate: true });
+
+// 上传前loading加载
+function handleBeforeUpload(file) {
+  let isImg = false;
+  if (props.fileType.length) {
+    let fileExtension = "";
+    if (file.name.lastIndexOf(".") > -1) {
+      fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
+    }
+    isImg = props.fileType.some(type => {
+      if (file.type.indexOf(type) > -1) return true;
+      if (fileExtension && fileExtension.indexOf(type) > -1) return true;
+      return false;
+    });
+  } else {
+    isImg = file.type.indexOf("image") > -1;
+  }
+  if (!isImg) {
+    proxy.$modal.msgError(`文件格式不正确，请上传${props.fileType.join("/")}图片格式文件!`);
+    return false;
+  }
+  if (file.name.includes(',')) {
+    proxy.$modal.msgError('文件名不正确，不能包含英文逗号!');
+    return false;
+  }
+  if (props.fileSize) {
+    const isLt = file.size / 1024 / 1024 < props.fileSize;
+    if (!isLt) {
+      proxy.$modal.msgError(`上传头像图片大小不能超过 ${props.fileSize} MB!`);
+      return false;
+    }
+  }
+  proxy.$modal.loading("正在上传图片，请稍候...");
+  number.value++;
+}
+
+// 文件个数超出
+function handleExceed() {
+  proxy.$modal.msgError(`上传文件数量不能超过 ${props.limit} 个!`);
+}
+
+// 上传成功回调
+function handleUploadSuccess(res, file) {
+  if (res.code === 200) {
+    uploadList.value.push({ name: res.fileName, url: res.url });
+    uploadedSuccessfully();
+  } else {
+    number.value--;
+    proxy.$modal.closeLoading();
+    proxy.$modal.msgError(res.msg);
+    proxy.$refs.imageUpload.handleRemove(file);
+    uploadedSuccessfully();
+  }
+}
+
+// 删除图片
+function handleDelete(file) {
+  const findex = fileList.value.map(f => f.name).indexOf(file.name);
+  if (findex > -1 && uploadList.value.length === number.value) {
+    fileList.value.splice(findex, 1);
+    emit("update:modelValue", listToString(fileList.value));
+    return false;
+  }
+}
+
+// 上传结束处理
+function uploadedSuccessfully() {
+  if (number.value > 0 && uploadList.value.length === number.value) {
+    fileList.value = fileList.value.filter(f => f.url !== undefined).concat(uploadList.value);
+    uploadList.value = [];
+    number.value = 0;
+    emit("update:modelValue", listToString(fileList.value));
+    proxy.$modal.closeLoading();
+  }
+}
+
+// 上传失败
+function handleUploadError() {
+  proxy.$modal.msgError("上传图片失败");
+  proxy.$modal.closeLoading();
+}
+
+// 预览
+function handlePictureCardPreview(file) {
+  dialogImageUrl.value = file.url;
+  dialogVisible.value = true;
+}
+
+// 对象转成指定字符串分隔
+function listToString(list, separator) {
+  let strs = "";
+  separator = separator || ",";
+  for (let i in list) {
+    if (undefined !== list[i].url && list[i].url.indexOf("blob:") !== 0) {
+      strs += list[i].url.replace(baseUrl, "") + separator;
+    }
+  }
+  return strs != "" ? strs.substr(0, strs.length - 1) : "";
+}
+</script>
+
+<style scoped lang="scss">
+// .el-upload--picture-card 控制加号部分
+:deep(.hide .el-upload--picture-card) {
+    display: none;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Pagination/index.vue b/src/components/Pagination/index.vue
new file mode 100644
index 0000000..e28740d
--- /dev/null
+++ b/src/components/Pagination/index.vue
@@ -0,0 +1,106 @@
+<template>
+  <div :class="{ 'hidden': hidden }" class="pagination-container">
+    <el-pagination
+      :background="background"
+      v-model:current-page="currentPage"
+      v-model:page-size="pageSize"
+      :layout="layout"
+      :page-sizes="pageSizes"
+      :pager-count="pagerCount"
+      :total="total"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+    />
+  </div>
+</template>
+
+<script setup>
+import { scrollTo } from '@/utils/scroll-to'
+
+const props = defineProps({
+  total: {
+    required: true,
+    type: Number
+  },
+  page: {
+    type: Number,
+    default: 1
+  },
+  limit: {
+    type: Number,
+    default: 20
+  },
+  pageSizes: {
+    type: Array,
+    default() {
+      return [10, 20, 30, 50]
+    }
+  },
+  // 移动端页码按钮的数量端默认值5
+  pagerCount: {
+    type: Number,
+    default: document.body.clientWidth < 992 ? 5 : 7
+  },
+  layout: {
+    type: String,
+    // default: 'total, sizes, prev, pager, next, jumper'
+    default: 'total,  prev, pager, next'
+  },
+  background: {
+    type: Boolean,
+    default: true
+  },
+  autoScroll: {
+    type: Boolean,
+    default: true
+  },
+  hidden: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const emit = defineEmits();
+const currentPage = computed({
+  get() {
+    return props.page
+  },
+  set(val) {
+    emit('update:page', val)
+  }
+})
+const pageSize = computed({
+  get() {
+    return props.limit
+  },
+  set(val){
+    emit('update:limit', val)
+  }
+})
+function handleSizeChange(val) {
+  if (currentPage.value * val > props.total) {
+    currentPage.value = 1
+  }
+  emit('pagination', { page: currentPage.value, limit: val })
+  if (props.autoScroll) {
+    scrollTo(0, 800)
+  }
+}
+function handleCurrentChange(val) {
+  emit('pagination', { page: val, limit: pageSize.value })
+  if (props.autoScroll) {
+    scrollTo(0, 800)
+  }
+}
+
+</script>
+
+<style scoped>
+.pagination-container {
+  background: #fff;
+  padding: 32px 16px;
+}
+.pagination-container.hidden {
+  display: none;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/ParentView/index.vue b/src/components/ParentView/index.vue
new file mode 100644
index 0000000..7bf6148
--- /dev/null
+++ b/src/components/ParentView/index.vue
@@ -0,0 +1,3 @@
+<template >
+  <router-view />
+</template>
diff --git a/src/components/RightToolbar/index.vue b/src/components/RightToolbar/index.vue
new file mode 100644
index 0000000..5a53dd4
--- /dev/null
+++ b/src/components/RightToolbar/index.vue
@@ -0,0 +1,134 @@
+<template>
+  <div class="top-right-btn" :style="style">
+    <el-row>
+      <el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top" v-if="search">
+        <el-button circle icon="Search" @click="toggleSearch()" />
+      </el-tooltip>
+      <el-tooltip class="item" effect="dark" content="刷新" placement="top">
+        <el-button circle icon="Refresh" @click="refresh()" />
+      </el-tooltip>
+      <el-tooltip class="item" effect="dark" content="显隐列" placement="top" v-if="columns">
+        <el-button circle icon="Menu" @click="showColumn()" v-if="showColumnsType == 'transfer'"/>
+        <el-dropdown trigger="click" :hide-on-click="false" style="padding-left: 12px" v-if="showColumnsType == 'checkbox'">
+          <el-button circle icon="Menu" />
+          <template #dropdown>
+            <el-dropdown-menu>
+              <template v-for="item in columns" :key="item.key">
+                <el-dropdown-item>
+                  <el-checkbox :checked="item.visible" @change="checkboxChange($event, item.label)" :label="item.label" />
+                </el-dropdown-item>
+              </template>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+      </el-tooltip>
+    </el-row>
+    <el-dialog :title="title" v-model="open" append-to-body>
+      <el-transfer
+        :titles="['显示', '隐藏']"
+        v-model="value"
+        :data="columns"
+        @change="dataChange"
+      ></el-transfer>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  /* 是否显示检索条件 */
+  showSearch: {
+    type: Boolean,
+    default: true,
+  },
+  /* 显隐列信息 */
+  columns: {
+    type: Array,
+  },
+  /* 是否显示检索图标 */
+  search: {
+    type: Boolean,
+    default: true,
+  },
+  /* 显隐列类型（transfer穿梭框、checkbox复选框） */
+  showColumnsType: {
+    type: String,
+    default: "checkbox",
+  },
+  /* 右外边距 */
+  gutter: {
+    type: Number,
+    default: 10,
+  },
+})
+
+const emits = defineEmits(['update:showSearch', 'queryTable']);
+
+// 显隐数据
+const value = ref([]);
+// 弹出层标题
+const title = ref("显示/隐藏");
+// 是否显示弹出层
+const open = ref(false);
+
+const style = computed(() => {
+  const ret = {};
+  if (props.gutter) {
+    ret.marginRight = `${props.gutter / 2}px`;
+  }
+  return ret;
+});
+
+// 搜索
+function toggleSearch() {
+  emits("update:showSearch", !props.showSearch);
+}
+
+// 刷新
+function refresh() {
+  emits("queryTable");
+}
+
+// 右侧列表元素变化
+function dataChange(data) {
+  for (let item in props.columns) {
+    const key = props.columns[item].key;
+    props.columns[item].visible = !data.includes(key);
+  }
+}
+
+// 打开显隐列dialog
+function showColumn() {
+  open.value = true;
+}
+
+if (props.showColumnsType == 'transfer') {
+  // 显隐列初始默认隐藏列
+  for (let item in props.columns) {
+    if (props.columns[item].visible === false) {
+      value.value.push(parseInt(item));
+    }
+  }
+}
+
+// 勾选
+function checkboxChange(event, label) {
+  props.columns.filter(item => item.label == label)[0].visible = event;
+}
+
+</script>
+
+<style lang='scss' scoped>
+:deep(.el-transfer__button) {
+  border-radius: 50%;
+  display: block;
+  margin-left: 0px;
+}
+:deep(.el-transfer__button:first-child) {
+  margin-bottom: 10px;
+}
+:deep(.el-dropdown-menu__item) {
+  line-height: 30px;
+  padding: 0 17px;
+}
+</style>
diff --git a/src/components/RuoYi/Doc/index.vue b/src/components/RuoYi/Doc/index.vue
new file mode 100644
index 0000000..51f13cb
--- /dev/null
+++ b/src/components/RuoYi/Doc/index.vue
@@ -0,0 +1,13 @@
+<template>
+  <div>
+    <svg-icon icon-class="question" @click="goto" />
+  </div>
+</template>
+
+<script setup>
+const url = ref('http://doc.ruoyi.vip/ruoyi-vue');
+
+function goto() {
+  window.open(url.value)
+}
+</script>
\ No newline at end of file
diff --git a/src/components/RuoYi/Git/index.vue b/src/components/RuoYi/Git/index.vue
new file mode 100644
index 0000000..b4459f3
--- /dev/null
+++ b/src/components/RuoYi/Git/index.vue
@@ -0,0 +1,13 @@
+<template>
+  <div>
+    <svg-icon icon-class="github" @click="goto" />
+  </div>
+</template>
+
+<script setup>
+const url = ref('https://gitee.com/y_project/RuoYi-Vue');
+
+function goto() {
+  window.open(url.value)
+}
+</script>
diff --git a/src/components/Screenfull/index.vue b/src/components/Screenfull/index.vue
new file mode 100644
index 0000000..7ad28ea
--- /dev/null
+++ b/src/components/Screenfull/index.vue
@@ -0,0 +1,22 @@
+<template>
+  <div>
+    <svg-icon :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" @click="toggle" />
+  </div>
+</template>
+
+<script setup>
+import { useFullscreen } from '@vueuse/core'
+
+const { isFullscreen, enter, exit, toggle } = useFullscreen();
+</script>
+
+<style lang='scss' scoped>
+.screenfull-svg {
+  display: inline-block;
+  cursor: pointer;
+  fill: #5a5e66;
+  width: 20px;
+  height: 20px;
+  vertical-align: 10px;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/SizeSelect/index.vue b/src/components/SizeSelect/index.vue
new file mode 100644
index 0000000..4c2e7e9
--- /dev/null
+++ b/src/components/SizeSelect/index.vue
@@ -0,0 +1,45 @@
+<template>
+  <div>
+    <el-dropdown trigger="click" @command="handleSetSize">
+      <div class="size-icon--style">
+        <svg-icon class-name="size-icon" icon-class="size" />
+      </div>
+      <template #dropdown>
+        <el-dropdown-menu>
+          <el-dropdown-item v-for="item of sizeOptions" :key="item.value" :disabled="size === item.value" :command="item.value">
+            {{ item.label }}
+          </el-dropdown-item>
+        </el-dropdown-menu>
+      </template>
+    </el-dropdown>
+  </div>
+</template>
+
+<script setup>
+import useAppStore from "@/store/modules/app";
+
+const appStore = useAppStore();
+const size = computed(() => appStore.size);
+const route = useRoute();
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+const sizeOptions = ref([
+  { label: "较大", value: "large" },
+  { label: "默认", value: "default" },
+  { label: "稍小", value: "small" },
+]);
+
+function handleSetSize(size) {
+  proxy.$modal.loading("正在设置布局大小，请稍候...");
+  appStore.setSize(size);
+  setTimeout("window.location.reload()", 1000);
+}
+</script>
+
+<style lang='scss' scoped>
+.size-icon--style {
+  font-size: 18px;
+  line-height: 50px;
+  padding-right: 7px;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/SvgIcon/index.vue b/src/components/SvgIcon/index.vue
new file mode 100644
index 0000000..8c101f6
--- /dev/null
+++ b/src/components/SvgIcon/index.vue
@@ -0,0 +1,53 @@
+<template>
+  <svg :class="svgClass" aria-hidden="true">
+    <use :xlink:href="iconName" :fill="color" />
+  </svg>
+</template>
+
+<script>
+export default defineComponent({
+  props: {
+    iconClass: {
+      type: String,
+      required: true
+    },
+    className: {
+      type: String,
+      default: ''
+    },
+    color: {
+      type: String,
+      default: ''
+    },
+  },
+  setup(props) {
+    return {
+      iconName: computed(() => `#icon-${props.iconClass}`),
+      svgClass: computed(() => {
+        if (props.className) {
+          return `svg-icon ${props.className}`
+        }
+        return 'svg-icon'
+      })
+    }
+  }
+})
+</script>
+
+<style scope lang="scss">
+.sub-el-icon,
+.nav-icon {
+  display: inline-block;
+  font-size: 15px;
+  margin-right: 12px;
+  position: relative;
+}
+
+.svg-icon {
+  width: 1em;
+  height: 1em;
+  position: relative;
+  fill: currentColor;
+  vertical-align: -2px;
+}
+</style>
diff --git a/src/components/SvgIcon/svgicon.js b/src/components/SvgIcon/svgicon.js
new file mode 100644
index 0000000..4431719
--- /dev/null
+++ b/src/components/SvgIcon/svgicon.js
@@ -0,0 +1,10 @@
+import * as components from '@element-plus/icons-vue'
+
+export default {
+    install: (app) => {
+        for (const key in components) {
+            const componentConfig = components[key];
+            app.component(componentConfig.name, componentConfig);
+        }
+    },
+};
diff --git a/src/components/TopNav/index.vue b/src/components/TopNav/index.vue
new file mode 100644
index 0000000..cf67821
--- /dev/null
+++ b/src/components/TopNav/index.vue
@@ -0,0 +1,216 @@
+<template>
+  <el-menu
+    :default-active="activeMenu"
+    mode="horizontal"
+    @select="handleSelect"
+    :ellipsis="false"
+  >
+    <template v-for="(item, index) in topMenus">
+      <el-menu-item :style="{'--theme': theme}" :index="item.path" :key="index" v-if="index < visibleNumber">
+        <svg-icon
+        v-if="item.meta && item.meta.icon && item.meta.icon !== '#'"
+        :icon-class="item.meta.icon"/>
+        {{ item.meta.title }}
+      </el-menu-item>
+    </template>
+
+    <!-- 顶部菜单超出数量折叠 -->
+    <el-sub-menu :style="{'--theme': theme}" index="more" v-if="topMenus.length > visibleNumber">
+      <template #title>更多菜单</template>
+      <template v-for="(item, index) in topMenus">
+        <el-menu-item
+          :index="item.path"
+          :key="index"
+          v-if="index >= visibleNumber">
+        <svg-icon
+          v-if="item.meta && item.meta.icon && item.meta.icon !== '#'"
+          :icon-class="item.meta.icon"/>
+        {{ item.meta.title }}
+        </el-menu-item>
+      </template>
+    </el-sub-menu>
+  </el-menu>
+</template>
+
+<script setup>
+import { constantRoutes } from "@/router"
+import { isHttp } from '@/utils/validate'
+import useAppStore from '@/store/modules/app'
+import useSettingsStore from '@/store/modules/settings'
+import usePermissionStore from '@/store/modules/permission'
+
+// 顶部栏初始数
+const visibleNumber = ref(null);
+// 当前激活菜单的 index
+const currentIndex = ref(null);
+// 隐藏侧边栏路由
+const hideList = ['/index', '/user/profile'];
+
+const appStore = useAppStore()
+const settingsStore = useSettingsStore()
+const permissionStore = usePermissionStore()
+const route = useRoute();
+const router = useRouter();
+
+// 主题颜色
+const theme = computed(() => settingsStore.theme);
+// 所有的路由信息
+const routers = computed(() => permissionStore.topbarRouters);
+
+// 顶部显示菜单
+const topMenus = computed(() => {
+  let topMenus = [];
+  routers.value.map((menu) => {
+    if (menu.hidden !== true) {
+      // 兼容顶部栏一级菜单内部跳转
+      if (menu.path === "/") {
+          topMenus.push(menu.children[0]);
+      } else {
+          topMenus.push(menu);
+      }
+    }
+  })
+  return topMenus;
+})
+
+// 设置子路由
+const childrenMenus = computed(() => {
+  let childrenMenus = [];
+  routers.value.map((router) => {
+    for (let item in router.children) {
+      if (router.children[item].parentPath === undefined) {
+        if(router.path === "/") {
+          router.children[item].path = "/" + router.children[item].path;
+        } else {
+          if(!isHttp(router.children[item].path)) {
+            router.children[item].path = router.path + "/" + router.children[item].path;
+          }
+        }
+        router.children[item].parentPath = router.path;
+      }
+      childrenMenus.push(router.children[item]);
+    }
+  })
+  return constantRoutes.concat(childrenMenus);
+})
+
+// 默认激活的菜单
+const activeMenu = computed(() => {
+  const path = route.path;
+  let activePath = path;
+  if (path !== undefined && path.lastIndexOf("/") > 0 && hideList.indexOf(path) === -1) {
+    const tmpPath = path.substring(1, path.length);
+    activePath = "/" + tmpPath.substring(0, tmpPath.indexOf("/"));
+    if (!route.meta.link) {
+        appStore.toggleSideBarHide(false);
+    }
+  } else if(!route.children) {
+    activePath = path;
+    appStore.toggleSideBarHide(true);
+  }
+  activeRoutes(activePath);
+  return activePath;
+})
+
+function setVisibleNumber() {
+  const width = document.body.getBoundingClientRect().width / 3;
+  visibleNumber.value = parseInt(width / 85);
+}
+
+function handleSelect(key, keyPath) {
+  currentIndex.value = key;
+  const route = routers.value.find(item => item.path === key);
+  if (isHttp(key)) {
+    // http(s):// 路径新窗口打开
+    window.open(key, "_blank");
+  } else if (!route || !route.children) {
+    // 没有子路由路径内部打开
+    const routeMenu = childrenMenus.value.find(item => item.path === key);
+    if (routeMenu && routeMenu.query) {
+      let query = JSON.parse(routeMenu.query);
+      router.push({ path: key, query: query });
+    } else {
+      router.push({ path: key });
+    }
+    appStore.toggleSideBarHide(true);
+  } else {
+    // 显示左侧联动菜单
+    activeRoutes(key);
+    appStore.toggleSideBarHide(false);
+  }
+}
+
+function activeRoutes(key) {
+  let routes = [];
+  if (childrenMenus.value && childrenMenus.value.length > 0) {
+    childrenMenus.value.map((item) => {
+      if (key == item.parentPath || (key == "index" && "" == item.path)) {
+        routes.push(item);
+      }
+    });
+  }
+  if(routes.length > 0) {
+    permissionStore.setSidebarRouters(routes);
+  } else {
+    appStore.toggleSideBarHide(true);
+  }
+  return routes;
+}
+
+onMounted(() => {
+  window.addEventListener('resize', setVisibleNumber)
+})
+onBeforeUnmount(() => {
+  window.removeEventListener('resize', setVisibleNumber)
+})
+
+onMounted(() => {
+  setVisibleNumber()
+})
+</script>
+
+<style lang="scss">
+.topmenu-container.el-menu--horizontal > .el-menu-item {
+  float: left;
+  height: 50px !important;
+  line-height: 50px !important;
+  color: #999093 !important;
+  padding: 0 5px !important;
+  margin: 0 10px !important;
+}
+
+.topmenu-container.el-menu--horizontal > .el-menu-item.is-active, .el-menu--horizontal > .el-sub-menu.is-active .el-submenu__title {
+  border-bottom: 2px solid #{'var(--theme)'} !important;
+  color: #303133;
+}
+
+/* sub-menu item */
+.topmenu-container.el-menu--horizontal > .el-sub-menu .el-sub-menu__title {
+  float: left;
+  height: 50px !important;
+  line-height: 50px !important;
+  color: #999093 !important;
+  padding: 0 5px !important;
+  margin: 0 10px !important;
+}
+
+/* 背景色隐藏 */
+.topmenu-container.el-menu--horizontal>.el-menu-item:not(.is-disabled):focus, .topmenu-container.el-menu--horizontal>.el-menu-item:not(.is-disabled):hover, .topmenu-container.el-menu--horizontal>.el-submenu .el-submenu__title:hover {
+  background-color: #ffffff;
+}
+
+/* 图标右间距 */
+.topmenu-container .svg-icon {
+  margin-right: 4px;
+}
+
+/* topmenu more arrow */
+.topmenu-container .el-sub-menu .el-sub-menu__icon-arrow {
+  position: static;
+  vertical-align: middle;
+  margin-left: 8px;
+  margin-top: 0px;
+}
+
+
+</style>
diff --git a/src/components/iFrame/index.vue b/src/components/iFrame/index.vue
new file mode 100644
index 0000000..091b1a2
--- /dev/null
+++ b/src/components/iFrame/index.vue
@@ -0,0 +1,31 @@
+<template>
+  <div v-loading="loading" :style="'height:' + height">
+    <iframe 
+      :src="url" 
+      frameborder="no" 
+      style="width: 100%; height: 100%" 
+      scrolling="auto" />
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  src: {
+    type: String,
+    required: true
+  }
+})
+
+const height = ref(document.documentElement.clientHeight - 94.5 + "px;")
+const loading = ref(true)
+const url = computed(() => props.src)
+
+onMounted(() => {
+  setTimeout(() => {
+    loading.value = false;
+  }, 300);
+  window.onresize = function temp() {
+    height.value = document.documentElement.clientHeight - 94.5 + "px;";
+  };
+})
+</script>
diff --git a/src/directive/common/copyText.js b/src/directive/common/copyText.js
new file mode 100644
index 0000000..7063df8
--- /dev/null
+++ b/src/directive/common/copyText.js
@@ -0,0 +1,66 @@
+/**
+* v-copyText 复制文本内容
+* Copyright (c) 2022 ruoyi
+*/
+
+export default {
+  beforeMount(el, { value, arg }) {
+    if (arg === "callback") {
+      el.$copyCallback = value;
+    } else {
+      el.$copyValue = value;
+      const handler = () => {
+        copyTextToClipboard(el.$copyValue);
+        if (el.$copyCallback) {
+          el.$copyCallback(el.$copyValue);
+        }
+      };
+      el.addEventListener("click", handler);
+      el.$destroyCopy = () => el.removeEventListener("click", handler);
+    }
+  }
+}
+
+function copyTextToClipboard(input, { target = document.body } = {}) {
+  const element = document.createElement('textarea');
+  const previouslyFocusedElement = document.activeElement;
+
+  element.value = input;
+
+  // Prevent keyboard from showing on mobile
+  element.setAttribute('readonly', '');
+
+  element.style.contain = 'strict';
+  element.style.position = 'absolute';
+  element.style.left = '-9999px';
+  element.style.fontSize = '12pt'; // Prevent zooming on iOS
+
+  const selection = document.getSelection();
+  const originalRange = selection.rangeCount > 0 && selection.getRangeAt(0);
+
+  target.append(element);
+  element.select();
+
+  // Explicit selection workaround for iOS
+  element.selectionStart = 0;
+  element.selectionEnd = input.length;
+
+  let isSuccess = false;
+  try {
+    isSuccess = document.execCommand('copy');
+  } catch { }
+
+  element.remove();
+
+  if (originalRange) {
+    selection.removeAllRanges();
+    selection.addRange(originalRange);
+  }
+
+  // Get the focus back on the previously focused element, if any
+  if (previouslyFocusedElement) {
+    previouslyFocusedElement.focus();
+  }
+
+  return isSuccess;
+}
diff --git a/src/directive/index.js b/src/directive/index.js
new file mode 100644
index 0000000..86b8f88
--- /dev/null
+++ b/src/directive/index.js
@@ -0,0 +1,9 @@
+import hasRole from './permission/hasRole'
+import hasPermi from './permission/hasPermi'
+import copyText from './common/copyText'
+
+export default function directive(app){
+  app.directive('hasRole', hasRole)
+  app.directive('hasPermi', hasPermi)
+  app.directive('copyText', copyText)
+}
\ No newline at end of file
diff --git a/src/directive/permission/hasPermi.js b/src/directive/permission/hasPermi.js
new file mode 100644
index 0000000..44ef3f8
--- /dev/null
+++ b/src/directive/permission/hasPermi.js
@@ -0,0 +1,28 @@
+ /**
+ * v-hasPermi 操作权限处理
+ * Copyright (c) 2019 ruoyi
+ */
+ 
+import useUserStore from '@/store/modules/user'
+
+export default {
+  mounted(el, binding, vnode) {
+    const { value } = binding
+    const all_permission = "*:*:*";
+    const permissions = useUserStore().permissions
+
+    if (value && value instanceof Array && value.length > 0) {
+      const permissionFlag = value
+
+      const hasPermissions = permissions.some(permission => {
+        return all_permission === permission || permissionFlag.includes(permission)
+      })
+
+      if (!hasPermissions) {
+        el.parentNode && el.parentNode.removeChild(el)
+      }
+    } else {
+      throw new Error(`请设置操作权限标签值`)
+    }
+  }
+}
diff --git a/src/directive/permission/hasRole.js b/src/directive/permission/hasRole.js
new file mode 100644
index 0000000..8774bdd
--- /dev/null
+++ b/src/directive/permission/hasRole.js
@@ -0,0 +1,28 @@
+ /**
+ * v-hasRole 角色权限处理
+ * Copyright (c) 2019 ruoyi
+ */
+ 
+import useUserStore from '@/store/modules/user'
+
+export default {
+  mounted(el, binding, vnode) {
+    const { value } = binding
+    const super_admin = "admin";
+    const roles = useUserStore().roles
+
+    if (value && value instanceof Array && value.length > 0) {
+      const roleFlag = value
+
+      const hasRole = roles.some(role => {
+        return super_admin === role || roleFlag.includes(role)
+      })
+
+      if (!hasRole) {
+        el.parentNode && el.parentNode.removeChild(el)
+      }
+    } else {
+      throw new Error(`请设置角色权限标签值`)
+    }
+  }
+}
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
new file mode 100644
index 0000000..0c6f6a3
--- /dev/null
+++ b/src/layout/components/AppMain.vue
@@ -0,0 +1,86 @@
+<template>
+  <section class="app-main">
+    <router-view v-slot="{ Component, route }" :key="routeKey">
+      <transition name="fade-transform" mode="out-in">
+        <keep-alive :include="tagsViewStore.cachedViews">
+          <component
+            v-if="!route.meta.link"
+            :is="Component"
+            :key="route.path"
+          />
+        </keep-alive>
+      </transition>
+    </router-view>
+    <iframe-toggle />
+  </section>
+</template>
+
+<script setup>
+import iframeToggle from "./IframeToggle/index";
+import useTagsViewStore from "@/store/modules/tagsView";
+
+const route = useRoute();
+const tagsViewStore = useTagsViewStore();
+const routeKey = computed(() => route.path + Math.random());
+onMounted(() => {
+  addIframe();
+});
+
+watch(route, () => {
+  addIframe();
+});
+
+function addIframe() {
+  if (route.meta.link) {
+    useTagsViewStore().addIframeView(route);
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app-main {
+  /* 50= navbar  50  */
+  min-height: calc(100vh - 50px);
+  width: 100%;
+  position: relative;
+  overflow: hidden;
+}
+
+.fixed-header + .app-main {
+  padding-top: 50px;
+}
+
+.hasTagsView {
+  .app-main {
+    /* 84 = navbar + tags-view = 50 + 34 */
+    min-height: calc(100vh - 84px);
+  }
+
+  .fixed-header + .app-main {
+    padding-top: 84px;
+  }
+}
+</style>
+
+<style lang="scss">
+// fix css style bug in open el-dialog
+.el-popup-parent--hidden {
+  .fixed-header {
+    padding-right: 6px;
+  }
+}
+
+::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+::-webkit-scrollbar-track {
+  background-color: #f1f1f1;
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: #c0c0c0;
+  border-radius: 3px;
+}
+</style>
diff --git a/src/layout/components/IframeToggle/index.vue b/src/layout/components/IframeToggle/index.vue
new file mode 100644
index 0000000..a407b74
--- /dev/null
+++ b/src/layout/components/IframeToggle/index.vue
@@ -0,0 +1,25 @@
+<template>
+  <inner-link
+    v-for="(item, index) in tagsViewStore.iframeViews"
+    :key="item.path"
+    :iframeId="'iframe' + index"
+    v-show="route.path === item.path"
+    :src="iframeUrl(item.meta.link, item.query)"
+  ></inner-link>
+</template>
+
+<script setup>
+import InnerLink from "../InnerLink/index";
+import useTagsViewStore from "@/store/modules/tagsView";
+
+const route = useRoute();
+const tagsViewStore = useTagsViewStore();
+
+function iframeUrl(url, query) {
+  if (Object.keys(query).length > 0) {
+    let params = Object.keys(query).map((key) => key + "=" + query[key]).join("&");
+    return url + "?" + params;
+  }
+  return url;
+}
+</script>
diff --git a/src/layout/components/InnerLink/index.vue b/src/layout/components/InnerLink/index.vue
new file mode 100644
index 0000000..53a903c
--- /dev/null
+++ b/src/layout/components/InnerLink/index.vue
@@ -0,0 +1,24 @@
+<template>
+  <div :style="'height:' + height">
+    <iframe
+      :id="iframeId"
+      style="width: 100%; height: 100%"
+      :src="src"
+      frameborder="no"
+    ></iframe>
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  src: {
+    type: String,
+    default: "/"
+  },
+  iframeId: {
+    type: String
+  }
+});
+
+const height = ref(document.documentElement.clientHeight - 94.5 + "px");
+</script>
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
new file mode 100644
index 0000000..9e5974c
--- /dev/null
+++ b/src/layout/components/Navbar.vue
@@ -0,0 +1,240 @@
+<template>
+  <div class="navbar">
+    <hamburger
+      id="hamburger-container"
+      :is-active="appStore.sidebar.opened"
+      class="hamburger-container"
+      @toggleClick="toggleSideBar"
+    />
+    <breadcrumb
+      id="breadcrumb-container"
+      class="breadcrumb-container"
+      v-if="!settingsStore.topNav"
+    />
+    <top-nav
+      id="topmenu-container"
+      class="topmenu-container"
+      v-if="settingsStore.topNav"
+    />
+
+    <div class="right-menu">
+      <template v-if="appStore.device !== 'mobile'">
+        <!-- <header-search id="header-search" class="right-menu-item" />
+
+        <el-tooltip content="源码地址" effect="dark" placement="bottom">
+          <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
+        </el-tooltip>
+
+        <el-tooltip content="文档地址" effect="dark" placement="bottom">
+          <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />
+        </el-tooltip> -->
+
+        <screenfull id="screenfull" class="right-menu-item hover-effect" />
+
+        <el-tooltip content="主题模式" effect="dark" placement="bottom">
+          <div
+            class="right-menu-item hover-effect theme-switch-wrapper"
+            @click="toggleTheme"
+          >
+            <svg-icon v-if="settingsStore.isDark" icon-class="sunny" />
+            <svg-icon v-if="!settingsStore.isDark" icon-class="moon" />
+          </div>
+        </el-tooltip>
+
+        <!-- <el-tooltip content="布局大小" effect="dark" placement="bottom">
+          <size-select id="size-select" class="right-menu-item hover-effect" />
+        </el-tooltip> -->
+      </template>
+      <div class="avatar-container">
+        <el-dropdown
+          @command="handleCommand"
+          class="right-menu-item hover-effect"
+          trigger="click"
+        >
+          <div class="avatar-wrapper">
+            <img :src="userStore.avatar" class="user-avatar" />
+            <el-icon><caret-bottom /></el-icon>
+          </div>
+          <template #dropdown>
+            <el-dropdown-menu>
+              <router-link to="/user/profile">
+                <el-dropdown-item>个人中心</el-dropdown-item>
+              </router-link>
+              <el-dropdown-item
+                command="setLayout"
+                v-if="settingsStore.showSettings"
+              >
+                <span>布局设置</span>
+              </el-dropdown-item>
+              <el-dropdown-item divided command="logout">
+                <span>退出登录</span>
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ElMessageBox } from "element-plus";
+import Breadcrumb from "@/components/Breadcrumb";
+import TopNav from "@/components/TopNav";
+import Hamburger from "@/components/Hamburger";
+import Screenfull from "@/components/Screenfull";
+import SizeSelect from "@/components/SizeSelect";
+import HeaderSearch from "@/components/HeaderSearch";
+import RuoYiGit from "@/components/RuoYi/Git";
+import RuoYiDoc from "@/components/RuoYi/Doc";
+import useAppStore from "@/store/modules/app";
+import useUserStore from "@/store/modules/user";
+import useSettingsStore from "@/store/modules/settings";
+
+const appStore = useAppStore();
+const userStore = useUserStore();
+const settingsStore = useSettingsStore();
+
+function toggleSideBar() {
+  appStore.toggleSideBar();
+}
+
+function handleCommand(command) {
+  switch (command) {
+    case "setLayout":
+      setLayout();
+      break;
+    case "logout":
+      logout();
+      break;
+    default:
+      break;
+  }
+}
+
+function logout() {
+  ElMessageBox.confirm("确定注销并退出系统吗？", "提示", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(() => {
+      userStore.logOut().then(() => {
+        location.href = "/index";
+      });
+    })
+    .catch(() => {});
+}
+
+const emits = defineEmits(["setLayout"]);
+function setLayout() {
+  emits("setLayout");
+}
+
+function toggleTheme() {
+  settingsStore.toggleTheme();
+}
+</script>
+
+<style lang="scss" scoped>
+.navbar {
+  height: 50px;
+  overflow: hidden;
+  position: relative;
+  background: var(--navbar-bg);
+  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+
+  .hamburger-container {
+    line-height: 46px;
+    height: 100%;
+    float: left;
+    cursor: pointer;
+    transition: background 0.3s;
+    -webkit-tap-highlight-color: transparent;
+
+    &:hover {
+      background: rgba(0, 0, 0, 0.025);
+    }
+  }
+
+  .breadcrumb-container {
+    float: left;
+  }
+
+  .topmenu-container {
+    position: absolute;
+    left: 50px;
+  }
+
+  .errLog-container {
+    display: inline-block;
+    vertical-align: top;
+  }
+
+  .right-menu {
+    float: right;
+    height: 100%;
+    line-height: 50px;
+    display: flex;
+
+    &:focus {
+      outline: none;
+    }
+
+    .right-menu-item {
+      display: inline-block;
+      padding: 0 8px;
+      height: 100%;
+      font-size: 18px;
+      color: var(--navbar-text);
+      vertical-align: text-bottom;
+
+      &.hover-effect {
+        cursor: pointer;
+        transition: background 0.3s;
+
+        &:hover {
+          background: rgba(0, 0, 0, 0.025);
+        }
+      }
+
+      &.theme-switch-wrapper {
+        display: flex;
+        align-items: center;
+
+        svg {
+          transition: transform 0.3s;
+
+          &:hover {
+            transform: scale(1.15);
+          }
+        }
+      }
+    }
+
+    .avatar-container {
+      margin-right: 40px;
+
+      .avatar-wrapper {
+        margin-top: 5px;
+        position: relative;
+
+        .user-avatar {
+          cursor: pointer;
+          width: 40px;
+          height: 40px;
+          border-radius: 10px;
+        }
+
+        i {
+          cursor: pointer;
+          position: absolute;
+          right: -20px;
+          top: 25px;
+          font-size: 12px;
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue
new file mode 100644
index 0000000..4ef2437
--- /dev/null
+++ b/src/layout/components/Settings/index.vue
@@ -0,0 +1,204 @@
+<template>
+  <el-drawer v-model="showSettings" :withHeader="false" direction="rtl" size="300px">
+    <div class="setting-drawer-title">
+      <h3 class="drawer-title">主题风格设置</h3>
+    </div>
+    <div class="setting-drawer-block-checbox">
+      <div class="setting-drawer-block-checbox-item" @click="handleTheme('theme-dark')">
+        <img src="@/assets/images/dark.svg" alt="dark" />
+        <div v-if="sideTheme === 'theme-dark'" class="setting-drawer-block-checbox-selectIcon" style="display: block;">
+          <i aria-label="图标: check" class="anticon anticon-check">
+            <svg viewBox="64 64 896 896" data-icon="check" width="1em" height="1em" :fill="theme" aria-hidden="true" focusable="false" class>
+              <path d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z" />
+            </svg>
+          </i>
+        </div>
+      </div>
+      <div class="setting-drawer-block-checbox-item" @click="handleTheme('theme-light')">
+        <img src="@/assets/images/light.svg" alt="light" />
+        <div v-if="sideTheme === 'theme-light'" class="setting-drawer-block-checbox-selectIcon" style="display: block;">
+          <i aria-label="图标: check" class="anticon anticon-check">
+            <svg viewBox="64 64 896 896" data-icon="check" width="1em" height="1em" :fill="theme" aria-hidden="true" focusable="false" class>
+              <path d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z" />
+            </svg>
+          </i>
+        </div>
+      </div>
+    </div>
+    <div class="drawer-item">
+      <span>主题颜色</span>
+      <span class="comp-style">
+        <el-color-picker v-model="theme" :predefine="predefineColors" @change="themeChange"/>
+      </span>
+    </div>
+    <el-divider />
+
+    <h3 class="drawer-title">系统布局配置</h3>
+
+    <div class="drawer-item">
+      <span>开启 TopNav</span>
+      <span class="comp-style">
+        <el-switch v-model="settingsStore.topNav" @change="topNavChange" class="drawer-switch" />
+      </span>
+    </div>
+
+    <div class="drawer-item">
+      <span>开启 Tags-Views</span>
+      <span class="comp-style">
+        <el-switch v-model="settingsStore.tagsView" class="drawer-switch" />
+      </span>
+    </div>
+
+    <div class="drawer-item">
+      <span>固定 Header</span>
+      <span class="comp-style">
+        <el-switch v-model="settingsStore.fixedHeader" class="drawer-switch" />
+      </span>
+    </div>
+
+    <div class="drawer-item">
+      <span>显示 Logo</span>
+      <span class="comp-style">
+        <el-switch v-model="settingsStore.sidebarLogo" class="drawer-switch" />
+      </span>
+    </div>
+
+    <div class="drawer-item">
+      <span>动态标题</span>
+      <span class="comp-style">
+        <el-switch v-model="settingsStore.dynamicTitle" class="drawer-switch" />
+      </span>
+    </div>
+
+    <el-divider />
+
+    <el-button type="primary" plain icon="DocumentAdd" @click="saveSetting">保存配置</el-button>
+    <el-button plain icon="Refresh" @click="resetSetting">重置配置</el-button>
+  </el-drawer>
+
+</template>
+
+<script setup>
+import variables from '@/assets/styles/variables.module.scss'
+import axios from 'axios'
+import { ElLoading, ElMessage } from 'element-plus'
+import { useDynamicTitle } from '@/utils/dynamicTitle'
+import useAppStore from '@/store/modules/app'
+import useSettingsStore from '@/store/modules/settings'
+import usePermissionStore from '@/store/modules/permission'
+import { handleThemeStyle } from '@/utils/theme'
+
+const { proxy } = getCurrentInstance();
+const appStore = useAppStore()
+const settingsStore = useSettingsStore()
+const permissionStore = usePermissionStore()
+const showSettings = ref(false);
+const theme = ref(settingsStore.theme);
+const sideTheme = ref(settingsStore.sideTheme);
+const storeSettings = computed(() => settingsStore);
+const predefineColors = ref(["#409EFF", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585"]);
+
+/** 是否需要topnav */
+function topNavChange(val) {
+  if (!val) {
+    appStore.toggleSideBarHide(false);
+    permissionStore.setSidebarRouters(permissionStore.defaultRoutes);
+  }
+}
+
+function themeChange(val) {
+  settingsStore.theme = val;
+  handleThemeStyle(val);
+}
+
+function handleTheme(val) {
+  settingsStore.sideTheme = val;
+  sideTheme.value = val;
+}
+
+function saveSetting() {
+  proxy.$modal.loading("正在保存到本地，请稍候...");
+  let layoutSetting = {
+    "topNav": storeSettings.value.topNav,
+    "tagsView": storeSettings.value.tagsView,
+    "fixedHeader": storeSettings.value.fixedHeader,
+    "sidebarLogo": storeSettings.value.sidebarLogo,
+    "dynamicTitle": storeSettings.value.dynamicTitle,
+    "sideTheme": storeSettings.value.sideTheme,
+    "theme": storeSettings.value.theme
+  };
+  localStorage.setItem("layout-setting", JSON.stringify(layoutSetting));
+  setTimeout(proxy.$modal.closeLoading(), 1000)
+}
+
+function resetSetting() {
+  proxy.$modal.loading("正在清除设置缓存并刷新，请稍候...");
+  localStorage.removeItem("layout-setting")
+  setTimeout("window.location.reload()", 1000)
+}
+
+function openSetting() {
+  showSettings.value = true;
+}
+
+defineExpose({
+  openSetting,
+})
+</script>
+
+<style lang='scss' scoped>
+.setting-drawer-title {
+  margin-bottom: 12px;
+  color: var(--el-text-color-primary, rgba(0, 0, 0, 0.85));
+  line-height: 22px;
+  font-weight: bold;
+
+  .drawer-title {
+    font-size: 14px;
+  }
+}
+
+.setting-drawer-block-checbox {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  margin-top: 10px;
+  margin-bottom: 20px;
+
+  .setting-drawer-block-checbox-item {
+    position: relative;
+    margin-right: 16px;
+    border-radius: 2px;
+    cursor: pointer;
+
+    img {
+      width: 48px;
+      height: 48px;
+    }
+
+    .setting-drawer-block-checbox-selectIcon {
+      position: absolute;
+      top: 0;
+      right: 0;
+      width: 100%;
+      height: 100%;
+      padding-top: 15px;
+      padding-left: 24px;
+      color: #1890ff;
+      font-weight: 700;
+      font-size: 14px;
+    }
+  }
+}
+
+.drawer-item {
+  color: var(--el-text-color-regular, rgba(0, 0, 0, 0.65));
+  padding: 12px 0;
+  font-size: 14px;
+
+  .comp-style {
+    float: right;
+    margin: -3px 8px 0px 0px;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/layout/components/Sidebar/Link.vue b/src/layout/components/Sidebar/Link.vue
new file mode 100644
index 0000000..8011431
--- /dev/null
+++ b/src/layout/components/Sidebar/Link.vue
@@ -0,0 +1,40 @@
+<template>
+  <component :is="type" v-bind="linkProps()">
+    <slot />
+  </component>
+</template>
+
+<script setup>
+import { isExternal } from '@/utils/validate'
+
+const props = defineProps({
+  to: {
+    type: [String, Object],
+    required: true
+  }
+})
+
+const isExt = computed(() => {
+  return isExternal(props.to)
+})
+
+const type = computed(() => {
+  if (isExt.value) {
+    return 'a'
+  }
+  return 'router-link'
+})
+
+function linkProps() {
+  if (isExt.value) {
+    return {
+      href: props.to,
+      target: '_blank',
+      rel: 'noopener'
+    }
+  }
+  return {
+    to: props.to
+  }
+}
+</script>
diff --git a/src/layout/components/Sidebar/Logo.vue b/src/layout/components/Sidebar/Logo.vue
new file mode 100644
index 0000000..05387bc
--- /dev/null
+++ b/src/layout/components/Sidebar/Logo.vue
@@ -0,0 +1,99 @@
+<template>
+  <div class="sidebar-logo-container" :class="{ 'collapse': collapse }">
+    <transition name="sidebarLogoFade">
+      <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
+        <img v-if="logo" :src="logo" class="sidebar-logo" />
+        <h1 v-else class="sidebar-title">{{ title }}</h1>
+      </router-link>
+      <router-link v-else key="expand" class="sidebar-logo-link" to="/">
+        <img v-if="logo" :src="logo" class="sidebar-logo" />
+        <h1 class="sidebar-title">{{ title }}</h1>
+      </router-link>
+    </transition>
+  </div>
+</template>
+
+<script setup>
+import logo from '@/assets/logo/logo.png'
+import useSettingsStore from '@/store/modules/settings'
+import variables from '@/assets/styles/variables.module.scss'
+
+defineProps({
+  collapse: {
+    type: Boolean,
+    required: true
+  }
+})
+
+const title = import.meta.env.VITE_APP_TITLE;
+const settingsStore = useSettingsStore();
+const sideTheme = computed(() => settingsStore.sideTheme);
+
+// 获取Logo背景色
+const getLogoBackground = computed(() => {
+  if (settingsStore.isDark) {
+    return 'var(--sidebar-bg)';
+  }
+  return sideTheme.value === 'theme-dark' ? variables.menuBg : variables.menuLightBg;
+});
+
+// 获取Logo文字颜色
+const getLogoTextColor = computed(() => {
+  if (settingsStore.isDark) {
+    return 'var(--sidebar-text)';
+  }
+  return sideTheme.value === 'theme-dark' ? '#fff' : variables.menuLightText;
+});
+</script>
+
+<style lang="scss" scoped>
+@import '@/assets/styles/variables.module.scss';
+
+.sidebarLogoFade-enter-active {
+  transition: opacity 1.5s;
+}
+
+.sidebarLogoFade-enter,
+.sidebarLogoFade-leave-to {
+  opacity: 0;
+}
+
+.sidebar-logo-container {
+  position: relative;
+  width: 100%;
+  height: 50px;
+  line-height: 50px;
+  background: v-bind(getLogoBackground);
+  text-align: center;
+  overflow: hidden;
+
+  & .sidebar-logo-link {
+    height: 100%;
+    width: 100%;
+
+    & .sidebar-logo {
+      width: 32px;
+      height: 32px;
+      vertical-align: middle;
+      margin-right: 12px;
+    }
+
+    & .sidebar-title {
+      display: inline-block;
+      margin: 0;
+      color: v-bind(getLogoTextColor);
+      font-weight: 600;
+      line-height: 50px;
+      font-size: 14px;
+      font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
+      vertical-align: middle;
+    }
+  }
+
+  &.collapse {
+    .sidebar-logo {
+      margin-right: 0px;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/layout/components/Sidebar/SidebarItem.vue b/src/layout/components/Sidebar/SidebarItem.vue
new file mode 100644
index 0000000..b43bca7
--- /dev/null
+++ b/src/layout/components/Sidebar/SidebarItem.vue
@@ -0,0 +1,100 @@
+<template>
+  <div v-if="!item.hidden">
+    <template v-if="hasOneShowingChild(item.children, item) && (!onlyOneChild.children || onlyOneChild.noShowingChildren) && !item.alwaysShow">
+      <app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path, onlyOneChild.query)">
+        <el-menu-item :index="resolvePath(onlyOneChild.path)" :class="{ 'submenu-title-noDropdown': !isNest }">
+          <svg-icon :icon-class="onlyOneChild.meta.icon || (item.meta && item.meta.icon)"/>
+          <template #title><span class="menu-title" :title="hasTitle(onlyOneChild.meta.title)">{{ onlyOneChild.meta.title }}</span></template>
+        </el-menu-item>
+      </app-link>
+    </template>
+
+    <el-sub-menu v-else ref="subMenu" :index="resolvePath(item.path)" teleported>
+      <template v-if="item.meta" #title>
+        <svg-icon :icon-class="item.meta && item.meta.icon" />
+        <span class="menu-title" :title="hasTitle(item.meta.title)">{{ item.meta.title }}</span>
+      </template>
+
+      <sidebar-item
+        v-for="(child, index) in item.children"
+        :key="child.path + index"
+        :is-nest="true"
+        :item="child"
+        :base-path="resolvePath(child.path)"
+        class="nest-menu"
+      />
+    </el-sub-menu>
+  </div>
+</template>
+
+<script setup>
+import { isExternal } from '@/utils/validate'
+import AppLink from './Link'
+import { getNormalPath } from '@/utils/ruoyi'
+
+const props = defineProps({
+  // route object
+  item: {
+    type: Object,
+    required: true
+  },
+  isNest: {
+    type: Boolean,
+    default: false
+  },
+  basePath: {
+    type: String,
+    default: ''
+  }
+})
+
+const onlyOneChild = ref({});
+
+function hasOneShowingChild(children = [], parent) {
+  if (!children) {
+    children = [];
+  }
+  const showingChildren = children.filter(item => {
+    if (item.hidden) {
+      return false
+    }
+    onlyOneChild.value = item
+    return true
+  })
+
+  // When there is only one child router, the child router is displayed by default
+  if (showingChildren.length === 1) {
+    return true
+  }
+
+  // Show parent if there are no child router to display
+  if (showingChildren.length === 0) {
+    onlyOneChild.value = { ...parent, path: '', noShowingChildren: true }
+    return true
+  }
+
+  return false
+};
+
+function resolvePath(routePath, routeQuery) {
+  if (isExternal(routePath)) {
+    return routePath
+  }
+  if (isExternal(props.basePath)) {
+    return props.basePath
+  }
+  if (routeQuery) {
+    let query = JSON.parse(routeQuery);
+    return { path: getNormalPath(props.basePath + '/' + routePath), query: query }
+  }
+  return getNormalPath(props.basePath + '/' + routePath)
+}
+
+function hasTitle(title){
+  if (title.length > 5) {
+    return title;
+  } else {
+    return "";
+  }
+}
+</script>
diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue
new file mode 100644
index 0000000..f0fdf88
--- /dev/null
+++ b/src/layout/components/Sidebar/index.vue
@@ -0,0 +1,104 @@
+<template>
+  <div :class="{ 'has-logo': showLogo }" class="sidebar-container">
+    <logo v-if="showLogo" :collapse="isCollapse" />
+    <el-scrollbar wrap-class="scrollbar-wrapper">
+      <el-menu
+        :default-active="activeMenu"
+        :collapse="isCollapse"
+        :background-color="getMenuBackground"
+        :text-color="getMenuTextColor"
+        :unique-opened="true"
+        :active-text-color="theme"
+        :collapse-transition="false"
+        mode="vertical"
+        :class="sideTheme"
+      >
+        <sidebar-item
+          v-for="(route, index) in sidebarRouters"
+          :key="route.path + index"
+          :item="route"
+          :base-path="route.path"
+        />
+      </el-menu>
+    </el-scrollbar>
+  </div>
+</template>
+
+<script setup>
+import Logo from './Logo'
+import SidebarItem from './SidebarItem'
+import variables from '@/assets/styles/variables.module.scss'
+import useAppStore from '@/store/modules/app'
+import useSettingsStore from '@/store/modules/settings'
+import usePermissionStore from '@/store/modules/permission'
+
+const route = useRoute();
+const appStore = useAppStore()
+const settingsStore = useSettingsStore()
+const permissionStore = usePermissionStore()
+
+const sidebarRouters = computed(() => permissionStore.sidebarRouters);
+const showLogo = computed(() => settingsStore.sidebarLogo);
+const sideTheme = computed(() => settingsStore.sideTheme);
+const theme = computed(() => settingsStore.theme);
+const isCollapse = computed(() => !appStore.sidebar.opened);
+
+// 获取菜单背景色
+const getMenuBackground = computed(() => {
+  if (settingsStore.isDark) {
+    return 'var(--sidebar-bg)';
+  }
+  return sideTheme.value === 'theme-dark' ? variables.menuBg : variables.menuLightBg;
+});
+
+// 获取菜单文字颜色
+const getMenuTextColor = computed(() => {
+  if (settingsStore.isDark) {
+    return 'var(--sidebar-text)';
+  }
+  return sideTheme.value === 'theme-dark' ? variables.menuText : variables.menuLightText;
+});
+
+const activeMenu = computed(() => {
+  const { meta, path } = route;
+  if (meta.activeMenu) {
+    return meta.activeMenu;
+  }
+  return path;
+});
+</script>
+
+<style lang="scss" scoped>
+.sidebar-container {
+  background-color: v-bind(getMenuBackground);
+  
+  .scrollbar-wrapper {
+    background-color: v-bind(getMenuBackground);
+  }
+
+  .el-menu {
+    border: none;
+    height: 100%;
+    width: 100% !important;
+    
+    .el-menu-item, .el-sub-menu__title {
+      &:hover {
+        background-color: var(--menu-hover, rgba(0, 0, 0, 0.06)) !important;
+      }
+    }
+
+    .el-menu-item {
+      color: v-bind(getMenuTextColor);
+      
+      &.is-active {
+        color: var(--menu-active-text, #409eff);
+        background-color: var(--menu-hover, rgba(0, 0, 0, 0.06)) !important;
+      }
+    }
+
+    .el-sub-menu__title {
+      color: v-bind(getMenuTextColor);
+    }
+  }
+}
+</style>
diff --git a/src/layout/components/TagsView/ScrollPane.vue b/src/layout/components/TagsView/ScrollPane.vue
new file mode 100644
index 0000000..ba92f64
--- /dev/null
+++ b/src/layout/components/TagsView/ScrollPane.vue
@@ -0,0 +1,107 @@
+<template>
+  <el-scrollbar
+    ref="scrollContainer"
+    :vertical="false"
+    class="scroll-container"
+    @wheel.prevent="handleScroll"
+  >
+    <slot />
+  </el-scrollbar>
+</template>
+
+<script setup>
+import useTagsViewStore from '@/store/modules/tagsView'
+
+const tagAndTagSpacing = ref(4);
+const { proxy } = getCurrentInstance();
+
+const scrollWrapper = computed(() => proxy.$refs.scrollContainer.$refs.wrapRef);
+
+onMounted(() => {
+  scrollWrapper.value.addEventListener('scroll', emitScroll, true)
+})
+
+onBeforeUnmount(() => {
+  scrollWrapper.value.removeEventListener('scroll', emitScroll)
+})
+
+function handleScroll(e) {
+  const eventDelta = e.wheelDelta || -e.deltaY * 40
+  const $scrollWrapper = scrollWrapper.value;
+  $scrollWrapper.scrollLeft = $scrollWrapper.scrollLeft + eventDelta / 4
+}
+
+const emits = defineEmits()
+const emitScroll = () => {
+  emits('scroll')
+}
+
+const tagsViewStore = useTagsViewStore()
+const visitedViews = computed(() => tagsViewStore.visitedViews);
+
+function moveToTarget(currentTag) {
+  const $container = proxy.$refs.scrollContainer.$el
+  const $containerWidth = $container.offsetWidth
+  const $scrollWrapper = scrollWrapper.value;
+
+  let firstTag = null
+  let lastTag = null
+
+  // find first tag and last tag
+  if (visitedViews.value.length > 0) {
+    firstTag = visitedViews.value[0]
+    lastTag = visitedViews.value[visitedViews.value.length - 1]
+  }
+
+  if (firstTag === currentTag) {
+    $scrollWrapper.scrollLeft = 0
+  } else if (lastTag === currentTag) {
+    $scrollWrapper.scrollLeft = $scrollWrapper.scrollWidth - $containerWidth
+  } else {
+    const tagListDom = document.getElementsByClassName('tags-view-item');
+    const currentIndex = visitedViews.value.findIndex(item => item === currentTag)
+    let prevTag = null
+    let nextTag = null
+    for (const k in tagListDom) {
+      if (k !== 'length' && Object.hasOwnProperty.call(tagListDom, k)) {
+        if (tagListDom[k].dataset.path === visitedViews.value[currentIndex - 1].path) {
+          prevTag = tagListDom[k];
+        }
+        if (tagListDom[k].dataset.path === visitedViews.value[currentIndex + 1].path) {
+          nextTag = tagListDom[k];
+        }
+      }
+    }
+
+    // the tag's offsetLeft after of nextTag
+    const afterNextTagOffsetLeft = nextTag.offsetLeft + nextTag.offsetWidth + tagAndTagSpacing.value
+
+    // the tag's offsetLeft before of prevTag
+    const beforePrevTagOffsetLeft = prevTag.offsetLeft - tagAndTagSpacing.value
+    if (afterNextTagOffsetLeft > $scrollWrapper.scrollLeft + $containerWidth) {
+      $scrollWrapper.scrollLeft = afterNextTagOffsetLeft - $containerWidth
+    } else if (beforePrevTagOffsetLeft < $scrollWrapper.scrollLeft) {
+      $scrollWrapper.scrollLeft = beforePrevTagOffsetLeft
+    }
+  }
+}
+
+defineExpose({
+  moveToTarget,
+})
+</script>
+
+<style lang='scss' scoped>
+.scroll-container {
+  white-space: nowrap;
+  position: relative;
+  overflow: hidden;
+  width: 100%;
+  :deep(.el-scrollbar__bar) {
+    bottom: 0px;
+  }
+  :deep(.el-scrollbar__wrap) {
+    height: 39px;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/layout/components/TagsView/index.vue b/src/layout/components/TagsView/index.vue
new file mode 100644
index 0000000..2755df8
--- /dev/null
+++ b/src/layout/components/TagsView/index.vue
@@ -0,0 +1,365 @@
+<template>
+  <div id="tags-view-container" class="tags-view-container">
+    <scroll-pane ref="scrollPaneRef" class="tags-view-wrapper" @scroll="handleScroll">
+      <router-link
+        v-for="tag in visitedViews"
+        :key="tag.path"
+        :data-path="tag.path"
+        :class="isActive(tag) ? 'active' : ''"
+        :to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }"
+        class="tags-view-item"
+        :style="activeStyle(tag)"
+        @click.middle="!isAffix(tag) ? closeSelectedTag(tag) : ''"
+        @contextmenu.prevent="openMenu(tag, $event)"
+      >
+        {{ tag.title }}
+        <span v-if="!isAffix(tag)" @click.prevent.stop="closeSelectedTag(tag)">
+          <close class="el-icon-close" style="width: 1em; height: 1em;vertical-align: middle;" />
+        </span>
+      </router-link>
+    </scroll-pane>
+    <ul v-show="visible" :style="{ left: left + 'px', top: top + 'px' }" class="contextmenu">
+      <li @click="refreshSelectedTag(selectedTag)">
+        <refresh-right style="width: 1em; height: 1em;" /> 刷新页面
+      </li>
+      <li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)">
+        <close style="width: 1em; height: 1em;" /> 关闭当前
+      </li>
+      <li @click="closeOthersTags">
+        <circle-close style="width: 1em; height: 1em;" /> 关闭其他
+      </li>
+      <li v-if="!isFirstView()" @click="closeLeftTags">
+        <back style="width: 1em; height: 1em;" /> 关闭左侧
+      </li>
+      <li v-if="!isLastView()" @click="closeRightTags">
+        <right style="width: 1em; height: 1em;" /> 关闭右侧
+      </li>
+      <li @click="closeAllTags(selectedTag)">
+        <circle-close style="width: 1em; height: 1em;" /> 全部关闭
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script setup>
+import ScrollPane from './ScrollPane'
+import { getNormalPath } from '@/utils/ruoyi'
+import useTagsViewStore from '@/store/modules/tagsView'
+import useSettingsStore from '@/store/modules/settings'
+import usePermissionStore from '@/store/modules/permission'
+
+const visible = ref(false);
+const top = ref(0);
+const left = ref(0);
+const selectedTag = ref({});
+const affixTags = ref([]);
+const scrollPaneRef = ref(null);
+
+const { proxy } = getCurrentInstance();
+const route = useRoute();
+const router = useRouter();
+
+const visitedViews = computed(() => useTagsViewStore().visitedViews);
+const routes = computed(() => usePermissionStore().routes);
+const theme = computed(() => useSettingsStore().theme);
+
+watch(route, () => {
+  addTags()
+  moveToCurrentTag()
+})
+
+watch(visible, (value) => {
+  if (value) {
+    document.body.addEventListener('click', closeMenu)
+  } else {
+    document.body.removeEventListener('click', closeMenu)
+  }
+})
+
+onMounted(() => {
+  initTags()
+  addTags()
+})
+
+function isActive(r) {
+  return r.path === route.path
+}
+
+function activeStyle(tag) {
+  if (!isActive(tag)) return {};
+  return {
+    "background-color": theme.value,
+    "border-color": theme.value
+  };
+}
+
+function isAffix(tag) {
+  return tag.meta && tag.meta.affix
+}
+
+function isFirstView() {
+  try {
+    return selectedTag.value.fullPath === '/index' || selectedTag.value.fullPath === visitedViews.value[1].fullPath
+  } catch (err) {
+    return false
+  }
+}
+
+function isLastView() {
+  try {
+    return selectedTag.value.fullPath === visitedViews.value[visitedViews.value.length - 1].fullPath
+  } catch (err) {
+    return false
+  }
+}
+
+function filterAffixTags(routes, basePath = '') {
+  let tags = []
+  routes.forEach(route => {
+    if (route.meta && route.meta.affix) {
+      const tagPath = getNormalPath(basePath + '/' + route.path)
+      tags.push({
+        fullPath: tagPath,
+        path: tagPath,
+        name: route.name,
+        meta: { ...route.meta }
+      })
+    }
+    if (route.children) {
+      const tempTags = filterAffixTags(route.children, route.path)
+      if (tempTags.length >= 1) {
+        tags = [...tags, ...tempTags]
+      }
+    }
+  })
+  return tags
+}
+
+function initTags() {
+  const res = filterAffixTags(routes.value);
+  affixTags.value = res;
+  for (const tag of res) {
+    // Must have tag name
+    if (tag.name) {
+       useTagsViewStore().addVisitedView(tag)
+    }
+  }
+}
+
+function addTags() {
+  const { name } = route
+  if (name) {
+    useTagsViewStore().addView(route)
+  }
+}
+
+function moveToCurrentTag() {
+  nextTick(() => {
+    for (const r of visitedViews.value) {
+      if (r.path === route.path) {
+        scrollPaneRef.value.moveToTarget(r);
+        // when query is different then update
+        if (r.fullPath !== route.fullPath) {
+          useTagsViewStore().updateVisitedView(route)
+        }
+      }
+    }
+  })
+}
+
+function refreshSelectedTag(view) {
+  proxy.$tab.refreshPage(view);
+  if (route.meta.link) {
+    useTagsViewStore().delIframeView(route);
+  }
+}
+
+function closeSelectedTag(view) {
+  proxy.$tab.closePage(view).then(({ visitedViews }) => {
+    if (isActive(view)) {
+      toLastView(visitedViews, view)
+    }
+  })
+}
+
+function closeRightTags() {
+  proxy.$tab.closeRightPage(selectedTag.value).then(visitedViews => {
+    if (!visitedViews.find(i => i.fullPath === route.fullPath)) {
+      toLastView(visitedViews)
+    }
+  })
+}
+
+function closeLeftTags() {
+  proxy.$tab.closeLeftPage(selectedTag.value).then(visitedViews => {
+    if (!visitedViews.find(i => i.fullPath === route.fullPath)) {
+      toLastView(visitedViews)
+    }
+  })
+}
+
+function closeOthersTags() {
+  router.push(selectedTag.value).catch(() => { });
+  proxy.$tab.closeOtherPage(selectedTag.value).then(() => {
+    moveToCurrentTag()
+  })
+}
+
+function closeAllTags(view) {
+  proxy.$tab.closeAllPage().then(({ visitedViews }) => {
+    if (affixTags.value.some(tag => tag.path === route.path)) {
+      return
+    }
+    toLastView(visitedViews, view)
+  })
+}
+
+function toLastView(visitedViews, view) {
+  const latestView = visitedViews.slice(-1)[0]
+  if (latestView) {
+    router.push(latestView.fullPath)
+  } else {
+    // now the default is to redirect to the home page if there is no tags-view,
+    // you can adjust it according to your needs.
+    if (view.name === 'Dashboard') {
+      // to reload home page
+      router.replace({ path: '/redirect' + view.fullPath })
+    } else {
+      router.push('/')
+    }
+  }
+}
+
+function openMenu(tag, e) {
+  const menuMinWidth = 105
+  const offsetLeft = proxy.$el.getBoundingClientRect().left // container margin left
+  const offsetWidth = proxy.$el.offsetWidth // container width
+  const maxLeft = offsetWidth - menuMinWidth // left boundary
+  const l = e.clientX - offsetLeft + 15 // 15: margin right
+
+  if (l > maxLeft) {
+    left.value = maxLeft
+  } else {
+    left.value = l
+  }
+
+  top.value = e.clientY
+  visible.value = true
+  selectedTag.value = tag
+}
+
+function closeMenu() {
+  visible.value = false
+}
+
+function handleScroll() {
+  closeMenu()
+}
+</script>
+
+<style lang="scss" scoped>
+.tags-view-container {
+  height: 34px;
+  width: 100%;
+  background: var(--tags-bg, #fff);
+  border-bottom: 1px solid var(--tags-item-border, #d8dce5);
+  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04);
+
+  .tags-view-wrapper {
+    .tags-view-item {
+      display: inline-block;
+      position: relative;
+      cursor: pointer;
+      height: 26px;
+      line-height: 26px;
+      border: 1px solid var(--tags-item-border, #d8dce5);
+      color: var(--tags-item-text, #495060);
+      background: var(--tags-item-bg, #fff);
+      padding: 0 8px;
+      font-size: 12px;
+      margin-left: 5px;
+      margin-top: 4px;
+
+      &:first-of-type {
+        margin-left: 15px;
+      }
+
+      &:last-of-type {
+        margin-right: 15px;
+      }
+
+      &.active {
+        background-color: #42b983;
+        color: #fff;
+        border-color: #42b983;
+
+        &::before {
+          content: '';
+          background: #fff;
+          display: inline-block;
+          width: 8px;
+          height: 8px;
+          border-radius: 50%;
+          position: relative;
+          margin-right: 5px;
+        }
+      }
+    }
+  }
+
+  .contextmenu {
+    margin: 0;
+    background: var(--el-bg-color-overlay, #fff);
+    z-index: 3000;
+    position: absolute;
+    list-style-type: none;
+    padding: 5px 0;
+    border-radius: 4px;
+    font-size: 12px;
+    font-weight: 400;
+    color: var(--tags-item-text, #333);
+    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, .3);
+    border: 1px solid var(--el-border-color-light, #e4e7ed);
+
+    li {
+      margin: 0;
+      padding: 7px 16px;
+      cursor: pointer;
+
+      &:hover {
+        background: var(--tags-item-hover, #eee);
+      }
+    }
+  }
+}
+</style>
+
+<style lang="scss">
+//reset element css of el-icon-close
+.tags-view-wrapper {
+  .tags-view-item {
+    .el-icon-close {
+      width: 16px;
+      height: 16px;
+      vertical-align: 2px;
+      border-radius: 50%;
+      text-align: center;
+      transition: all .3s cubic-bezier(.645, .045, .355, 1);
+      transform-origin: 100% 50%;
+
+      &:before {
+        transform: scale(.6);
+        display: inline-block;
+        vertical-align: -3px;
+      }
+
+      &:hover {
+        background-color: var(--tags-close-hover, #b4bccc);
+        color: #fff;
+        width: 12px !important;
+        height: 12px !important;
+      }
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/layout/components/index.js b/src/layout/components/index.js
new file mode 100644
index 0000000..fd57731
--- /dev/null
+++ b/src/layout/components/index.js
@@ -0,0 +1,4 @@
+export { default as AppMain } from './AppMain'
+export { default as Navbar } from './Navbar'
+export { default as Settings } from './Settings'
+export { default as TagsView } from './TagsView/index.vue'
diff --git a/src/layout/index.vue b/src/layout/index.vue
new file mode 100644
index 0000000..bad8dae
--- /dev/null
+++ b/src/layout/index.vue
@@ -0,0 +1,114 @@
+<template>
+  <div :class="classObj" class="app-wrapper" :style="{ '--current-color': theme }">
+    <div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
+    <sidebar v-if="!sidebar.hide" class="sidebar-container" />
+    <div :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
+      <div :class="{ 'fixed-header': fixedHeader }">
+        <navbar @setLayout="setLayout" />
+        <tags-view v-if="needTagsView" />
+      </div>
+      <app-main />
+      <settings ref="settingRef" />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { useWindowSize } from '@vueuse/core'
+import Sidebar from './components/Sidebar/index.vue'
+import { AppMain, Navbar, Settings, TagsView } from './components'
+import defaultSettings from '@/settings'
+
+import useAppStore from '@/store/modules/app'
+import useSettingsStore from '@/store/modules/settings'
+
+const settingsStore = useSettingsStore()
+const theme = computed(() => settingsStore.theme);
+const sideTheme = computed(() => settingsStore.sideTheme);
+const sidebar = computed(() => useAppStore().sidebar);
+const device = computed(() => useAppStore().device);
+const needTagsView = computed(() => settingsStore.tagsView);
+const fixedHeader = computed(() => settingsStore.fixedHeader);
+
+const classObj = computed(() => ({
+  hideSidebar: !sidebar.value.opened,
+  openSidebar: sidebar.value.opened,
+  withoutAnimation: sidebar.value.withoutAnimation,
+  mobile: device.value === 'mobile'
+}))
+
+const { width, height } = useWindowSize();
+const WIDTH = 992; // refer to Bootstrap's responsive design
+
+watch(() => device.value, () => {
+  if (device.value === 'mobile' && sidebar.value.opened) {
+    useAppStore().closeSideBar({ withoutAnimation: false })
+  }
+})
+
+watchEffect(() => {
+  if (width.value - 1 < WIDTH) {
+    useAppStore().toggleDevice('mobile')
+    useAppStore().closeSideBar({ withoutAnimation: true })
+  } else {
+    useAppStore().toggleDevice('desktop')
+  }
+})
+
+function handleClickOutside() {
+  useAppStore().closeSideBar({ withoutAnimation: false })
+}
+
+const settingRef = ref(null);
+function setLayout() {
+  settingRef.value.openSetting();
+}
+</script>
+
+<style lang="scss" scoped>
+  @import "@/assets/styles/mixin.scss";
+  @import "@/assets/styles/variables.module.scss";
+
+.app-wrapper {
+  @include clearfix;
+  position: relative;
+  height: 100%;
+  width: 100%;
+
+  &.mobile.openSidebar {
+    position: fixed;
+    top: 0;
+  }
+}
+
+.drawer-bg {
+  background: #000;
+  opacity: 0.3;
+  width: 100%;
+  top: 0;
+  height: 100%;
+  position: absolute;
+  z-index: 999;
+}
+
+.fixed-header {
+  position: fixed;
+  top: 0;
+  right: 0;
+  z-index: 9;
+  width: calc(100% - #{$base-sidebar-width});
+  transition: width 0.28s;
+}
+
+.hideSidebar .fixed-header {
+  width: calc(100% - 54px);
+}
+
+.sidebarHide .fixed-header {
+  width: 100%;
+}
+
+.mobile .fixed-header {
+  width: 100%;
+}
+</style>
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
new file mode 100644
index 0000000..0994583
--- /dev/null
+++ b/src/main.js
@@ -0,0 +1,82 @@
+import { createApp } from 'vue'
+
+import Cookies from 'js-cookie'
+
+import ElementPlus from 'element-plus'
+import 'element-plus/dist/index.css'
+import 'element-plus/theme-chalk/dark/css-vars.css'
+import locale from 'element-plus/es/locale/lang/zh-cn'
+
+import '@/assets/styles/index.scss' // global css
+
+import App from './App'
+import store from './store'
+import router from './router'
+import directive from './directive' // directive
+
+// 注册指令
+import plugins from './plugins' // plugins
+import { download } from '@/utils/request'
+
+// svg图标
+import 'virtual:svg-icons-register'
+import SvgIcon from '@/components/SvgIcon'
+import elementIcons from '@/components/SvgIcon/svgicon'
+
+import './permission' // permission control
+
+import { useDict } from '@/utils/dict'
+import { parseTime, resetForm, addDateRange, handleTree, selectDictLabel, selectDictLabels } from '@/utils/ruoyi'
+
+// 分页组件
+import Pagination from '@/components/Pagination'
+// 自定义表格工具组件
+import RightToolbar from '@/components/RightToolbar'
+// 富文本组件
+import Editor from "@/components/Editor"
+// 文件上传组件
+import FileUpload from "@/components/FileUpload"
+// 图片上传组件
+import ImageUpload from "@/components/ImageUpload"
+// 图片预览组件
+import ImagePreview from "@/components/ImagePreview"
+// 字典标签组件
+import DictTag from '@/components/DictTag'
+
+const app = createApp(App)
+
+// 全局方法挂载
+app.config.globalProperties.useDict = useDict
+app.config.globalProperties.download = download
+app.config.globalProperties.parseTime = parseTime
+app.config.globalProperties.resetForm = resetForm
+app.config.globalProperties.handleTree = handleTree
+app.config.globalProperties.addDateRange = addDateRange
+app.config.globalProperties.selectDictLabel = selectDictLabel
+app.config.globalProperties.selectDictLabels = selectDictLabels
+
+// 全局组件挂载
+app.component('DictTag', DictTag)
+app.component('Pagination', Pagination)
+app.component('FileUpload', FileUpload)
+app.component('ImageUpload', ImageUpload)
+app.component('ImagePreview', ImagePreview)
+app.component('RightToolbar', RightToolbar)
+app.component('Editor', Editor)
+
+app.use(router)
+app.use(store)
+app.use(plugins)
+app.use(elementIcons)
+app.component('svg-icon', SvgIcon)
+
+directive(app)
+
+// 使用element-plus 并且设置全局的大小
+app.use(ElementPlus, {
+  locale: locale,
+  // 支持 large、default、small
+  size: Cookies.get('size') || 'default'
+})
+
+app.mount('#app')
diff --git a/src/permission.js b/src/permission.js
new file mode 100644
index 0000000..7e3b5bf
--- /dev/null
+++ b/src/permission.js
@@ -0,0 +1,69 @@
+import router from './router'
+import { ElMessage } from 'element-plus'
+import NProgress from 'nprogress'
+import 'nprogress/nprogress.css'
+import { getToken } from '@/utils/auth'
+import { isHttp, isPathMatch } from '@/utils/validate'
+import { isRelogin } from '@/utils/request'
+import useUserStore from '@/store/modules/user'
+import useSettingsStore from '@/store/modules/settings'
+import usePermissionStore from '@/store/modules/permission'
+
+NProgress.configure({ showSpinner: false })
+
+const whiteList = ['/login', '/register']
+
+const isWhiteList = (path) => {
+  return whiteList.some(pattern => isPathMatch(pattern, path))
+}
+
+router.beforeEach((to, from, next) => {
+  NProgress.start()
+  if (getToken()) {
+    to.meta.title && useSettingsStore().setTitle(to.meta.title)
+    /* has token*/
+    if (to.path === '/login') {
+      next({ path: '/' })
+      NProgress.done()
+    } else if (isWhiteList(to.path)) {
+      next()
+    } else {
+      if (useUserStore().roles.length === 0) {
+        isRelogin.show = true
+        // 判断当前用户是否已拉取完user_info信息
+        useUserStore().getInfo().then(() => {
+          isRelogin.show = false
+          usePermissionStore().generateRoutes().then(accessRoutes => {
+            // 根据roles权限生成可访问的路由表
+            accessRoutes.forEach(route => {
+              if (!isHttp(route.path)) {
+                router.addRoute(route) // 动态添加可访问路由表
+              }
+            })
+            next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
+          })
+        }).catch(err => {
+          useUserStore().logOut().then(() => {
+            ElMessage.error(err)
+            next({ path: '/' })
+          })
+        })
+      } else {
+        next()
+      }
+    }
+  } else {
+    // 没有token
+    if (isWhiteList(to.path)) {
+      // 在免登录白名单，直接进入
+      next()
+    } else {
+      next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
+      NProgress.done()
+    }
+  }
+})
+
+router.afterEach(() => {
+  NProgress.done()
+})
diff --git a/src/plugins/auth.js b/src/plugins/auth.js
new file mode 100644
index 0000000..5e8c28d
--- /dev/null
+++ b/src/plugins/auth.js
@@ -0,0 +1,60 @@
+import useUserStore from '@/store/modules/user'
+
+function authPermission(permission) {
+  const all_permission = "*:*:*";
+  const permissions = useUserStore().permissions
+  if (permission && permission.length > 0) {
+    return permissions.some(v => {
+      return all_permission === v || v === permission
+    })
+  } else {
+    return false
+  }
+}
+
+function authRole(role) {
+  const super_admin = "admin";
+  const roles = useUserStore().roles
+  if (role && role.length > 0) {
+    return roles.some(v => {
+      return super_admin === v || v === role
+    })
+  } else {
+    return false
+  }
+}
+
+export default {
+  // 验证用户是否具备某权限
+  hasPermi(permission) {
+    return authPermission(permission);
+  },
+  // 验证用户是否含有指定权限，只需包含其中一个
+  hasPermiOr(permissions) {
+    return permissions.some(item => {
+      return authPermission(item)
+    })
+  },
+  // 验证用户是否含有指定权限，必须全部拥有
+  hasPermiAnd(permissions) {
+    return permissions.every(item => {
+      return authPermission(item)
+    })
+  },
+  // 验证用户是否具备某角色
+  hasRole(role) {
+    return authRole(role);
+  },
+  // 验证用户是否含有指定角色，只需包含其中一个
+  hasRoleOr(roles) {
+    return roles.some(item => {
+      return authRole(item)
+    })
+  },
+  // 验证用户是否含有指定角色，必须全部拥有
+  hasRoleAnd(roles) {
+    return roles.every(item => {
+      return authRole(item)
+    })
+  }
+}
diff --git a/src/plugins/cache.js b/src/plugins/cache.js
new file mode 100644
index 0000000..b67d453
--- /dev/null
+++ b/src/plugins/cache.js
@@ -0,0 +1,79 @@
+const sessionCache = {
+  set (key, value) {
+    if (!sessionStorage) {
+      return
+    }
+    if (key != null && value != null) {
+      sessionStorage.setItem(key, value)
+    }
+  },
+  get (key) {
+    if (!sessionStorage) {
+      return null
+    }
+    if (key == null) {
+      return null
+    }
+    return sessionStorage.getItem(key)
+  },
+  setJSON (key, jsonValue) {
+    if (jsonValue != null) {
+      this.set(key, JSON.stringify(jsonValue))
+    }
+  },
+  getJSON (key) {
+    const value = this.get(key)
+    if (value != null) {
+      return JSON.parse(value)
+    }
+    return null
+  },
+  remove (key) {
+    sessionStorage.removeItem(key);
+  }
+}
+const localCache = {
+  set (key, value) {
+    if (!localStorage) {
+      return
+    }
+    if (key != null && value != null) {
+      localStorage.setItem(key, value)
+    }
+  },
+  get (key) {
+    if (!localStorage) {
+      return null
+    }
+    if (key == null) {
+      return null
+    }
+    return localStorage.getItem(key)
+  },
+  setJSON (key, jsonValue) {
+    if (jsonValue != null) {
+      this.set(key, JSON.stringify(jsonValue))
+    }
+  },
+  getJSON (key) {
+    const value = this.get(key)
+    if (value != null) {
+      return JSON.parse(value)
+    }
+    return null
+  },
+  remove (key) {
+    localStorage.removeItem(key);
+  }
+}
+
+export default {
+  /**
+   * 会话级缓存
+   */
+  session: sessionCache,
+  /**
+   * 本地缓存
+   */
+  local: localCache
+}
diff --git a/src/plugins/download.js b/src/plugins/download.js
new file mode 100644
index 0000000..1a89efd
--- /dev/null
+++ b/src/plugins/download.js
@@ -0,0 +1,79 @@
+import axios from 'axios'
+import { ElLoading, ElMessage } from 'element-plus'
+import { saveAs } from 'file-saver'
+import { getToken } from '@/utils/auth'
+import errorCode from '@/utils/errorCode'
+import { blobValidate } from '@/utils/ruoyi'
+
+const baseURL = import.meta.env.VITE_APP_BASE_API
+let downloadLoadingInstance;
+
+export default {
+  name(name, isDelete = true) {
+    var url = baseURL + "/common/download?fileName=" + encodeURIComponent(name) + "&delete=" + isDelete
+    axios({
+      method: 'get',
+      url: url,
+      responseType: 'blob',
+      headers: { 'Authorization': 'Bearer ' + getToken() }
+    }).then((res) => {
+      const isBlob = blobValidate(res.data);
+      if (isBlob) {
+        const blob = new Blob([res.data])
+        this.saveAs(blob, decodeURIComponent(res.headers['download-filename']))
+      } else {
+        this.printErrMsg(res.data);
+      }
+    })
+  },
+  resource(resource) {
+    var url = baseURL + "/common/download/resource?resource=" + encodeURIComponent(resource);
+    axios({
+      method: 'get',
+      url: url,
+      responseType: 'blob',
+      headers: { 'Authorization': 'Bearer ' + getToken() }
+    }).then((res) => {
+      const isBlob = blobValidate(res.data);
+      if (isBlob) {
+        const blob = new Blob([res.data])
+        this.saveAs(blob, decodeURIComponent(res.headers['download-filename']))
+      } else {
+        this.printErrMsg(res.data);
+      }
+    })
+  },
+  zip(url, name) {
+    var url = baseURL + url
+    downloadLoadingInstance = ElLoading.service({ text: "正在下载数据，请稍候", background: "rgba(0, 0, 0, 0.7)", })
+    axios({
+      method: 'get',
+      url: url,
+      responseType: 'blob',
+      headers: { 'Authorization': 'Bearer ' + getToken() }
+    }).then((res) => {
+      const isBlob = blobValidate(res.data);
+      if (isBlob) {
+        const blob = new Blob([res.data], { type: 'application/zip' })
+        this.saveAs(blob, name)
+      } else {
+        this.printErrMsg(res.data);
+      }
+      downloadLoadingInstance.close();
+    }).catch((r) => {
+      console.error(r)
+      ElMessage.error('下载文件出现错误，请联系管理员！')
+      downloadLoadingInstance.close();
+    })
+  },
+  saveAs(text, name, opts) {
+    saveAs(text, name, opts);
+  },
+  async printErrMsg(data) {
+    const resText = await data.text();
+    const rspObj = JSON.parse(resText);
+    const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
+    ElMessage.error(errMsg);
+  }
+}
+
diff --git a/src/plugins/index.js b/src/plugins/index.js
new file mode 100644
index 0000000..47d1b41
--- /dev/null
+++ b/src/plugins/index.js
@@ -0,0 +1,18 @@
+import tab from './tab'
+import auth from './auth'
+import cache from './cache'
+import modal from './modal'
+import download from './download'
+
+export default function installPlugins(app){
+  // 页签操作
+  app.config.globalProperties.$tab = tab
+  // 认证对象
+  app.config.globalProperties.$auth = auth
+  // 缓存对象
+  app.config.globalProperties.$cache = cache
+  // 模态框对象
+  app.config.globalProperties.$modal = modal
+  // 下载文件
+  app.config.globalProperties.$download = download
+}
diff --git a/src/plugins/modal.js b/src/plugins/modal.js
new file mode 100644
index 0000000..b59e14d
--- /dev/null
+++ b/src/plugins/modal.js
@@ -0,0 +1,82 @@
+import { ElMessage, ElMessageBox, ElNotification, ElLoading } from 'element-plus'
+
+let loadingInstance;
+
+export default {
+  // 消息提示
+  msg(content) {
+    ElMessage.info(content)
+  },
+  // 错误消息
+  msgError(content) {
+    ElMessage.error(content)
+  },
+  // 成功消息
+  msgSuccess(content) {
+    ElMessage.success(content)
+  },
+  // 警告消息
+  msgWarning(content) {
+    ElMessage.warning(content)
+  },
+  // 弹出提示
+  alert(content) {
+    ElMessageBox.alert(content, "系统提示")
+  },
+  // 错误提示
+  alertError(content) {
+    ElMessageBox.alert(content, "系统提示", { type: 'error' })
+  },
+  // 成功提示
+  alertSuccess(content) {
+    ElMessageBox.alert(content, "系统提示", { type: 'success' })
+  },
+  // 警告提示
+  alertWarning(content) {
+    ElMessageBox.alert(content, "系统提示", { type: 'warning' })
+  },
+  // 通知提示
+  notify(content) {
+    ElNotification.info(content)
+  },
+  // 错误通知
+  notifyError(content) {
+    ElNotification.error(content);
+  },
+  // 成功通知
+  notifySuccess(content) {
+    ElNotification.success(content)
+  },
+  // 警告通知
+  notifyWarning(content) {
+    ElNotification.warning(content)
+  },
+  // 确认窗体
+  confirm(content) {
+    return ElMessageBox.confirm(content, "系统提示", {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: "warning",
+    })
+  },
+  // 提交内容
+  prompt(content) {
+    return ElMessageBox.prompt(content, "系统提示", {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: "warning",
+    })
+  },
+  // 打开遮罩层
+  loading(content) {
+    loadingInstance = ElLoading.service({
+      lock: true,
+      text: content,
+      background: "rgba(0, 0, 0, 0.7)",
+    })
+  },
+  // 关闭遮罩层
+  closeLoading() {
+    loadingInstance.close();
+  }
+}
diff --git a/src/plugins/tab.js b/src/plugins/tab.js
new file mode 100644
index 0000000..7b51cf5
--- /dev/null
+++ b/src/plugins/tab.js
@@ -0,0 +1,69 @@
+import useTagsViewStore from '@/store/modules/tagsView'
+import router from '@/router'
+
+export default {
+  // 刷新当前tab页签
+  refreshPage(obj) {
+    const { path, query, matched } = router.currentRoute.value;
+    if (obj === undefined) {
+      matched.forEach((m) => {
+        if (m.components && m.components.default && m.components.default.name) {
+          if (!['Layout', 'ParentView'].includes(m.components.default.name)) {
+            obj = { name: m.components.default.name, path: path, query: query };
+          }
+        }
+      });
+    }
+    return useTagsViewStore().delCachedView(obj).then(() => {
+      const { path, query } = obj
+      router.replace({
+        path: '/redirect' + path,
+        query: query
+      })
+    })
+  },
+  // 关闭当前tab页签，打开新页签
+  closeOpenPage(obj) {
+    useTagsViewStore().delView(router.currentRoute.value);
+    if (obj !== undefined) {
+      return router.push(obj);
+    }
+  },
+  // 关闭指定tab页签
+  closePage(obj) {
+    if (obj === undefined) {
+      return useTagsViewStore().delView(router.currentRoute.value).then(({ visitedViews }) => {
+        const latestView = visitedViews.slice(-1)[0]
+        if (latestView) {
+          return router.push(latestView.fullPath)
+        }
+        return router.push('/');
+      });
+    }
+    return useTagsViewStore().delView(obj);
+  },
+  // 关闭所有tab页签
+  closeAllPage() {
+    return useTagsViewStore().delAllViews();
+  },
+  // 关闭左侧tab页签
+  closeLeftPage(obj) {
+    return useTagsViewStore().delLeftTags(obj || router.currentRoute.value);
+  },
+  // 关闭右侧tab页签
+  closeRightPage(obj) {
+    return useTagsViewStore().delRightTags(obj || router.currentRoute.value);
+  },
+  // 关闭其他tab页签
+  closeOtherPage(obj) {
+    return useTagsViewStore().delOthersViews(obj || router.currentRoute.value);
+  },
+  // 打开tab页签
+  openPage(url) {
+    return router.push(url);
+  },
+  // 修改tab页签
+  updatePage(obj) {
+    return useTagsViewStore().updateVisitedView(obj);
+  }
+}
diff --git a/src/router/index.js b/src/router/index.js
new file mode 100644
index 0000000..ee8f56a
--- /dev/null
+++ b/src/router/index.js
@@ -0,0 +1,174 @@
+import { createWebHistory, createRouter } from 'vue-router'
+/* Layout */
+import Layout from '@/layout'
+
+/**
+ * Note: 路由配置项
+ *
+ * hidden: true                     // 当设置 true 的时候该路由不会再侧边栏出现 如401，login等页面，或者如一些编辑页面/edit/1
+ * alwaysShow: true                 // 当你一个路由下面的 children 声明的路由大于1个时，自动会变成嵌套的模式--如组件页面
+ *                                  // 只有一个时，会将那个子路由当做根路由显示在侧边栏--如引导页面
+ *                                  // 若你想不管路由下面的 children 声明的个数都显示你的根路由
+ *                                  // 你可以设置 alwaysShow: true，这样它就会忽略之前定义的规则，一直显示根路由
+ * redirect: noRedirect             // 当设置 noRedirect 的时候该路由在面包屑导航中不可被点击
+ * name:'router-name'               // 设定路由的名字，一定要填写不然使用<keep-alive>时会出现各种问题
+ * query: '{"id": 1, "name": "ry"}' // 访问路由的默认传递参数
+ * roles: ['admin', 'common']       // 访问路由的角色权限
+ * permissions: ['a:a:a', 'b:b:b']  // 访问路由的菜单权限
+ * meta : {
+    noCache: true                   // 如果设置为true，则不会被 <keep-alive> 缓存(默认 false)
+    title: 'title'                  // 设置该路由在侧边栏和面包屑中展示的名字
+    icon: 'svg-name'                // 设置该路由的图标，对应路径src/assets/icons/svg
+    breadcrumb: false               // 如果设置为false，则不会在breadcrumb面包屑中显示
+    activeMenu: '/system/user'      // 当路由设置了该属性，则会高亮相对应的侧边栏。
+  }
+ */
+
+// 公共路由
+export const constantRoutes = [
+  {
+    path: '/redirect',
+    component: Layout,
+    hidden: true,
+    children: [
+      {
+        path: '/redirect/:path(.*)',
+        component: () => import('@/views/redirect/index.vue')
+      }
+    ]
+  },
+  {
+    path: '/login',
+    component: () => import('@/views/login'),
+    hidden: true
+  },
+  {
+    path: '/register',
+    component: () => import('@/views/register'),
+    hidden: true
+  },
+  {
+    path: "/:pathMatch(.*)*",
+    component: () => import('@/views/error/404'),
+    hidden: true
+  },
+  {
+    path: '/401',
+    component: () => import('@/views/error/401'),
+    hidden: true
+  },
+  {
+    path: '',
+    component: Layout,
+    redirect: '/index',
+    children: [
+      {
+        path: '/index',
+        component: () => import('@/views/index'),
+        name: 'Index',
+        meta: { title: '仪表盘', icon: 'dashboard', affix: true }
+      }
+    ]
+  },
+  {
+    path: '/user',
+    component: Layout,
+    hidden: true,
+    redirect: 'noredirect',
+    children: [
+      {
+        path: 'profile',
+        component: () => import('@/views/system/user/profile/index'),
+        name: 'Profile',
+        meta: { title: '个人中心', icon: 'user' }
+      }
+    ]
+  }
+]
+
+// 动态路由，基于用户权限动态去加载
+export const dynamicRoutes = [
+  {
+    path: '/system/user-auth',
+    component: Layout,
+    hidden: false,
+    permissions: ['system:user:edit'],
+    children: [
+      {
+        path: 'role/:userId(\\d+)',
+        component: () => import('@/views/system/user/authRole'),
+        name: 'AuthRole',
+        meta: { title: '分配角色', activeMenu: '/system/user' }
+      }
+    ]
+  },
+  {
+    path: '/system/role-auth',
+    component: Layout,
+    hidden: true,
+    permissions: ['system:role:edit'],
+    children: [
+      {
+        path: 'user/:roleId(\\d+)',
+        component: () => import('@/views/system/role/authUser'),
+        name: 'AuthUser',
+        meta: { title: '分配用户', activeMenu: '/system/role' }
+      }
+    ]
+  },
+  {
+    path: '/system/dict-data',
+    component: Layout,
+    hidden: true,
+    permissions: ['system:dict:list'],
+    children: [
+      {
+        path: 'index/:dictId(\\d+)',
+        component: () => import('@/views/system/dict/data'),
+        name: 'Data',
+        meta: { title: '字典数据', activeMenu: '/system/dict' }
+      }
+    ]
+  },
+  {
+    path: '/monitor/job-log',
+    component: Layout,
+    hidden: true,
+    permissions: ['monitor:job:list'],
+    children: [
+      {
+        path: 'index/:jobId(\\d+)',
+        component: () => import('@/views/monitor/job/log'),
+        name: 'JobLog',
+        meta: { title: '调度日志', activeMenu: '/monitor/job' }
+      }
+    ]
+  },
+  {
+    path: '/tool/gen-edit',
+    component: Layout,
+    hidden: true,
+    permissions: ['tool:gen:edit'],
+    children: [
+      {
+        path: 'index/:tableId(\\d+)',
+        component: () => import('@/views/tool/gen/editTable'),
+        name: 'GenEdit',
+        meta: { title: '修改生成配置', activeMenu: '/tool/gen' }
+      }
+    ]
+  }
+]
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes: constantRoutes,
+  scrollBehavior(to, from, savedPosition) {
+    if (savedPosition) {
+      return savedPosition
+    }
+    return { top: 0 }
+  },
+});
+
+export default router;
diff --git a/src/settings.js b/src/settings.js
new file mode 100644
index 0000000..124f5fb
--- /dev/null
+++ b/src/settings.js
@@ -0,0 +1,47 @@
+export default {
+  /**
+   * 网页标题
+   */
+  title: import.meta.env.VITE_APP_TITLE,
+  /**
+   * 侧边栏主题 深色主题theme-dark，浅色主题theme-light
+   */
+  sideTheme: 'theme-light',
+  /**
+   * 是否系统布局配置
+   */
+  showSettings: false,
+
+  /**
+   * 是否显示顶部导航
+   */
+  topNav: false,
+
+  /**
+   * 是否显示 tagsView
+   */
+  tagsView: false,
+
+  /**
+   * 是否固定头部
+   */
+  fixedHeader: true,
+
+  /**
+   * 是否显示logo
+   */
+  sidebarLogo: true,
+
+  /**
+   * 是否显示动态标题
+   */
+  dynamicTitle: false,
+
+  /**
+   * @type {string | array} 'production' | ['production', 'development']
+   * @description Need show err logs component.
+   * The default is only used in the production env
+   * If you want to also use it in dev, you can pass ['production', 'development']
+   */
+  errorLog: 'production'
+}
diff --git a/src/store/index.js b/src/store/index.js
new file mode 100644
index 0000000..f10f389
--- /dev/null
+++ b/src/store/index.js
@@ -0,0 +1,3 @@
+const store = createPinia()
+
+export default store
\ No newline at end of file
diff --git a/src/store/modules/app.js b/src/store/modules/app.js
new file mode 100644
index 0000000..0b57159
--- /dev/null
+++ b/src/store/modules/app.js
@@ -0,0 +1,46 @@
+import Cookies from 'js-cookie'
+
+const useAppStore = defineStore(
+  'app',
+  {
+    state: () => ({
+      sidebar: {
+        opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true,
+        withoutAnimation: false,
+        hide: false
+      },
+      device: 'desktop',
+      size: Cookies.get('size') || 'default'
+    }),
+    actions: {
+      toggleSideBar(withoutAnimation) {
+        if (this.sidebar.hide) {
+          return false;
+        }
+        this.sidebar.opened = !this.sidebar.opened
+        this.sidebar.withoutAnimation = withoutAnimation
+        if (this.sidebar.opened) {
+          Cookies.set('sidebarStatus', 1)
+        } else {
+          Cookies.set('sidebarStatus', 0)
+        }
+      },
+      closeSideBar({ withoutAnimation }) {
+        Cookies.set('sidebarStatus', 0)
+        this.sidebar.opened = false
+        this.sidebar.withoutAnimation = withoutAnimation
+      },
+      toggleDevice(device) {
+        this.device = device
+      },
+      setSize(size) {
+        this.size = size;
+        Cookies.set('size', size)
+      },
+      toggleSideBarHide(status) {
+        this.sidebar.hide = status
+      }
+    }
+  })
+
+export default useAppStore
diff --git a/src/store/modules/dict.js b/src/store/modules/dict.js
new file mode 100644
index 0000000..27fc308
--- /dev/null
+++ b/src/store/modules/dict.js
@@ -0,0 +1,57 @@
+const useDictStore = defineStore(
+  'dict',
+  {
+    state: () => ({
+      dict: new Array()
+    }),
+    actions: {
+      // 获取字典
+      getDict(_key) {
+        if (_key == null && _key == "") {
+          return null;
+        }
+        try {
+          for (let i = 0; i < this.dict.length; i++) {
+            if (this.dict[i].key == _key) {
+              return this.dict[i].value;
+            }
+          }
+        } catch (e) {
+          return null;
+        }
+      },
+      // 设置字典
+      setDict(_key, value) {
+        if (_key !== null && _key !== "") {
+          this.dict.push({
+            key: _key,
+            value: value
+          });
+        }
+      },
+      // 删除字典
+      removeDict(_key) {
+        var bln = false;
+        try {
+          for (let i = 0; i < this.dict.length; i++) {
+            if (this.dict[i].key == _key) {
+              this.dict.splice(i, 1);
+              return true;
+            }
+          }
+        } catch (e) {
+          bln = false;
+        }
+        return bln;
+      },
+      // 清空字典
+      cleanDict() {
+        this.dict = new Array();
+      },
+      // 初始字典
+      initDict() {
+      }
+    }
+  })
+
+export default useDictStore
diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js
new file mode 100644
index 0000000..958fe63
--- /dev/null
+++ b/src/store/modules/permission.js
@@ -0,0 +1,142 @@
+import auth from '@/plugins/auth'
+import router, { constantRoutes, dynamicRoutes } from '@/router'
+import { getRouters } from '@/api/menu'
+import Layout from '@/layout/index'
+import ParentView from '@/components/ParentView'
+import InnerLink from '@/layout/components/InnerLink'
+
+// 匹配views里面所有的.vue文件
+const modules = import.meta.glob('./../../views/**/*.vue')
+
+const usePermissionStore = defineStore(
+  'permission',
+  {
+    state: () => ({
+      routes: [],
+      addRoutes: [],
+      defaultRoutes: [],
+      topbarRouters: [],
+      sidebarRouters: []
+    }),
+    actions: {
+      setRoutes(routes) {
+        this.addRoutes = routes
+        this.routes = constantRoutes.concat(routes)
+      },
+      setDefaultRoutes(routes) {
+        this.defaultRoutes = constantRoutes.concat(routes)
+      },
+      setTopbarRoutes(routes) {
+        this.topbarRouters = routes
+      },
+      setSidebarRouters(routes) {
+        this.sidebarRouters = routes
+      },
+      generateRoutes(roles) {
+        return new Promise(resolve => {
+          // 向后端请求路由数据
+          getRouters().then(res => {
+            const sdata = JSON.parse(JSON.stringify(res.data))
+            const rdata = JSON.parse(JSON.stringify(res.data))
+            const defaultData = JSON.parse(JSON.stringify(res.data))
+            const sidebarRoutes = filterAsyncRouter(sdata)
+            const rewriteRoutes = filterAsyncRouter(rdata, false, true)
+            const defaultRoutes = filterAsyncRouter(defaultData)
+            const asyncRoutes = filterDynamicRoutes(dynamicRoutes)
+            asyncRoutes.forEach(route => { router.addRoute(route) })
+            this.setRoutes(rewriteRoutes)
+            this.setSidebarRouters(constantRoutes.concat(sidebarRoutes))
+            this.setDefaultRoutes(sidebarRoutes)
+            this.setTopbarRoutes(defaultRoutes)
+            resolve(rewriteRoutes)
+          })
+        })
+      }
+    }
+  })
+
+// 遍历后台传来的路由字符串，转换为组件对象
+function filterAsyncRouter(asyncRouterMap, lastRouter = false, type = false) {
+  return asyncRouterMap.filter(route => {
+    if (type && route.children) {
+      route.children = filterChildren(route.children)
+    }
+    if (route.component) {
+      // Layout ParentView 组件特殊处理
+      if (route.component === 'Layout') {
+        route.component = Layout
+      } else if (route.component === 'ParentView') {
+        route.component = ParentView
+      } else if (route.component === 'InnerLink') {
+        route.component = InnerLink
+      } else {
+        route.component = loadView(route.component)
+      }
+    }
+    if (route.children != null && route.children && route.children.length) {
+      route.children = filterAsyncRouter(route.children, route, type)
+    } else {
+      delete route['children']
+      delete route['redirect']
+    }
+    return true
+  })
+}
+
+function filterChildren(childrenMap, lastRouter = false) {
+  var children = []
+  childrenMap.forEach((el, index) => {
+    if (el.children && el.children.length) {
+      if (el.component === 'ParentView' && !lastRouter) {
+        el.children.forEach(c => {
+          c.path = el.path + '/' + c.path
+          if (c.children && c.children.length) {
+            children = children.concat(filterChildren(c.children, c))
+            return
+          }
+          children.push(c)
+        })
+        return
+      }
+    }
+    if (lastRouter) {
+      el.path = lastRouter.path + '/' + el.path
+      if (el.children && el.children.length) {
+        children = children.concat(filterChildren(el.children, el))
+        return
+      }
+    }
+    children = children.concat(el)
+  })
+  return children
+}
+
+// 动态路由遍历，验证是否具备权限
+export function filterDynamicRoutes(routes) {
+  const res = []
+  routes.forEach(route => {
+    if (route.permissions) {
+      if (auth.hasPermiOr(route.permissions)) {
+        res.push(route)
+      }
+    } else if (route.roles) {
+      if (auth.hasRoleOr(route.roles)) {
+        res.push(route)
+      }
+    }
+  })
+  return res
+}
+
+export const loadView = (view) => {
+  let res;
+  for (const path in modules) {
+    const dir = path.split('views/')[1].split('.vue')[0];
+    if (dir === view) {
+      res = () => modules[path]();
+    }
+  }
+  return res;
+}
+
+export default usePermissionStore
diff --git a/src/store/modules/settings.js b/src/store/modules/settings.js
new file mode 100644
index 0000000..e155fc8
--- /dev/null
+++ b/src/store/modules/settings.js
@@ -0,0 +1,49 @@
+import defaultSettings from '@/settings'
+import { useDark, useToggle } from '@vueuse/core'
+import { useDynamicTitle } from '@/utils/dynamicTitle'
+
+const isDark = useDark()
+const toggleDark = useToggle(isDark)
+
+const { sideTheme, showSettings, topNav, tagsView, fixedHeader, sidebarLogo, dynamicTitle } = defaultSettings
+
+const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || ''
+
+const useSettingsStore = defineStore(
+  'settings',
+  {
+    state: () => ({
+      title: '',
+      // theme: storageSetting.theme || '#7f88e0' || '#b0b6ec' || '#409EFF',
+      theme: storageSetting.theme || '#409EFF',
+      sideTheme: storageSetting.sideTheme || sideTheme,
+      showSettings: showSettings,
+      topNav: storageSetting.topNav === undefined ? topNav : storageSetting.topNav,
+      tagsView: storageSetting.tagsView === undefined ? tagsView : storageSetting.tagsView,
+      fixedHeader: storageSetting.fixedHeader === undefined ? fixedHeader : storageSetting.fixedHeader,
+      sidebarLogo: storageSetting.sidebarLogo === undefined ? sidebarLogo : storageSetting.sidebarLogo,
+      dynamicTitle: storageSetting.dynamicTitle === undefined ? dynamicTitle : storageSetting.dynamicTitle,
+      isDark: isDark.value
+    }),
+    actions: {
+      // 修改布局设置
+      changeSetting(data) {
+        const { key, value } = data
+        if (this.hasOwnProperty(key)) {
+          this[key] = value
+        }
+      },
+      // 设置网页标题
+      setTitle(title) {
+        this.title = title
+        useDynamicTitle()
+      },
+      // 切换暗黑模式
+      toggleTheme() {
+        this.isDark = !this.isDark
+        toggleDark()
+      }
+    }
+  })
+
+export default useSettingsStore
diff --git a/src/store/modules/tagsView.js b/src/store/modules/tagsView.js
new file mode 100644
index 0000000..9d07f33
--- /dev/null
+++ b/src/store/modules/tagsView.js
@@ -0,0 +1,182 @@
+const useTagsViewStore = defineStore(
+  'tags-view',
+  {
+    state: () => ({
+      visitedViews: [],
+      cachedViews: [],
+      iframeViews: []
+    }),
+    actions: {
+      addView(view) {
+        this.addVisitedView(view)
+        this.addCachedView(view)
+      },
+      addIframeView(view) {
+        if (this.iframeViews.some(v => v.path === view.path)) return
+        this.iframeViews.push(
+          Object.assign({}, view, {
+            title: view.meta.title || 'no-name'
+          })
+        )
+      },
+      addVisitedView(view) {
+        if (this.visitedViews.some(v => v.path === view.path)) return
+        this.visitedViews.push(
+          Object.assign({}, view, {
+            title: view.meta.title || 'no-name'
+          })
+        )
+      },
+      addCachedView(view) {
+        if (this.cachedViews.includes(view.name)) return
+        if (!view.meta.noCache) {
+          this.cachedViews.push(view.name)
+        }
+      },
+      delView(view) {
+        return new Promise(resolve => {
+          this.delVisitedView(view)
+          this.delCachedView(view)
+          resolve({
+            visitedViews: [...this.visitedViews],
+            cachedViews: [...this.cachedViews]
+          })
+        })
+      },
+      delVisitedView(view) {
+        return new Promise(resolve => {
+          for (const [i, v] of this.visitedViews.entries()) {
+            if (v.path === view.path) {
+              this.visitedViews.splice(i, 1)
+              break
+            }
+          }
+          this.iframeViews = this.iframeViews.filter(item => item.path !== view.path)
+          resolve([...this.visitedViews])
+        })
+      },
+      delIframeView(view) {
+        return new Promise(resolve => {
+          this.iframeViews = this.iframeViews.filter(item => item.path !== view.path)
+          resolve([...this.iframeViews])
+        })
+      },
+      delCachedView(view) {
+        return new Promise(resolve => {
+          const index = this.cachedViews.indexOf(view.name)
+          index > -1 && this.cachedViews.splice(index, 1)
+          resolve([...this.cachedViews])
+        })
+      },
+      delOthersViews(view) {
+        return new Promise(resolve => {
+          this.delOthersVisitedViews(view)
+          this.delOthersCachedViews(view)
+          resolve({
+            visitedViews: [...this.visitedViews],
+            cachedViews: [...this.cachedViews]
+          })
+        })
+      },
+      delOthersVisitedViews(view) {
+        return new Promise(resolve => {
+          this.visitedViews = this.visitedViews.filter(v => {
+            return v.meta.affix || v.path === view.path
+          })
+          this.iframeViews = this.iframeViews.filter(item => item.path === view.path)
+          resolve([...this.visitedViews])
+        })
+      },
+      delOthersCachedViews(view) {
+        return new Promise(resolve => {
+          const index = this.cachedViews.indexOf(view.name)
+          if (index > -1) {
+            this.cachedViews = this.cachedViews.slice(index, index + 1)
+          } else {
+            this.cachedViews = []
+          }
+          resolve([...this.cachedViews])
+        })
+      },
+      delAllViews(view) {
+        return new Promise(resolve => {
+          this.delAllVisitedViews(view)
+          this.delAllCachedViews(view)
+          resolve({
+            visitedViews: [...this.visitedViews],
+            cachedViews: [...this.cachedViews]
+          })
+        })
+      },
+      delAllVisitedViews(view) {
+        return new Promise(resolve => {
+          const affixTags = this.visitedViews.filter(tag => tag.meta.affix)
+          this.visitedViews = affixTags
+          this.iframeViews = []
+          resolve([...this.visitedViews])
+        })
+      },
+      delAllCachedViews(view) {
+        return new Promise(resolve => {
+          this.cachedViews = []
+          resolve([...this.cachedViews])
+        })
+      },
+      updateVisitedView(view) {
+        for (let v of this.visitedViews) {
+          if (v.path === view.path) {
+            v = Object.assign(v, view)
+            break
+          }
+        }
+      },
+      delRightTags(view) {
+        return new Promise(resolve => {
+          const index = this.visitedViews.findIndex(v => v.path === view.path)
+          if (index === -1) {
+            return
+          }
+          this.visitedViews = this.visitedViews.filter((item, idx) => {
+            if (idx <= index || (item.meta && item.meta.affix)) {
+              return true
+            }
+            const i = this.cachedViews.indexOf(item.name)
+            if (i > -1) {
+              this.cachedViews.splice(i, 1)
+            }
+            if(item.meta.link) {
+              const fi = this.iframeViews.findIndex(v => v.path === item.path)
+              this.iframeViews.splice(fi, 1)
+            }
+            return false
+          })
+          resolve([...this.visitedViews])
+        })
+      },
+      delLeftTags(view) {
+        return new Promise(resolve => {
+          const index = this.visitedViews.findIndex(v => v.path === view.path)
+          if (index === -1) {
+            return
+          }
+          this.visitedViews = this.visitedViews.filter((item, idx) => {
+            if (idx >= index || (item.meta && item.meta.affix)) {
+              return true
+            }
+            const i = this.cachedViews.indexOf(item.name)
+            if (i > -1) {
+              this.cachedViews.splice(i, 1)
+            }
+            if(item.meta.link) {
+              const fi = this.iframeViews.findIndex(v => v.path === item.path)
+              this.iframeViews.splice(fi, 1)
+            }
+            return false
+          })
+          resolve([...this.visitedViews])
+        })
+      }
+    }
+  })
+
+export default useTagsViewStore
diff --git a/src/store/modules/user.js b/src/store/modules/user.js
new file mode 100644
index 0000000..094c712
--- /dev/null
+++ b/src/store/modules/user.js
@@ -0,0 +1,77 @@
+import { login, logout, getInfo } from '@/api/login'
+import { getToken, setToken, removeToken } from '@/utils/auth'
+import { isHttp, isEmpty } from "@/utils/validate"
+import defAva from '@/assets/logo/logo.png'
+
+const useUserStore = defineStore(
+  'user',
+  {
+    state: () => ({
+      token: getToken(),
+      id: '',
+      name: '',
+      avatar: '',
+      roles: [],
+      permissions: [],
+      userInfo: {}
+    }),
+    actions: {
+      // 登录
+      login(userInfo) {
+        const username = userInfo.username.trim()
+        const password = userInfo.password
+        const code = userInfo.code
+        const uuid = userInfo.uuid
+        return new Promise((resolve, reject) => {
+          login(username, password, code, uuid).then(res => {
+            setToken(res.token)
+            this.token = res.token
+            resolve()
+          }).catch(error => {
+            reject(error)
+          })
+        })
+      },
+      // 获取用户信息
+      getInfo() {
+        return new Promise((resolve, reject) => {
+          getInfo().then(res => {
+            const user = res.user
+            this.userInfo = user
+            let avatar = user.avatar || ""
+            if (!isHttp(avatar)) {
+              avatar = (isEmpty(avatar)) ? defAva : import.meta.env.VITE_APP_BASE_API + avatar
+            }
+            if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
+              this.roles = res.roles
+              this.permissions = res.permissions
+            } else {
+              this.roles = ['ROLE_DEFAULT']
+            }
+            this.id = user.userId
+            this.name = user.userName
+            this.avatar = avatar
+            resolve(res)
+          }).catch(error => {
+            reject(error)
+          })
+        })
+      },
+      // 退出系统
+      logOut() {
+        return new Promise((resolve, reject) => {
+          logout(this.token).then(() => {
+            this.token = ''
+            this.roles = []
+            this.permissions = []
+            removeToken()
+            resolve()
+          }).catch(error => {
+            reject(error)
+          })
+        })
+      }
+    }
+  })
+
+export default useUserStore
diff --git a/src/utils/auth.js b/src/utils/auth.js
new file mode 100644
index 0000000..08a43d6
--- /dev/null
+++ b/src/utils/auth.js
@@ -0,0 +1,15 @@
+import Cookies from 'js-cookie'
+
+const TokenKey = 'Admin-Token'
+
+export function getToken() {
+  return Cookies.get(TokenKey)
+}
+
+export function setToken(token) {
+  return Cookies.set(TokenKey, token)
+}
+
+export function removeToken() {
+  return Cookies.remove(TokenKey)
+}
diff --git a/src/utils/dict.js b/src/utils/dict.js
new file mode 100644
index 0000000..9648f14
--- /dev/null
+++ b/src/utils/dict.js
@@ -0,0 +1,24 @@
+import useDictStore from '@/store/modules/dict'
+import { getDicts } from '@/api/system/dict/data'
+
+/**
+ * 获取字典数据
+ */
+export function useDict(...args) {
+  const res = ref({});
+  return (() => {
+    args.forEach((dictType, index) => {
+      res.value[dictType] = [];
+      const dicts = useDictStore().getDict(dictType);
+      if (dicts) {
+        res.value[dictType] = dicts;
+      } else {
+        getDicts(dictType).then(resp => {
+          res.value[dictType] = resp.data.map(p => ({ label: p.dictLabel, value: p.dictValue, elTagType: p.listClass, elTagClass: p.cssClass }))
+          useDictStore().setDict(dictType, res.value[dictType]);
+        })
+      }
+    })
+    return toRefs(res.value);
+  })()
+}
\ No newline at end of file
diff --git a/src/utils/dynamicTitle.js b/src/utils/dynamicTitle.js
new file mode 100644
index 0000000..64404b2
--- /dev/null
+++ b/src/utils/dynamicTitle.js
@@ -0,0 +1,15 @@
+import store from '@/store'
+import defaultSettings from '@/settings'
+import useSettingsStore from '@/store/modules/settings'
+
+/**
+ * 动态修改标题
+ */
+export function useDynamicTitle() {
+  const settingsStore = useSettingsStore();
+  if (settingsStore.dynamicTitle) {
+    document.title = settingsStore.title + ' - ' + defaultSettings.title;
+  } else {
+    document.title = defaultSettings.title;
+  }
+}
\ No newline at end of file
diff --git a/src/utils/errorCode.js b/src/utils/errorCode.js
new file mode 100644
index 0000000..d2111ee
--- /dev/null
+++ b/src/utils/errorCode.js
@@ -0,0 +1,6 @@
+export default {
+  '401': '认证失败，无法访问系统资源',
+  '403': '当前操作没有权限',
+  '404': '访问资源不存在',
+  'default': '系统未知错误，请反馈给管理员'
+}
diff --git a/src/utils/index.js b/src/utils/index.js
new file mode 100644
index 0000000..4e65504
--- /dev/null
+++ b/src/utils/index.js
@@ -0,0 +1,390 @@
+import { parseTime } from './ruoyi'
+
+/**
+ * 表格时间格式化
+ */
+export function formatDate(cellValue) {
+  if (cellValue == null || cellValue == "") return "";
+  var date = new Date(cellValue) 
+  var year = date.getFullYear()
+  var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
+  var day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate() 
+  var hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours() 
+  var minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes() 
+  var seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
+  return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds
+}
+
+/**
+ * @param {number} time
+ * @param {string} option
+ * @returns {string}
+ */
+export function formatTime(time, option) {
+  if (('' + time).length === 10) {
+    time = parseInt(time) * 1000
+  } else {
+    time = +time
+  }
+  const d = new Date(time)
+  const now = Date.now()
+
+  const diff = (now - d) / 1000
+
+  if (diff < 30) {
+    return '刚刚'
+  } else if (diff < 3600) {
+    // less 1 hour
+    return Math.ceil(diff / 60) + '分钟前'
+  } else if (diff < 3600 * 24) {
+    return Math.ceil(diff / 3600) + '小时前'
+  } else if (diff < 3600 * 24 * 2) {
+    return '1天前'
+  }
+  if (option) {
+    return parseTime(time, option)
+  } else {
+    return (
+      d.getMonth() +
+      1 +
+      '月' +
+      d.getDate() +
+      '日' +
+      d.getHours() +
+      '时' +
+      d.getMinutes() +
+      '分'
+    )
+  }
+}
+
+/**
+ * @param {string} url
+ * @returns {Object}
+ */
+export function getQueryObject(url) {
+  url = url == null ? window.location.href : url
+  const search = url.substring(url.lastIndexOf('?') + 1)
+  const obj = {}
+  const reg = /([^?&=]+)=([^?&=]*)/g
+  search.replace(reg, (rs, $1, $2) => {
+    const name = decodeURIComponent($1)
+    let val = decodeURIComponent($2)
+    val = String(val)
+    obj[name] = val
+    return rs
+  })
+  return obj
+}
+
+/**
+ * @param {string} input value
+ * @returns {number} output value
+ */
+export function byteLength(str) {
+  // returns the byte length of an utf8 string
+  let s = str.length
+  for (var i = str.length - 1; i >= 0; i--) {
+    const code = str.charCodeAt(i)
+    if (code > 0x7f && code <= 0x7ff) s++
+    else if (code > 0x7ff && code <= 0xffff) s += 2
+    if (code >= 0xDC00 && code <= 0xDFFF) i--
+  }
+  return s
+}
+
+/**
+ * @param {Array} actual
+ * @returns {Array}
+ */
+export function cleanArray(actual) {
+  const newArray = []
+  for (let i = 0; i < actual.length; i++) {
+    if (actual[i]) {
+      newArray.push(actual[i])
+    }
+  }
+  return newArray
+}
+
+/**
+ * @param {Object} json
+ * @returns {Array}
+ */
+export function param(json) {
+  if (!json) return ''
+  return cleanArray(
+    Object.keys(json).map(key => {
+      if (json[key] === undefined) return ''
+      return encodeURIComponent(key) + '=' + encodeURIComponent(json[key])
+    })
+  ).join('&')
+}
+
+/**
+ * @param {string} url
+ * @returns {Object}
+ */
+export function param2Obj(url) {
+  const search = decodeURIComponent(url.split('?')[1]).replace(/\+/g, ' ')
+  if (!search) {
+    return {}
+  }
+  const obj = {}
+  const searchArr = search.split('&')
+  searchArr.forEach(v => {
+    const index = v.indexOf('=')
+    if (index !== -1) {
+      const name = v.substring(0, index)
+      const val = v.substring(index + 1, v.length)
+      obj[name] = val
+    }
+  })
+  return obj
+}
+
+/**
+ * @param {string} val
+ * @returns {string}
+ */
+export function html2Text(val) {
+  const div = document.createElement('div')
+  div.innerHTML = val
+  return div.textContent || div.innerText
+}
+
+/**
+ * Merges two objects, giving the last one precedence
+ * @param {Object} target
+ * @param {(Object|Array)} source
+ * @returns {Object}
+ */
+export function objectMerge(target, source) {
+  if (typeof target !== 'object') {
+    target = {}
+  }
+  if (Array.isArray(source)) {
+    return source.slice()
+  }
+  Object.keys(source).forEach(property => {
+    const sourceProperty = source[property]
+    if (typeof sourceProperty === 'object') {
+      target[property] = objectMerge(target[property], sourceProperty)
+    } else {
+      target[property] = sourceProperty
+    }
+  })
+  return target
+}
+
+/**
+ * @param {HTMLElement} element
+ * @param {string} className
+ */
+export function toggleClass(element, className) {
+  if (!element || !className) {
+    return
+  }
+  let classString = element.className
+  const nameIndex = classString.indexOf(className)
+  if (nameIndex === -1) {
+    classString += '' + className
+  } else {
+    classString =
+      classString.substr(0, nameIndex) +
+      classString.substr(nameIndex + className.length)
+  }
+  element.className = classString
+}
+
+/**
+ * @param {string} type
+ * @returns {Date}
+ */
+export function getTime(type) {
+  if (type === 'start') {
+    return new Date().getTime() - 3600 * 1000 * 24 * 90
+  } else {
+    return new Date(new Date().toDateString())
+  }
+}
+
+/**
+ * @param {Function} func
+ * @param {number} wait
+ * @param {boolean} immediate
+ * @return {*}
+ */
+export function debounce(func, wait, immediate) {
+  let timeout, args, context, timestamp, result
+
+  const later = function() {
+    // 据上一次触发时间间隔
+    const last = +new Date() - timestamp
+
+    // 上次被包装函数被调用时间间隔 last 小于设定时间间隔 wait
+    if (last < wait && last > 0) {
+      timeout = setTimeout(later, wait - last)
+    } else {
+      timeout = null
+      // 如果设定为immediate===true，因为开始边界已经调用过了此处无需调用
+      if (!immediate) {
+        result = func.apply(context, args)
+        if (!timeout) context = args = null
+      }
+    }
+  }
+
+  return function(...args) {
+    context = this
+    timestamp = +new Date()
+    const callNow = immediate && !timeout
+    // 如果延时不存在，重新设定延时
+    if (!timeout) timeout = setTimeout(later, wait)
+    if (callNow) {
+      result = func.apply(context, args)
+      context = args = null
+    }
+
+    return result
+  }
+}
+
+/**
+ * This is just a simple version of deep copy
+ * Has a lot of edge cases bug
+ * If you want to use a perfect deep copy, use lodash's _.cloneDeep
+ * @param {Object} source
+ * @returns {Object}
+ */
+export function deepClone(source) {
+  if (!source && typeof source !== 'object') {
+    throw new Error('error arguments', 'deepClone')
+  }
+  const targetObj = source.constructor === Array ? [] : {}
+  Object.keys(source).forEach(keys => {
+    if (source[keys] && typeof source[keys] === 'object') {
+      targetObj[keys] = deepClone(source[keys])
+    } else {
+      targetObj[keys] = source[keys]
+    }
+  })
+  return targetObj
+}
+
+/**
+ * @param {Array} arr
+ * @returns {Array}
+ */
+export function uniqueArr(arr) {
+  return Array.from(new Set(arr))
+}
+
+/**
+ * @returns {string}
+ */
+export function createUniqueString() {
+  const timestamp = +new Date() + ''
+  const randomNum = parseInt((1 + Math.random()) * 65536) + ''
+  return (+(randomNum + timestamp)).toString(32)
+}
+
+/**
+ * Check if an element has a class
+ * @param {HTMLElement} elm
+ * @param {string} cls
+ * @returns {boolean}
+ */
+export function hasClass(ele, cls) {
+  return !!ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'))
+}
+
+/**
+ * Add class to element
+ * @param {HTMLElement} elm
+ * @param {string} cls
+ */
+export function addClass(ele, cls) {
+  if (!hasClass(ele, cls)) ele.className += ' ' + cls
+}
+
+/**
+ * Remove class from element
+ * @param {HTMLElement} elm
+ * @param {string} cls
+ */
+export function removeClass(ele, cls) {
+  if (hasClass(ele, cls)) {
+    const reg = new RegExp('(\\s|^)' + cls + '(\\s|$)')
+    ele.className = ele.className.replace(reg, ' ')
+  }
+}
+
+export function makeMap(str, expectsLowerCase) {
+  const map = Object.create(null)
+  const list = str.split(',')
+  for (let i = 0; i < list.length; i++) {
+    map[list[i]] = true
+  }
+  return expectsLowerCase
+    ? val => map[val.toLowerCase()]
+    : val => map[val]
+}
+ 
+export const exportDefault = 'export default '
+
+export const beautifierConf = {
+  html: {
+    indent_size: '2',
+    indent_char: ' ',
+    max_preserve_newlines: '-1',
+    preserve_newlines: false,
+    keep_array_indentation: false,
+    break_chained_methods: false,
+    indent_scripts: 'separate',
+    brace_style: 'end-expand',
+    space_before_conditional: true,
+    unescape_strings: false,
+    jslint_happy: false,
+    end_with_newline: true,
+    wrap_line_length: '110',
+    indent_inner_html: true,
+    comma_first: false,
+    e4x: true,
+    indent_empty_lines: true
+  },
+  js: {
+    indent_size: '2',
+    indent_char: ' ',
+    max_preserve_newlines: '-1',
+    preserve_newlines: false,
+    keep_array_indentation: false,
+    break_chained_methods: false,
+    indent_scripts: 'normal',
+    brace_style: 'end-expand',
+    space_before_conditional: true,
+    unescape_strings: false,
+    jslint_happy: true,
+    end_with_newline: true,
+    wrap_line_length: '110',
+    indent_inner_html: true,
+    comma_first: false,
+    e4x: true,
+    indent_empty_lines: true
+  }
+}
+
+// 首字母大小
+export function titleCase(str) {
+  return str.replace(/( |^)[a-z]/g, L => L.toUpperCase())
+}
+
+// 下划转驼峰
+export function camelCase(str) {
+  return str.replace(/_[a-z]/g, str1 => str1.substr(-1).toUpperCase())
+}
+
+export function isNumberStr(str) {
+  return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str)
+}
+ 
diff --git a/src/utils/jsencrypt.js b/src/utils/jsencrypt.js
new file mode 100644
index 0000000..78d9523
--- /dev/null
+++ b/src/utils/jsencrypt.js
@@ -0,0 +1,30 @@
+import JSEncrypt from 'jsencrypt/bin/jsencrypt.min'
+
+// 密钥对生成 http://web.chacuo.net/netrsakeypair
+
+const publicKey = 'MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBAKoR8mX0rGKLqzcWmOzbfj64K8ZIgOdH\n' +
+  'nzkXSOVOZbFu/TJhZ7rFAN+eaGkl3C4buccQd/EjEsj9ir7ijT7h96MCAwEAAQ=='
+
+const privateKey = 'MIIBVAIBADANBgkqhkiG9w0BAQEFAASCAT4wggE6AgEAAkEAqhHyZfSsYourNxaY\n' +
+  '7Nt+PrgrxkiA50efORdI5U5lsW79MmFnusUA355oaSXcLhu5xxB38SMSyP2KvuKN\n' +
+  'PuH3owIDAQABAkAfoiLyL+Z4lf4Myxk6xUDgLaWGximj20CUf+5BKKnlrK+Ed8gA\n' +
+  'kM0HqoTt2UZwA5E2MzS4EI2gjfQhz5X28uqxAiEA3wNFxfrCZlSZHb0gn2zDpWow\n' +
+  'cSxQAgiCstxGUoOqlW8CIQDDOerGKH5OmCJ4Z21v+F25WaHYPxCFMvwxpcw99Ecv\n' +
+  'DQIgIdhDTIqD2jfYjPTY8Jj3EDGPbH2HHuffvflECt3Ek60CIQCFRlCkHpi7hthh\n' +
+  'YhovyloRYsM+IS9h/0BzlEAuO0ktMQIgSPT3aFAgJYwKpqRYKlLDVcflZFCKY7u3\n' +
+  'UP8iWi1Qw0Y='
+
+// 加密
+export function encrypt(txt) {
+  const encryptor = new JSEncrypt()
+  encryptor.setPublicKey(publicKey) // 设置公钥
+  return encryptor.encrypt(txt) // 对数据进行加密
+}
+
+// 解密
+export function decrypt(txt) {
+  const encryptor = new JSEncrypt()
+  encryptor.setPrivateKey(privateKey) // 设置私钥
+  return encryptor.decrypt(txt) // 对数据进行解密
+}
+
diff --git a/src/utils/permission.js b/src/utils/permission.js
new file mode 100644
index 0000000..93fee87
--- /dev/null
+++ b/src/utils/permission.js
@@ -0,0 +1,51 @@
+import useUserStore from '@/store/modules/user'
+
+/**
+ * 字符权限校验
+ * @param {Array} value 校验值
+ * @returns {Boolean}
+ */
+export function checkPermi(value) {
+  if (value && value instanceof Array && value.length > 0) {
+    const permissions = useUserStore().permissions
+    const permissionDatas = value
+    const all_permission = "*:*:*";
+
+    const hasPermission = permissions.some(permission => {
+      return all_permission === permission || permissionDatas.includes(permission)
+    })
+
+    if (!hasPermission) {
+      return false
+    }
+    return true
+  } else {
+    console.error(`need roles! Like checkPermi="['system:user:add','system:user:edit']"`)
+    return false
+  }
+}
+
+/**
+ * 角色权限校验
+ * @param {Array} value 校验值
+ * @returns {Boolean}
+ */
+export function checkRole(value) {
+  if (value && value instanceof Array && value.length > 0) {
+    const roles = useUserStore().roles
+    const permissionRoles = value
+    const super_admin = "admin";
+
+    const hasRole = roles.some(role => {
+      return super_admin === role || permissionRoles.includes(role)
+    })
+
+    if (!hasRole) {
+      return false
+    }
+    return true
+  } else {
+    console.error(`need roles! Like checkRole="['admin','editor']"`)
+    return false
+  }
+}
\ No newline at end of file
diff --git a/src/utils/request.js b/src/utils/request.js
new file mode 100644
index 0000000..00b910f
--- /dev/null
+++ b/src/utils/request.js
@@ -0,0 +1,152 @@
+import axios from 'axios'
+import { ElNotification , ElMessageBox, ElMessage, ElLoading } from 'element-plus'
+import { getToken } from '@/utils/auth'
+import errorCode from '@/utils/errorCode'
+import { tansParams, blobValidate } from '@/utils/ruoyi'
+import cache from '@/plugins/cache'
+import { saveAs } from 'file-saver'
+import useUserStore from '@/store/modules/user'
+
+let downloadLoadingInstance;
+// 是否显示重新登录
+export let isRelogin = { show: false };
+
+axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
+// 创建axios实例
+const service = axios.create({
+  // axios中请求配置有baseURL选项，表示请求URL公共部分
+  baseURL: import.meta.env.VITE_APP_BASE_API,
+  // 超时
+  timeout: 10000
+})
+
+// request拦截器
+service.interceptors.request.use(config => {
+  // 是否需要设置 token
+  const isToken = (config.headers || {}).isToken === false
+  // 是否需要防止数据重复提交
+  const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
+  if (getToken() && !isToken) {
+    config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
+  }
+  // get请求映射params参数
+  if (config.method === 'get' && config.params) {
+    let url = config.url + '?' + tansParams(config.params);
+    url = url.slice(0, -1);
+    config.params = {};
+    config.url = url;
+  }
+  if (!isRepeatSubmit && (config.method === 'post' || config.method === 'put')) {
+    const requestObj = {
+      url: config.url,
+      data: typeof config.data === 'object' ? JSON.stringify(config.data) : config.data,
+      time: new Date().getTime()
+    }
+    const requestSize = Object.keys(JSON.stringify(requestObj)).length; // 请求数据大小
+    const limitSize = 5 * 1024 * 1024; // 限制存放数据5M
+    if (requestSize >= limitSize) {
+      console.warn(`[${config.url}]: ` + '请求数据大小超出允许的5M限制，无法进行防重复提交验证。')
+      return config;
+    }
+    const sessionObj = cache.session.getJSON('sessionObj')
+    if (sessionObj === undefined || sessionObj === null || sessionObj === '') {
+      cache.session.setJSON('sessionObj', requestObj)
+    } else {
+      const s_url = sessionObj.url;                // 请求地址
+      const s_data = sessionObj.data;              // 请求数据
+      const s_time = sessionObj.time;              // 请求时间
+      const interval = 1000;                       // 间隔时间(ms)，小于此时间视为重复提交
+      if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) {
+        const message = '数据正在处理，请勿重复提交';
+        console.warn(`[${s_url}]: ` + message)
+        return Promise.reject(new Error(message))
+      } else {
+        cache.session.setJSON('sessionObj', requestObj)
+      }
+    }
+  }
+  return config
+}, error => {
+    console.log(error)
+    Promise.reject(error)
+})
+
+// 响应拦截器
+service.interceptors.response.use(res => {
+    // 未设置状态码则默认成功状态
+    const code = res.data.code || 200;
+    // 获取错误信息
+    const msg = errorCode[code] || res.data.msg || errorCode['default']
+    // 二进制数据则直接返回
+    if (res.request.responseType ===  'blob' || res.request.responseType ===  'arraybuffer') {
+      return res.data
+    }
+    if (code === 401) {
+      if (!isRelogin.show) {
+        isRelogin.show = true;
+        ElMessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
+          isRelogin.show = false;
+          useUserStore().logOut().then(() => {
+            location.href = '/index';
+          })
+      }).catch(() => {
+        isRelogin.show = false;
+      });
+    }
+      return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
+    } else if (code === 500) {
+      ElMessage({ message: msg, type: 'error' })
+      return Promise.reject(new Error(msg))
+    } else if (code === 601) {
+      ElMessage({ message: msg, type: 'warning' })
+      return Promise.reject(new Error(msg))
+    } else if (code !== 200) {
+      ElNotification.error({ title: msg })
+      return Promise.reject('error')
+    } else {
+      return  Promise.resolve(res.data)
+    }
+  },
+  error => {
+    console.log('err' + error)
+    let { message } = error;
+    if (message == "Network Error") {
+      message = "后端接口连接异常";
+    } else if (message.includes("timeout")) {
+      message = "系统接口请求超时";
+    } else if (message.includes("Request failed with status code")) {
+      message = "系统接口" + message.substr(message.length - 3) + "异常";
+    }
+    ElMessage({ message: message, type: 'error', duration: 5 * 1000 })
+    return Promise.reject(error)
+  }
+)
+
+// 通用下载方法
+export function download(url, params, filename, config) {
+  downloadLoadingInstance = ElLoading.service({ text: "正在下载数据，请稍候", background: "rgba(0, 0, 0, 0.7)", })
+  return service.post(url, params, {
+    transformRequest: [(params) => { return tansParams(params) }],
+    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+    responseType: 'blob',
+    ...config
+  }).then(async (data) => {
+    const isBlob = blobValidate(data);
+    if (isBlob) {
+      const blob = new Blob([data])
+      saveAs(blob, filename)
+    } else {
+      const resText = await data.text();
+      const rspObj = JSON.parse(resText);
+      const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
+      ElMessage.error(errMsg);
+    }
+    downloadLoadingInstance.close();
+  }).catch((r) => {
+    console.error(r)
+    ElMessage.error('下载文件出现错误，请联系管理员！')
+    downloadLoadingInstance.close();
+  })
+}
+
+export default service
diff --git a/src/utils/ruoyi.js b/src/utils/ruoyi.js
new file mode 100644
index 0000000..4efca08
--- /dev/null
+++ b/src/utils/ruoyi.js
@@ -0,0 +1,246 @@
+
+
+/**
+ * 通用js方法封装处理
+ * Copyright (c) 2019 ruoyi
+ */
+
+// 日期格式化
+export function parseTime(time, pattern) {
+  if (arguments.length === 0 || !time) {
+    return null
+  }
+  const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
+  let date
+  if (typeof time === 'object') {
+    date = time
+  } else {
+    if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
+      time = parseInt(time)
+    } else if (typeof time === 'string') {
+      time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
+    }
+    if ((typeof time === 'number') && (time.toString().length === 10)) {
+      time = time * 1000
+    }
+    date = new Date(time)
+  }
+  const formatObj = {
+    y: date.getFullYear(),
+    m: date.getMonth() + 1,
+    d: date.getDate(),
+    h: date.getHours(),
+    i: date.getMinutes(),
+    s: date.getSeconds(),
+    a: date.getDay()
+  }
+  const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
+    let value = formatObj[key]
+    // Note: getDay() returns 0 on Sunday
+    if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
+    if (result.length > 0 && value < 10) {
+      value = '0' + value
+    }
+    return value || 0
+  })
+  return time_str
+}
+
+// 表单重置
+export function resetForm(refName) {
+  if (this.$refs[refName]) {
+    this.$refs[refName].resetFields();
+  }
+}
+
+// 添加日期范围
+export function addDateRange(params, dateRange, propName) {
+  let search = params;
+  search.params = typeof (search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {};
+  dateRange = Array.isArray(dateRange) ? dateRange : [];
+  if (typeof (propName) === 'undefined') {
+    search.params['beginTime'] = dateRange[0];
+    search.params['endTime'] = dateRange[1];
+  } else {
+    search.params['begin' + propName] = dateRange[0];
+    search.params['end' + propName] = dateRange[1];
+  }
+  return search;
+}
+
+// 回显数据字典
+export function selectDictLabel(datas, value) {
+  if (value === undefined) {
+    return "";
+  }
+  var actions = [];
+  Object.keys(datas).some((key) => {
+    if (datas[key].value == ('' + value)) {
+      actions.push(datas[key].label);
+      return true;
+    }
+  })
+  if (actions.length === 0) {
+    actions.push(value);
+  }
+  return actions.join('');
+}
+
+// 回显数据字典（字符串数组）
+export function selectDictLabels(datas, value, separator) {
+  if (value === undefined || value.length ===0) {
+    return "";
+  }
+  if (Array.isArray(value)) {
+    value = value.join(",");
+  }
+  var actions = [];
+  var currentSeparator = undefined === separator ? "," : separator;
+  var temp = value.split(currentSeparator);
+  Object.keys(value.split(currentSeparator)).some((val) => {
+    var match = false;
+    Object.keys(datas).some((key) => {
+      if (datas[key].value == ('' + temp[val])) {
+        actions.push(datas[key].label + currentSeparator);
+        match = true;
+      }
+    })
+    if (!match) {
+      actions.push(temp[val] + currentSeparator);
+    }
+  })
+  return actions.join('').substring(0, actions.join('').length - 1);
+}
+
+// 字符串格式化(%s )
+export function sprintf(str) {
+  var args = arguments, flag = true, i = 1;
+  str = str.replace(/%s/g, function () {
+    var arg = args[i++];
+    if (typeof arg === 'undefined') {
+      flag = false;
+      return '';
+    }
+    return arg;
+  });
+  return flag ? str : '';
+}
+
+// 转换字符串，undefined,null等转化为""
+export function parseStrEmpty(str) {
+  if (!str || str == "undefined" || str == "null") {
+    return "";
+  }
+  return str;
+}
+
+// 数据合并
+export function mergeRecursive(source, target) {
+  for (var p in target) {
+    try {
+      if (target[p].constructor == Object) {
+        source[p] = mergeRecursive(source[p], target[p]);
+      } else {
+        source[p] = target[p];
+      }
+    } catch (e) {
+      source[p] = target[p];
+    }
+  }
+  return source;
+};
+
+/**
+ * 构造树型结构数据
+ * @param {*} data 数据源
+ * @param {*} id id字段 默认 'id'
+ * @param {*} parentId 父节点字段 默认 'parentId'
+ * @param {*} children 孩子节点字段 默认 'children'
+ */
+export function handleTree(data, id, parentId, children) {
+  let config = {
+    id: id || 'id',
+    parentId: parentId || 'parentId',
+    childrenList: children || 'children'
+  };
+
+  var childrenListMap = {};
+  var nodeIds = {};
+  var tree = [];
+
+  for (let d of data) {
+    let parentId = d[config.parentId];
+    if (childrenListMap[parentId] == null) {
+      childrenListMap[parentId] = [];
+    }
+    nodeIds[d[config.id]] = d;
+    childrenListMap[parentId].push(d);
+  }
+
+  for (let d of data) {
+    let parentId = d[config.parentId];
+    if (nodeIds[parentId] == null) {
+      tree.push(d);
+    }
+  }
+
+  for (let t of tree) {
+    adaptToChildrenList(t);
+  }
+
+  function adaptToChildrenList(o) {
+    if (childrenListMap[o[config.id]] !== null) {
+      o[config.childrenList] = childrenListMap[o[config.id]];
+    }
+    if (o[config.childrenList]) {
+      for (let c of o[config.childrenList]) {
+        adaptToChildrenList(c);
+      }
+    }
+  }
+  return tree;
+}
+
+/**
+* 参数处理
+* @param {*} params  参数
+*/
+export function tansParams(params) {
+  let result = ''
+  for (const propName of Object.keys(params)) {
+    const value = params[propName];
+    var part = encodeURIComponent(propName) + "=";
+    if (value !== null && value !== "" && typeof (value) !== "undefined") {
+      if (typeof value === 'object') {
+        for (const key of Object.keys(value)) {
+          if (value[key] !== null && value[key] !== "" && typeof (value[key]) !== 'undefined') {
+            let params = propName + '[' + key + ']';
+            var subPart = encodeURIComponent(params) + "=";
+            result += subPart + encodeURIComponent(value[key]) + "&";
+          }
+        }
+      } else {
+        result += part + encodeURIComponent(value) + "&";
+      }
+    }
+  }
+  return result
+}
+
+
+// 返回项目路径
+export function getNormalPath(p) {
+  if (p.length === 0 || !p || p == 'undefined') {
+    return p
+  };
+  let res = p.replace('//', '/')
+  if (res[res.length - 1] === '/') {
+    return res.slice(0, res.length - 1)
+  }
+  return res;
+}
+
+// 验证是否为blob格式
+export function blobValidate(data) {
+  return data.type !== 'application/json'
+}
diff --git a/src/utils/scroll-to.js b/src/utils/scroll-to.js
new file mode 100644
index 0000000..c5d8e04
--- /dev/null
+++ b/src/utils/scroll-to.js
@@ -0,0 +1,58 @@
+Math.easeInOutQuad = function(t, b, c, d) {
+  t /= d / 2
+  if (t < 1) {
+    return c / 2 * t * t + b
+  }
+  t--
+  return -c / 2 * (t * (t - 2) - 1) + b
+}
+
+// requestAnimationFrame for Smart Animating http://goo.gl/sx5sts
+var requestAnimFrame = (function() {
+  return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function(callback) { window.setTimeout(callback, 1000 / 60) }
+})()
+
+/**
+ * Because it's so fucking difficult to detect the scrolling element, just move them all
+ * @param {number} amount
+ */
+function move(amount) {
+  document.documentElement.scrollTop = amount
+  document.body.parentNode.scrollTop = amount
+  document.body.scrollTop = amount
+}
+
+function position() {
+  return document.documentElement.scrollTop || document.body.parentNode.scrollTop || document.body.scrollTop
+}
+
+/**
+ * @param {number} to
+ * @param {number} duration
+ * @param {Function} callback
+ */
+export function scrollTo(to, duration, callback) {
+  const start = position()
+  const change = to - start
+  const increment = 20
+  let currentTime = 0
+  duration = (typeof (duration) === 'undefined') ? 500 : duration
+  var animateScroll = function() {
+    // increment the time
+    currentTime += increment
+    // find the value with the quadratic in-out easing function
+    var val = Math.easeInOutQuad(currentTime, start, change, duration)
+    // move the document.body
+    move(val)
+    // do the animation unless its over
+    if (currentTime < duration) {
+      requestAnimFrame(animateScroll)
+    } else {
+      if (callback && typeof (callback) === 'function') {
+        // the animation is done so lets callback
+        callback()
+      }
+    }
+  }
+  animateScroll()
+}
diff --git a/src/utils/theme.js b/src/utils/theme.js
new file mode 100644
index 0000000..f4badc6
--- /dev/null
+++ b/src/utils/theme.js
@@ -0,0 +1,49 @@
+// 处理主题样式
+export function handleThemeStyle(theme) {
+	document.documentElement.style.setProperty('--el-color-primary', theme)
+	for (let i = 1; i <= 9; i++) {
+		document.documentElement.style.setProperty(`--el-color-primary-light-${i}`, `${getLightColor(theme, i / 10)}`)
+	}
+	for (let i = 1; i <= 9; i++) {
+		document.documentElement.style.setProperty(`--el-color-primary-dark-${i}`, `${getDarkColor(theme, i / 10)}`)
+	}
+}
+
+// hex颜色转rgb颜色
+export function hexToRgb(str) {
+	str = str.replace('#', '')
+	let hexs = str.match(/../g)
+	for (let i = 0; i < 3; i++) {
+		hexs[i] = parseInt(hexs[i], 16)
+	}
+	return hexs
+}
+
+// rgb颜色转Hex颜色
+export function rgbToHex(r, g, b) {
+	let hexs = [r.toString(16), g.toString(16), b.toString(16)]
+	for (let i = 0; i < 3; i++) {
+		if (hexs[i].length == 1) {
+			hexs[i] = `0${hexs[i]}`
+		}
+	}
+	return `#${hexs.join('')}`
+}
+
+// 变浅颜色值
+export function getLightColor(color, level) {
+	let rgb = hexToRgb(color)
+	for (let i = 0; i < 3; i++) {
+		rgb[i] = Math.floor((255 - rgb[i]) * level + rgb[i])
+	}
+	return rgbToHex(rgb[0], rgb[1], rgb[2])
+}
+
+// 变深颜色值
+export function getDarkColor(color, level) {
+	let rgb = hexToRgb(color)
+	for (let i = 0; i < 3; i++) {
+		rgb[i] = Math.floor(rgb[i] * (1 - level))
+	}
+	return rgbToHex(rgb[0], rgb[1], rgb[2])
+}
diff --git a/src/utils/validate.js b/src/utils/validate.js
new file mode 100644
index 0000000..6a4c0c5
--- /dev/null
+++ b/src/utils/validate.js
@@ -0,0 +1,114 @@
+/**
+ * 路径匹配器
+ * @param {string} pattern
+ * @param {string} path
+ * @returns {Boolean}
+ */
+export function isPathMatch(pattern, path) {
+  const regexPattern = pattern.replace(/\//g, '\\/').replace(/\*\*/g, '.*').replace(/\*/g, '[^\\/]*')
+  const regex = new RegExp(`^${regexPattern}$`)
+  return regex.test(path)
+}
+
+/**
+ * 判断value字符串是否为空 
+ * @param {string} value
+ * @returns {Boolean}
+ */
+export function isEmpty(value) {
+  if (value == null || value == "" || value == undefined || value == "undefined") {
+    return true
+  }
+  return false
+}
+
+/**
+ * 判断url是否是http或https 
+ * @param {string} url
+ * @returns {Boolean}
+ */
+export function isHttp(url) {
+  return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1
+}
+
+/**
+ * 判断path是否为外链
+ * @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)
+}
+
+/**
+ * @param {string} str
+ * @returns {Boolean}
+ */
+export function isString(str) {
+  return typeof str === 'string' || str instanceof String
+}
+
+/**
+ * @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)
+}
diff --git a/src/views/activity/activityInfo.vue b/src/views/activity/activityInfo.vue
new file mode 100644
index 0000000..35e05cc
--- /dev/null
+++ b/src/views/activity/activityInfo.vue
@@ -0,0 +1,301 @@
+<template>
+  <div class="app-container">
+    <div style="display: flex; gap: 10px">
+      <div class="zd-card" style="flex: 1">
+        <h4>基本信息</h4>
+        <el-descriptions :column="1">
+          <el-descriptions-item label="招募开始时间">{{
+            activityInfo.startDate
+          }}</el-descriptions-item>
+          <el-descriptions-item label="招募结束时间">{{
+            activityInfo.endDate
+          }}</el-descriptions-item>
+          <el-descriptions-item label="门店累积天数">{{
+            activityInfo.duration
+          }}</el-descriptions-item>
+
+          <el-descriptions-item label="累积目标数">{{
+            activityInfo.activityTarget
+          }}</el-descriptions-item>
+          <el-descriptions-item label="发布区域">{{
+            activityInfo.city
+          }}</el-descriptions-item>
+        </el-descriptions>
+      </div>
+      <div class="zd-card" style="flex: 1">
+        <h4>参与酒款</h4>
+        <template v-if="activityInfo.beerScope == 1">
+          <el-table
+            v-if="activityInfo.beers && activityInfo.beers.length > 0"
+            :data="activityInfo.beers"
+            style="width: 100%"
+            class="zd-table"
+          >
+            <el-table-column
+              prop="beerName"
+              label="酒款名称"
+              show-overflow-tooltip
+            ></el-table-column>
+            <el-table-column prop="" label="已核销数量" align="center">
+              <template #default="scope">
+                {{ scope.row.scanCount || 0 }}
+              </template>
+            </el-table-column>
+          </el-table>
+        </template>
+        <div
+          v-else
+          style="
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            height: 100px;
+          "
+        >
+          全系酒款
+        </div>
+      </div>
+      <div style="flex: 1">
+        <div class="zd-card">
+          <h4>达成奖励</h4>
+          <template v-if="activityInfo.activityType === 1">
+            奖励啤酒币 * {{ activityInfo.activityRewardCount }}
+          </template>
+          <template v-if="activityInfo.activityType === 2">
+            <el-table
+              v-if="activityInfo.activityRewardGoods"
+              :data="[activityInfo.activityRewardGoods]"
+              style="width: 100%"
+              class="zd-table"
+            >
+              <el-table-column
+                prop="goodsName"
+                label="商品名称"
+                show-overflow-tooltip
+              ></el-table-column>
+              <el-table-column
+                prop="specs"
+                label="规格"
+                align="center"
+              ></el-table-column>
+              <el-table-column label="数量" align="center">
+                <template #default="scope">{{
+                  activityInfo.activityRewardCount
+                }}</template>
+              </el-table-column>
+            </el-table>
+          </template>
+        </div>
+        <div class="zd-card" style="padding-top: 10px">
+          <el-descriptions :column="2">
+            <el-descriptions-item label="已核销数量">{{
+              sInfo.consumeCount || 0
+            }}</el-descriptions-item>
+            <el-descriptions-item label="待兑付数">{{
+              sInfo.waitRewardCount || 0
+            }}</el-descriptions-item>
+            <el-descriptions-item label="参加门店数">{{
+              sInfo.consumeBarCount || 0
+            }}</el-descriptions-item>
+
+            <el-descriptions-item label="已完成数">{{
+              sInfo.completeCount || 0
+            }}</el-descriptions-item>
+          </el-descriptions>
+        </div>
+      </div>
+    </div>
+    <div class="zd-card">
+      <h4>参与门店明细</h4>
+      <el-table :data="bars" style="width: 100%" class="zd-table">
+        <el-table-column prop="barNumber" label="门店ID"></el-table-column>
+        <el-table-column prop="barName" label="门店名称"></el-table-column>
+        <el-table-column prop="barCity" label="门店城市"></el-table-column>
+        <el-table-column prop="startDate" label="开始累积时间" align="center">
+          <template #default="scope">
+            {{ scope.row.startDate || "--" }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="endDate" label="截止累积时间" align="center">
+          <template #default="scope">
+            {{ scope.row.endDate || "--" }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="joinNum" label="已累积桶数" align="center">
+          <template #default="scope">
+            {{ scope.row.joinNum || 0 }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="remainNum" label="剩余数量" align="center">
+          <template #default="scope">
+            {{ scope.row.remainNum || 0 }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          align="center"
+          fixed="right"
+          width="150"
+          class-name="small-padding fixed-width"
+        >
+          <template #default="scope">
+            <el-button
+              v-if="scope.row.rewardType === 2 && scope.row.rewardStatus === 0"
+              link
+              type="primary"
+              @click="handleDelivery(scope.row)"
+              >发货</el-button
+            >
+            <el-button link type="primary" @click="handleDetail(scope.row)"
+              >详细</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="barsTotal > 0"
+        :total="barsTotal"
+        v-model:page="batchQuery.pageNum"
+        v-model:limit="batchQuery.pageSize"
+        @pagination="getBatchList"
+      />
+    </div>
+    <el-drawer v-model="showDrawer" title="详情" size="680">
+      <el-descriptions column="1" label-width="100px">
+        <el-descriptions-item label="活动ID：">{{
+          info.activityName
+        }}</el-descriptions-item>
+        <el-descriptions-item label="门店ID：">{{
+          info.barNumber
+        }}</el-descriptions-item>
+        <el-descriptions-item label="开始累积时间：">
+          {{ info.startDate || "--" }}
+        </el-descriptions-item>
+        <el-descriptions-item label="截止累积时间：">
+          {{ info.endDate || "--" }}
+        </el-descriptions-item>
+
+        <el-descriptions-item label="已累积桶数：">
+          {{ info.joinNum || 0 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="剩余数量：">
+          {{ info.remainNum || 0 }}
+        </el-descriptions-item>
+      </el-descriptions>
+      <el-table :data="consumeList" class="zd-table">
+        <el-table-column
+          label="核销产品名称"
+          align="center"
+          prop="beerName"
+          show-overflow-tooltip
+        />
+        <el-table-column label="二维码ID" align="center" prop="skuSn" />
+        <el-table-column label="核销时间" align="center" prop="scanTime" />
+        <el-table-column label="操作" align="center">
+          <template #default="scope">
+            <el-button
+              v-if="scope.row.scanStatus === 1"
+              type="text"
+              @click="handleRevoke(scope.row)"
+            >
+              撤销核销
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="consumeTotal > 0"
+        :total="consumeTotal"
+        v-model:page="consumeQuery.pageNum"
+        v-model:limit="consumeQuery.pageSize"
+        @pagination="getConsumeList"
+      />
+    </el-drawer>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, getCurrentInstance } from "vue";
+import {
+  getActivity,
+  getActivityConsumeList,
+  cancelConsume,
+  getActivityStatistics,
+  getActivityBatchList,
+} from "@/api/brewery/activity";
+const { proxy } = getCurrentInstance();
+const route = useRoute();
+const activityInfo = ref({});
+const activityId = ref("");
+onMounted(() => {
+  activityId.value = route.query.id;
+  getActivityInfo();
+  getStatistics();
+  getBatchList();
+});
+function getActivityInfo() {
+  getActivity(activityId.value).then((response) => {
+    activityInfo.value = response.data;
+  });
+}
+
+function handleDelivery(row) {
+  console.log(row);
+}
+
+// 详细
+const showDrawer = ref(false);
+const consumeList = ref([]);
+const consumeTotal = ref(0);
+const consumeQuery = ref({
+  pageNum: 1,
+  pageSize: 5,
+});
+const info = ref({});
+function handleDetail(row) {
+  console.log(row);
+  showDrawer.value = true;
+  info.value = row;
+  consumeQuery.value.activityId = row.activityId;
+  consumeQuery.value.barId = row.barId;
+  getConsumeList();
+}
+function getConsumeList() {
+  getActivityConsumeList(consumeQuery.value).then((res) => {
+    console.log(res);
+    consumeList.value = res.rows;
+    consumeTotal.value = res.total;
+  });
+}
+// 撤销核销
+function handleRevoke(row) {
+  console.log(row);
+  cancelConsume(row.id).then((res) => {
+    proxy.$message.success("撤销成功");
+    getConsumeList();
+  });
+}
+const sInfo = ref({});
+function getStatistics() {
+  getActivityStatistics(activityId.value).then((res) => {
+    console.log(res);
+    sInfo.value = res.data;
+  });
+}
+const barsTotal = ref(0);
+const bars = ref([]);
+const batchQuery = ref({
+  pageNum: 1,
+  pageSize: 5,
+});
+function getBatchList() {
+  batchQuery.value.activityId = activityId.value;
+  getActivityBatchList(batchQuery.value).then((res) => {
+    console.log(res);
+    bars.value = res.rows;
+    barsTotal.value = res.total;
+  });
+}
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/activity/addRebate.vue b/src/views/activity/addRebate.vue
new file mode 100644
index 0000000..9da1b26
--- /dev/null
+++ b/src/views/activity/addRebate.vue
@@ -0,0 +1,280 @@
+<template>
+  <div class="app-container">
+    <el-form ref="formRef" :model="form" label-width="120px">
+      <div class="zd-card">
+        <h4>添加营销活动</h4>
+        <div class="box">
+          <h5>基本信息</h5>
+
+          <el-form-item label="活动类型">
+            <el-radio-group v-model="form.activityType">
+              <el-radio :value="1">指定门店</el-radio>
+              <el-radio :value="2">招募活动</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item v-if="form.activityType == 1" label="输入指定门店ID">
+            <el-input
+              v-model="form.barNumber"
+              placeholder="请务必确认输入正确"
+              style="width: 400px"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="参与酒款范围">
+            <el-radio-group v-model="form.beerScope">
+              <el-radio :value="0">不限</el-radio>
+              <el-radio :value="1">指定酒款</el-radio>
+            </el-radio-group>
+          </el-form-item>
+
+          <el-form-item
+            v-if="form.beerScope == 1"
+            label="选择指定酒款"
+            prop="beerId"
+          >
+            <el-select
+              v-model="form.beerIds"
+              placeholder="请选择酒款"
+              multiple
+              style="width: 400px"
+            >
+              <el-option
+                v-for="item in allBeersList"
+                :key="item.id"
+                :label="item.beerName"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            v-if="form.activityType === 2"
+            label="投放城市"
+            prop="city"
+          >
+            <el-cascader
+              placeholder="请输入投放城市"
+              :options="pcTextArr"
+              v-model="selectedOptions"
+              style="width: 340px; margin-right: 10px"
+              :disabled="form.city == '全国'"
+              @change="handleChange"
+            >
+            </el-cascader>
+            <el-checkbox
+              v-model="form.city"
+              true-value="全国"
+              @change="selectedOptions = []"
+              >全国</el-checkbox
+            >
+          </el-form-item>
+        </div>
+        <div class="box">
+          <h5>目标设定</h5>
+          <el-form-item label="累计目标" prop="activityTarget">
+            <el-input
+              v-model="form.activityTarget"
+              type="number"
+              :min="0"
+              step-strictly
+              :precision="0"
+              placeholder="请输入累计目标"
+              style="width: 400px"
+            >
+              <template #suffix> 桶 </template>
+            </el-input>
+          </el-form-item>
+          <el-form-item
+            :label="form.activityType === 2 ? '招募开始时间' : '开始时间'"
+            prop="startDate"
+          >
+            <el-date-picker
+              clearable
+              v-model="form.startDate"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="请选择开始时间"
+            >
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item
+            :label="form.activityType === 2 ? '招募结束时间' : '结束时间'"
+            prop="endDate"
+          >
+            <el-date-picker
+              clearable
+              v-model="form.endDate"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="请选择结束时间"
+            >
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item
+            v-if="form.activityType === 2"
+            label="门店累积天数"
+            prop="duration"
+          >
+            <el-input
+              v-model="form.duration"
+              :max="31"
+              type="number"
+              placeholder="不大于31天"
+              style="width: 400px"
+            >
+              <template #suffix> 天 </template>
+            </el-input>
+          </el-form-item>
+        </div>
+        <div class="box">
+          <h5>返利设置</h5>
+          <el-form-item label="返利方式" prop="activityRewardType">
+            <el-radio-group v-model="form.activityRewardType">
+              <el-radio :value="1">商品</el-radio>
+              <el-radio :value="2">啤酒币</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <template v-if="form.activityRewardType == 1">
+            <el-form-item label="选择商品" prop="activityRewardGoodsId">
+              <el-select
+                v-model="form.activityRewardGoodsId"
+                placeholder="请选择商品"
+                style="width: 400px"
+              >
+                <el-option
+                  v-for="item in allGoods"
+                  :key="item.id"
+                  :label="item.goodsName"
+                  :value="item.id"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="返利数量" prop="activityRewardCount">
+              <el-input
+                v-model="form.activityRewardCount"
+                type="number"
+                :min="0"
+                placeholder="返利数量"
+                style="width: 400px"
+              ></el-input>
+            </el-form-item>
+          </template>
+          <template v-if="form.activityRewardType == 2">
+            <el-form-item label="啤酒币发放数量" prop="activityRewardCount">
+              <el-input
+                v-model="form.activityRewardCount"
+                type="number"
+                :min="0"
+                placeholder="啤酒币发放数量"
+                style="width: 400px"
+              ></el-input>
+            </el-form-item>
+          </template>
+        </div>
+      </div>
+    </el-form>
+    <div class="btn-container">
+      <el-button type="primary" @click="handlePublish">保存并发布</el-button>
+      <el-button type="primary" @click="handleSubmit">保存</el-button>
+      <el-button @click="handleCancle">取消</el-button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { pcTextArr } from "element-china-area-data";
+import { onMounted, ref } from "vue";
+import { addActivity } from "@/api/brewery/activity";
+import { allBeers } from "@/api/brewery/beer";
+import { allListGoods } from "@/api/brewery/goods";
+import { getCurrentInstance } from "vue";
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+const loading = ref(false);
+const form = ref({
+  activityType: 2,
+  beerScope: 0,
+  activityRewardType: 1,
+});
+const allBeersList = ref([]); // 所有啤酒列表
+const allGoods = ref([]); // 所有可兑换商品
+onMounted(() => {
+  getAllBeersFun(); // 所有啤酒列表
+  getAllGoodsFun(); // 所有可兑换商品
+});
+const selectedOptions = ref([]);
+function handleChange() {
+  console.log(selectedOptions.value);
+  form.value.city = `${selectedOptions.value[0]}/${selectedOptions.value[1]}`;
+}
+// 获取所有啤酒列表
+function getAllBeersFun() {
+  allBeers().then((response) => {
+    allBeersList.value = response.data;
+  });
+}
+// 所有可兑换商品
+function getAllGoodsFun() {
+  allListGoods({ purchaseMethod: 2 }).then((response) => {
+    allGoods.value = response.data;
+  });
+}
+// 发布活动
+function handlePublish() {
+  console.log("发布");
+  proxy.$refs["formRef"].validate((valid) => {
+    if (valid) {
+      form.value.activityStatus = 1;
+
+      loading.value = true;
+      addActivity(form.value)
+        .then((response) => {
+          loading.value = false;
+          proxy.$modal.msgSuccess("发布成功");
+          router.back();
+        })
+        .catch((error) => {
+          loading.value = false;
+          console.log(error);
+          proxy.$modal.msgError("发布失败");
+        });
+    }
+  });
+}
+// 保存活动
+function handleSubmit() {
+  console.log("保存");
+  proxy.$refs["formRef"].validate((valid) => {
+    if (valid) {
+      form.value.activityStatus = 0;
+
+      loading.value = true;
+      addActivity(form.value)
+        .then((response) => {
+          loading.value = false;
+          proxy.$modal.msgSuccess("保存成功");
+          router.back();
+        })
+        .catch((error) => {
+          loading.value = false;
+          console.log(error);
+          proxy.$modal.msgError("保存失败");
+        });
+    }
+  });
+}
+// 取消
+function handleCancle() {
+  router.back();
+}
+</script>
+
+<style scoped lang="scss">
+.box {
+  padding: 5px 8px;
+  background-color: #f5f5f5;
+  margin-bottom: 24px;
+}
+.btn-container {
+  text-align: center;
+}
+</style>
diff --git a/src/views/activity/index.vue b/src/views/activity/index.vue
new file mode 100644
index 0000000..3b7947c
--- /dev/null
+++ b/src/views/activity/index.vue
@@ -0,0 +1,406 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="酒厂ID" prop="breweryId">
+        <el-input
+          v-model="queryParams.breweryId"
+          placeholder="请输入酒厂ID"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="活动名称" prop="activityName">
+        <el-input
+          v-model="queryParams.activityName"
+          placeholder="请输入活动名称"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="活动介绍" prop="activityDesc">
+        <el-input
+          v-model="queryParams.activityDesc"
+          placeholder="请输入活动介绍"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="开始时间" prop="startDate">
+        <el-date-picker
+          clearable
+          v-model="queryParams.startDate"
+          type="date"
+          value-format="YYYY-MM-DD"
+          placeholder="请选择开始时间"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="结束时间" prop="endDate">
+        <el-date-picker
+          clearable
+          v-model="queryParams.endDate"
+          type="date"
+          value-format="YYYY-MM-DD"
+          placeholder="请选择结束时间"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="handleAdd"
+          v-hasPermi="['brewery:activity:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['brewery:activity:edit']"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['brewery:activity:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:activity:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="activityList"
+      class="zd-table"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="" align="center" prop="id" />
+      <el-table-column label="酒厂ID" align="center" prop="breweryId" />
+      <el-table-column label="1定向 2招募" align="center" prop="activityType" />
+      <el-table-column label="活动名称" align="center" prop="activityName" />
+      <el-table-column label="活动介绍" align="center" prop="activityDesc" />
+      <el-table-column
+        label="0无效 1有效"
+        align="center"
+        prop="activityStatus"
+      />
+      <el-table-column
+        label="开始时间"
+        align="center"
+        prop="startDate"
+        width="180"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.startDate, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="结束时间"
+        align="center"
+        prop="endDate"
+        width="180"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.endDate, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            icon="Edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['brewery:activity:edit']"
+            >修改</el-button
+          >
+          <el-button
+            link
+            type="primary"
+            icon="Delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['brewery:activity:remove']"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改营销活动对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form
+        ref="activityRef"
+        :model="form"
+        :rules="rules"
+        label-width="80px"
+      >
+        <el-form-item label="酒厂ID" prop="breweryId">
+          <el-input v-model="form.breweryId" placeholder="请输入酒厂ID" />
+        </el-form-item>
+        <el-form-item label="活动名称" prop="activityName">
+          <el-input v-model="form.activityName" placeholder="请输入活动名称" />
+        </el-form-item>
+        <el-form-item label="活动介绍" prop="activityDesc">
+          <el-input v-model="form.activityDesc" placeholder="请输入活动介绍" />
+        </el-form-item>
+        <el-form-item label="开始时间" prop="startDate">
+          <el-date-picker
+            clearable
+            v-model="form.startDate"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="请选择开始时间"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="结束时间" prop="endDate">
+          <el-date-picker
+            clearable
+            v-model="form.endDate"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="请选择结束时间"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="form.remark"
+            type="textarea"
+            placeholder="请输入内容"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Activity">
+import {
+  listActivity,
+  getActivity,
+  delActivity,
+  addActivity,
+  updateActivity,
+} from "@/api/brewery/activity";
+
+const { proxy } = getCurrentInstance();
+
+const activityList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    activityType: null,
+    activityName: null,
+    activityDesc: null,
+    activityStatus: null,
+    startDate: null,
+    endDate: null,
+  },
+  rules: {
+    breweryId: [{ required: true, message: "酒厂ID不能为空", trigger: "blur" }],
+    activityType: [
+      { required: true, message: "1定向 2招募不能为空", trigger: "change" },
+    ],
+    activityName: [
+      { required: true, message: "活动名称不能为空", trigger: "blur" },
+    ],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询营销活动列表 */
+function getList() {
+  loading.value = true;
+  listActivity(queryParams.value).then((response) => {
+    activityList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    activityType: null,
+    activityName: null,
+    activityDesc: null,
+    activityStatus: null,
+    startDate: null,
+    endDate: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("activityRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加营销活动";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value;
+  getActivity(_id).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改营销活动";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["activityRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateActivity(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addActivity(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除营销活动编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delActivity(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/activity/export",
+    {
+      ...queryParams.value,
+    },
+    `activity_${new Date().getTime()}.xlsx`
+  );
+}
+
+getList();
+</script>
diff --git a/src/views/activity/promotion.vue b/src/views/activity/promotion.vue
new file mode 100644
index 0000000..58966d6
--- /dev/null
+++ b/src/views/activity/promotion.vue
@@ -0,0 +1,331 @@
+<template>
+  <!-- <div>啤酒币推广</div> -->
+  <div class="app-container">
+    <div class="top-box">
+      <div class="statistic">
+        <div class="title">已发放未使用啤酒币数量</div>
+        <div class="value">{{ TJData.remaining || 0 }}</div>
+        <svg-icon icon-class="beerReview" class="icon"></svg-icon>
+      </div>
+      <div class="statistic">
+        <div class="title">参与门店用户数</div>
+        <div class="value">{{ TJData.bars || 0 }}</div>
+        <svg-icon icon-class="fangkuai" class="icon"></svg-icon>
+      </div>
+      <div class="statistic">
+        <div class="title">待兑付订单数</div>
+        <div class="value">{{ TJData.waitingOrders || 0 }}</div>
+        <svg-icon icon-class="biaoge" class="icon"></svg-icon>
+      </div>
+      <div class="statistic">
+        <div class="title">发布商品数量</div>
+        <div class="value">{{ TJData.goodsCount || 0 }}</div>
+        <svg-icon icon-class="shizhong" class="icon"></svg-icon>
+      </div>
+    </div>
+    <div class="zd-card">
+      <div
+        style="
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+        "
+      >
+        <h4>已发布兑换商品</h4>
+        <el-button type="primary" @click="handleAdd">新增兑换商品</el-button>
+      </div>
+      <el-table v-loading="loading" :data="goodsList" class="zd-table">
+        <el-table-column label="商品名称" align="left" prop="goodsName">
+          <template #default="scope">
+            <div style="display: flex; align-items: center; gap: 16px">
+              <el-image
+                style="width: 60px; height: 60px"
+                :src="scope.row.goodsCover"
+                :zoom-rate="1.2"
+                :max-scale="7"
+                :min-scale="0.2"
+                :preview-src-list="[scope.row.goodsCover]"
+                :initial-index="4"
+                fit="cover"
+                title="点击查看大图"
+                preview-teleported
+              />
+              <div>
+                <div>名称：{{ scope.row.goodsName }} {{ scope.row.specs }}</div>
+                <div>编码：{{ scope.row.goodsSn }}</div>
+              </div>
+            </div>
+          </template>
+        </el-table-column>
+
+        <el-table-column
+          label="啤酒币兑换数量"
+          align="center"
+          prop="redeemedNum"
+        >
+          <template #default="scope">
+            <template v-if="currentGoodsCoinId === scope.row.id">
+              <el-input
+                v-model="goodsCoinCount"
+                type="number"
+                placeholder="请输入数量"
+                style="width: 80px"
+              />
+              <el-button link type="primary" @click="saveGoodsCoinCount"
+                >保存</el-button
+              >
+              <el-button link @click="cancelGoodsCoin">取消</el-button>
+            </template>
+            <template v-else>
+              <span>{{ scope.row.redeemedNum }}</span>
+              <el-icon
+                size="16"
+                class="edit-icon"
+                @click="handleGoodsIcons(scope.row)"
+                ><EditPen
+              /></el-icon>
+            </template>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="创建时间" align="center" prop="createTime" />
+        <el-table-column
+          label="操作"
+          align="center"
+          width="200"
+          fixed="right"
+          class-name="small-padding fixed-width"
+        >
+          <template #default="scope">
+            <el-button
+              link
+              type="primary"
+              @click="handleSaleStatus(scope.row)"
+              >{{ scope.row.onSale === 1 ? "下架" : "上架" }}</el-button
+            >
+            <el-button link type="primary" @click="handleHistory(scope.row)"
+              >兑换历史</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        v-model:page="queryParams.pageNum"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </div>
+    <div class="zd-card">
+      <h4>参与门店明细</h4>
+      <el-table :data="bars" class="zd-table">
+        <el-table-column label="门店ID" align="center" prop="barCode" />
+        <el-table-column label="门店所在城市" align="center" prop="barCity" />
+        <el-table-column
+          label="未使用啤酒币数量"
+          align="center"
+          prop="balance"
+        />
+        <el-table-column
+          label="已使用啤酒币数量"
+          align="center"
+          prop="usedNum"
+        />
+        <el-table-column
+          label="兑换历史订单数量"
+          align="center"
+          prop="exchangedOrderNum"
+        />
+        <el-table-column label="操作" align="center" width="200" fixed="right">
+          <template #default="scope">
+            <el-button link type="primary" @click="handleBarDetail(scope.row)"
+              >查看详细</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="barTotal > 0"
+        :total="barTotal"
+        v-model:page="barQuery.pageNum"
+        v-model:limit="barQuery.pageSize"
+        @pagination="getBeerCoinBars"
+      />
+    </div>
+    <el-drawer v-model="showDrawer" title="批次详情">
+      <el-descriptions column="1" label-width="100px">
+        <el-descriptions-item label="批次编号：">{{
+          barInfo.batchSn
+        }}</el-descriptions-item>
+        <el-descriptions-item label="打印数量：">{{}}</el-descriptions-item>
+        <el-descriptions-item label="打印日期："> {{}} </el-descriptions-item>
+        <el-descriptions-item label="产品生产日期：">
+          {{}}
+        </el-descriptions-item>
+        <el-descriptions-item label="已核销数量：">
+          {{ barInfo.checkCount }}
+        </el-descriptions-item>
+        <el-descriptions-item label="待核销数量："> {{}} </el-descriptions-item>
+        <el-descriptions-item label="已失效数量：">
+          {{ barInfo.invalidCount }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-drawer>
+  </div>
+</template>
+
+<script setup>
+import { beerCoinData, beerCoinBars } from "@/api/brewery/activity";
+import {
+  listGoods,
+  updateGoodsIcons,
+  updateGoodsSaleStatus,
+} from "@/api/brewery/goods";
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+onMounted(() => {
+  getTJData();
+  getBeerCoinBars();
+  getList();
+});
+const TJData = ref({});
+function getTJData() {
+  beerCoinData().then((res) => {
+    TJData.value = res.data;
+  });
+}
+function handleAdd() {
+  router.push("/product/commodity/add");
+}
+const goodsList = ref([]);
+const total = ref(0);
+const queryParams = reactive({
+  pageNum: 1,
+  pageSize: 10,
+});
+const loading = ref(false);
+/** 查询兑换商品列表 */
+function getList() {
+  loading.value = true;
+  listGoods(queryParams.value).then((response) => {
+    goodsList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+// 修改兑换啤酒数
+const currentGoodsCoinId = ref(null);
+const goodsCoinCount = ref(0);
+function handleGoodsIcons(row) {
+  currentGoodsCoinId.value = row.id;
+  goodsCoinCount.value = row.redeemedNum;
+}
+function saveGoodsCoinCount() {
+  updateGoodsIcons({
+    goodsId: currentGoodsCoinId.value,
+    icons: goodsCoinCount.value,
+  }).then(() => {
+    proxy.$modal.msgSuccess("修改成功");
+    currentGoodsCoinId.value = null;
+    goodsCoinCount.value = 0;
+    getList();
+  });
+}
+function cancelGoodsCoin() {
+  currentGoodsCoinId.value = null;
+  goodsCoinCount.value = 0;
+}
+//==========//==========
+const bars = ref([]);
+const barTotal = ref(0);
+const barQuery = ref({
+  pageNum: 1,
+  pageSize: 5,
+});
+function getBeerCoinBars() {
+  beerCoinBars(barQuery.value).then((res) => {
+    bars.value = res.rows;
+    barTotal.value = res.total;
+  });
+}
+/** 商品上架按钮操作 */
+function handleSaleStatus(row) {
+  let str = "";
+  if (row.onSale == 1) {
+    str = "下架";
+  } else {
+    str = "上架";
+  }
+
+  proxy.$modal
+    .confirm("是否确认" + str + '编号为"' + row.id + '"的数据项？')
+    .then(() => {
+      updateGoodsSaleStatus({
+        goodsId: row.id,
+        state: row.onSale == 1 ? 0 : 1,
+      }).then(() => {
+        getList();
+        proxy.$modal.msgSuccess(`${str}成功`);
+      });
+    })
+    .catch(() => {});
+}
+function handleHistory(row) {
+  router.push("/product/commodity/history?goodsId=" + row.id);
+}
+
+//   门店详情
+const barInfo = ref({});
+const showDrawer = ref(false);
+function handleBarDetail(row) {
+  showDrawer.value = true;
+  console.log(row);
+}
+</script>
+
+<style scoped lang="scss">
+.top-box {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 16px;
+  .statistic {
+    min-width: 24%;
+    height: 161px;
+    box-sizing: border-box;
+    padding: 16px;
+    border-radius: 14px;
+    opacity: 1;
+    background: #ffffff;
+    box-shadow: 6px 6px 54px 0px rgba(0, 0, 0, 0.05);
+    position: relative;
+    .title {
+      font-family: Nunito Sans;
+      font-size: 16px;
+      font-weight: 600;
+      color: #202224;
+      margin-bottom: 12px;
+    }
+    .value {
+      font-family: Nunito Sans;
+      font-size: 28px;
+      font-weight: bold;
+      color: #202224;
+    }
+    .icon {
+      position: absolute;
+      top: 16px;
+      right: 16px;
+      width: 60px;
+      height: 60px;
+    }
+  }
+}
+.edit-icon {
+  margin-left: 4px;
+  vertical-align: middle;
+  cursor: pointer;
+}
+</style>
diff --git a/src/views/activity/rebate.vue b/src/views/activity/rebate.vue
new file mode 100644
index 0000000..f07dd53
--- /dev/null
+++ b/src/views/activity/rebate.vue
@@ -0,0 +1,474 @@
+<template>
+  <div class="app-container">
+    <div
+      style="
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 16px;
+      "
+    >
+      <span>累积返利</span>
+      <el-button
+        type="primary"
+        @click="handleAdd"
+        v-hasPermi="['brewery:goods:add']"
+        >发布返利活动</el-button
+      >
+    </div>
+    <div class="top-box">
+      <div class="statistic">
+        <div class="title">招募中活动数量</div>
+        <div class="value" style="font-size: 18px">
+          <span style="font-size: 14px; margin-right: 10px">指定活动：</span
+          >{{ TJData.qualifiedCount || 0 }}
+        </div>
+        <div class="value" style="font-size: 18px">
+          <span style="font-size: 14px; margin-right: 10px">招募活动：</span
+          >{{ TJData.publicCount || 0 }}
+        </div>
+        <svg-icon icon-class="beerReview" class="icon"></svg-icon>
+      </div>
+      <div class="statistic">
+        <div class="title">参与中门店数</div>
+        <div class="value">{{ TJData.barCount || 0 }}</div>
+        <svg-icon icon-class="fangkuai" class="icon"></svg-icon>
+      </div>
+      <div class="statistic">
+        <div class="title">待兑付订单数</div>
+        <div class="value">{{ TJData.waitingClaimCount || 0 }}</div>
+        <svg-icon icon-class="biaoge" class="icon"></svg-icon>
+      </div>
+      <div class="statistic">
+        <div class="title">已兑付订单数</div>
+        <div class="value">{{ TJData.redeemedCount || 0 }}</div>
+        <svg-icon icon-class="shizhong" class="icon"></svg-icon>
+      </div>
+    </div>
+    <div class="zd-card">
+      <el-tabs
+        v-model="stage"
+        class="demo-tabs"
+        style="padding-top: 10px"
+        @tab-click="handleStageClick"
+      >
+        <el-tab-pane label="招募中活动" :name="1"></el-tab-pane>
+        <el-tab-pane label="招募结束待结案活动" :name="2"></el-tab-pane>
+        <el-tab-pane label="已结案活动" :name="3"></el-tab-pane>
+      </el-tabs>
+      <el-table :data="activityList" class="zd-table" style="width: 100%">
+        <el-table-column label="活动ID" align="center" prop="id" width="80px" />
+        <!-- <el-table-column label="活动发起方" align="center" prop="" /> -->
+        <el-table-column
+          label="招募开始时间"
+          align="center"
+          prop="startDate"
+          width="110px"
+        />
+        <el-table-column
+          label="招募结束时间"
+          align="center"
+          prop="endDate"
+          width="110px"
+        />
+        <el-table-column label="活动状态" align="center" prop="activityStatus">
+          <template #default="scope">
+            <span v-if="scope.row.activityStatus === 0">已中止</span>
+            <span v-if="scope.row.activityStatus === 1">进行中</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="累计时间" align="center" prop="duration" />
+        <el-table-column
+          label="发布区域"
+          align="center"
+          prop="city"
+          show-overflow-tooltip
+        />
+        <el-table-column label="已核销数量" align="center" prop="claimCount" />
+        <el-table-column
+          label="参与门店数"
+          align="center"
+          prop="joinBarCount"
+        />
+        <el-table-column
+          label="待兑付数"
+          align="center"
+          prop="waitingClaimCount"
+        />
+        <el-table-column
+          label="已完成数"
+          align="center"
+          prop="finishedClaimCount"
+        />
+        <el-table-column
+          label="操作"
+          align="center"
+          width="120px"
+          fixed="right"
+          class-name="small-padding fixed-width"
+        >
+          <template #default="scope">
+            <el-button link type="primary" @click="handleInfo(scope.row)"
+              >详细</el-button
+            >
+            <el-button
+              v-if="scope.row.activityStatus === 1"
+              link
+              type="primary"
+              @click="handleAbort(scope.row)"
+              >中止招募</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        v-model:page="query.pageNum"
+        v-model:limit="query.pageSize"
+        @pagination="getRecruitList"
+      />
+    </div>
+    <div class="zd-card">
+      <h4>指定门店ID活动明细</h4>
+      <el-table :data="DXList" class="zd-table" style="width: 100%">
+        <el-table-column label="活动ID" align="center" prop="activityName" />
+        <el-table-column label="门店ID" align="center" prop="barNumber">
+        </el-table-column>
+        <el-table-column
+          label="开始时间"
+          align="center"
+          prop="startDate"
+          width="110px"
+        />
+        <el-table-column
+          label="结束时间"
+          align="center"
+          prop="endDate"
+          width="110px"
+        />
+        <el-table-column label="酒款范围" align="center" prop="beerScope">
+          <template #default="scope">
+            <span v-if="scope.row.beerScope === 1">指定酒款</span>
+            <span v-if="scope.row.beerScope == 0">不限</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="达成奖励"
+          align="center"
+          prop="activityRewardCount"
+        />
+        <el-table-column
+          label="累积目标数"
+          align="center"
+          prop="activityTarget"
+        />
+        <el-table-column label="达成进度" align="center" prop="progress" />
+        <el-table-column label="活动状态" align="center" prop="activityStatus">
+          <template #default="scope">
+            <span v-if="scope.row.activityStatus === 0">无效</span>
+            <span v-if="scope.row.activityStatus === 1">有效</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          align="center"
+          width="120px"
+          fixed="right"
+          class-name="small-padding fixed-width"
+        >
+          <template #default="scope">
+            <el-button link type="primary" @click="handleClaim(scope.row)"
+              >兑付</el-button
+            >
+            <el-button link type="primary" @click="handleDetail(scope.row)"
+              >详细</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="dxTotal > 0"
+        :total="dxTotal"
+        v-model:page="DXQuery.pageNum"
+        v-model:limit="DXQuery.pageSize"
+        @pagination="getDXList"
+      />
+    </div>
+
+    <el-drawer v-model="showDrawer" title="详情" size="680">
+      <el-descriptions column="1" label-width="100px">
+        <el-descriptions-item label="活动ID：">{{
+          info.activityName
+        }}</el-descriptions-item>
+        <el-descriptions-item label="门店ID：">{{
+          info.barNumber
+        }}</el-descriptions-item>
+        <el-descriptions-item label="开始时间：">
+          {{ info.startDate }}
+        </el-descriptions-item>
+        <el-descriptions-item label="结束时间：">
+          {{ info.endDate }}
+        </el-descriptions-item>
+        <el-descriptions-item label="酒款范围：">
+          <span v-if="info.beerScope === 1">指定酒款</span>
+          <span v-if="info.beerScope == 0">不限</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="累积目标数：">
+          {{ info.activityTarget }}
+        </el-descriptions-item>
+        <el-descriptions-item label="达成奖励：">
+          {{ info.activityRewardCount }}
+        </el-descriptions-item>
+      </el-descriptions>
+      <div
+        style="display: flex; justify-content: flex-end; margin-bottom: 16px"
+      >
+        <el-button type="primary" @click="handleAddTime"
+          >延长活动时间</el-button
+        >
+      </div>
+      <el-table :data="consumeList" class="zd-table">
+        <el-table-column label="核销产品名称" align="center" prop="beerName" />
+        <el-table-column label="二维码ID" align="center" prop="skuSn" />
+        <el-table-column label="核销时间" align="center" prop="scanTime" />
+        <el-table-column label="操作" align="center">
+          <template #default="scope">
+            <el-button
+              v-if="scope.row.scanStatus === 1"
+              type="text"
+              @click="handleRevoke(scope.row)"
+            >
+              撤销核销
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="consumeTotal > 0"
+        :total="consumeTotal"
+        v-model:page="consumeQuery.pageNum"
+        v-model:limit="consumeQuery.pageSize"
+        @pagination="getConsumeList"
+      />
+    </el-drawer>
+    <el-dialog
+      title="延长活动时间"
+      v-if="showExtendTime"
+      v-model="showExtendTime"
+      width="500px"
+    >
+      <el-form :model="extendForm" label-width="100px">
+        <el-form-item label="延长时间">
+          <el-date-picker
+            v-model="extendForm.extendTime"
+            type="date"
+            placeholder="选择延长时间"
+            value-format="YYYY-MM-DD"
+            style="width: 100%"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="handleConfirm">确定</el-button>
+          <el-button @click="showExtendTime = false">取消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import {
+  activityData,
+  listActivity,
+  stopActivity,
+  extendActivity,
+  getActivityConsumeList,
+  cancelConsume,
+} from "@/api/brewery/activity";
+import { getCurrentInstance } from "vue";
+import { ref, reactive, onMounted } from "vue";
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+onMounted(() => {
+  getTJData();
+  getDXList();
+  getRecruitList();
+});
+function handleAdd() {
+  router.push("/activity/addRebate");
+}
+const TJData = ref({});
+function getTJData() {
+  activityData().then((res) => {
+    TJData.value = res.data;
+  });
+}
+
+// 招募中
+const activityList = ref([]);
+const total = ref(0);
+const query = ref({
+  activityType: 2,
+  pageNum: 1,
+  pageSize: 5,
+});
+function getRecruitList() {
+  listActivity(query.value).then((res) => {
+    activityList.value = res.rows;
+    total.value = res.total;
+  });
+}
+const stage = ref(1);
+function handleStageClick() {
+  query.value.activityType = 2;
+  query.value.pageNum = 1;
+  query.value.stage = stage.value;
+  getRecruitList();
+}
+// 招募活动详情
+function handleInfo(row) {
+  console.log(row);
+  router.push("/activity/activityInfo?id=" + row.id);
+}
+
+// 中止
+function handleAbort(row) {
+  console.log(row);
+  proxy.$modal
+    .confirm('是否确认中止活动编号为"' + row.id + '"的数据项？')
+    .then(() => {
+      stopActivity(row.id).then(() => {
+        getRecruitList();
+      });
+    });
+}
+// 指定门店ID（定向）
+const DXList = ref([]);
+const dxTotal = ref(0);
+const DXQuery = ref({
+  activityType: 1,
+  pageNum: 1,
+  pageSize: 5,
+});
+function getDXList() {
+  listActivity(DXQuery.value).then((res) => {
+    if (res.rows && res.rows.length > 0) {
+      DXList.value = res.rows.map((item) => {
+        if (item.activityTarget && item.claimCount != null) {
+          item.progress =
+            item.activityTarget > 0
+              ? (item.claimCount / item.activityTarget).toFixed(2) * 100 + "%"
+              : 0 + "%";
+        }
+
+        return item;
+      });
+    }
+
+    dxTotal.value = res.total;
+  });
+}
+
+// 活动详情
+const showDrawer = ref(false);
+
+// 兑付
+function handleClaim(row) {
+  console.log(row);
+  // router.push("/activity/claim");
+}
+
+// 详细
+const consumeList = ref([]);
+const consumeTotal = ref(0);
+const consumeQuery = ref({
+  pageNum: 1,
+  pageSize: 5,
+});
+const info = ref({});
+function handleDetail(row) {
+  console.log(row);
+  showDrawer.value = true;
+  info.value = row;
+  consumeQuery.value.activityId = row.id;
+  consumeQuery.value.barId = row.barIds[0];
+  getConsumeList();
+}
+function getConsumeList() {
+  getActivityConsumeList(consumeQuery.value).then((res) => {
+    console.log(res);
+    consumeList.value = res.rows;
+    consumeTotal.value = res.total;
+  });
+}
+
+// 延长活动时间
+const extendTime = ref("");
+const extendForm = ref({});
+const showExtendTime = ref(false);
+function handleAddTime() {
+  showExtendTime.value = true;
+}
+function handleConfirm() {
+  console.log("延长活动时间");
+  extendActivity({
+    activityId: info.value.id,
+    extendTime: extendForm.value.extendTime,
+  }).then((res) => {
+    console.log(res);
+    showExtendTime.value = false;
+  });
+}
+
+// 撤销核销
+function handleRevoke(row) {
+  console.log(row);
+  cancelConsume(row.id).then((res) => {
+    proxy.$message.success("撤销成功");
+    getConsumeList();
+  });
+}
+</script>
+
+<style scoped lang="scss">
+.top-box {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 16px;
+  .statistic {
+    min-width: 24%;
+    height: 161px;
+    box-sizing: border-box;
+    padding: 16px;
+    border-radius: 14px;
+    opacity: 1;
+    background: #ffffff;
+    box-shadow: 6px 6px 54px 0px rgba(0, 0, 0, 0.05);
+    position: relative;
+    .title {
+      font-family: Nunito Sans;
+      font-size: 16px;
+      font-weight: 600;
+      color: #202224;
+      margin-bottom: 12px;
+    }
+    .value {
+      font-family: Nunito Sans;
+      font-size: 28px;
+      font-weight: bold;
+      color: #202224;
+    }
+    .icon {
+      position: absolute;
+      top: 16px;
+      right: 16px;
+      width: 60px;
+      height: 60px;
+    }
+  }
+}
+</style>
diff --git a/src/views/activity/rewardList.vue b/src/views/activity/rewardList.vue
new file mode 100644
index 0000000..7e5c6ee
--- /dev/null
+++ b/src/views/activity/rewardList.vue
@@ -0,0 +1,307 @@
+<template>
+  <div class="app-container">
+    <el-table :data="rewardList" class="zd-table">
+      <el-table-column
+        label="兑付单号"
+        align="center"
+        prop="id"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="兑付时间"
+        align="center"
+        prop="claimTime"
+        width="120"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.claimTime, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="活动名称"
+        align="center"
+        prop="activityName"
+        show-overflow-tooltip
+      />
+
+      <el-table-column
+        label="商品名称"
+        align="center"
+        prop="rewardGoodsName"
+        show-overflow-tooltip
+      >
+        <template #default="scope">
+          <span v-if="scope.row.rewardType === 1">啤酒币</span>
+          <span v-if="scope.row.rewardType === 2">{{
+            scope.row.rewardGoodsName
+          }}</span>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column label="兑付类型" align="center" prop="orderType" /> -->
+      <el-table-column label="门店" align="center" prop="barName" />
+      <el-table-column label="门店ID" align="center" prop="barNumber" />
+      <el-table-column
+        label="门店城市"
+        align="center"
+        prop="barCity"
+        show-overflow-tooltip
+      />
+      <!-- <el-table-column
+        label="品牌啤酒币兑换数"
+        align="center"
+        prop="beerCoinNum"
+      />
+      <el-table-column
+        label="平台啤酒币兑换数"
+        align="center"
+        prop="platformCoinNum"
+      /> -->
+      <!-- <el-table-column
+        label="收货地址"
+        align="center"
+        prop="address"
+        show-overflow-tooltip
+      /> -->
+
+      <el-table-column label="物流状态" align="center" prop="shippingStatus" />
+
+      <el-table-column
+        label="发货时间"
+        align="center"
+        prop="dispatchTime"
+        width="120"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.dispatchTime, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="快递单号" align="center" prop="wayBillNo" />
+      <el-table-column label="兑付状态" align="center" prop="rewardStatus">
+        <template #default="scope">
+          <span v-if="scope.row.rewardStatus === 0">待发放</span>
+          <span v-if="scope.row.rewardStatus === 1">已发放</span>
+          <span v-if="scope.row.rewardStatus === 2">已领取</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column
+        label="操作"
+        align="center"
+        fixed="right"
+        width="150"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            v-if="scope.row.rewardType === 2 && scope.row.rewardStatus === 0"
+            link
+            type="primary"
+            @click="handleDelivery2(scope.row)"
+            >发货</el-button
+          >
+          <el-button link type="primary" @click="handleRemark(scope.row)"
+            >备注</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+    <!-- 2 发货 -->
+    <el-dialog
+      title="订单发货"
+      v-model="deliveryOpen2"
+      width="500px"
+      append-to-body
+    >
+      <el-form
+        ref="deliveryRef2"
+        :model="deliveryForm2"
+        :rules="rules"
+        label-width="80px"
+      >
+        <el-form-item label="商品信息">
+          <div
+            style="
+              display: flex;
+              justify-content: flex-start;
+              align-items: center;
+              gap: 20px;
+              width: 100%;
+            "
+          >
+            <el-image
+              style="width: 60px; height: 60px"
+              :src="currentRow2.goodsCover"
+              :zoom-rate="1.2"
+              :max-scale="7"
+              :min-scale="0.2"
+              :preview-src-list="[currentRow2.goodsCover]"
+              :initial-index="4"
+              fit="cover"
+              title="点击查看大图"
+              preview-teleported
+            />
+            <div>
+              <div>{{ currentRow2.rewardGoodsName }}</div>
+              <!-- <div>{{ currentRow.goodsName }}</div> -->
+            </div>
+            <div>x {{ currentRow2.rewardGoodsNum }}</div>
+          </div>
+        </el-form-item>
+        <el-form-item label="收货信息">
+          <div>联系方式：{{ currentRow2.contactPhone }}</div>
+          <div>收货地址：{{ currentRow2.address }}</div>
+        </el-form-item>
+        <el-form-item label="发货方式" prop="dispatchMethod">
+          <el-radio-group v-model="deliveryForm2.dispatchMethod">
+            <el-radio :value="0">自己配送</el-radio>
+            <el-radio :value="1">快递</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <templatet v-if="deliveryForm2.dispatchMethod === 1">
+          <el-form-item label="快递公司" prop="expressCompany">
+            <el-input
+              v-model="deliveryForm2.expressCompany"
+              placeholder="请输入快递公司"
+            />
+          </el-form-item>
+          <el-form-item label="快递单号" prop="wayBillNo">
+            <el-input
+              v-model="deliveryForm2.wayBillNo"
+              placeholder="请输入快递单号"
+            />
+          </el-form-item>
+        </templatet>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitDelivery2">确 定</el-button>
+          <el-button @click="cancelDelivery2">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <el-dialog
+      title="订单备注"
+      v-model="openRemark"
+      width="500px"
+      append-to-body
+    >
+      <el-form
+        ref="remarkRef"
+        :model="remarkForm"
+        :rules="rulesRemark"
+        label-width="80px"
+      >
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="remarkForm.remark"
+            type="textarea"
+            placeholder="请输入内容"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitRemark">确 定</el-button>
+          <el-button @click="cancelRemark">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted } from "vue";
+import {
+  activityRedeemOrder,
+  getOrderInfo,
+  deliveryRedeemOrder,
+} from "@/api/brewery/redeemOrder";
+const { proxy } = getCurrentInstance();
+const loading = ref(false);
+const total = ref(0);
+const ids = ref(0);
+const remarkForm = ref({});
+const openRemark = ref(false); // 备注弹窗
+const rulesRemark = ref({
+  remark: [{ required: true, message: "备注不能为空", trigger: "blur" }],
+});
+const rewardList = ref([]);
+const deliveryOpen = ref(false); // 发货弹窗
+const deliveryForm = ref({});
+const queryParams = ref({
+  pageNum: 1,
+  pageSize: 10,
+});
+onMounted(() => {
+  getList();
+});
+
+/** 查询兑换订单列表 */
+function getList() {
+  loading.value = true;
+  activityRedeemOrder(queryParams.value).then((response) => {
+    rewardList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+const currentRow2 = ref({});
+const deliveryOpen2 = ref(false);
+const deliveryForm2 = ref({ dispatchMethod: 0 });
+/** 发货按钮操作 */
+function handleDelivery2(row) {
+  currentRow2.value = row;
+  console.log(row);
+  deliveryOpen2.value = true;
+}
+// 发货按钮
+function submitDelivery2() {
+  proxy.$refs["deliveryRef2"].validate((valid) => {
+    if (valid) {
+      deliveryForm2.value.rewardId = currentRow.value.id;
+      dispatchRew(deliveryForm2.value).then((response) => {
+        proxy.$modal.msgSuccess("发货成功");
+        deliveryOpen2.value = false;
+        getGoodsActivity();
+      });
+    }
+  });
+}
+function cancelDelivery2() {
+  deliveryOpen2.value = false;
+  deliveryForm2.value = { dispatchMethod: 0 };
+  currentRow2.value = {};
+}
+
+function handleRemark(row) {
+  currentRow2.value = row;
+  openRemark.value = true;
+}
+function submitRemark() {
+  proxy.$refs["remarkRef"].validate((valid) => {
+    if (valid) {
+      remarkForm.value.id = currentRow2.value.id;
+      updateRedeemOrder(remarkForm.value).then((response) => {
+        proxy.$modal.msgSuccess("备注成功");
+        openRemark.value = false;
+        getList();
+      });
+    }
+  });
+}
+// 取消按钮
+function cancelRemark() {
+  openRemark.value = false;
+}
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/beerReview/index.vue b/src/views/beerReview/index.vue
new file mode 100644
index 0000000..df7ceaa
--- /dev/null
+++ b/src/views/beerReview/index.vue
@@ -0,0 +1,629 @@
+<template>
+  <div class="app-container">
+    <div class="header">
+      <el-form
+        :model="queryParams"
+        ref="queryRef"
+        :inline="false"
+        v-show="showSearch"
+        label-width="68px"
+      >
+        <el-form-item label="评价时间" prop="createTime">
+          <el-date-picker
+            v-model="timeRange"
+            type="daterange"
+            placeholder="请选择评价时间"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            value-format="YYYY-MM-DD"
+            style="width: 400px"
+            @change="handleTime"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="酒款筛选" prop="beerName">
+          <el-select
+            v-model="queryParams.beerId"
+            placeholder="请选择酒款"
+            style="width: 410px"
+            @keyup.enter="handleQuery"
+          >
+            <el-option
+              v-for="item in beerList"
+              :key="item.id"
+              :label="item.beerName"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="评分区间" prop="overallRating">
+          <div
+            style="display: flex; justify-content: space-between; width: 410px"
+          >
+            <el-input
+              :min="0"
+              :max="5"
+              v-model="queryParams.params.lowScore"
+              style="width: 190px"
+              oninput="value=value.replace(/[^0-9]/g,'')"
+            ></el-input>
+            <span> ~ </span>
+            <el-input
+              :min="0"
+              :max="5"
+              v-model="queryParams.params.highScore"
+              style="width: 190px"
+              oninput="value=value.replace(/[^0-9]/g,'')"
+            ></el-input>
+          </div>
+        </el-form-item>
+      </el-form>
+      <div
+        style="
+          display: flex;
+          flex-direction: column;
+          justify-content: flex-end;
+          align-items: flex-start;
+          height: 150px;
+          flex: 1;
+          margin-left: 10px;
+        "
+      >
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery"
+            >搜索</el-button
+          >
+          <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </div>
+
+      <div class="right">
+        <div class="statistic">
+          <div class="title">累积酒评数量</div>
+          <div class="value">{{ total }}</div>
+          <svg-icon icon-class="beerReview" class="icon"></svg-icon>
+        </div>
+        <div class="top">
+          <div class="title">评分TOP排行</div>
+          <table>
+            <thead>
+              <tr class="row-title">
+                <th style="width: 60px; text-align: left">TOP</th>
+                <th style="width: 120px; text-align: left">酒款名称</th>
+                <th style="width: 100px; text-align: center">评分</th>
+                <th style="width: 100px; text-align: center">评分数量</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr v-for="(item, index) in topReviewBeers" :key="index">
+                <td style="text-align: left">{{ index + 1 }}</td>
+                <td
+                  style="
+                    text-overflow: ellipsis;
+                    white-space: nowrap;
+                    overflow: hidden;
+                  "
+                >
+                  {{ item.beerName }}
+                </td>
+                <td style="text-align: center">{{ item.beerOverallRating }}</td>
+                <td style="text-align: center">{{ item.beerReviewsCount }}</td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
+    </div>
+
+    <!-- <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+          <el-button
+            type="primary"
+            plain
+            icon="Plus"
+            @click="handleAdd"
+            v-hasPermi="['brewery:review:add']"
+          >新增</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button
+            type="success"
+            plain
+            icon="Edit"
+            :disabled="single"
+            @click="handleUpdate"
+            v-hasPermi="['brewery:review:edit']"
+          >修改</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button
+            type="danger"
+            plain
+            icon="Delete"
+            :disabled="multiple"
+            @click="handleDelete"
+            v-hasPermi="['brewery:review:remove']"
+          >删除</el-button>
+        </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:review:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row> -->
+
+    <el-table
+      v-loading="loading"
+      :data="reviewList"
+      class="zd-table"
+      @selection-change="handleSelectionChange"
+    >
+      <!-- <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="id" align="center" prop="id" />
+      <el-table-column label="品牌方id" align="center" prop="breweryId" />
+      <el-table-column label="酒款ID" align="center" prop="beerId" /> -->
+      <el-table-column
+        label="酒款名称"
+        align="left"
+        prop="beerName"
+        min-width="200"
+      >
+        <template #default="scope">
+          <div>{{ scope.row.beerName }}</div>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column label="用户id" align="center" prop="userId" /> -->
+      <el-table-column
+        label="评价内容"
+        align="left"
+        prop="reviewContent"
+        show-overflow-tooltip
+        min-width="300"
+      ></el-table-column>
+      <el-table-column label="图片" align="center" prop="reviewImg" width="100">
+        <template #default="scope">
+          <el-image
+            style="width: 60px; height: 60px"
+            :src="scope.row.reviewImg"
+            :zoom-rate="1.2"
+            :max-scale="7"
+            :min-scale="0.2"
+            :preview-src-list="[scope.row.reviewImg]"
+            :initial-index="4"
+            fit="cover"
+            title="点击查看大图"
+            preview-teleported
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="综合评分"
+        align="center"
+        prop="overallRating"
+        width="100"
+      >
+        <template #default="scope">
+          {{ Number(scope.row.overallRating).toFixed(1) }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="口味评分"
+        align="center"
+        prop="tasteRating"
+        width="100"
+      >
+        <template #default="scope">
+          {{ Number(scope.row.tasteRating).toFixed(1) }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="香味评分"
+        align="center"
+        prop="aromaRating"
+        width="100"
+      >
+        <template #default="scope">
+          {{ Number(scope.row.aromaRating).toFixed(1) }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="颜色评分"
+        align="center"
+        prop="colorRating"
+        width="100"
+      >
+        <template #default="scope">
+          {{ Number(scope.row.colorRating).toFixed(1) }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="评价时间"
+        align="center"
+        prop="createTime"
+        width="160"
+      />
+      <!-- <el-table-column
+        label="门店ID"
+        align="center"
+        prop=""
+        width="160"
+      /> -->
+      <!-- <el-table-column label="备注" align="center" prop="remark" /> -->
+      <el-table-column
+        label="操作"
+        align="center"
+        fixed="right"
+        width="200"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            v-hasPermi="['brewery:review:edit']"
+            v-if="scope.row.isTop == 0"
+            @click="handleSetTop(scope.row)"
+            >置顶</el-button
+          >
+          <el-button
+            link
+            type="primary"
+            v-hasPermi="['brewery:review:edit']"
+            v-if="scope.row.isTop == 1"
+            @click="handlecancelTop(scope.row)"
+            >取消置顶</el-button
+          >
+          <!-- <el-button link type="primary" v-hasPermi="['brewery:review:edit']"
+            >点赞</el-button
+          > -->
+          <!-- <el-button link type="primary" v-hasPermi="['brewery:review:edit']"
+            >回复</el-button
+          > -->
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改酒评对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="reviewRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="品牌方id" prop="breweryId">
+          <el-input v-model="form.breweryId" placeholder="请输入品牌方id" />
+        </el-form-item>
+        <el-form-item label="啤酒id" prop="beerId">
+          <el-input v-model="form.beerId" placeholder="请输入啤酒id" />
+        </el-form-item>
+        <el-form-item label="用户id" prop="userId">
+          <el-input v-model="form.userId" placeholder="请输入用户id" />
+        </el-form-item>
+        <el-form-item label="评论内容">
+          <editor v-model="form.reviewContent" :min-height="192" />
+        </el-form-item>
+        <el-form-item label="口味评分" prop="tasteRating">
+          <el-input v-model="form.tasteRating" placeholder="请输入口味评分" />
+        </el-form-item>
+        <el-form-item label="香味评分" prop="aromaRating">
+          <el-input v-model="form.aromaRating" placeholder="请输入香味评分" />
+        </el-form-item>
+        <el-form-item label="颜色评分" prop="colorRating">
+          <el-input v-model="form.colorRating" placeholder="请输入颜色评分" />
+        </el-form-item>
+        <el-form-item label="综合评分" prop="overallRating">
+          <el-input v-model="form.overallRating" placeholder="请输入综合评分" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="form.remark"
+            type="textarea"
+            placeholder="请输入内容"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Review">
+import {
+  listReview,
+  getReview,
+  delReview,
+  addReview,
+  updateReview,
+  topReview10BeersList,
+  setTop,
+  cancelTop,
+} from "@/api/brewery/review";
+import { allBeers } from "@/api/brewery/beer";
+import { onMounted } from "vue";
+const { proxy } = getCurrentInstance();
+
+const reviewList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    beerId: null,
+    beerName: null,
+    userId: null,
+    reviewContent: null,
+    tasteRating: null,
+    aromaRating: null,
+    colorRating: null,
+    overallRating: null,
+    params: {
+      lowScore: null,
+      highScore: null,
+    },
+  },
+  rules: {},
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询酒评列表 */
+function getList() {
+  loading.value = true;
+  listReview(queryParams.value).then((response) => {
+    reviewList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    beerId: null,
+    beerName: null,
+    userId: null,
+    reviewContent: null,
+    tasteRating: null,
+    aromaRating: null,
+    colorRating: null,
+    overallRating: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("reviewRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加酒评";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value;
+  getReview(_id).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改酒评";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["reviewRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateReview(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addReview(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除酒评编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delReview(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/review/export",
+    {
+      ...queryParams.value,
+    },
+    `review_${new Date().getTime()}.xlsx`
+  );
+}
+
+const topList = ref([]);
+const beerList = ref([]);
+function getAllBeers() {
+  allBeers().then((response) => {
+    beerList.value = response.data;
+  });
+}
+// 评分前10酒款
+const topReviewBeers = ref([]);
+function getTopReviewBeers() {
+  topReview10BeersList().then((res) => {
+    topReviewBeers.value = res.data.slice(0, 3);
+  });
+}
+// 时间筛选
+const timeRange = ref([]);
+function handleTime() {
+  queryParams.value.params.beginTime = timeRange.value[0];
+  queryParams.value.params.endTime = timeRange.value[1];
+  getList();
+}
+// 置顶
+function handleSetTop(row) {
+  setTop(row.id).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("置顶成功");
+  });
+}
+// 取消置顶
+function handlecancelTop(row) {
+  cancelTop(row.id).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("取消置顶成功");
+  });
+}
+onMounted(() => {
+  getAllBeers();
+  getList();
+  getTopReviewBeers();
+});
+</script>
+<style lang="scss" scoped>
+.header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  .right {
+    display: flex;
+    align-items: center;
+  }
+  .statistic {
+    min-width: 300px;
+    min-height: 137px;
+    padding: 16px;
+    border-radius: 14px;
+    opacity: 1;
+    background: #ffffff;
+    box-shadow: 6px 6px 54px 0px rgba(0, 0, 0, 0.05);
+    position: relative;
+    .title {
+      font-family: Nunito Sans;
+      font-size: 16px;
+      font-weight: 600;
+      color: #202224;
+      margin-bottom: 12px;
+    }
+    .value {
+      font-family: Nunito Sans;
+      font-size: 28px;
+      font-weight: bold;
+      color: #202224;
+    }
+    .icon {
+      position: absolute;
+      top: 16px;
+      right: 16px;
+      width: 60px;
+      height: 60px;
+    }
+  }
+  .top {
+    min-width: 400px;
+    min-height: 137px;
+    padding: 16px;
+    border-radius: 14px;
+    opacity: 1;
+    background: #ffffff;
+    box-shadow: 6px 6px 54px 0px rgba(0, 0, 0, 0.05);
+    margin-left: 30px;
+    .title {
+      font-family: Nunito Sans;
+      font-size: 16px;
+      font-weight: 600;
+      color: #202224;
+    }
+    .row-title {
+      font-family: Nunito Sans;
+      font-size: 14px;
+      font-weight: 800;
+      line-height: normal;
+      letter-spacing: 0px;
+      color: #202224;
+    }
+  }
+}
+:deep(.el-popper) {
+  max-width: 400px;
+}
+</style>
diff --git a/src/views/brewery/banner.vue b/src/views/brewery/banner.vue
new file mode 100644
index 0000000..ef8d592
--- /dev/null
+++ b/src/views/brewery/banner.vue
@@ -0,0 +1,343 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="显示顺序" prop="bannerOrder">
+        <el-input
+          v-model="queryParams.bannerOrder"
+          placeholder="请输入显示顺序"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="类型" prop="bannerOrder">
+        <el-select
+          v-model="queryParams.bannerType"
+          placeholder="请选择类型"
+          style="width: 150px"
+        >
+          <el-option label="轮播图" :value="1"></el-option>
+          <el-option label="广告图" :value="2"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="handleAdd"
+          v-hasPermi="['brewery:banner:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['brewery:banner:edit']"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['brewery:banner:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:banner:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="bannerList"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="id" align="center" prop="id" />
+      <el-table-column label="类型" align="center" prop="bannerType">
+        <template #default="scope">
+          <span v-if="scope.row.bannerType == 1">轮播图</span>
+          <span v-if="scope.row.bannerType == 2">广告图</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="图片地址" align="center" prop="bannerUrl">
+        <template #default="scope">
+          <el-image
+            style="width: 100px; height: 60px"
+            :src="scope.row.bannerUrl"
+            :zoom-rate="1.2"
+            :max-scale="7"
+            :min-scale="0.2"
+            :preview-src-list="[scope.row.bannerUrl]"
+            :initial-index="4"
+            fit="cover"
+            title="点击查看大图"
+            preview-teleported
+          />
+        </template>
+      </el-table-column>
+      <el-table-column label="显示顺序" align="center" prop="bannerOrder" />
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            icon="Edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['brewery:banner:edit']"
+            >修改</el-button
+          >
+          <el-button
+            link
+            type="primary"
+            icon="Delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['brewery:banner:remove']"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改品牌方广告图对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="bannerRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="图片类型" prop="bannerType">
+          <el-radio-group v-model="form.bannerType">
+            <el-radio :label="1">封面图</el-radio>
+            <el-radio :label="2">广告图</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="显示顺序" prop="bannerOrder">
+          <el-input
+            v-model="form.bannerOrder"
+            placeholder="请输入显示顺序（0～999）"
+          />
+        </el-form-item>
+        <el-form-item label="图片" prop="bannerUrl">
+          <ImageUpload v-model="form.bannerUrl" :fileSize="5" :limit="1" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Banner">
+import {
+  listBanner,
+  getBanner,
+  delBanner,
+  addBanner,
+  updateBanner,
+} from "@/api/brewery/banner";
+
+const { proxy } = getCurrentInstance();
+
+const bannerList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    bannerType: null,
+    bannerOrder: null,
+    bannerUrl: null,
+  },
+  rules: {
+    breweryId: [
+      { required: true, message: "品牌方id不能为空", trigger: "blur" },
+    ],
+    bannerType: [
+      { required: true, message: "广告图类型不能为空", trigger: "change" },
+    ],
+    bannerOrder: [
+      { required: true, message: "显示顺序不能为空", trigger: "blur" },
+    ],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询品牌方广告图列表 */
+function getList() {
+  loading.value = true;
+  listBanner(queryParams.value).then((response) => {
+    bannerList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    bannerType: null,
+    bannerOrder: null,
+    bannerUrl: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("bannerRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加品牌方广告图";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value;
+  getBanner(_id).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改品牌方广告图";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["bannerRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateBanner(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addBanner(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除品牌方广告图编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delBanner(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/banner/export",
+    {
+      ...queryParams.value,
+    },
+    `banner_${new Date().getTime()}.xlsx`
+  );
+}
+
+getList();
+</script>
diff --git a/src/views/brewery/cover.vue b/src/views/brewery/cover.vue
new file mode 100644
index 0000000..5998eb9
--- /dev/null
+++ b/src/views/brewery/cover.vue
@@ -0,0 +1,277 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="显示顺序" prop="bannerOrder">
+        <el-input
+          v-model="queryParams.bannerOrder"
+          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="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="handleAdd"
+          v-hasPermi="['brewery:banner:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['brewery:banner:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['brewery:banner:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:banner:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="bannerList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="id" align="center" prop="id" />
+      <!-- <el-table-column label="品牌方id" align="center" prop="breweryId" /> -->
+      <el-table-column label="广告图类型" align="center" prop="bannerType" >
+        <template #default="scope">
+          {{ scope.row.bannerType === 1 ? '首页轮播图' : '品牌方广告图' }}
+        </template>
+      </el-table-column>
+      <el-table-column label="显示顺序" align="center" prop="bannerOrder" />
+      <el-table-column label="图片地址" align="center" prop="bannerUrl" >
+        <template #default="scope">
+          <el-image
+                    style="width: 100px; height: 60px"
+                    :src="scope.row.bannerUrl"
+                    :zoom-rate="1.2"
+                    :max-scale="7"
+                    :min-scale="0.2"
+                    :preview-src-list="[scope.row.bannerUrl]"
+                    :initial-index="4"
+                    fit="cover"
+                    title="点击查看大图"
+                  />
+        </template>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template #default="scope">
+          <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['brewery:banner:edit']">修改</el-button>
+          <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['brewery:banner:remove']">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    
+    <pagination
+      v-show="total>0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改品牌方广告图对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="bannerRef" :model="form" :rules="rules" label-width="80px">
+       
+        <el-form-item label="显示顺序" prop="bannerOrder">
+          <el-input v-model="form.bannerOrder" placeholder="请输入显示顺序（0～999）" />
+        </el-form-item>
+        <el-form-item label="图片" prop="bannerUrl">
+          <ImageUpload v-model="form.bannerUrl" :fileSize="5" :limit="1" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Banner">
+import { listBanner, getBanner, delBanner, addBanner, updateBanner } from "@/api/brewery/banner";
+
+const { proxy } = getCurrentInstance();
+
+const bannerList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    bannerType: null,
+    bannerOrder: null,
+    bannerUrl: null,
+  },
+  rules: {
+    breweryId: [
+      { required: true, message: "品牌方id不能为空", trigger: "blur" }
+    ],
+    bannerType: [
+      { required: true, message: "广告图类型不能为空", trigger: "change" }
+    ],
+    bannerOrder: [
+      { required: true, message: "显示顺序不能为空", trigger: "blur" }
+    ],
+  }
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询品牌方广告图列表 */
+function getList() {
+  loading.value = true;
+  listBanner(queryParams.value).then(response => {
+    bannerList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    bannerType: null,
+    bannerOrder: null,
+    bannerUrl: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null
+  };
+  proxy.resetForm("bannerRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加品牌方广告图";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value
+  getBanner(_id).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改品牌方广告图";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["bannerRef"].validate(valid => {
+    if (valid) {
+      form.value.bannerType = 1
+      if (form.value.id != null) {
+        updateBanner(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addBanner(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal.confirm('是否确认删除品牌方广告图编号为"' + _ids + '"的数据项？').then(function() {
+    return delBanner(_ids);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download('brewery/banner/export', {
+    ...queryParams.value
+  }, `banner_${new Date().getTime()}.xlsx`)
+}
+
+getList();
+</script>
diff --git a/src/views/brewery/redeemOrder/index.vue b/src/views/brewery/redeemOrder/index.vue
new file mode 100644
index 0000000..848be17
--- /dev/null
+++ b/src/views/brewery/redeemOrder/index.vue
@@ -0,0 +1,743 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <!-- <el-form-item label="品牌方id" prop="breweryId">
+          <el-input
+            v-model="queryParams.breweryId"
+            placeholder="请输入品牌方id"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item> -->
+      <el-form-item label="订单编号" prop="orderSn">
+        <el-input
+          v-model="queryParams.orderSn"
+          placeholder="请输入订单编号"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!-- <el-form-item label="商品id" prop="goodsId">
+        <el-input
+          v-model="queryParams.goodsId"
+          placeholder="请输入商品id"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item> -->
+      <el-form-item label="商品名称" prop="goodsName">
+        <el-input
+          v-model="queryParams.goodsName"
+          placeholder="请输入商品名称"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!-- <el-form-item label="用户id" prop="userId">
+          <el-input
+            v-model="queryParams.userId"
+            placeholder="请输入用户id"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item> -->
+      <!-- <el-form-item label="品牌啤酒币兑换数" prop="beerCoinNum">
+        <el-input
+          v-model="queryParams.beerCoinNum"
+          placeholder="请输入品牌啤酒币兑换数"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item> -->
+      <!-- <el-form-item label="平台啤酒币兑换数" prop="platformCoinNum">
+        <el-input
+          v-model="queryParams.platformCoinNum"
+          placeholder="请输入平台啤酒币兑换数"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item> -->
+      <!-- <el-form-item label="收货地址" prop="address">
+          <el-input
+            v-model="queryParams.address"
+            placeholder="请输入收货地址"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item> -->
+      <!-- <el-form-item label="联系人" prop="contactPersion">
+        <el-input
+          v-model="queryParams.contactPersion"
+          placeholder="请输入联系人"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item> -->
+      <!-- <el-form-item label="联系电话" prop="contactPhone">
+        <el-input
+          v-model="queryParams.contactPhone"
+          placeholder="请输入联系电话"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item> -->
+      <el-form-item label="支付时间" prop="paidTime">
+        <el-date-picker
+          clearable
+          v-model="queryParams.paidTime"
+          type="date"
+          value-format="YYYY-MM-DD"
+          placeholder="请选择支付时间"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="发货时间" prop="shippingTime">
+        <el-date-picker
+          clearable
+          v-model="queryParams.shippingTime"
+          type="date"
+          value-format="YYYY-MM-DD"
+          placeholder="请选择发货时间"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="快递单号" prop="trackingNumber">
+        <el-input
+          v-model="queryParams.trackingNumber"
+          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="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <!-- <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="handleAdd"
+          v-hasPermi="['brewery:redeemOrder:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['brewery:redeemOrder:edit']"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['brewery:redeemOrder:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:redeemOrder:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row> -->
+
+    <el-table
+      v-loading="loading"
+      :data="redeemOrderList"
+      class="zd-table"
+      @selection-change="handleSelectionChange"
+    >
+      <!-- <el-table-column type="selection" width="55" align="center" /> -->
+      <!-- <el-table-column label="id" align="center" prop="id" /> -->
+      <!-- <el-table-column label="品牌方id" align="center" prop="breweryId" /> -->
+      <el-table-column
+        label="兑付单号"
+        align="center"
+        prop="orderSn"
+        show-overflow-tooltip
+      />
+      <!-- <el-table-column label="商品id" align="center" prop="goodsId" /> -->
+      <el-table-column
+        label="支付时间"
+        align="center"
+        prop="paidTime"
+        width="120"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.paidTime, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="商品名称"
+        align="center"
+        prop="goodsName"
+        show-overflow-tooltip
+      />
+      <el-table-column label="兑付类型" align="center" prop="orderType" />
+      <!-- <el-table-column label="商品封面图" align="center" prop="goodsCover">
+        <template #default="scope">
+          <el-image
+            style="width: 40px; height: 40px"
+            :src="scope.row.goodsCover"
+            :zoom-rate="1.2"
+            :max-scale="7"
+            :min-scale="0.2"
+            :preview-src-list="[scope.row.goodsCover]"
+            :initial-index="4"
+            fit="cover"
+            title="点击查看大图"
+            preview-teleported
+          />
+        </template>
+      </el-table-column> -->
+
+      <!-- <el-table-column label="用户id" align="center" prop="userId" /> -->
+      <el-table-column label="门店" align="center" prop="barName" />
+      <el-table-column
+        label="品牌啤酒币兑换数"
+        align="center"
+        prop="beerCoinNum"
+      />
+      <el-table-column
+        label="平台啤酒币兑换数"
+        align="center"
+        prop="platformCoinNum"
+      />
+      <el-table-column
+        label="收货地址"
+        align="center"
+        prop="address"
+        show-overflow-tooltip
+      />
+      <!-- <el-table-column label="联系人" align="center" prop="contactPersion" /> -->
+      <!-- <el-table-column label="联系电话" align="center" prop="contactPhone" /> -->
+      <el-table-column label="兑付状态" align="center" prop="orderStatus" />
+      <el-table-column label="物流状态" align="center" prop="shippingStatus" />
+
+      <el-table-column
+        label="发货时间"
+        align="center"
+        prop="shippingTime"
+        width="120"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.shippingTime, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="快递单号" align="center" prop="trackingNumber" />
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column
+        label="操作"
+        align="center"
+        fixed="right"
+        width="150"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            @click="handleDelivery(scope.row)"
+            v-hasPermi="['brewery:redeemOrder:edit']"
+            >发货</el-button
+          >
+          <el-button
+            link
+            type="primary"
+            @click="handleRemark(scope.row)"
+            v-hasPermi="['brewery:redeemOrder:edit']"
+            >备注</el-button
+          >
+          <!-- <el-button
+            link
+            type="primary"
+            icon="Delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['brewery:redeemOrder:remove']"
+            >删除</el-button
+          > -->
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改兑换订单对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form
+        ref="redeemOrderRef"
+        :model="form"
+        :rules="rules"
+        label-width="80px"
+      >
+        <el-form-item label="品牌方id" prop="breweryId">
+          <el-input v-model="form.breweryId" placeholder="请输入品牌方id" />
+        </el-form-item>
+        <el-form-item label="订单编号" prop="orderSn">
+          <el-input v-model="form.orderSn" placeholder="请输入订单编号" />
+        </el-form-item>
+        <el-form-item label="商品id" prop="goodsId">
+          <el-input v-model="form.goodsId" placeholder="请输入商品id" />
+        </el-form-item>
+        <el-form-item label="商品名称" prop="goodsName">
+          <el-input v-model="form.goodsName" placeholder="请输入商品名称" />
+        </el-form-item>
+        <el-form-item label="用户id" prop="userId">
+          <el-input v-model="form.userId" placeholder="请输入用户id" />
+        </el-form-item>
+        <el-form-item label="品牌啤酒币兑换数" prop="beerCoinNum">
+          <el-input
+            v-model="form.beerCoinNum"
+            placeholder="请输入品牌啤酒币兑换数"
+          />
+        </el-form-item>
+        <el-form-item label="平台啤酒币兑换数" prop="platformCoinNum">
+          <el-input
+            v-model="form.platformCoinNum"
+            placeholder="请输入平台啤酒币兑换数"
+          />
+        </el-form-item>
+        <el-form-item label="收货地址" prop="address">
+          <el-input v-model="form.address" placeholder="请输入收货地址" />
+        </el-form-item>
+        <el-form-item label="联系人" prop="contactPersion">
+          <el-input v-model="form.contactPersion" placeholder="请输入联系人" />
+        </el-form-item>
+        <el-form-item label="联系电话" prop="contactPhone">
+          <el-input v-model="form.contactPhone" placeholder="请输入联系电话" />
+        </el-form-item>
+        <el-form-item label="支付时间" prop="paidTime">
+          <el-date-picker
+            clearable
+            v-model="form.paidTime"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="请选择支付时间"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="发货时间" prop="shippingTime">
+          <el-date-picker
+            clearable
+            v-model="form.shippingTime"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="请选择发货时间"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="快递单号" prop="trackingNumber">
+          <el-input
+            v-model="form.trackingNumber"
+            placeholder="请输入快递单号"
+          />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="form.remark"
+            type="textarea"
+            placeholder="请输入内容"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <el-dialog
+      title="订单发货"
+      v-model="deliveryOpen"
+      width="500px"
+      append-to-body
+    >
+      <el-form
+        ref="deliveryRef"
+        :model="deliveryForm"
+        :rules="rules"
+        label-width="80px"
+      >
+        <el-form-item label="商品信息">
+          <div
+            style="
+              display: flex;
+              justify-content: flex-start;
+              align-items: center;
+              gap: 20px;
+              width: 100%;
+            "
+          >
+            <el-image
+              style="width: 60px; height: 60px"
+              :src="currentRow.goodsCover"
+              :zoom-rate="1.2"
+              :max-scale="7"
+              :min-scale="0.2"
+              :preview-src-list="[currentRow.goodsCover]"
+              :initial-index="4"
+              fit="cover"
+              title="点击查看大图"
+              preview-teleported
+            />
+            <div>
+              <div>{{ currentRow.goodsName }}</div>
+              <!-- <div>{{ currentRow.goodsName }}</div> -->
+            </div>
+            <div>x {{ currentRow.redeemNum }}</div>
+          </div>
+        </el-form-item>
+        <el-form-item label="收货信息">
+          <div>联系方式：{{ currentRow.contactPhone }}</div>
+          <div>收货地址：{{ currentRow.address }}</div>
+        </el-form-item>
+        <el-form-item label="发货方式" prop="dispatchMethod">
+          <el-radio-group v-model="deliveryForm.dispatchMethod">
+            <el-radio :value="0">自己配送</el-radio>
+            <el-radio :value="1">快递</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <template v-if="deliveryForm.dispatchMethod == 1">
+          <el-form-item label="快递公司" prop="expressCompany">
+            <el-input
+              v-model="deliveryForm.expressCompany"
+              placeholder="请输入快递公司"
+            />
+          </el-form-item>
+          <el-form-item label="快递单号" prop="trackingNumber">
+            <el-input
+              v-model="deliveryForm.trackingNumber"
+              placeholder="请输入快递单号"
+            />
+          </el-form-item>
+        </template>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitDelivery">确 定</el-button>
+          <el-button @click="cancelDelivery">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <el-dialog
+      title="订单备注"
+      v-model="openRemark"
+      width="500px"
+      append-to-body
+    >
+      <el-form
+        ref="remarkRef"
+        :model="remarkForm"
+        :rules="rulesRemark"
+        label-width="80px"
+      >
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="remarkForm.remark"
+            type="textarea"
+            placeholder="请输入内容"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitRemark">确 定</el-button>
+          <el-button @click="cancelRemark">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="RedeemOrder">
+import {
+  listRedeemOrder,
+  getRedeemOrder,
+  delRedeemOrder,
+  addRedeemOrder,
+  updateRedeemOrder,
+  deliveryRedeemOrder,
+  activityRedeemOrder,
+  getOrderInfo,
+} from "@/api/brewery/redeemOrder";
+
+const { proxy } = getCurrentInstance();
+
+const redeemOrderList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    orderSn: null,
+    goodsId: null,
+    goodsName: null,
+    userId: null,
+    beerCoinNum: null,
+    platformCoinNum: null,
+    address: null,
+    contactPersion: null,
+    contactPhone: null,
+    orderStatus: null,
+    shippingStatus: null,
+    paidTime: null,
+    shippingTime: null,
+    trackingNumber: null,
+  },
+  rules: {
+    breweryId: [
+      { required: true, message: "品牌方id不能为空", trigger: "blur" },
+    ],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+const deliveryOpen = ref(false); // 发货弹窗
+const deliveryForm = ref({ dispatchMethod: 0 });
+/** 查询兑换订单列表 */
+function getList() {
+  loading.value = true;
+  activityRedeemOrder(queryParams.value).then((response) => {
+    redeemOrderList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    orderSn: null,
+    goodsId: null,
+    goodsName: null,
+    userId: null,
+    beerCoinNum: null,
+    platformCoinNum: null,
+    address: null,
+    contactPersion: null,
+    contactPhone: null,
+    orderStatus: null,
+    shippingStatus: null,
+    paidTime: null,
+    shippingTime: null,
+    trackingNumber: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("redeemOrderRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加兑换订单";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value;
+  getOrderInfo(_id).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改兑换订单";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["redeemOrderRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateRedeemOrder(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addRedeemOrder(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除兑换订单编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delRedeemOrder(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/redeemOrder/export",
+    {
+      ...queryParams.value,
+    },
+    `redeemOrder_${new Date().getTime()}.xlsx`
+  );
+}
+const currentRow = ref({});
+/** 发货按钮操作 */
+function handleDelivery(row) {
+  currentRow.value = row;
+  resetDelivery();
+  const _id = row.id || ids.value;
+  getOrderInfo(_id).then((response) => {
+    deliveryForm.value = response.data;
+    deliveryOpen.value = true;
+  });
+}
+// 发货按钮
+function submitDelivery() {
+  proxy.$refs["deliveryRef"].validate((valid) => {
+    if (valid) {
+      deliveryForm.value.orderId = currentRow.value.id;
+      deliveryRedeemOrder(deliveryForm.value).then((response) => {
+        proxy.$modal.msgSuccess("发货成功");
+        deliveryOpen.value = false;
+        getList();
+      });
+    }
+  });
+}
+
+// 取消按钮
+function cancelDelivery() {
+  deliveryOpen.value = false;
+  resetDelivery();
+}
+
+function resetDelivery() {
+  deliveryForm.value = { dispatchMethod: 0 };
+  proxy.resetForm("deliveryRef");
+}
+
+const remarkForm = ref({});
+const openRemark = ref(false); // 备注弹窗
+const rulesRemark = ref({
+  remark: [{ required: true, message: "备注不能为空", trigger: "blur" }],
+});
+// 备注
+
+function handleRemark(row) {
+  const _id = row.id || ids.value;
+  currentRow.value = row;
+  // getRedeemOrder(_id).then((response) => {
+  openRemark.value = true;
+  // });
+}
+function submitRemark() {
+  proxy.$refs["remarkRef"].validate((valid) => {
+    if (valid) {
+      remarkForm.value.id = currentRow.value.id;
+      updateRedeemOrder(remarkForm.value).then((response) => {
+        proxy.$modal.msgSuccess("备注成功");
+        openRemark.value = false;
+        getList();
+      });
+    }
+  });
+}
+
+// 取消按钮
+function cancelRemark() {
+  openRemark.value = false;
+}
+
+getList();
+</script>
diff --git a/src/views/error/401.vue b/src/views/error/401.vue
new file mode 100644
index 0000000..1ba3792
--- /dev/null
+++ b/src/views/error/401.vue
@@ -0,0 +1,82 @@
+<template>
+  <div class="errPage-container">
+    <el-button icon="arrow-left" class="pan-back-btn" @click="back">
+      返回
+    </el-button>
+    <el-row>
+      <el-col :span="12">
+        <h1 class="text-jumbo text-ginormous">
+          401错误!
+        </h1>
+        <h2>您没有访问权限！</h2>
+        <h6>对不起，您没有访问权限，请不要进行非法操作！您可以返回主页面</h6>
+        <ul class="list-unstyled">
+          <li class="link-type">
+            <router-link to="/">
+              回首页
+            </router-link>
+          </li>
+        </ul>
+      </el-col>
+      <el-col :span="12">
+        <img :src="errGif" width="313" height="428" alt="Girl has dropped her ice cream.">
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import errImage from "@/assets/401_images/401.gif";
+
+let { proxy } = getCurrentInstance();
+
+const errGif = ref(errImage + "?" + +new Date());
+
+function back() {
+  if (proxy.$route.query.noGoBack) {
+    proxy.$router.push({ path: "/" });
+  } else {
+    proxy.$router.go(-1);
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.errPage-container {
+  width: 800px;
+  max-width: 100%;
+  margin: 100px auto;
+  .pan-back-btn {
+    background: #008489;
+    color: #fff;
+    border: none !important;
+  }
+  .pan-gif {
+    margin: 0 auto;
+    display: block;
+  }
+  .pan-img {
+    display: block;
+    margin: 0 auto;
+    width: 100%;
+  }
+  .text-jumbo {
+    font-size: 60px;
+    font-weight: 700;
+    color: #484848;
+  }
+  .list-unstyled {
+    font-size: 14px;
+    li {
+      padding-bottom: 5px;
+    }
+    a {
+      color: #008489;
+      text-decoration: none;
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/error/404.vue b/src/views/error/404.vue
new file mode 100644
index 0000000..f205303
--- /dev/null
+++ b/src/views/error/404.vue
@@ -0,0 +1,227 @@
+<template>
+  <div class="wscn-http404-container">
+    <div class="wscn-http404">
+      <div class="pic-404">
+        <img class="pic-404__parent" src="@/assets/404_images/404.png" alt="404">
+        <img class="pic-404__child left" src="@/assets/404_images/404_cloud.png" alt="404">
+        <img class="pic-404__child mid" src="@/assets/404_images/404_cloud.png" alt="404">
+        <img class="pic-404__child right" src="@/assets/404_images/404_cloud.png" alt="404">
+      </div>
+      <div class="bullshit">
+        <div class="bullshit__oops">
+          404错误!
+        </div>
+        <div class="bullshit__headline">
+          {{ message }}
+        </div>
+        <div class="bullshit__info">
+          对不起，您正在寻找的页面不存在。尝试检查URL的错误，然后按浏览器上的刷新按钮或尝试在我们的应用程序中找到其他内容。
+        </div>
+        <router-link to="/index" class="bullshit__return-home">
+          返回首页
+        </router-link>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+let message = computed(() => {
+  return '找不到网页！'
+})
+</script>
+
+<style lang="scss" scoped>
+.wscn-http404-container{
+  transform: translate(-50%,-50%);
+  position: absolute;
+  top: 40%;
+  left: 50%;
+}
+.wscn-http404 {
+  position: relative;
+  width: 1200px;
+  padding: 0 50px;
+  overflow: hidden;
+  .pic-404 {
+    position: relative;
+    float: left;
+    width: 600px;
+    overflow: hidden;
+    &__parent {
+      width: 100%;
+    }
+    &__child {
+      position: absolute;
+      &.left {
+        width: 80px;
+        top: 17px;
+        left: 220px;
+        opacity: 0;
+        animation-name: cloudLeft;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      &.mid {
+        width: 46px;
+        top: 10px;
+        left: 420px;
+        opacity: 0;
+        animation-name: cloudMid;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1.2s;
+      }
+      &.right {
+        width: 62px;
+        top: 100px;
+        left: 500px;
+        opacity: 0;
+        animation-name: cloudRight;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      @keyframes cloudLeft {
+        0% {
+          top: 17px;
+          left: 220px;
+          opacity: 0;
+        }
+        20% {
+          top: 33px;
+          left: 188px;
+          opacity: 1;
+        }
+        80% {
+          top: 81px;
+          left: 92px;
+          opacity: 1;
+        }
+        100% {
+          top: 97px;
+          left: 60px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudMid {
+        0% {
+          top: 10px;
+          left: 420px;
+          opacity: 0;
+        }
+        20% {
+          top: 40px;
+          left: 360px;
+          opacity: 1;
+        }
+        70% {
+          top: 130px;
+          left: 180px;
+          opacity: 1;
+        }
+        100% {
+          top: 160px;
+          left: 120px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudRight {
+        0% {
+          top: 100px;
+          left: 500px;
+          opacity: 0;
+        }
+        20% {
+          top: 120px;
+          left: 460px;
+          opacity: 1;
+        }
+        80% {
+          top: 180px;
+          left: 340px;
+          opacity: 1;
+        }
+        100% {
+          top: 200px;
+          left: 300px;
+          opacity: 0;
+        }
+      }
+    }
+  }
+  .bullshit {
+    position: relative;
+    float: left;
+    width: 300px;
+    padding: 30px 0;
+    overflow: hidden;
+    &__oops {
+      font-size: 32px;
+      font-weight: bold;
+      line-height: 40px;
+      color: #1482f0;
+      opacity: 0;
+      margin-bottom: 20px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-fill-mode: forwards;
+    }
+    &__headline {
+      font-size: 20px;
+      line-height: 24px;
+      color: #222;
+      font-weight: bold;
+      opacity: 0;
+      margin-bottom: 10px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.1s;
+      animation-fill-mode: forwards;
+    }
+    &__info {
+      font-size: 13px;
+      line-height: 21px;
+      color: grey;
+      opacity: 0;
+      margin-bottom: 30px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.2s;
+      animation-fill-mode: forwards;
+    }
+    &__return-home {
+      display: block;
+      float: left;
+      width: 110px;
+      height: 36px;
+      background: #1482f0;
+      border-radius: 100px;
+      text-align: center;
+      color: #ffffff;
+      opacity: 0;
+      font-size: 14px;
+      line-height: 36px;
+      cursor: pointer;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.3s;
+      animation-fill-mode: forwards;
+    }
+    @keyframes slideUp {
+      0% {
+        transform: translateY(60px);
+        opacity: 0;
+      }
+      100% {
+        transform: translateY(0);
+        opacity: 1;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/index.vue b/src/views/index.vue
new file mode 100644
index 0000000..b441de0
--- /dev/null
+++ b/src/views/index.vue
@@ -0,0 +1,592 @@
+<template>
+  <div class="app-container home">
+    <el-row :gutter="16" style="margin-bottom: 10px">
+      <el-col :span="4">
+        <div class="statistic-card">
+          <el-statistic :value="recentInfo.sevenDaysScanCount">
+            <template #title>
+              <div style="display: inline-flex; align-items: center">
+                <el-tooltip
+                  effect="dark"
+                  content="近7天累积核销酒款数"
+                  placement="top"
+                >
+                  <el-icon style="margin-right: 4px" :size="12">
+                    <Warning />
+                  </el-icon>
+                </el-tooltip>
+                近7天累积核销酒款数
+              </div>
+            </template>
+          </el-statistic>
+          <!-- <div class="statistic-footer">
+            <div class="footer-item">
+              <span>than yesterday</span>
+              <span class="green">
+                24%
+                <el-icon>
+                  <CaretTop />
+                </el-icon>
+              </span>
+            </div>
+          </div> -->
+        </div>
+      </el-col>
+      <el-col :span="4">
+        <div class="statistic-card">
+          <el-statistic :value="recentInfo.sevenDaysBarCount">
+            <template #title>
+              <div style="display: inline-flex; align-items: center">
+                <el-tooltip
+                  effect="dark"
+                  content="近7天核销门店数"
+                  placement="top"
+                >
+                  <el-icon style="margin-right: 4px" :size="12">
+                    <Warning />
+                  </el-icon>
+                </el-tooltip>
+                近7天核销门店数
+              </div>
+            </template>
+          </el-statistic>
+          <!-- <div class="statistic-footer">
+            <div class="footer-item">
+              <span>than yesterday</span>
+              <span class="green">
+                24%
+                <el-icon>
+                  <CaretTop />
+                </el-icon>
+              </span>
+            </div>
+          </div> -->
+        </div>
+      </el-col>
+      <el-col :span="4">
+        <div class="statistic-card">
+          <el-statistic :value="recentInfo.processingBarCount">
+            <template #title>
+              <div style="display: inline-flex; align-items: center">
+                <el-tooltip
+                  effect="dark"
+                  content="累积进行中门店数"
+                  placement="top"
+                >
+                  <el-icon style="margin-right: 4px" :size="12">
+                    <Warning />
+                  </el-icon>
+                </el-tooltip>
+                累积进行中门店数
+              </div>
+            </template>
+          </el-statistic>
+          <!-- <div class="statistic-footer">
+            <div class="footer-item">
+              <span>than yesterday</span>
+              <span class="green">
+                24%
+                <el-icon>
+                  <CaretTop />
+                </el-icon>
+              </span>
+            </div>
+          </div> -->
+        </div>
+      </el-col>
+      <el-col :span="4">
+        <div class="statistic-card">
+          <el-statistic :value="recentInfo.waitingRewardCount">
+            <template #title>
+              <div style="display: inline-flex; align-items: center">
+                <el-tooltip effect="dark" content="待兑付订单" placement="top">
+                  <el-icon style="margin-right: 4px" :size="12">
+                    <Warning />
+                  </el-icon>
+                </el-tooltip>
+                待兑付订单
+              </div>
+            </template>
+          </el-statistic>
+          <!-- <div class="statistic-footer">
+            <div class="footer-item">
+              <span>than yesterday</span>
+              <span class="green">
+                24%
+                <el-icon>
+                  <CaretTop />
+                </el-icon>
+              </span>
+            </div>
+          </div> -->
+        </div>
+      </el-col>
+      <el-col :span="4">
+        <div class="statistic-card">
+          <el-statistic :value="recentInfo.sevenDaysReviewCount">
+            <template #title>
+              <div style="display: inline-flex; align-items: center">
+                <el-tooltip effect="dark" content="新增酒评数" placement="top">
+                  <el-icon style="margin-right: 4px" :size="12">
+                    <Warning />
+                  </el-icon>
+                </el-tooltip>
+                新增酒评数
+              </div>
+            </template>
+          </el-statistic>
+          <!-- <div class="statistic-footer">
+            <div class="footer-item">
+              <span>than yesterday</span>
+              <span class="green">
+                24%
+                <el-icon>
+                  <CaretTop />
+                </el-icon>
+              </span>
+            </div>
+          </div> -->
+        </div>
+      </el-col>
+    </el-row>
+    <el-card
+      class="update-log"
+      shadow="never"
+      style="margin-bottom: 10px; border: none"
+    >
+      <div
+        style="
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+        "
+      >
+        <div class="header-title">
+          <span>核销酒款数量</span>
+        </div>
+        <!-- <div>
+          <el-date-picker
+            v-model="timeData"
+            type="month"
+            placeholder="选择年月"
+            @change="changeTime"
+          />
+        </div> -->
+      </div>
+      <div ref="monthRef" style="height: 300px"></div>
+    </el-card>
+    <el-row :gutter="10" style="height: calc(100vh - 414px)">
+      <el-col :sm="12" :lg="12" style="margin-bottom: 10px">
+        <el-card
+          class="update-log"
+          shadow="never"
+          style="height: 100%; border: none"
+        >
+          <div class="body">
+            <div class="header-title">
+              <span>近30天热门酒款TOP</span>
+            </div>
+            <el-table :data="beerList" class="zd-table">
+              <el-table-column
+                type="index"
+                width="100"
+                label="排名"
+                align="center"
+              />
+              <el-table-column label="酒款名称" prop="beerName" align="center">
+                <template #default="scope">
+                  <div
+                    style="
+                      display: flex;
+                      align-items: center;
+                      justify-content: center;
+                    "
+                  >
+                    <el-image
+                      style="width: 60px; height: 60px"
+                      :src="scope.row.beerCover"
+                      :zoom-rate="1.2"
+                      :max-scale="7"
+                      :min-scale="0.2"
+                      :preview-src-list="[scope.row.beerCover]"
+                      :initial-index="4"
+                      fit="cover"
+                      title="点击查看大图"
+                      preview-teleported
+                    />
+                    <span style="margin-left: 10px">{{
+                      scope.row.beerName
+                    }}</span>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                label="核销数量"
+                prop="verifyCount"
+                align="center"
+                width="200"
+              >
+              </el-table-column>
+            </el-table>
+          </div>
+        </el-card>
+      </el-col>
+      <el-col :sm="12" :lg="12" style="margin-bottom: 10px">
+        <el-card
+          class="update-log"
+          shadow="never"
+          style="height: 100%; border: none"
+        >
+          <div class="header-title">
+            <span>近30天核销城市占比</span>
+          </div>
+          <div ref="cityRef" style="height: 300px"></div>
+        </el-card>
+      </el-col>
+    </el-row>
+    <el-row :gutter="10" style="height: calc(100vh - 414px)">
+      <el-col :sm="12" :lg="12" style="margin-bottom: 10px">
+        <el-card
+          class="update-log"
+          shadow="never"
+          style="height: 100%; border: none; background-color: #fff"
+        >
+          <div class="body">
+            <div class="header-title">
+              <span>一周TOP门店排行</span>
+            </div>
+            <el-table :data="checkOutBarCount" class="zd-table">
+              <el-table-column
+                type="index"
+                width="100"
+                label="排名"
+                align="center"
+              />
+              <el-table-column label="门店ID" prop="barCode" align="center" />
+              <el-table-column label="所在城市" prop="barCity" align="center" />
+              <el-table-column
+                label="核销数量"
+                prop="verifyCount"
+                align="center"
+                width="200"
+              >
+              </el-table-column>
+            </el-table>
+          </div>
+        </el-card>
+      </el-col>
+      <el-col :sm="12" :lg="12" style="margin-bottom: 10px">
+        <el-card
+          class="update-log"
+          shadow="never"
+          style="height: 100%; border: none"
+        >
+          <div class="header-title">
+            <span>酒款评分TOP榜</span>
+          </div>
+          <el-table :data="topReviewBeers" class="zd-table">
+            <el-table-column
+              type="index"
+              width="100"
+              label="排名"
+              align="center"
+            />
+            <el-table-column label="酒款名称" prop="beerName" align="center" />
+            <el-table-column
+              label="酒款评分"
+              prop="beerOverallRating"
+              align="center"
+            />
+            <el-table-column
+              label="点评人数"
+              prop="beerReviewsCount"
+              align="center"
+              width="200"
+            >
+            </el-table-column>
+          </el-table>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup name="Index">
+import {
+  recentData,
+  popularBeerData,
+  checkOutBarData,
+  monthVerifyData,
+  recentPopularCityData,
+} from "@/api/brewery/home";
+import useUserStore from "@/store/modules/user";
+import { topReview10BeersList } from "@/api/brewery/review";
+import * as echarts from "echarts";
+import { onMounted } from "vue";
+const { proxy } = getCurrentInstance();
+const userInfo = useUserStore().userInfo;
+const myChart = ref(null);
+const cityChart = ref(null);
+const option = ref({
+  title: {
+    text: ``,
+    subtext: "",
+    left: "center",
+  },
+  xAxis: {
+    type: "category",
+    data: [],
+    name: "日期",
+  },
+  yAxis: {
+    type: "value",
+    name: "核销数量",
+  },
+  series: [
+    {
+      data: [],
+      type: "line",
+    },
+  ],
+  tooltip: {
+    show: true,
+  },
+});
+const year = ref(2025);
+const month = ref("");
+function initTime() {
+  const now = new Date();
+  year.value = now.getFullYear();
+  month.value = now.getMonth() + 1;
+  getmonthVerifyData();
+}
+
+onMounted(() => {
+  myChart.value = echarts.init(monthRef.value);
+  cityChart.value = echarts.init(cityRef.value);
+  initTime();
+
+  getRecentData();
+  getPopularBeerData(); // 30天热门酒款TOP
+  getCheckOutBarData(); // 一周核销门店数
+  getTopReviewBeers(); // 评分前10酒款
+  getCityData();
+});
+const recentInfo = ref({});
+function getRecentData() {
+  recentData().then((res) => {
+    recentInfo.value = res.data;
+  });
+}
+// 30天热门酒款TOP
+const beerList = ref([]);
+function getPopularBeerData() {
+  popularBeerData({ lastDays: 30 }).then((res) => {
+    beerList.value = res.data;
+  });
+}
+// 一周核销门店数
+const checkOutBarCount = ref([]);
+function getCheckOutBarData() {
+  checkOutBarData({ lastDays: 7 }).then((res) => {
+    checkOutBarCount.value = res.data;
+  });
+}
+// 评分前10酒款
+const topReviewBeers = ref([]);
+function getTopReviewBeers() {
+  topReview10BeersList().then((res) => {
+    topReviewBeers.value = res.data;
+  });
+}
+const timeData = ref("");
+function changeTime() {
+  console.log(timeData.value);
+  let date = new Date(timeData.value);
+  year.value = date.getFullYear();
+  month.value = date.getMonth() + 1;
+  getmonthVerifyData();
+}
+const monthRef = ref(null);
+
+function getmonthVerifyData() {
+  monthVerifyData({ year: year.value, month: month.value }).then((res) => {
+    console.log(res);
+    const data = res.data;
+    option.value.xAxis.data = [];
+    option.value.series[0].data = [];
+    for (const key in data) {
+      if (Object.prototype.hasOwnProperty.call(data, key)) {
+        const element = data[key];
+
+        option.value.xAxis.data.push(key);
+        option.value.series[0].data.push(element);
+      }
+    }
+    option.value.title.text = `${year.value}年${month.value}月核销数量统计`;
+    console.log(option.value);
+    option.value && myChart.value.setOption(option.value);
+  });
+}
+
+// 近30天核销城市占比
+const cityRef = ref(null);
+const cityOption = ref({
+  title: {
+    // text: "城市占比",
+    subtext: "",
+    left: "center",
+  },
+  tooltip: {
+    trigger: "item",
+    formatter: "{a} <br/>{b} : {c} ({d}%)",
+  },
+  legend: {
+    type: "scroll",
+    orient: "vertical",
+    right: 10,
+    top: 20,
+    bottom: 20,
+    data: [],
+  },
+  series: [
+    {
+      name: "占比",
+      type: "pie",
+      radius: "55%",
+      center: ["40%", "50%"],
+      data: [],
+      emphasis: {
+        itemStyle: {
+          shadowBlur: 10,
+          shadowOffsetX: 0,
+          shadowColor: "rgba(0, 0, 0, 0.5)",
+        },
+      },
+    },
+  ],
+});
+function getCityData() {
+  recentPopularCityData({ lastDays: 30 }).then((res) => {
+    const data = res.data;
+    console.log(data);
+    cityOption.value.legend.data = [];
+    cityOption.value.series[0].data = [];
+    for (const key in data) {
+      if (Object.prototype.hasOwnProperty.call(data, key)) {
+        const element = data[key];
+        cityOption.value.legend.data.push(key);
+        cityOption.value.series[0].data.push({
+          name: key,
+          value: element,
+        });
+      }
+    }
+    // cityOption.value.title.text = `近30天核销城市占比`;
+    cityOption.value && cityChart.value.setOption(cityOption.value);
+    console.log(cityOption.value);
+  });
+}
+</script>
+
+<style scoped lang="scss">
+ul {
+  // padding: 0;
+  margin: 0;
+}
+li {
+  list-style: none;
+  margin-bottom: 10px;
+}
+.app-container {
+  padding: 20px;
+  .header-title {
+    font-size: 20px;
+    font-weight: bold;
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 10px;
+  }
+  .name {
+    font-size: 18px;
+    font-weight: bold;
+    margin-left: 40px;
+    margin-bottom: 15px;
+  }
+}
+.user-info-head {
+  position: relative;
+  display: inline-block;
+  width: 120px;
+  height: 120px;
+}
+
+.user-info-head:hover:after {
+  content: "+";
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  color: #eee;
+  background: rgba(0, 0, 0, 0.5);
+  font-size: 24px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  cursor: pointer;
+  line-height: 110px;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+::v-deep .el-divider--vertical {
+  height: 85%;
+}
+
+.row {
+  display: flex;
+  .label {
+    width: 100px;
+  }
+}
+.el-statistic {
+  --el-statistic-content-font-size: 28px;
+}
+
+.statistic-card {
+  height: 100%;
+  padding: 20px;
+  border-radius: 4px;
+  background-color: var(--el-bg-color-overlay);
+}
+
+.statistic-footer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  font-size: 12px;
+  color: var(--el-text-color-regular);
+  margin-top: 16px;
+}
+
+.statistic-footer .footer-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.statistic-footer .footer-item span:last-child {
+  display: inline-flex;
+  align-items: center;
+  margin-left: 4px;
+}
+.green {
+  color: var(--el-color-success);
+}
+.red {
+  color: var(--el-color-error);
+}
+</style>
diff --git a/src/views/login.vue b/src/views/login.vue
new file mode 100644
index 0000000..6cabf20
--- /dev/null
+++ b/src/views/login.vue
@@ -0,0 +1,239 @@
+<template>
+  <div class="login">
+    <img src="../assets/images/login_bg.png" class="left-img" alt="">
+    <div class="login-container">
+      <el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
+      <h3 class="title">枝点品牌方后台管理系统</h3>
+      <el-form-item prop="username">
+        <el-input
+          v-model="loginForm.username"
+          type="text"
+          size="large"
+          auto-complete="off"
+          placeholder="账号"
+        >
+          <template #prefix><svg-icon icon-class="user" class="el-input__icon input-icon" /></template>
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="password">
+        <el-input
+          v-model="loginForm.password"
+          type="password"
+          size="large"
+          auto-complete="off"
+          placeholder="密码"
+          @keyup.enter="handleLogin"
+        >
+          <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template>
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="code" v-if="captchaEnabled">
+        <el-input
+          v-model="loginForm.code"
+          size="large"
+          auto-complete="off"
+          placeholder="验证码"
+          style="width: 63%"
+          @keyup.enter="handleLogin"
+        >
+          <template #prefix><svg-icon icon-class="validCode" class="el-input__icon input-icon" /></template>
+        </el-input>
+        <div class="login-code">
+          <img :src="codeUrl" @click="getCode" class="login-code-img"/>
+        </div>
+      </el-form-item>
+      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
+      <el-form-item style="width:100%;">
+        <el-button
+          :loading="loading"
+          size="large"
+          type="primary"
+          style="width:100%;"
+          @click.prevent="handleLogin"
+        >
+          <span v-if="!loading">登 录</span>
+          <span v-else>登 录 中...</span>
+        </el-button>
+        <div style="float: right;" v-if="register">
+          <router-link class="link-type" :to="'/register'">立即注册</router-link>
+        </div>
+      </el-form-item>
+      </el-form>
+    </div>
+    
+    <!--  底部  -->
+    <!-- <div class="el-login-footer">
+      <span>Copyright © 2018-2024 ruoyi.vip All Rights Reserved.</span>
+    </div> -->
+  </div>
+</template>
+
+<script setup>
+import { getCodeImg } from "@/api/login";
+import Cookies from "js-cookie";
+import { encrypt, decrypt } from "@/utils/jsencrypt";
+import useUserStore from '@/store/modules/user'
+
+const userStore = useUserStore()
+const route = useRoute();
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+const loginForm = ref({
+  username: "zhangsan",
+  password: "admin123",
+  rememberMe: false,
+  code: "",
+  uuid: ""
+});
+
+const loginRules = {
+  username: [{ required: true, trigger: "blur", message: "请输入您的账号" }],
+  password: [{ required: true, trigger: "blur", message: "请输入您的密码" }],
+  code: [{ required: true, trigger: "change", message: "请输入验证码" }]
+};
+
+const codeUrl = ref("");
+const loading = ref(false);
+// 验证码开关
+const captchaEnabled = ref(true);
+// 注册开关
+const register = ref(false);
+const redirect = ref(undefined);
+
+watch(route, (newRoute) => {
+    redirect.value = newRoute.query && newRoute.query.redirect;
+}, { immediate: true });
+
+function handleLogin() {
+  proxy.$refs.loginRef.validate(valid => {
+    if (valid) {
+      loading.value = true;
+      // 勾选了需要记住密码设置在 cookie 中设置记住用户名和密码
+      if (loginForm.value.rememberMe) {
+        Cookies.set("username", loginForm.value.username, { expires: 30 });
+        Cookies.set("password", encrypt(loginForm.value.password), { expires: 30 });
+        Cookies.set("rememberMe", loginForm.value.rememberMe, { expires: 30 });
+      } else {
+        // 否则移除
+        Cookies.remove("username");
+        Cookies.remove("password");
+        Cookies.remove("rememberMe");
+      }
+      // 调用action的登录方法
+      userStore.login(loginForm.value).then(() => {
+        const query = route.query;
+        const otherQueryParams = Object.keys(query).reduce((acc, cur) => {
+          if (cur !== "redirect") {
+            acc[cur] = query[cur];
+          }
+          return acc;
+        }, {});
+        router.push({ path: redirect.value || "/", query: otherQueryParams });
+      }).catch(() => {
+        loading.value = false;
+        // 重新获取验证码
+        if (captchaEnabled.value) {
+          getCode();
+        }
+      });
+    }
+  });
+}
+
+function getCode() {
+  getCodeImg().then(res => {
+    captchaEnabled.value = res.captchaEnabled === undefined ? true : res.captchaEnabled;
+    if (captchaEnabled.value) {
+      codeUrl.value = "data:image/gif;base64," + res.img;
+      loginForm.value.uuid = res.uuid;
+    }
+  });
+}
+
+function getCookie() {
+  const username = Cookies.get("username");
+  const password = Cookies.get("password");
+  const rememberMe = Cookies.get("rememberMe");
+  loginForm.value = {
+    username: username === undefined ? loginForm.value.username : username,
+    password: password === undefined ? loginForm.value.password : decrypt(password),
+    rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
+  };
+}
+
+getCode();
+getCookie();
+</script>
+
+<style lang='scss' scoped>
+.login {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  // background-image: url("../assets/images/login_bg.jpeg");
+  // background-size: cover;
+  background: rgb(235.9, 245.3, 255);
+  .left-img {
+      width: 500px;
+      margin-right: 50px;
+    }
+  .login-container {
+    display: flex;
+    // background: rgb(176, 182, 236);
+  }
+}
+.title {
+  margin: 0px auto 30px auto;
+  text-align: center;
+  color: #707070;
+}
+
+.login-form {
+  border-radius: 6px;
+  background: #ffffff;
+  width: 400px;
+  padding: 25px 25px 5px 25px;
+  .el-input {
+    height: 40px;
+    input {
+      height: 40px;
+    }
+  }
+  .input-icon {
+    height: 39px;
+    width: 14px;
+    margin-left: 0px;
+  }
+}
+.login-tip {
+  font-size: 13px;
+  text-align: center;
+  color: #bfbfbf;
+}
+.login-code {
+  width: 33%;
+  height: 40px;
+  float: right;
+  img {
+    cursor: pointer;
+    vertical-align: middle;
+  }
+}
+.el-login-footer {
+  height: 40px;
+  line-height: 40px;
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  text-align: center;
+  color: #fff;
+  font-family: Arial;
+  font-size: 12px;
+  letter-spacing: 1px;
+}
+.login-code-img {
+  height: 40px;
+  padding-left: 12px;
+}
+</style>
diff --git a/src/views/marketing/index.vue b/src/views/marketing/index.vue
new file mode 100644
index 0000000..79dbc56
--- /dev/null
+++ b/src/views/marketing/index.vue
@@ -0,0 +1,613 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="活动名称" prop="activityName">
+        <el-input
+          v-model="queryParams.activityName"
+          placeholder="请输入活动名称"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!-- <el-form-item label="活动介绍" prop="activityDesc">
+          <el-input
+            v-model="queryParams.activityDesc"
+            placeholder="请输入活动介绍"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item> -->
+      <el-form-item label="开始时间" prop="startDate">
+        <el-date-picker
+          clearable
+          v-model="queryParams.startDate"
+          type="date"
+          value-format="YYYY-MM-DD"
+          placeholder="请选择开始时间"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="结束时间" prop="endDate">
+        <el-date-picker
+          clearable
+          v-model="queryParams.endDate"
+          type="date"
+          value-format="YYYY-MM-DD"
+          placeholder="请选择结束时间"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="handleAdd"
+          v-hasPermi="['brewery:activity:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['brewery:activity:edit']"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['brewery:activity:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:activity:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="activityList"
+      class="zd-table"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="id" align="left" prop="id" width="80" />
+      <el-table-column label="活动名称" align="left" prop="activityName" />
+      <el-table-column
+        label="活动类型"
+        align="center"
+        prop="activityType"
+        width="120"
+      >
+        <template #default="scope">
+          <span v-if="scope.row.activityType === 1">定向</span>
+          <span v-if="scope.row.activityType === 2">招募</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column
+        label="活动介绍"
+        align="left"
+        prop="activityDesc"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="状态"
+        align="center"
+        prop="activityStatus"
+        width="100"
+      >
+        <template #default="scope">
+          <el-tag v-if="scope.row.activityStatus === 1" type="success"
+            >有效</el-tag
+          >
+          <el-tag v-if="scope.row.activityStatus === 0" type="danger"
+            >无效</el-tag
+          >
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="开始时间"
+        align="center"
+        prop="startDate"
+        width="150"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.startDate, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="结束时间"
+        align="center"
+        prop="endDate"
+        width="150"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.endDate, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column label="备注" align="center" prop="remark" /> -->
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            icon="Edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['brewery:activity:edit']"
+            >修改</el-button
+          >
+          <el-button
+            link
+            type="primary"
+            icon="Delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['brewery:activity:remove']"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改营销活动对话框 -->
+    <el-dialog :title="title" v-model="open" width="680px" append-to-body>
+      <el-form
+        ref="activityRef"
+        :model="form"
+        :rules="rules"
+        label-width="120px"
+      >
+        <el-form-item label="活动名称" prop="activityName">
+          <el-input v-model="form.activityName" placeholder="请输入活动名称" />
+        </el-form-item>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="活动类型" prop="activityType">
+              <el-radio-group v-model="form.activityType">
+                <el-radio :value="1">定向</el-radio>
+                <el-radio :value="2">招募</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="活动产品范围" prop="beerScope">
+              <el-radio-group v-model="form.beerScope">
+                <el-radio :value="0">无限制</el-radio>
+                <el-radio :value="1">指定产品</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-form-item
+          v-if="form.activityType === 1"
+          label="定向酒吧选择"
+          prop="barIds"
+        >
+          <el-select v-model="form.barIds" multiple placeholder="请选择酒吧">
+          </el-select>
+        </el-form-item>
+
+        <el-form-item
+          v-if="form.beerScope === 1"
+          label="选择指定产品"
+          prop="beerId"
+        >
+          <el-select v-model="form.beerIds" placeholder="请选择产品" multiple>
+            <el-option
+              v-for="item in allBeersList"
+              :key="item.id"
+              :label="item.beerName"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="活动目标" prop="activityTarget">
+              <el-input
+                v-model="form.activityTarget"
+                type="number"
+                placeholder="请输入活动目标"
+              >
+                <template #suffix> 桶 </template>
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="活动状态" prop="activityStatus">
+              <el-radio-group v-model="form.activityStatus">
+                <el-radio :value="1">有效</el-radio>
+                <el-radio :value="0">无效</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-form-item label="奖励方式" prop="activityRewardType">
+          <el-radio-group v-model="form.activityRewardType">
+            <el-radio :value="1">商品</el-radio>
+            <el-radio :value="2">啤酒币</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-row v-if="form.activityRewardType === 1">
+          <el-col :span="12">
+            <el-form-item label="选择商品" prop="activityRewardGoodsId">
+              <el-select
+                v-model="form.activityRewardGoodsId"
+                placeholder="请选择商品"
+              >
+                <el-option
+                  v-for="item in allGoods"
+                  :key="item.id"
+                  :label="item.goodsName"
+                  :value="item.id"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="奖励数量" prop="activityRewardCount">
+              <el-input
+                v-model="form.activityRewardCount"
+                type="number"
+                placeholder="奖励数量"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row v-if="form.activityRewardType === 2">
+          <el-col :span="12">
+            <el-form-item label="奖励数量" prop="activityRewardCount">
+              <el-input
+                v-model="form.activityRewardCount"
+                type="number"
+                placeholder="奖励数量"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="开始时间" prop="startDate">
+              <el-date-picker
+                clearable
+                v-model="form.startDate"
+                type="date"
+                value-format="YYYY-MM-DD"
+                placeholder="请选择开始时间"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="结束时间" prop="endDate">
+              <el-date-picker
+                clearable
+                v-model="form.endDate"
+                type="date"
+                value-format="YYYY-MM-DD"
+                placeholder="请选择结束时间"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-form-item
+          v-if="form.activityType === 2"
+          label="投放城市"
+          prop="city"
+        >
+          <el-cascader
+            placeholder="请输入投放城市"
+            :options="pcTextArr"
+            v-model="selectedOptions"
+            style="width: 50%; margin-right: 10px"
+            :disabled="form.city == '全国'"
+            @change="handleChange"
+          >
+          </el-cascader>
+          <el-checkbox
+            v-model="form.city"
+            true-value="全国"
+            @change="selectedOptions = []"
+            >全国</el-checkbox
+          >
+        </el-form-item>
+        <el-form-item
+          v-if="form.activityType === 2"
+          label="活动累计时间"
+          prop="duration"
+        >
+          <el-input
+            v-model="form.duration"
+            :max="31"
+            type="number"
+            placeholder="累计时间（不大于31天）"
+          >
+            <template #suffix> 天 </template>
+          </el-input>
+          <!-- <el-input-number
+            v-model="form.activityPolicyTarget"
+            :min="1"
+            :max="31"
+          >
+            <template #suffix>
+              <span>天</span>
+            </template>
+          </el-input-number> -->
+        </el-form-item>
+        <el-form-item label="活动介绍" prop="activityDesc">
+          <!-- <el-input
+            v-model="form.activityDesc"
+            type="textarea"
+            placeholder="请输入活动介绍"
+          /> -->
+          <editor v-model="form.activityDesc" :min-height="150" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Activity">
+import { pcTextArr } from "element-china-area-data";
+import {
+  listActivity,
+  getActivity,
+  delActivity,
+  addActivity,
+  updateActivity,
+} from "@/api/brewery/activity";
+import { allBeers } from "@/api/brewery/beer";
+import { allListGoods } from "@/api/brewery/goods";
+const { proxy } = getCurrentInstance();
+
+const activityList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const allBeersList = ref([]); // 所有啤酒列表
+const allGoods = ref([]); // 所有可兑换商品
+const data = reactive({
+  form: {
+    num: null,
+  },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    activityType: null,
+    activityName: null,
+    activityDesc: null,
+    activityStatus: null,
+    startDate: null,
+    endDate: null,
+  },
+  rules: {
+    breweryId: [{ required: true, message: "酒厂ID不能为空", trigger: "blur" }],
+    activityType: [
+      { required: true, message: "1定向 2招募不能为空", trigger: "change" },
+    ],
+    activityName: [
+      { required: true, message: "活动名称不能为空", trigger: "blur" },
+    ],
+    city: [{ required: true, message: "投放城市不能为空", trigger: "blur" }],
+    num: [
+      { required: true, message: "累计时间不能为空", trigger: "blur" },
+      { max: 31, message: "累计时间不能大于31天", trigger: "blur" },
+      { min: 1, message: "累计时间不能小于1天", trigger: "blur" },
+    ],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询营销活动列表 */
+function getList() {
+  loading.value = true;
+  listActivity(queryParams.value).then((response) => {
+    activityList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    activityType: null,
+    activityName: null,
+    activityDesc: null,
+    activityStatus: null,
+    startDate: null,
+    endDate: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("activityRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加营销活动";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value;
+  getActivity(_id).then((response) => {
+    form.value = response.data;
+    if (form.value.city) {
+      selectedOptions.value = [
+        form.value.city.split("/")[0],
+        form.value.city.split("/")[1],
+      ];
+    }
+    open.value = true;
+    title.value = "修改营销活动";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["activityRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateActivity(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addActivity(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除营销活动编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delActivity(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/activity/export",
+    {
+      ...queryParams.value,
+    },
+    `activity_${new Date().getTime()}.xlsx`
+  );
+}
+// 获取所有啤酒列表
+function getAllBeersFun() {
+  allBeers().then((response) => {
+    allBeersList.value = response.data;
+  });
+}
+// 所有可兑换商品
+function getAllGoodsFun() {
+  allListGoods({ purchaseMethod: 2 }).then((response) => {
+    allGoods.value = response.data;
+  });
+}
+const selectedOptions = ref([]);
+function handleChange() {
+  console.log(selectedOptions.value);
+  form.value.city = `${selectedOptions.value[0]}/${selectedOptions.value[1]}`;
+}
+getAllBeersFun(); // 所有啤酒列表
+getAllGoodsFun(); // 所有可兑换商品
+getList();
+</script>
diff --git a/src/views/monitor/cache/index.vue b/src/views/monitor/cache/index.vue
new file mode 100644
index 0000000..f2a53a9
--- /dev/null
+++ b/src/views/monitor/cache/index.vue
@@ -0,0 +1,132 @@
+<template>
+  <div class="app-container">
+    <el-row>
+      <el-col :span="24" class="card-box">
+        <el-card>
+          <template #header><Monitor style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">基本信息</span></template>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%">
+              <tbody>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">Redis版本</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.redis_version }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">运行模式</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.redis_mode == "standalone" ? "单机" : "集群" }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">端口</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.tcp_port }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">客户端数</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.connected_clients }}</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">运行时间(天)</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.uptime_in_days }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">使用内存</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.used_memory_human }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">使用CPU</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ parseFloat(cache.info.used_cpu_user_children).toFixed(2) }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">内存配置</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.maxmemory_human }}</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">AOF是否开启</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.aof_enabled == "0" ? "否" : "是" }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">RDB是否成功</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.rdb_last_bgsave_status }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">Key数量</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.dbSize">{{ cache.dbSize }} </div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">网络入口/出口</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.instantaneous_input_kbps }}kps/{{cache.info.instantaneous_output_kbps}}kps</div></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="12" class="card-box">
+        <el-card>
+          <template #header><PieChart style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">命令统计</span></template>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <div ref="commandstats" style="height: 420px" />
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="12" class="card-box">
+        <el-card>
+          <template #header><Odometer style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">内存信息</span></template>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <div ref="usedmemory" style="height: 420px" />
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup name="Cache">
+import { getCache } from '@/api/monitor/cache';
+import * as echarts from 'echarts';
+
+const cache = ref([]);
+const commandstats = ref(null);
+const usedmemory = ref(null);
+const { proxy } = getCurrentInstance();
+
+function getList() {
+  proxy.$modal.loading("正在加载缓存监控数据，请稍候！");
+  getCache().then(response => {
+    proxy.$modal.closeLoading();
+    cache.value = response.data;
+
+    const commandstatsIntance = echarts.init(commandstats.value, "macarons");
+    commandstatsIntance.setOption({
+      tooltip: {
+        trigger: "item",
+        formatter: "{a} <br/>{b} : {c} ({d}%)"
+      },
+      series: [
+        {
+          name: "命令",
+          type: "pie",
+          roseType: "radius",
+          radius: [15, 95],
+          center: ["50%", "38%"],
+          data: response.data.commandStats,
+          animationEasing: "cubicInOut",
+          animationDuration: 1000
+        }
+      ]
+    });
+    const usedmemoryInstance = echarts.init(usedmemory.value, "macarons");
+    usedmemoryInstance.setOption({
+      tooltip: {
+        formatter: "{b} <br/>{a} : " + cache.value.info.used_memory_human
+      },
+      series: [
+        {
+          name: "峰值",
+          type: "gauge",
+          min: 0,
+          max: 1000,
+          detail: {
+            formatter: cache.value.info.used_memory_human
+          },
+          data: [
+            {
+              value: parseFloat(cache.value.info.used_memory_human),
+              name: "内存消耗"
+            }
+          ]
+        }
+      ]
+    })
+    window.addEventListener("resize", () => {
+      commandstatsIntance.resize();
+      usedmemoryInstance.resize();
+    });
+  })
+}
+
+getList();
+</script>
diff --git a/src/views/monitor/cache/list.vue b/src/views/monitor/cache/list.vue
new file mode 100644
index 0000000..1696f3a
--- /dev/null
+++ b/src/views/monitor/cache/list.vue
@@ -0,0 +1,246 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="10">
+      <el-col :span="8">
+        <el-card style="height: calc(100vh - 125px)">
+          <template #header>
+            <Collection style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">缓存列表</span>
+            <el-button
+              style="float: right; padding: 3px 0"
+              link
+              type="primary"
+              icon="Refresh"
+              @click="refreshCacheNames()"
+            ></el-button>
+          </template>
+          <el-table
+            v-loading="loading"
+            :data="cacheNames"
+            :height="tableHeight"
+            highlight-current-row
+            @row-click="getCacheKeys"
+            style="width: 100%"
+          >
+            <el-table-column
+              label="序号"
+              width="60"
+              type="index"
+            ></el-table-column>
+
+            <el-table-column
+              label="缓存名称"
+              align="center"
+              prop="cacheName"
+              :show-overflow-tooltip="true"
+              :formatter="nameFormatter"
+            ></el-table-column>
+
+            <el-table-column
+              label="备注"
+              align="center"
+              prop="remark"
+              :show-overflow-tooltip="true"
+            />
+            <el-table-column
+              label="操作"
+              width="60"
+              align="center"
+              class-name="small-padding fixed-width"
+            >
+              <template #default="scope">
+                <el-button
+                  link
+                  type="primary"
+                  icon="Delete"
+                  @click="handleClearCacheName(scope.row)"
+                ></el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-card>
+      </el-col>
+
+      <el-col :span="8">
+        <el-card style="height: calc(100vh - 125px)">
+          <template #header>
+            <Key style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">键名列表</span>
+            <el-button
+              style="float: right; padding: 3px 0"
+              link
+              type="primary"
+              icon="Refresh"
+              @click="refreshCacheKeys()"
+            ></el-button>
+          </template>
+          <el-table
+            v-loading="subLoading"
+            :data="cacheKeys"
+            :height="tableHeight"
+            highlight-current-row
+            @row-click="handleCacheValue"
+            style="width: 100%"
+          >
+            <el-table-column
+              label="序号"
+              width="60"
+              type="index"
+            ></el-table-column>
+            <el-table-column
+              label="缓存键名"
+              align="center"
+              :show-overflow-tooltip="true"
+              :formatter="keyFormatter"
+            >
+            </el-table-column>
+            <el-table-column
+              label="操作"
+              width="60"
+              align="center"
+              class-name="small-padding fixed-width"
+            >
+              <template #default="scope">
+                <el-button
+                  link
+                  type="primary"
+                  icon="Delete"
+                  @click="handleClearCacheKey(scope.row)"
+                ></el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-card>
+      </el-col>
+
+      <el-col :span="8">
+        <el-card :bordered="false" style="height: calc(100vh - 125px)">
+          <template #header>
+            <Document style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">缓存内容</span>
+            <el-button
+              style="float: right; padding: 3px 0"
+              link
+              type="primary"
+              icon="Refresh"
+              @click="handleClearCacheAll()"
+              >清理全部</el-button
+            >
+          </template>
+          <el-form :model="cacheForm">
+            <el-row :gutter="32">
+              <el-col :offset="1" :span="22">
+                <el-form-item label="缓存名称:" prop="cacheName">
+                  <el-input v-model="cacheForm.cacheName" :readOnly="true" />
+                </el-form-item>
+              </el-col>
+              <el-col :offset="1" :span="22">
+                <el-form-item label="缓存键名:" prop="cacheKey">
+                  <el-input v-model="cacheForm.cacheKey" :readOnly="true" />
+                </el-form-item>
+              </el-col>
+              <el-col :offset="1" :span="22">
+                <el-form-item label="缓存内容:" prop="cacheValue">
+                  <el-input
+                    v-model="cacheForm.cacheValue"
+                    type="textarea"
+                    :rows="8"
+                    :readOnly="true"
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup name="CacheList">
+import { listCacheName, listCacheKey, getCacheValue, clearCacheName, clearCacheKey, clearCacheAll } from "@/api/monitor/cache";
+
+const { proxy } = getCurrentInstance();
+
+const cacheNames = ref([]);
+const cacheKeys = ref([]);
+const cacheForm = ref({});
+const loading = ref(true);
+const subLoading = ref(false);
+const nowCacheName = ref("");
+const tableHeight = ref(window.innerHeight - 200);
+
+/** 查询缓存名称列表 */
+function getCacheNames() {
+  loading.value = true;
+  listCacheName().then(response => {
+    cacheNames.value = response.data;
+    loading.value = false;
+  });
+}
+
+/** 刷新缓存名称列表 */
+function refreshCacheNames() {
+  getCacheNames();
+  proxy.$modal.msgSuccess("刷新缓存列表成功");
+}
+
+/** 清理指定名称缓存 */
+function handleClearCacheName(row) {
+  clearCacheName(row.cacheName).then(response => {
+    proxy.$modal.msgSuccess("清理缓存名称[" + row.cacheName + "]成功");
+    getCacheKeys();
+  });
+}
+
+/** 查询缓存键名列表 */
+function getCacheKeys(row) {
+  const cacheName = row !== undefined ? row.cacheName : nowCacheName.value;
+  if (cacheName === "") {
+    return;
+  }
+  subLoading.value = true;
+  listCacheKey(cacheName).then(response => {
+    cacheKeys.value = response.data;
+    subLoading.value = false;
+    nowCacheName.value = cacheName;
+  });
+}
+
+/** 刷新缓存键名列表 */
+function refreshCacheKeys() {
+  getCacheKeys();
+  proxy.$modal.msgSuccess("刷新键名列表成功");
+}
+
+/** 清理指定键名缓存 */
+function handleClearCacheKey(cacheKey) {
+  clearCacheKey(cacheKey).then(response => {
+    proxy.$modal.msgSuccess("清理缓存键名[" + cacheKey + "]成功");
+    getCacheKeys();
+  });
+}
+
+/** 列表前缀去除 */
+function nameFormatter(row) {
+  return row.cacheName.replace(":", "");
+}
+
+/** 键名前缀去除 */
+function keyFormatter(cacheKey) {
+  return cacheKey.replace(nowCacheName.value, "");
+}
+
+/** 查询缓存内容详细 */
+function handleCacheValue(cacheKey) {
+  getCacheValue(nowCacheName.value, cacheKey).then(response => {
+    cacheForm.value = response.data;
+  });
+}
+
+/** 清理全部缓存 */
+function handleClearCacheAll() {
+  clearCacheAll().then(response => {
+    proxy.$modal.msgSuccess("清理全部缓存成功");
+  });
+}
+
+getCacheNames();
+</script>
diff --git a/src/views/monitor/druid/index.vue b/src/views/monitor/druid/index.vue
new file mode 100644
index 0000000..13736ec
--- /dev/null
+++ b/src/views/monitor/druid/index.vue
@@ -0,0 +1,13 @@
+<template>
+   <div>
+      <i-frame v-model:src="url"></i-frame>
+   </div>
+</template>
+
+<script setup>
+import iFrame from '@/components/iFrame'
+
+import { ref } from 'vue';
+
+const url = ref(import.meta.env.VITE_APP_BASE_API + '/druid/login.html');
+</script>
diff --git a/src/views/monitor/job/index.vue b/src/views/monitor/job/index.vue
new file mode 100644
index 0000000..c514839
--- /dev/null
+++ b/src/views/monitor/job/index.vue
@@ -0,0 +1,501 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
+         <el-form-item label="任务名称" prop="jobName">
+            <el-input
+               v-model="queryParams.jobName"
+               placeholder="请输入任务名称"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="任务组名" prop="jobGroup">
+            <el-select v-model="queryParams.jobGroup" placeholder="请选择任务组名" clearable style="width: 200px">
+               <el-option
+                  v-for="dict in sys_job_group"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="任务状态" prop="status">
+            <el-select v-model="queryParams.status" placeholder="请选择任务状态" clearable style="width: 200px">
+               <el-option
+                  v-for="dict in sys_job_status"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="handleAdd"
+               v-hasPermi="['monitor:job:add']"
+            >新增</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="success"
+               plain
+               icon="Edit"
+               :disabled="single"
+               @click="handleUpdate"
+               v-hasPermi="['monitor:job:edit']"
+            >修改</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['monitor:job:remove']"
+            >删除</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Download"
+               @click="handleExport"
+               v-hasPermi="['monitor:job:export']"
+            >导出</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="info"
+               plain
+               icon="Operation"
+               @click="handleJobLog"
+               v-hasPermi="['monitor:job:query']"
+            >日志</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table v-loading="loading" :data="jobList" @selection-change="handleSelectionChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="任务编号" width="100" align="center" prop="jobId" />
+         <el-table-column label="任务名称" align="center" prop="jobName" :show-overflow-tooltip="true" />
+         <el-table-column label="任务组名" align="center" prop="jobGroup">
+            <template #default="scope">
+               <dict-tag :options="sys_job_group" :value="scope.row.jobGroup" />
+            </template>
+         </el-table-column>
+         <el-table-column label="调用目标字符串" align="center" prop="invokeTarget" :show-overflow-tooltip="true" />
+         <el-table-column label="cron执行表达式" align="center" prop="cronExpression" :show-overflow-tooltip="true" />
+         <el-table-column label="状态" align="center">
+            <template #default="scope">
+               <el-switch
+                  v-model="scope.row.status"
+                  active-value="0"
+                  inactive-value="1"
+                  @change="handleStatusChange(scope.row)"
+               ></el-switch>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-tooltip content="修改" placement="top">
+                  <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['monitor:job:edit']"></el-button>
+               </el-tooltip>
+               <el-tooltip content="删除" placement="top">
+                  <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['monitor:job:remove']"></el-button>
+               </el-tooltip>
+               <el-tooltip content="执行一次" placement="top">
+                  <el-button link type="primary" icon="CaretRight" @click="handleRun(scope.row)" v-hasPermi="['monitor:job:changeStatus']"></el-button>
+               </el-tooltip>
+               <el-tooltip content="任务详细" placement="top">
+                  <el-button link type="primary" icon="View" @click="handleView(scope.row)" v-hasPermi="['monitor:job:query']"></el-button>
+               </el-tooltip>
+               <el-tooltip content="调度日志" placement="top">
+                  <el-button link type="primary" icon="Operation" @click="handleJobLog(scope.row)" v-hasPermi="['monitor:job:query']"></el-button>
+               </el-tooltip>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+
+      <!-- 添加或修改定时任务对话框 -->
+      <el-dialog :title="title" v-model="open" width="820px" append-to-body>
+         <el-form ref="jobRef" :model="form" :rules="rules" label-width="120px">
+            <el-row>
+               <el-col :span="12">
+                  <el-form-item label="任务名称" prop="jobName">
+                     <el-input v-model="form.jobName" placeholder="请输入任务名称" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="任务分组" prop="jobGroup">
+                     <el-select v-model="form.jobGroup" placeholder="请选择">
+                        <el-option
+                           v-for="dict in sys_job_group"
+                           :key="dict.value"
+                           :label="dict.label"
+                           :value="dict.value"
+                        ></el-option>
+                     </el-select>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item prop="invokeTarget">
+                     <template #label>
+                        <span>
+                           调用方法
+                           <el-tooltip placement="top">
+                              <template #content>
+                                 <div>
+                                    Bean调用示例：ryTask.ryParams('ry')
+                                    <br />Class类调用示例：com.ruoyi.quartz.task.RyTask.ryParams('ry')
+                                    <br />参数说明：支持字符串，布尔类型，长整型，浮点型，整型
+                                 </div>
+                              </template>
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>
+                        </span>
+                     </template>
+                     <el-input v-model="form.invokeTarget" placeholder="请输入调用目标字符串" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="cron表达式" prop="cronExpression">
+                     <el-input v-model="form.cronExpression" placeholder="请输入cron执行表达式">
+                        <template #append>
+                           <el-button type="primary" @click="handleShowCron">
+                              生成表达式
+                              <i class="el-icon-time el-icon--right"></i>
+                           </el-button>
+                        </template>
+                     </el-input>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="24" v-if="form.jobId !== undefined">
+                  <el-form-item label="状态">
+                     <el-radio-group v-model="form.status">
+                        <el-radio
+                           v-for="dict in sys_job_status"
+                           :key="dict.value"
+                           :value="dict.value"
+                        >{{ dict.label }}</el-radio>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="执行策略" prop="misfirePolicy">
+                     <el-radio-group v-model="form.misfirePolicy">
+                        <el-radio-button value="1">立即执行</el-radio-button>
+                        <el-radio-button value="2">执行一次</el-radio-button>
+                        <el-radio-button value="3">放弃执行</el-radio-button>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="是否并发" prop="concurrent">
+                     <el-radio-group v-model="form.concurrent">
+                        <el-radio-button value="0">允许</el-radio-button>
+                        <el-radio-button value="1">禁止</el-radio-button>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+            </el-row>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitForm">确 定</el-button>
+               <el-button @click="cancel">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+
+     <el-dialog title="Cron表达式生成器" v-model="openCron" append-to-body destroy-on-close>
+       <crontab ref="crontabRef" @hide="openCron=false" @fill="crontabFill" :expression="expression"></crontab>
+     </el-dialog>
+
+      <!-- 任务日志详细 -->
+      <el-dialog title="任务详细" v-model="openView" width="700px" append-to-body>
+         <el-form :model="form" label-width="120px">
+            <el-row>
+               <el-col :span="12">
+                  <el-form-item label="任务编号：">{{ form.jobId }}</el-form-item>
+                  <el-form-item label="任务名称：">{{ form.jobName }}</el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="任务分组：">{{ jobGroupFormat(form) }}</el-form-item>
+                  <el-form-item label="创建时间：">{{ form.createTime }}</el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="cron表达式：">{{ form.cronExpression }}</el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="下次执行时间：">{{ parseTime(form.nextValidTime) }}</el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="调用目标方法：">{{ form.invokeTarget }}</el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="任务状态：">
+                     <div v-if="form.status == 0">正常</div>
+                     <div v-else-if="form.status == 1">暂停</div>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="是否并发：">
+                     <div v-if="form.concurrent == 0">允许</div>
+                     <div v-else-if="form.concurrent == 1">禁止</div>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="执行策略：">
+                     <div v-if="form.misfirePolicy == 0">默认策略</div>
+                     <div v-else-if="form.misfirePolicy == 1">立即执行</div>
+                     <div v-else-if="form.misfirePolicy == 2">执行一次</div>
+                     <div v-else-if="form.misfirePolicy == 3">放弃执行</div>
+                  </el-form-item>
+               </el-col>
+            </el-row>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button @click="openView = false">关 闭</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Job">
+import { listJob, getJob, delJob, addJob, updateJob, runJob, changeJobStatus } from "@/api/monitor/job";
+import Crontab from '@/components/Crontab'
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+const { sys_job_group, sys_job_status } = proxy.useDict("sys_job_group", "sys_job_status");
+
+const jobList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const openView = ref(false);
+const openCron = ref(false);
+const expression = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    jobName: undefined,
+    jobGroup: undefined,
+    status: undefined
+  },
+  rules: {
+    jobName: [{ required: true, message: "任务名称不能为空", trigger: "blur" }],
+    invokeTarget: [{ required: true, message: "调用目标字符串不能为空", trigger: "blur" }],
+    cronExpression: [{ required: true, message: "cron执行表达式不能为空", trigger: "change" }]
+  }
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询定时任务列表 */
+function getList() {
+  loading.value = true;
+  listJob(queryParams.value).then(response => {
+    jobList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 任务组名字典翻译 */
+function jobGroupFormat(row, column) {
+  return proxy.selectDictLabel(sys_job_group.value, row.jobGroup);
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    jobId: undefined,
+    jobName: undefined,
+    jobGroup: undefined,
+    invokeTarget: undefined,
+    cronExpression: undefined,
+    misfirePolicy: 1,
+    concurrent: 1,
+    status: "0"
+  };
+  proxy.resetForm("jobRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.jobId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+// 更多操作触发
+function handleCommand(command, row) {
+  switch (command) {
+    case "handleRun":
+      handleRun(row);
+      break;
+    case "handleView":
+      handleView(row);
+      break;
+    case "handleJobLog":
+      handleJobLog(row);
+      break;
+    default:
+      break;
+  }
+}
+
+// 任务状态修改
+function handleStatusChange(row) {
+  let text = row.status === "0" ? "启用" : "停用";
+  proxy.$modal.confirm('确认要"' + text + '""' + row.jobName + '"任务吗?').then(function () {
+    return changeJobStatus(row.jobId, row.status);
+  }).then(() => {
+    proxy.$modal.msgSuccess(text + "成功");
+  }).catch(function () {
+    row.status = row.status === "0" ? "1" : "0";
+  });
+}
+
+/* 立即执行一次 */
+function handleRun(row) {
+  proxy.$modal.confirm('确认要立即执行一次"' + row.jobName + '"任务吗?').then(function () {
+    return runJob(row.jobId, row.jobGroup);
+  }).then(() => {
+    proxy.$modal.msgSuccess("执行成功");})
+  .catch(() => {});
+}
+
+/** 任务详细信息 */
+function handleView(row) {
+  getJob(row.jobId).then(response => {
+    form.value = response.data;
+    openView.value = true;
+  });
+}
+
+/** cron表达式按钮操作 */
+function handleShowCron() {
+  expression.value = form.value.cronExpression;
+  openCron.value = true;
+}
+
+/** 确定后回传值 */
+function crontabFill(value) {
+  form.value.cronExpression = value;
+}
+
+/** 任务日志列表查询 */
+function handleJobLog(row) {
+  const jobId = row.jobId || 0;
+  router.push('/monitor/job-log/index/' + jobId)
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加任务";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const jobId = row.jobId || ids.value;
+  getJob(jobId).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改任务";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["jobRef"].validate(valid => {
+    if (valid) {
+      if (form.value.jobId != undefined) {
+        updateJob(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addJob(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const jobIds = row.jobId || ids.value;
+  proxy.$modal.confirm('是否确认删除定时任务编号为"' + jobIds + '"的数据项?').then(function () {
+    return delJob(jobIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("monitor/job/export", {
+    ...queryParams.value,
+  }, `job_${new Date().getTime()}.xlsx`);
+}
+
+getList();
+</script>
diff --git a/src/views/monitor/job/log.vue b/src/views/monitor/job/log.vue
new file mode 100644
index 0000000..6823883
--- /dev/null
+++ b/src/views/monitor/job/log.vue
@@ -0,0 +1,283 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+         <el-form-item label="任务名称" prop="jobName">
+            <el-input
+               v-model="queryParams.jobName"
+               placeholder="请输入任务名称"
+               clearable
+               style="width: 240px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="任务组名" prop="jobGroup">
+            <el-select
+               v-model="queryParams.jobGroup"
+               placeholder="请选择任务组名"
+               clearable
+               style="width: 240px"
+            >
+               <el-option
+                  v-for="dict in sys_job_group"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="执行状态" prop="status">
+            <el-select
+               v-model="queryParams.status"
+               placeholder="请选择执行状态"
+               clearable
+               style="width: 240px"
+            >
+               <el-option
+                  v-for="dict in sys_common_status"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="执行时间" style="width: 308px">
+            <el-date-picker
+               v-model="dateRange"
+               value-format="YYYY-MM-DD"
+               type="daterange"
+               range-separator="-"
+               start-placeholder="开始日期"
+               end-placeholder="结束日期"
+            ></el-date-picker>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['monitor:job:remove']"
+            >删除</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               @click="handleClean"
+               v-hasPermi="['monitor:job:remove']"
+            >清空</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Download"
+               @click="handleExport"
+               v-hasPermi="['monitor:job:export']"
+            >导出</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button 
+               type="warning" 
+               plain 
+               icon="Close"
+               @click="handleClose"
+            >关闭</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table v-loading="loading" :data="jobLogList" @selection-change="handleSelectionChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="日志编号" width="80" align="center" prop="jobLogId" />
+         <el-table-column label="任务名称" align="center" prop="jobName" :show-overflow-tooltip="true" />
+         <el-table-column label="任务组名" align="center" prop="jobGroup" :show-overflow-tooltip="true">
+            <template #default="scope">
+               <dict-tag :options="sys_job_group" :value="scope.row.jobGroup" />
+            </template>
+         </el-table-column>
+         <el-table-column label="调用目标字符串" align="center" prop="invokeTarget" :show-overflow-tooltip="true" />
+         <el-table-column label="日志信息" align="center" prop="jobMessage" :show-overflow-tooltip="true" />
+         <el-table-column label="执行状态" align="center" prop="status">
+            <template #default="scope">
+               <dict-tag :options="sys_common_status" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="执行时间" align="center" prop="createTime" width="180">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="View" @click="handleView(scope.row)" v-hasPermi="['monitor:job:query']">详细</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+
+      <!-- 调度日志详细 -->
+      <el-dialog title="调度日志详细" v-model="open" width="700px" append-to-body>
+         <el-form :model="form" label-width="100px">
+            <el-row>
+               <el-col :span="12">
+                  <el-form-item label="日志序号：">{{ form.jobLogId }}</el-form-item>
+                  <el-form-item label="任务名称：">{{ form.jobName }}</el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="任务分组：">{{ form.jobGroup }}</el-form-item>
+                  <el-form-item label="执行时间：">{{ form.createTime }}</el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="调用方法：">{{ form.invokeTarget }}</el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="日志信息：">{{ form.jobMessage }}</el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="执行状态：">
+                     <div v-if="form.status == 0">正常</div>
+                     <div v-else-if="form.status == 1">失败</div>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="异常信息：" v-if="form.status == 1">{{ form.exceptionInfo }}</el-form-item>
+               </el-col>
+            </el-row>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button @click="open = false">关 闭</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="JobLog">
+import { getJob } from "@/api/monitor/job";
+import { listJobLog, delJobLog, cleanJobLog } from "@/api/monitor/jobLog";
+
+const { proxy } = getCurrentInstance();
+const { sys_common_status, sys_job_group } = proxy.useDict("sys_common_status", "sys_job_group");
+
+const jobLogList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const multiple = ref(true);
+const total = ref(0);
+const dateRange = ref([]);
+const route = useRoute();
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    dictName: undefined,
+    dictType: undefined,
+    status: undefined
+  }
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询调度日志列表 */
+function getList() {
+  loading.value = true;
+  listJobLog(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => {
+    jobLogList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 返回按钮
+function handleClose() {
+  const obj = { path: "/monitor/job" };
+  proxy.$tab.closeOpenPage(obj);
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  dateRange.value = [];
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.jobLogId);
+  multiple.value = !selection.length;
+}
+
+/** 详细按钮操作 */
+function handleView(row) {
+  open.value = true;
+  form.value = row;
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  proxy.$modal.confirm('是否确认删除调度日志编号为"' + ids.value + '"的数据项?').then(function () {
+    return delJobLog(ids.value);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 清空按钮操作 */
+function handleClean() {
+  proxy.$modal.confirm("是否确认清空所有调度日志数据项?").then(function () {
+    return cleanJobLog();
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("清空成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("monitor/jobLog/export", {
+    ...queryParams.value,
+  }, `job_log_${new Date().getTime()}.xlsx`);
+}
+
+(() => {
+  const jobId = route.params && route.params.jobId;
+  if (jobId !== undefined && jobId != 0) {
+    getJob(jobId).then(response => {
+      queryParams.value.jobName = response.data.jobName;
+      queryParams.value.jobGroup = response.data.jobGroup;
+      getList();
+    });
+  } else {
+    getList();
+  }
+})();
+</script>
diff --git a/src/views/monitor/logininfor/index.vue b/src/views/monitor/logininfor/index.vue
new file mode 100644
index 0000000..09c5642
--- /dev/null
+++ b/src/views/monitor/logininfor/index.vue
@@ -0,0 +1,233 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+         <el-form-item label="登录地址" prop="ipaddr">
+            <el-input
+               v-model="queryParams.ipaddr"
+               placeholder="请输入登录地址"
+               clearable
+               style="width: 240px;"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="用户名称" prop="userName">
+            <el-input
+               v-model="queryParams.userName"
+               placeholder="请输入用户名称"
+               clearable
+               style="width: 240px;"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="状态" prop="status">
+            <el-select
+               v-model="queryParams.status"
+               placeholder="登录状态"
+               clearable
+               style="width: 240px"
+            >
+               <el-option
+                  v-for="dict in sys_common_status"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="登录时间" style="width: 308px">
+            <el-date-picker
+               v-model="dateRange"
+               value-format="YYYY-MM-DD HH:mm:ss"
+               type="daterange"
+               range-separator="-"
+               start-placeholder="开始日期"
+               end-placeholder="结束日期"
+               :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+            ></el-date-picker>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['monitor:logininfor:remove']"
+            >删除</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               @click="handleClean"
+               v-hasPermi="['monitor:logininfor:remove']"
+            >清空</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Unlock"
+               :disabled="single"
+               @click="handleUnlock"
+               v-hasPermi="['monitor:logininfor:unlock']"
+            >解锁</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Download"
+               @click="handleExport"
+               v-hasPermi="['monitor:logininfor:export']"
+            >导出</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table ref="logininforRef" v-loading="loading" :data="logininforList" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="访问编号" align="center" prop="infoId" />
+         <el-table-column label="用户名称" align="center" prop="userName" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" />
+         <el-table-column label="地址" align="center" prop="ipaddr" :show-overflow-tooltip="true" />
+         <el-table-column label="登录地点" align="center" prop="loginLocation" :show-overflow-tooltip="true" />
+         <el-table-column label="操作系统" align="center" prop="os" :show-overflow-tooltip="true" />
+         <el-table-column label="浏览器" align="center" prop="browser" :show-overflow-tooltip="true" />
+         <el-table-column label="登录状态" align="center" prop="status">
+            <template #default="scope">
+               <dict-tag :options="sys_common_status" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="描述" align="center" prop="msg" :show-overflow-tooltip="true" />
+         <el-table-column label="访问时间" align="center" prop="loginTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.loginTime) }}</span>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+   </div>
+</template>
+
+<script setup name="Logininfor">
+import { list, delLogininfor, cleanLogininfor, unlockLogininfor } from "@/api/monitor/logininfor";
+
+const { proxy } = getCurrentInstance();
+const { sys_common_status } = proxy.useDict("sys_common_status");
+
+const logininforList = ref([]);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const selectName = ref("");
+const total = ref(0);
+const dateRange = ref([]);
+const defaultSort = ref({ prop: "loginTime", order: "descending" });
+
+// 查询参数
+const queryParams = ref({
+  pageNum: 1,
+  pageSize: 10,
+  ipaddr: undefined,
+  userName: undefined,
+  status: undefined,
+  orderByColumn: undefined,
+  isAsc: undefined
+});
+
+/** 查询登录日志列表 */
+function getList() {
+  loading.value = true;
+  list(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => {
+    logininforList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  dateRange.value = [];
+  proxy.resetForm("queryRef");
+  queryParams.value.pageNum = 1;
+  proxy.$refs["logininforRef"].sort(defaultSort.value.prop, defaultSort.value.order);
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.infoId);
+  multiple.value = !selection.length;
+  single.value = selection.length != 1;
+  selectName.value = selection.map(item => item.userName);
+}
+
+/** 排序触发事件 */
+function handleSortChange(column, prop, order) {
+  queryParams.value.orderByColumn = column.prop;
+  queryParams.value.isAsc = column.order;
+  getList();
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const infoIds = row.infoId || ids.value;
+  proxy.$modal.confirm('是否确认删除访问编号为"' + infoIds + '"的数据项?').then(function () {
+    return delLogininfor(infoIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 清空按钮操作 */
+function handleClean() {
+  proxy.$modal.confirm("是否确认清空所有登录日志数据项?").then(function () {
+    return cleanLogininfor();
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("清空成功");
+  }).catch(() => {});
+}
+
+/** 解锁按钮操作 */
+function handleUnlock() {
+  const username = selectName.value;
+  proxy.$modal.confirm('是否确认解锁用户"' + username + '"数据项?').then(function () {
+    return unlockLogininfor(username);
+  }).then(() => {
+    proxy.$modal.msgSuccess("用户" + username + "解锁成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("monitor/logininfor/export", {
+    ...queryParams.value,
+  }, `logininfor_${new Date().getTime()}.xlsx`);
+}
+
+getList();
+</script>
diff --git a/src/views/monitor/online/index.vue b/src/views/monitor/online/index.vue
new file mode 100644
index 0000000..9481959
--- /dev/null
+++ b/src/views/monitor/online/index.vue
@@ -0,0 +1,109 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true">
+         <el-form-item label="登录地址" prop="ipaddr">
+            <el-input
+               v-model="queryParams.ipaddr"
+               placeholder="请输入登录地址"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="用户名称" prop="userName">
+            <el-input
+               v-model="queryParams.userName"
+               placeholder="请输入用户名称"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+      <el-table
+         v-loading="loading"
+         :data="onlineList.slice((pageNum - 1) * pageSize, pageNum * pageSize)"
+         style="width: 100%;"
+      >
+         <el-table-column label="序号" width="50" type="index" align="center">
+            <template #default="scope">
+               <span>{{ (pageNum - 1) * pageSize + scope.$index + 1 }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="会话编号" align="center" prop="tokenId" :show-overflow-tooltip="true" />
+         <el-table-column label="登录名称" align="center" prop="userName" :show-overflow-tooltip="true" />
+         <el-table-column label="所属部门" align="center" prop="deptName" :show-overflow-tooltip="true" />
+         <el-table-column label="主机" align="center" prop="ipaddr" :show-overflow-tooltip="true" />
+         <el-table-column label="登录地点" align="center" prop="loginLocation" :show-overflow-tooltip="true" />
+         <el-table-column label="操作系统" align="center" prop="os" :show-overflow-tooltip="true" />
+         <el-table-column label="浏览器" align="center" prop="browser" :show-overflow-tooltip="true" />
+         <el-table-column label="登录时间" align="center" prop="loginTime" width="180">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.loginTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="Delete" @click="handleForceLogout(scope.row)" v-hasPermi="['monitor:online:forceLogout']">强退</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination v-show="total > 0" :total="total" v-model:page="pageNum" v-model:limit="pageSize" />
+   </div>
+</template>
+
+<script setup name="Online">
+import { forceLogout, list as initData } from "@/api/monitor/online";
+
+const { proxy } = getCurrentInstance();
+
+const onlineList = ref([]);
+const loading = ref(true);
+const total = ref(0);
+const pageNum = ref(1);
+const pageSize = ref(10);
+
+const queryParams = ref({
+  ipaddr: undefined,
+  userName: undefined
+});
+
+/** 查询登录日志列表 */
+function getList() {
+  loading.value = true;
+  initData(queryParams.value).then(response => {
+    onlineList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  pageNum.value = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 强退按钮操作 */
+function handleForceLogout(row) {
+    proxy.$modal.confirm('是否确认强退名称为"' + row.userName + '"的用户?').then(function () {
+  return forceLogout(row.tokenId);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+getList();
+</script>
diff --git a/src/views/monitor/operlog/index.vue b/src/views/monitor/operlog/index.vue
new file mode 100644
index 0000000..3f2ea94
--- /dev/null
+++ b/src/views/monitor/operlog/index.vue
@@ -0,0 +1,310 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+         <el-form-item label="操作地址" prop="operIp">
+            <el-input
+               v-model="queryParams.operIp"
+               placeholder="请输入操作地址"
+               clearable
+               style="width: 240px;"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="系统模块" prop="title">
+            <el-input
+               v-model="queryParams.title"
+               placeholder="请输入系统模块"
+               clearable
+               style="width: 240px;"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="操作人员" prop="operName">
+            <el-input
+               v-model="queryParams.operName"
+               placeholder="请输入操作人员"
+               clearable
+               style="width: 240px;"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="类型" prop="businessType">
+            <el-select
+               v-model="queryParams.businessType"
+               placeholder="操作类型"
+               clearable
+               style="width: 240px"
+            >
+               <el-option
+                  v-for="dict in sys_oper_type"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="状态" prop="status">
+            <el-select
+               v-model="queryParams.status"
+               placeholder="操作状态"
+               clearable
+               style="width: 240px"
+            >
+               <el-option
+                  v-for="dict in sys_common_status"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="操作时间" style="width: 308px">
+            <el-date-picker
+               v-model="dateRange"
+               value-format="YYYY-MM-DD HH:mm:ss"
+               type="daterange"
+               range-separator="-"
+               start-placeholder="开始日期"
+               end-placeholder="结束日期"
+               :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+            ></el-date-picker>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['monitor:operlog:remove']"
+            >删除</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               @click="handleClean"
+               v-hasPermi="['monitor:operlog:remove']"
+            >清空</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Download"
+               @click="handleExport"
+               v-hasPermi="['monitor:operlog:export']"
+            >导出</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table ref="operlogRef" v-loading="loading" :data="operlogList" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
+         <el-table-column type="selection" width="50" align="center" />
+         <el-table-column label="日志编号" align="center" prop="operId" />
+         <el-table-column label="系统模块" align="center" prop="title" :show-overflow-tooltip="true" />
+         <el-table-column label="操作类型" align="center" prop="businessType">
+            <template #default="scope">
+               <dict-tag :options="sys_oper_type" :value="scope.row.businessType" />
+            </template>
+         </el-table-column>
+         <el-table-column label="操作人员" align="center" width="110" prop="operName" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" />
+         <el-table-column label="操作地址" align="center" prop="operIp" width="130" :show-overflow-tooltip="true" />
+         <el-table-column label="操作状态" align="center" prop="status">
+            <template #default="scope">
+               <dict-tag :options="sys_common_status" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="操作日期" align="center" prop="operTime" width="180" sortable="custom" :sort-orders="['descending', 'ascending']">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.operTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="消耗时间" align="center" prop="costTime" width="110" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']">
+            <template #default="scope">
+               <span>{{ scope.row.costTime }}毫秒</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="View" @click="handleView(scope.row, scope.index)" v-hasPermi="['monitor:operlog:query']">详细</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+
+      <!-- 操作日志详细 -->
+      <el-dialog title="操作日志详细" v-model="open" width="800px" append-to-body>
+         <el-form :model="form" label-width="100px">
+            <el-row>
+               <el-col :span="12">
+                  <el-form-item label="操作模块：">{{ form.title }} / {{ typeFormat(form) }}</el-form-item>
+                  <el-form-item
+                    label="登录信息："
+                  >{{ form.operName }} / {{ form.operIp }} / {{ form.operLocation }}</el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="请求地址：">{{ form.operUrl }}</el-form-item>
+                  <el-form-item label="请求方式：">{{ form.requestMethod }}</el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="操作方法：">{{ form.method }}</el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="请求参数：">{{ form.operParam }}</el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="返回参数：">{{ form.jsonResult }}</el-form-item>
+               </el-col>
+               <el-col :span="8">
+                  <el-form-item label="操作状态：">
+                     <div v-if="form.status === 0">正常</div>
+                     <div v-else-if="form.status === 1">失败</div>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="8">
+                  <el-form-item label="消耗时间：">{{ form.costTime }}毫秒</el-form-item>
+               </el-col>
+               <el-col :span="8">
+                  <el-form-item label="操作时间：">{{ parseTime(form.operTime) }}</el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="异常信息：" v-if="form.status === 1">{{ form.errorMsg }}</el-form-item>
+               </el-col>
+            </el-row>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button @click="open = false">关 闭</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Operlog">
+import { list, delOperlog, cleanOperlog } from "@/api/monitor/operlog";
+
+const { proxy } = getCurrentInstance();
+const { sys_oper_type, sys_common_status } = proxy.useDict("sys_oper_type","sys_common_status");
+
+const operlogList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const dateRange = ref([]);
+const defaultSort = ref({ prop: "operTime", order: "descending" });
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    operIp: undefined,
+    title: undefined,
+    operName: undefined,
+    businessType: undefined,
+    status: undefined
+  }
+});
+
+const { queryParams, form } = toRefs(data);
+
+/** 查询登录日志 */
+function getList() {
+  loading.value = true;
+  list(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => {
+    operlogList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 操作日志类型字典翻译 */
+function typeFormat(row, column) {
+  return proxy.selectDictLabel(sys_oper_type.value, row.businessType);
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  dateRange.value = [];
+  proxy.resetForm("queryRef");
+  queryParams.value.pageNum = 1;
+  proxy.$refs["operlogRef"].sort(defaultSort.value.prop, defaultSort.value.order);
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.operId);
+  multiple.value = !selection.length;
+}
+
+/** 排序触发事件 */
+function handleSortChange(column, prop, order) {
+  queryParams.value.orderByColumn = column.prop;
+  queryParams.value.isAsc = column.order;
+  getList();
+}
+
+/** 详细按钮操作 */
+function handleView(row) {
+  open.value = true;
+  form.value = row;
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const operIds = row.operId || ids.value;
+  proxy.$modal.confirm('是否确认删除日志编号为"' + operIds + '"的数据项?').then(function () {
+    return delOperlog(operIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 清空按钮操作 */
+function handleClean() {
+  proxy.$modal.confirm("是否确认清空所有操作日志数据项?").then(function () {
+    return cleanOperlog();
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("清空成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("monitor/operlog/export",{
+    ...queryParams.value,
+  }, `config_${new Date().getTime()}.xlsx`);
+}
+
+getList();
+</script>
diff --git a/src/views/monitor/server/index.vue b/src/views/monitor/server/index.vue
new file mode 100644
index 0000000..a1178b1
--- /dev/null
+++ b/src/views/monitor/server/index.vue
@@ -0,0 +1,187 @@
+<template>
+  <div class="app-container">
+    <el-row>
+      <el-col :span="12" class="card-box">
+        <el-card>
+          <template #header><Cpu style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">CPU</span></template>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%;">
+              <thead>
+                <tr>
+                  <th class="el-table__cell is-leaf"><div class="cell">属性</div></th>
+                  <th class="el-table__cell is-leaf"><div class="cell">值</div></th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">核心数</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.cpuNum }}</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">用户使用率</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.used }}%</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">系统使用率</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.sys }}%</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">当前空闲率</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.free }}%</div></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="12" class="card-box">
+        <el-card>
+          <template #header><Tickets style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">内存</span></template>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%;">
+              <thead>
+                <tr>
+                  <th class="el-table__cell is-leaf"><div class="cell">属性</div></th>
+                  <th class="el-table__cell is-leaf"><div class="cell">内存</div></th>
+                  <th class="el-table__cell is-leaf"><div class="cell">JVM</div></th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">总内存</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.total }}G</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.total }}M</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">已用内存</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.used}}G</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.used}}M</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">剩余内存</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.free }}G</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.free }}M</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">使用率</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem" :class="{'text-danger': server.mem.usage > 80}">{{ server.mem.usage }}%</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm" :class="{'text-danger': server.jvm.usage > 80}">{{ server.jvm.usage }}%</div></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="24" class="card-box">
+        <el-card>
+          <template #header><Monitor style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">服务器信息</span></template>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%;">
+              <tbody>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">服务器名称</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.computerName }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">操作系统</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.osName }}</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">服务器IP</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.computerIp }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">系统架构</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.osArch }}</div></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="24" class="card-box">
+        <el-card>
+          <template #header><CoffeeCup style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">Java虚拟机信息</span></template>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%;table-layout:fixed;">
+              <tbody>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">Java名称</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.name }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">Java版本</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.version }}</div></td>
+                </tr>
+                <tr>
+                  <td class="el-table__cell is-leaf"><div class="cell">启动时间</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.startTime }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">运行时长</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.runTime }}</div></td>
+                </tr>
+                <tr>
+                  <td colspan="1" class="el-table__cell is-leaf"><div class="cell">安装路径</div></td>
+                  <td colspan="3" class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.home }}</div></td>
+                </tr>
+                <tr>
+                  <td colspan="1" class="el-table__cell is-leaf"><div class="cell">项目路径</div></td>
+                  <td colspan="3" class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.userDir }}</div></td>
+                </tr>
+                <tr>
+                  <td colspan="1" class="el-table__cell is-leaf"><div class="cell">运行参数</div></td>
+                  <td colspan="3" class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.inputArgs }}</div></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="24" class="card-box">
+        <el-card>
+          <template #header><MessageBox style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">磁盘状态</span></template>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%;">
+              <thead>
+                <tr>
+                  <th class="el-table__cell el-table__cell is-leaf"><div class="cell">盘符路径</div></th>
+                  <th class="el-table__cell is-leaf"><div class="cell">文件系统</div></th>
+                  <th class="el-table__cell is-leaf"><div class="cell">盘符类型</div></th>
+                  <th class="el-table__cell is-leaf"><div class="cell">总大小</div></th>
+                  <th class="el-table__cell is-leaf"><div class="cell">可用大小</div></th>
+                  <th class="el-table__cell is-leaf"><div class="cell">已用大小</div></th>
+                  <th class="el-table__cell is-leaf"><div class="cell">已用百分比</div></th>
+                </tr>
+              </thead>
+              <tbody v-if="server.sysFiles">
+                <tr v-for="(sysFile, index) in server.sysFiles" :key="index">
+                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.dirName }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.sysTypeName }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.typeName }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.total }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.free }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.used }}</div></td>
+                  <td class="el-table__cell is-leaf"><div class="cell" :class="{'text-danger': sysFile.usage > 80}">{{ sysFile.usage }}%</div></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { getServer } from '@/api/monitor/server'
+
+const server = ref([]);
+const { proxy } = getCurrentInstance();
+
+function getList() {
+  proxy.$modal.loading("正在加载服务监控数据，请稍候！");
+  getServer().then(response => {
+    server.value = response.data;
+    proxy.$modal.closeLoading();
+  });
+}
+
+getList();
+</script>
diff --git a/src/views/plan/index.vue b/src/views/plan/index.vue
new file mode 100644
index 0000000..3eda1d2
--- /dev/null
+++ b/src/views/plan/index.vue
@@ -0,0 +1,307 @@
+<template>
+    <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+        <el-form-item label="品牌方id" prop="breweryId">
+          <el-input
+            v-model="queryParams.breweryId"
+            placeholder="请输入品牌方id"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="方案名" prop="planName">
+          <el-input
+            v-model="queryParams.planName"
+            placeholder="请输入方案名"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="可领取用户数量" prop="receivedUserCount">
+          <el-input
+            v-model="queryParams.receivedUserCount"
+            placeholder="请输入可领取用户数量"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="每用户可领取啤酒币数量" prop="receivedCoinCount">
+          <el-input
+            v-model="queryParams.receivedCoinCount"
+            placeholder="请输入每用户可领取啤酒币数量"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="有效天数" prop="effectiveDays">
+          <el-input
+            v-model="queryParams.effectiveDays"
+            placeholder="请输入有效天数"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="每日领取次数" prop="receiveTimes">
+          <el-input
+            v-model="queryParams.receiveTimes"
+            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="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+  
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button
+            type="primary"
+            plain
+            icon="Plus"
+            @click="handleAdd"
+            v-hasPermi="['brewery:plan:add']"
+          >新增</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button
+            type="success"
+            plain
+            icon="Edit"
+            :disabled="single"
+            @click="handleUpdate"
+            v-hasPermi="['brewery:plan:edit']"
+          >修改</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button
+            type="danger"
+            plain
+            icon="Delete"
+            :disabled="multiple"
+            @click="handleDelete"
+            v-hasPermi="['brewery:plan:remove']"
+          >删除</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button
+            type="warning"
+            plain
+            icon="Download"
+            @click="handleExport"
+            v-hasPermi="['brewery:plan:export']"
+          >导出</el-button>
+        </el-col>
+        <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+  
+      <el-table v-loading="loading" :data="planList" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column label="${comment}" align="center" prop="id" />
+        <el-table-column label="品牌方id" align="center" prop="breweryId" />
+        <el-table-column label="方案名" align="center" prop="planName" />
+        <el-table-column label="可领取用户数量" align="center" prop="receivedUserCount" />
+        <el-table-column label="每用户可领取啤酒币数量" align="center" prop="receivedCoinCount" />
+        <el-table-column label="有效天数" align="center" prop="effectiveDays" />
+        <el-table-column label="每日领取次数" align="center" prop="receiveTimes" />
+        <el-table-column label="备注" align="center" prop="remark" />
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+          <template #default="scope">
+            <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['brewery:plan:edit']">修改</el-button>
+            <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['brewery:plan:remove']">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      
+      <pagination
+        v-show="total>0"
+        :total="total"
+        v-model:page="queryParams.pageNum"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
+      />
+  
+      <!-- 添加或修改啤酒币方案对话框 -->
+      <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+        <el-form ref="planRef" :model="form" :rules="rules" label-width="80px">
+          <el-form-item label="品牌方id" prop="breweryId">
+            <el-input v-model="form.breweryId" placeholder="请输入品牌方id" />
+          </el-form-item>
+          <el-form-item label="方案名" prop="planName">
+            <el-input v-model="form.planName" placeholder="请输入方案名" />
+          </el-form-item>
+          <el-form-item label="可领取用户数量" prop="receivedUserCount">
+            <el-input v-model="form.receivedUserCount" placeholder="请输入可领取用户数量" />
+          </el-form-item>
+          <el-form-item label="每用户可领取啤酒币数量" prop="receivedCoinCount">
+            <el-input v-model="form.receivedCoinCount" placeholder="请输入每用户可领取啤酒币数量" />
+          </el-form-item>
+          <el-form-item label="有效天数" prop="effectiveDays">
+            <el-input v-model="form.effectiveDays" placeholder="请输入有效天数" />
+          </el-form-item>
+          <el-form-item label="每日领取次数" prop="receiveTimes">
+            <el-input v-model="form.receiveTimes" placeholder="请输入每日领取次数" />
+          </el-form-item>
+          <el-form-item label="备注" prop="remark">
+            <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+          </el-form-item>
+        </el-form>
+        <template #footer>
+          <div class="dialog-footer">
+            <el-button type="primary" @click="submitForm">确 定</el-button>
+            <el-button @click="cancel">取 消</el-button>
+          </div>
+        </template>
+      </el-dialog>
+    </div>
+  </template>
+  
+  <script setup name="Plan">
+  import { listPlan, getPlan, delPlan, addPlan, updatePlan } from "@/api/brewery/plan";
+  
+  const { proxy } = getCurrentInstance();
+  
+  const planList = ref([]);
+  const open = ref(false);
+  const loading = ref(true);
+  const showSearch = ref(true);
+  const ids = ref([]);
+  const single = ref(true);
+  const multiple = ref(true);
+  const total = ref(0);
+  const title = ref("");
+  
+  const data = reactive({
+    form: {},
+    queryParams: {
+      pageNum: 1,
+      pageSize: 10,
+      breweryId: null,
+      planName: null,
+      receivedUserCount: null,
+      receivedCoinCount: null,
+      effectiveDays: null,
+      receiveTimes: null,
+    },
+    rules: {
+    }
+  });
+  
+  const { queryParams, form, rules } = toRefs(data);
+  
+  /** 查询啤酒币方案列表 */
+  function getList() {
+    loading.value = true;
+    listPlan(queryParams.value).then(response => {
+      planList.value = response.rows;
+      total.value = response.total;
+      loading.value = false;
+    });
+  }
+  
+  // 取消按钮
+  function cancel() {
+    open.value = false;
+    reset();
+  }
+  
+  // 表单重置
+  function reset() {
+    form.value = {
+      id: null,
+      breweryId: null,
+      planName: null,
+      receivedUserCount: null,
+      receivedCoinCount: null,
+      effectiveDays: null,
+      receiveTimes: null,
+      createBy: null,
+      createTime: null,
+      updateBy: null,
+      updateTime: null,
+      remark: null
+    };
+    proxy.resetForm("planRef");
+  }
+  
+  /** 搜索按钮操作 */
+  function handleQuery() {
+    queryParams.value.pageNum = 1;
+    getList();
+  }
+  
+  /** 重置按钮操作 */
+  function resetQuery() {
+    proxy.resetForm("queryRef");
+    handleQuery();
+  }
+  
+  // 多选框选中数据
+  function handleSelectionChange(selection) {
+    ids.value = selection.map(item => item.id);
+    single.value = selection.length != 1;
+    multiple.value = !selection.length;
+  }
+  
+  /** 新增按钮操作 */
+  function handleAdd() {
+    reset();
+    open.value = true;
+    title.value = "添加啤酒币方案";
+  }
+  
+  /** 修改按钮操作 */
+  function handleUpdate(row) {
+    reset();
+    const _id = row.id || ids.value
+    getPlan(_id).then(response => {
+      form.value = response.data;
+      open.value = true;
+      title.value = "修改啤酒币方案";
+    });
+  }
+  
+  /** 提交按钮 */
+  function submitForm() {
+    proxy.$refs["planRef"].validate(valid => {
+      if (valid) {
+        if (form.value.id != null) {
+          updatePlan(form.value).then(response => {
+            proxy.$modal.msgSuccess("修改成功");
+            open.value = false;
+            getList();
+          });
+        } else {
+          addPlan(form.value).then(response => {
+            proxy.$modal.msgSuccess("新增成功");
+            open.value = false;
+            getList();
+          });
+        }
+      }
+    });
+  }
+  
+  /** 删除按钮操作 */
+  function handleDelete(row) {
+    const _ids = row.id || ids.value;
+    proxy.$modal.confirm('是否确认删除啤酒币方案编号为"' + _ids + '"的数据项？').then(function() {
+      return delPlan(_ids);
+    }).then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    }).catch(() => {});
+  }
+  
+  /** 导出按钮操作 */
+  function handleExport() {
+    proxy.download('brewery/plan/export', {
+      ...queryParams.value
+    }, `plan_${new Date().getTime()}.xlsx`)
+  }
+  
+  getList();
+  </script>
+  
\ No newline at end of file
diff --git a/src/views/product/beers/addBeer.vue b/src/views/product/beers/addBeer.vue
new file mode 100644
index 0000000..7e64e10
--- /dev/null
+++ b/src/views/product/beers/addBeer.vue
@@ -0,0 +1,255 @@
+<template>
+  <div class="app-container">
+    <el-form
+      ref="beerRef"
+      :model="form"
+      :rules="rules"
+      label-width="165px"
+      label-suffix="："
+    >
+      <div class="zd-card">
+        <h3 class="zd-card-title">酒款信息</h3>
+        <el-row>
+          <el-col :span="7">
+            <el-form-item label="商品海报" prop="cover">
+              <ImageUpload v-model="form.cover" :fileSize="5" :limit="1" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="7">
+            <el-form-item label="鱼眼标" prop="fisheyeLogo">
+              <ImageUpload
+                v-model="form.fisheyeLogo"
+                :fileSize="5"
+                :limit="1"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-form-item label="酒款名称" prop="beerName">
+          <el-input
+            v-model="form.beerName"
+            placeholder="请输入酒款名称"
+            style="width: 400px"
+          />
+        </el-form-item>
+        <el-form-item label="酒款风格" prop="beerStyles">
+          <el-cascader
+            v-model="form.beerStyles"
+            :options="beerStyles"
+            :show-all-levels="false"
+            :props="{
+              label: 'styleName',
+              value: 'styleName',
+              emitPath: false,
+            }"
+            placeholder="请选择酒款风格"
+            style="width: 400px"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item label="酒精度数 ABV" prop="beerAbv">
+          <el-input
+            v-model="form.beerAbv"
+            placeholder="请输入酒精度数"
+            style="width: 400px"
+            oninput="value=value.replace(/[^0-9]/g,'')"
+          />
+        </el-form-item>
+        <el-form-item label="原麦汁浓度 Plato" prop="beerOg">
+          <el-input
+            v-model="form.beerOg"
+            placeholder="请输入原麦汁浓度"
+            style="width: 400px"
+            oninput="value=value.replace(/[^0-9]/g,'')"
+          />
+        </el-form-item>
+        <el-form-item label="苦度值 IBU" prop="beerIbus">
+          <el-input
+            v-model="form.beerIbus"
+            placeholder="请输入苦度值"
+            style="width: 400px"
+            oninput="value=value.replace(/[^0-9]/g,'')"
+          />
+        </el-form-item>
+        <el-form-item label="上市日期" prop="launchDate">
+          <el-date-picker
+            clearable
+            v-model="form.launchDate"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="请选择上市日期"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="产品描述" prop="desc">
+          <el-input
+            v-model="form.desc"
+            type="textarea"
+            maxlength="140"
+            show-word-limit
+            placeholder="请输入产品描述"
+            style="width: 400px"
+            :autosize="{ minRows: 4, maxRows: 6 }"
+          />
+        </el-form-item>
+      </div>
+      <div class="zd-card">
+        <h3>酒标签打印配置</h3>
+        <el-form-item label="原料以及辅料" prop="materials">
+          <el-input
+            v-model="form.materials"
+            placeholder="请输入原料以及辅料"
+            style="width: 400px"
+          />
+        </el-form-item>
+        <el-form-item label="保质期" prop="shelfLife">
+          <el-input
+            v-model="form.shelfLife"
+            placeholder="请输入保质期"
+            style="width: 400px"
+            oninput="value=value.replace(/[^0-9]/g,'')"
+          >
+            <template #append>
+              <el-select v-model="shelfLifeUnit" style="width: 80px">
+                <el-option label="天" value="天"></el-option>
+                <el-option label="月" value="月"></el-option>
+                <el-option label="年" value="年"></el-option>
+              </el-select>
+            </template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="条形码" prop="barcode">
+          <el-input
+            v-model="form.barcode"
+            placeholder="请输入条形码"
+            style="width: 400px"
+          />
+        </el-form-item>
+        <el-form-item label="净含量" prop="netContent">
+          <el-input
+            v-model="form.netContent"
+            placeholder="请输入净含量"
+            style="width: 400px"
+            oninput="value=value.replace(/[^0-9]/g,'')"
+          >
+            <template #append>
+              <el-select v-model="netContentUnit" style="width: 80px">
+                <el-option label="L" value="L"></el-option>
+                <el-option label="ML" value="ML"></el-option>
+              </el-select> </template
+          ></el-input>
+        </el-form-item>
+      </div>
+      <div class="zd-card">
+        <h3>营销策略</h3>
+        <el-form-item label="市售状态" prop="onSale">
+          <el-radio-group v-model="form.onSale">
+            <el-radio :value="1">在售款</el-radio>
+            <el-radio :value="0">已停产</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="门店指导价" prop="marketPrice">
+          <el-input
+            v-model="form.marketPrice"
+            placeholder="请输入门店指导价"
+            style="width: 400px"
+          />
+        </el-form-item>
+        <el-form-item label="市售规格" prop="specs">
+          <!-- <el-input v-model="form.specs" placeholder="请输入规格" /> -->
+          <el-radio-group v-model="form.specs">
+            <el-radio value="桶装">桶装</el-radio>
+            <el-radio value="罐装">罐装</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="扫码啤酒币赠送数量" prop="scanCoinCount">
+          <el-input
+            v-model="form.scanCoinCount"
+            type="number"
+            min="0"
+            max="9999"
+            placeholder="请填写整数（必填）"
+            style="width: 400px"
+          />
+        </el-form-item>
+        <el-form-item label="写酒评赠送数量" prop="firstReviewCoin">
+          <el-input
+            v-model="form.firstReviewCoin"
+            type="number"
+            min="0"
+            max="9999"
+            placeholder="请填写整数（选填）"
+            style="width: 400px"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <div class="btn-container">
+      <el-button type="primary" @click="handleSubmit">提交</el-button>
+      <el-button @click="handleCancle">取消</el-button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { addBeer, styleList } from "@/api/brewery/beer";
+import { getCurrentInstance } from "vue";
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+const beerStyles = ref();
+const form = ref({
+  specs: "桶装",
+  onSale: 1,
+  scanCoinCount: 0,
+  firstReviewCoin: 0,
+  cover: "",
+  beerName: "",
+  beerStyles: "",
+});
+const netContentUnit = ref("L");
+const shelfLifeUnit = ref("天");
+const rules = {
+  beerName: [{ required: true, message: "请输入啤酒名称", trigger: "blur" }],
+  launchDate: [
+    { required: true, message: "请选择上市日期", trigger: "change" },
+  ],
+  scanCoinCount: [
+    { required: true, message: "请输入扫码啤酒币赠送数量", trigger: "blur" },
+  ],
+  cover: [{ required: true, message: "请上传封面图", trigger: "change" }],
+
+  beerStyles: [
+    { required: true, message: "请选择啤酒风格", trigger: "change" },
+  ],
+};
+function handleSubmit() {
+  proxy.$refs["beerRef"].validate((valid) => {
+    if (valid) {
+      form.value.netContent += netContentUnit.value;
+      form.value.shelfLife += shelfLifeUnit.value;
+      addBeer(form.value).then(() => {
+        proxy.$message.success("提交成功");
+        router.push("/product/beers");
+      });
+    }
+  });
+}
+function handleCancle() {
+  router.push("/product/beers");
+}
+// 获取酒款风格列表
+function getBeerStyles() {
+  styleList().then((res) => {
+    console.log(res);
+    beerStyles.value = res.data;
+  });
+}
+getBeerStyles();
+</script>
+
+<style scoped lang="scss">
+.btn-container {
+  text-align: center;
+}
+</style>
diff --git a/src/views/product/beers/beerInfo.vue b/src/views/product/beers/beerInfo.vue
new file mode 100644
index 0000000..9bb9d5f
--- /dev/null
+++ b/src/views/product/beers/beerInfo.vue
@@ -0,0 +1,652 @@
+<template>
+  <div class="app-container">
+    <div
+      style="
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 16px;
+      "
+    >
+      <div>
+        <span>酒款管理</span><span>-查看详情（{{ beer.beerName }}）</span>
+      </div>
+      <div>
+        <el-button
+          type="primary"
+          @click="handleAdd"
+          v-hasPermi="['brewery:beer:add']"
+          >新增酒款</el-button
+        >
+        <el-button type="primary" @click="handlePrintSetting"
+          >打印模版配置</el-button
+        >
+      </div>
+    </div>
+    <div class="container">
+      <div class="div1 zd-card">
+        <h4>酒款信息</h4>
+        <el-descriptions column="1" label-width="110px">
+          <el-descriptions-item label="商品海报：">
+            <el-image
+              style="width: 60px; height: 60px; margin-right: 20px"
+              :src="beer.cover"
+              :zoom-rate="1.2"
+              :max-scale="7"
+              :min-scale="0.2"
+              :preview-src-list="[beer.cover]"
+              :initial-index="4"
+              fit="cover"
+              title="点击查看大图"
+              preview-teleported
+            />
+            <el-image
+              v-if="beer.fisheyeLogo"
+              style="width: 60px; height: 60px"
+              :src="beer.fisheyeLogo"
+              :zoom-rate="1.2"
+              :max-scale="7"
+              :min-scale="0.2"
+              :preview-src-list="[beer.fisheyeLogo]"
+              :initial-index="4"
+              fit="cover"
+              title="点击查看大图"
+              preview-teleported
+            />
+          </el-descriptions-item>
+          <el-descriptions-item label="酒款名称：">{{
+            beer.beerName
+          }}</el-descriptions-item>
+          <el-descriptions-item label="酒款风格：">{{
+            beer.beerStyles
+          }}</el-descriptions-item>
+          <el-descriptions-item label="酒精度数 ABV：">
+            {{ beer.beerAbv }}
+          </el-descriptions-item>
+          <el-descriptions-item label="原麦汁浓度：">
+            {{ beer.beerOg }}
+          </el-descriptions-item>
+          <el-descriptions-item label="苦度值 IBU：">{{
+            beer.beerIbus
+          }}</el-descriptions-item>
+          <el-descriptions-item label="条形码：">{{
+            beer.barcode
+          }}</el-descriptions-item>
+          <el-descriptions-item label="初上市日期：">{{
+            beer.launchDate
+          }}</el-descriptions-item>
+          <el-descriptions-item label="产品描述：">
+            {{ beer.desc }}
+          </el-descriptions-item>
+        </el-descriptions>
+        <div style="display: flex; justify-content: flex-end">
+          <el-button type="primary" @click="handleEditInfo">编辑</el-button>
+        </div>
+      </div>
+      <div class="div2 zd-card">
+        <h4>营销策略</h4>
+        <el-descriptions column="1" label-width="140px">
+          <el-descriptions-item label="市售状态：">{{
+            beer.onSale == 1 ? "在售款" : "已停产"
+          }}</el-descriptions-item>
+          <el-descriptions-item label="门店指导价：">{{
+            beer.marketPrice
+          }}</el-descriptions-item>
+          <el-descriptions-item label="市售规格：">
+            {{ beer.specs }}
+          </el-descriptions-item>
+          <el-descriptions-item label="扫码啤酒币赠送数量：">
+            {{ beer.scanCoinCount }}
+          </el-descriptions-item>
+          <el-descriptions-item label="写酒评赠送数量：">{{
+            beer.firstReviewCoin
+          }}</el-descriptions-item>
+        </el-descriptions>
+        <div style="display: flex; justify-content: flex-end">
+          <el-button type="primary" @click="handleEditSale">编辑</el-button>
+        </div>
+      </div>
+      <div class="div3 zd-card">
+        <h4>酒标签打印配置</h4>
+        <el-descriptions column="1" label-width="100px">
+          <el-descriptions-item label="原料以及辅料：">{{
+            beer.materials || "--"
+          }}</el-descriptions-item>
+          <el-descriptions-item label="保质期：">{{
+            beer.shelfLife || "--"
+          }}</el-descriptions-item>
+          <el-descriptions-item label="条形码：">
+            {{ beer.barcode }}
+          </el-descriptions-item>
+          <el-descriptions-item label="净含量：">
+            {{ beer.netContent || "--" }}
+          </el-descriptions-item>
+        </el-descriptions>
+        <!-- <div style="display: flex; justify-content: flex-end">
+          <el-button type="primary" @click="handleEditInfo">预览</el-button>
+        </div> -->
+      </div>
+      <div class="div4 zd-card">
+        <h4>进行中活动</h4>
+        <el-table :data="activityList" class="zd-table" style="width: 100%">
+          <el-table-column label="活动ID" prop="id"></el-table-column>
+          <el-table-column
+            label="活动名称"
+            prop="activityName"
+          ></el-table-column>
+          <el-table-column label="活动类型" prop="activityType">
+            <template #default="scope">
+              {{ scope.row.activityType == 1 ? "定向" : "招募" }}
+            </template>
+          </el-table-column>
+          <el-table-column label="开始时间" prop="startDate"></el-table-column>
+          <el-table-column label="结束时间" prop="endDate"></el-table-column>
+          <el-table-column label="操作" width="150px" align="center">
+            <template #default="scope">
+              <el-button type="text" @click="handleActivityDetail(scope.row)"
+                >查看详细</el-button
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination
+          v-show="activityTotal > 0"
+          :total="activityTotal"
+          v-model:page="queryParams.pageNum"
+          v-model:limit="queryParams.pageSize"
+          @pagination="getBeerActivity"
+        />
+      </div>
+      <div class="div5 zd-card">
+        <div
+          style="
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+          "
+        >
+          <h4>批次信息</h4>
+          <!-- <el-date-picker v-model="date" type="date" placeholder="选择日期" /> -->
+        </div>
+        <el-table :data="batchList" class="zd-table" style="width: 100%">
+          <el-table-column
+            label="批次编号"
+            prop="batchSn"
+            show-overflow-tooltip
+          ></el-table-column>
+          <el-table-column
+            label="打印数量"
+            align="center"
+            prop="printCount"
+          ></el-table-column>
+          <el-table-column label="打印日期" align="center" prop="createTime">
+            <template #default="scope">
+              {{ parseTime(scope.row.createTime, "{y}-{m}-{d}") }}
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="产品生产日期"
+            prop="productionDate"
+          ></el-table-column>
+          <el-table-column
+            label="已核销数量"
+            prop="checkCount"
+            align="center"
+          ></el-table-column>
+          <el-table-column label="待核销数量" align="center">
+            <template #default="scope">
+              {{
+                scope.row.printCount -
+                scope.row.checkCount -
+                scope.row.invalidCount
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="已失效数量"
+            prop="invalidCount"
+            align="center"
+          ></el-table-column>
+          <el-table-column label="操作" align="center">
+            <template #default="scope">
+              <el-button type="text" @click="handleBatchDetail(scope.row)"
+                >详情</el-button
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination
+          v-show="batchTotal > 0"
+          :total="batchTotal"
+          v-model:page="queryBatch.pageNum"
+          v-model:limit="queryBatch.pageSize"
+          @pagination="getBeerBatch"
+        />
+      </div>
+    </div>
+    <!-- 批次详情 -->
+    <el-drawer v-model="showDrawer" title="批次详情">
+      <el-descriptions column="1" label-width="100px">
+        <el-descriptions-item label="批次编号：">{{
+          batchInfo.batchSn
+        }}</el-descriptions-item>
+        <el-descriptions-item label="打印数量：">{{
+          batchInfo.printCount
+        }}</el-descriptions-item>
+        <el-descriptions-item label="打印日期：">
+          {{ parseTime(batchInfo.createTime, "{y}-{m}-{d}") }}
+        </el-descriptions-item>
+        <el-descriptions-item label="产品生产日期：">
+          {{ batchInfo.productionDate }}
+        </el-descriptions-item>
+        <el-descriptions-item label="已核销数量：">
+          {{ batchInfo.checkCount || 0 }}
+        </el-descriptions-item>
+        <el-descriptions-item label="待核销数量：">
+          {{
+            batchInfo.printCount - batchInfo.checkCount - batchInfo.invalidCount
+          }}
+        </el-descriptions-item>
+        <el-descriptions-item label="已失效数量：">
+          {{ batchInfo.invalidCount || 0 }}
+        </el-descriptions-item>
+      </el-descriptions>
+      <!-- <div
+        style="
+          display: flex;
+          justify-content: flex-end;
+          align-items: center;
+          margin-bottom: 16px;
+        "
+      >
+        核销状态：
+        <el-select v-model="selectStatus" style="width: 100px">
+          <el-option label="待核销" value="1"></el-option>
+          <el-option label="已核销" value="2"></el-option>
+          <el-option label="已失效" value="3"></el-option>
+        </el-select>
+      </div> -->
+
+      <el-table
+        :data="batchInfo.wyBeerQrcodeList"
+        class="zd-table"
+        style="width: 100%"
+      >
+        <el-table-column label="条码ID" prop="skuSn"></el-table-column>
+        <el-table-column label="二维码图片" prop="qrcodeUrl" width="150px">
+          <template #default="scope">
+            <el-image
+              style="width: 60px; height: 60px"
+              :src="scope.row.qrcodeUrl"
+              :zoom-rate="1.2"
+              :max-scale="7"
+              :min-scale="0.2"
+              :preview-src-list="[scope.row.qrcodeUrl]"
+              :initial-index="4"
+              fit="cover"
+              title="点击查看大图"
+              preview-teleported
+            />
+          </template>
+        </el-table-column>
+        <el-table-column label="核销状态" width="100px">
+          <template #default="scope">
+            <el-tag type="success" v-if="scope.row.qrcodeStatus === 1"
+              >已核销</el-tag
+            >
+            <el-tag type="warning" v-else-if="scope.row.qrcodeStatus === 0"
+              >未核销</el-tag
+            >
+            <el-tag type="info" v-else-if="scope.row.qrcodeStatus === 2"
+              >已失效</el-tag
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-drawer>
+    <el-dialog title="编辑酒款信息" v-model="open" width="800px" append-to-body>
+      <el-form ref="beerRef" :model="form" :rules="rules" label-width="90px">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="商品海报" prop="cover">
+              <ImageUpload v-model="form.cover" :fileSize="5" :limit="1" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="鱼眼标" prop="fisheyeLogo">
+              <ImageUpload
+                v-model="form.fisheyeLogo"
+                :fileSize="5"
+                :limit="1"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="啤酒名称" prop="beerName">
+              <el-input v-model="form.beerName" placeholder="请输入啤酒名称" />
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="12">
+            <el-form-item label="啤酒编码" prop="beerSn">
+              <el-input v-model="form.beerSn" placeholder="请输入啤酒编码" />
+            </el-form-item>
+          </el-col> -->
+          <el-col :span="12">
+            <el-form-item label="啤酒风格" prop="beerStyles">
+              <el-cascader
+                v-model="form.beerStyles"
+                :options="beerStyles"
+                :show-all-levels="false"
+                :props="{
+                  label: 'styleName',
+                  value: 'styleName',
+                  emitPath: false,
+                }"
+                placeholder="请选择酒款风格"
+                style="width: 400px"
+                clearable
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="酒精度" prop="beerAbv">
+              <el-input
+                v-model="form.beerAbv"
+                placeholder="请输入酒精度"
+                oninput="value=value.replace(/[^0-9]/g,'')"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="原麦汁浓度" prop="beerOg">
+              <el-input
+                v-model="form.beerOg"
+                placeholder="请输入原麦汁浓度"
+                oninput="value=value.replace(/[^0-9]/g,'')"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="苦度值" prop="beerIbus">
+              <el-input
+                v-model="form.beerIbus"
+                placeholder="请输入苦度值"
+                oninput="value=value.replace(/[^0-9]/g,'')"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="条形码" prop="barcode">
+              <el-input v-model="form.barcode" placeholder="请输入条形码" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="上市日期" prop="launchDate">
+              <el-date-picker
+                clearable
+                v-model="form.launchDate"
+                type="date"
+                value-format="YYYY-MM-DD"
+                placeholder="请选择上市日期"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-form-item label="产品描述" prop="desc">
+            <el-input
+              v-model="form.desc"
+              type="textarea"
+              maxlength="140"
+              show-word-limit
+              placeholder="请输入产品描述"
+              style="width: 680px"
+              :autosize="{ minRows: 4, maxRows: 6 }"
+            />
+          </el-form-item>
+        </el-row>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancelEdit">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!-- 编辑营销信息 -->
+    <el-dialog
+      title="编辑营销信息"
+      v-model="openSale"
+      width="500px"
+      append-to-body
+    >
+      <el-form ref="beerRef" :model="form" :rules="rules" label-width="140px">
+        <el-form-item label="上架状态" prop="onSale">
+          <el-radio-group v-model="form.onSale">
+            <el-radio :label="1">在售款</el-radio>
+            <el-radio :label="0">已停产</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="市场价" prop="marketPrice">
+          <el-input v-model="form.marketPrice" placeholder="请输入市场价" />
+        </el-form-item>
+        <el-form-item label="规格" prop="specs">
+          <el-radio-group v-model="form.specs">
+            <el-radio label="桶装">桶装</el-radio>
+            <el-radio label="罐装">罐装</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="扫码啤酒币赠送数量" prop="scanCoinCount">
+          <el-input
+            v-model="form.scanCoinCount"
+            type="number"
+            min="0"
+            max="9999"
+            placeholder="请填写整数（必填）"
+            style="width: 880px"
+          />
+        </el-form-item>
+        <el-form-item label="写酒评赠送数量" prop="firstReviewCoin">
+          <el-input
+            v-model="form.firstReviewCoin"
+            type="number"
+            min="0"
+            max="9999"
+            placeholder="请填写整数（选添）"
+            style="width: 880px"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancelEdit">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import {
+  getBeer,
+  delBeer,
+  updateBeer,
+  updateBeerIcons,
+  updateBeerSaleStatus,
+  activityListByBeerId,
+  batchListByBeerId,
+  styleList,
+} from "@/api/brewery/beer";
+import { getBatch } from "@/api/brewery/batch";
+import { onMounted, ref } from "vue";
+import { useRoute, useRouter } from "vue-router";
+
+const route = useRoute();
+const router = useRouter();
+const beerId = ref("");
+const beer = ref({});
+// 获取酒款风格列表
+function getBeerStyles() {
+  styleList().then((res) => {
+    console.log(res);
+    beerStyles.value = res.data;
+  });
+}
+
+onMounted(() => {
+  beerId.value = route.query.id;
+  queryParams.value.beerId = beerId.value;
+  queryBatch.value.beerId = beerId.value;
+  getBeerStyles();
+  getBeerInfo();
+  getBeerBatch();
+  getBeerActivity();
+});
+// 获取酒款活动信息
+const activityList = ref([]);
+const activityTotal = ref(0);
+const queryParams = ref({
+  pageNum: 1,
+  pageSize: 5,
+  beerId: beerId.value,
+});
+function getBeerActivity() {
+  activityListByBeerId(queryParams.value).then((res) => {
+    activityList.value = res.rows;
+    activityTotal.value = res.total;
+  });
+}
+function handleActivityDetail(row) {
+  router.push("/activity/activityInfo?id=" + row.id);
+}
+// 获取酒款批次信息
+const batchList = ref([]);
+const batchTotal = ref(0);
+const queryBatch = ref({
+  pageNum: 1,
+  pageSize: 5,
+  beerId: beerId.value,
+});
+function getBeerBatch() {
+  batchListByBeerId(queryBatch.value).then((res) => {
+    batchList.value = res.rows;
+    batchTotal.value = res.total;
+  });
+}
+// 获取酒款信息
+function getBeerInfo() {
+  getBeer(beerId.value).then((res) => {
+    beer.value = res.data;
+  });
+}
+function handleAdd() {
+  router.push("/product/addBeer");
+}
+// 打印模版配置
+function handlePrintSetting() {
+  router.push("/setting/print");
+}
+
+// 编辑酒款信息
+const open = ref(false);
+const form = ref({});
+const rules = ref({});
+const beerStyles = ref([]);
+function handleEditInfo() {
+  form.value = {
+    ...beer.value,
+  };
+  open.value = true;
+}
+function cancelEdit() {
+  open.value = false;
+  openSale.value = false;
+  form.value = {};
+}
+function submitForm() {
+  const params = {
+    ...form.value,
+  };
+  updateBeer(params).then(() => {
+    open.value = false;
+    openSale.value = false;
+    getBeerInfo();
+  });
+}
+// 编辑营销信息
+const openSale = ref(false);
+function handleEditSale() {
+  openSale.value = true;
+  form.value = {
+    ...beer.value,
+  };
+}
+// 编辑商品图标
+// 批次详情
+const showDrawer = ref(false);
+const batchInfo = ref({});
+const selectStatus = ref(1); // 1待核销 2已核销 3已失效
+function handleBatchDetail(row) {
+  getBatch(row.id).then((res) => {
+    showDrawer.value = true;
+    batchInfo.value = res.data;
+  });
+}
+</script>
+
+<style scoped lang="scss">
+// .container {
+//   display: grid;
+//   grid-template-columns: repeat(2, 1fr);
+//   grid-template-rows: repeat(4, 1fr);
+//   grid-column-gap: 14px;
+//   grid-row-gap: 0px;
+// }
+.container {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  grid-template-rows: auto auto auto auto;
+  grid-column-gap: 14px;
+  grid-template-areas:
+    "div1 div2"
+    "div1 div3"
+    "div4 div4"
+    "div5 div5";
+}
+
+.div1 {
+  grid-area: div1;
+}
+
+.div2 {
+  grid-area: div2;
+}
+
+.div3 {
+  grid-area: div3;
+}
+
+.div4 {
+  grid-area: div4;
+}
+
+.div5 {
+  grid-area: div5;
+}
+.card {
+  background-color: #fff;
+  border-radius: 4px;
+}
+</style>
diff --git a/src/views/product/beers/index.vue b/src/views/product/beers/index.vue
new file mode 100644
index 0000000..929ccd5
--- /dev/null
+++ b/src/views/product/beers/index.vue
@@ -0,0 +1,1213 @@
+<template>
+  <div class="app-container">
+    <div
+      style="
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 16px;
+      "
+    >
+      <span>酒款管理</span>
+      <el-button
+        type="primary"
+        @click="handleAdd"
+        v-hasPermi="['brewery:beer:add']"
+        >新增酒款</el-button
+      >
+    </div>
+    <!-- <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="商品名称" prop="beerName">
+        <el-input
+          v-model="queryParams.beerName"
+          placeholder="请输入商品名称"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="商品编码" prop="beerSn">
+        <el-input
+          v-model="queryParams.beerSn"
+          placeholder="请输入商品编码"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="酒款风格" prop="beerStyles">
+        <el-select
+          v-model="queryParams.beerStyles"
+          placeholder="请选择酒款风格"
+          clearable
+          style="width: 150px"
+        >
+          <el-option
+            v-for="style in beerStyles"
+            :key="style.value"
+            :label="style.name"
+            :value="style.value"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="市售状态" prop="onSale">
+        <el-select
+          v-model="queryParams.onSale"
+          placeholder="请选择状态"
+          clearable
+          style="width: 150px"
+        >
+          <el-option label="在售款" :value="1"></el-option>
+          <el-option label="已停产" :value="0"></el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="上市日期" prop="launchDate">
+        <el-date-picker
+          clearable
+          v-model="queryParams.launchDate"
+          type="date"
+          value-format="YYYY-MM-DD"
+          placeholder="请选择上市日期"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form> -->
+
+    <!-- <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="handleAdd"
+          v-hasPermi="['brewery:beer:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['brewery:beer:edit']"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['brewery:beer:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:beer:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row> -->
+
+    <el-table
+      v-loading="loading"
+      :data="beerList"
+      @selection-change="handleSelectionChange"
+      class="zd-table"
+    >
+      <!-- <el-table-column type="selection" width="55" align="center" /> -->
+      <el-table-column label="酒款ID" align="center" prop="id" />
+      <!-- <el-table-column label="品牌方id" align="center" prop="breweryId" /> -->
+      <el-table-column label="酒款图片" align="center" prop="cover" width="90">
+        <template #default="scope">
+          <el-image
+            style="width: 60px; height: 60px"
+            :src="scope.row.cover"
+            :zoom-rate="1.2"
+            :max-scale="7"
+            :min-scale="0.2"
+            :preview-src-list="[scope.row.cover]"
+            :initial-index="4"
+            fit="cover"
+            title="点击查看大图"
+            preview-teleported
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="酒款名称"
+        align="center"
+        prop="beerName"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="啤酒风格"
+        align="center"
+        prop="beerStyles"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="近30天核销桶数"
+        align="center"
+        prop="scanCount"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="参与中活动数量"
+        align="center"
+        show-overflow-tooltip
+        prop="activityCount"
+      />
+      <!-- <el-table-column
+        label="品牌logo"
+        align="center"
+        prop="brandLogo"
+        width="90"
+      >
+        <template #default="scope">
+          <el-image
+            style="width: 60px; height: 60px"
+            :src="scope.row.brandLogo"
+            :zoom-rate="1.2"
+            :max-scale="7"
+            :min-scale="0.2"
+            :preview-src-list="[scope.row.brandLogo]"
+            :initial-index="4"
+            fit="cover"
+            title="点击查看大图"
+            preview-teleported
+          />
+        </template>
+      </el-table-column> -->
+      <!-- <el-table-column
+        label="酒款编码"
+        align="center"
+        prop="beerSn"
+        show-overflow-tooltip
+      /> -->
+
+      <!-- <el-table-column
+        label="酒精度"
+        align="center"
+        prop="beerAbv"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="苦度值"
+        align="center"
+        prop="beerIbus"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="产品条形码"
+        align="center"
+        prop="barcode"
+        show-overflow-tooltip
+        width="120"
+      /> -->
+      <!-- <el-table-column label="市售状态" align="center" prop="onSale">
+        <template #default="scope">
+          <el-tag v-if="scope.row.onSale === 1" type="success"> 在售款</el-tag>
+          <el-tag v-else type="danger"> 已停产</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="审核状态" align="center" prop="approval">
+        <template #default="scope">
+          <el-tag v-if="scope.row.approval === 1" type="success"> 通过</el-tag>
+          <el-tag v-else-if="scope.row.approval === 2" type="danger"> 拒绝</el-tag>
+          <el-tag v-else type="info"> 待审核</el-tag>
+        </template>
+      </el-table-column> -->
+      <!-- <el-table-column
+        label="原麦汁浓度"
+        align="center"
+        prop="beerOg"
+        width="100"
+      /> -->
+      <!-- <el-table-column
+        label="市场零售价"
+        align="center"
+        prop="marketPrice"
+        width="100"
+      /> -->
+      <!-- <el-table-column label="市售规格" align="center" prop="specs" /> -->
+      <!-- <el-table-column label="描述" align="center" prop="desc" /> -->
+      <el-table-column
+        label="扫码领取啤酒币数量"
+        align="center"
+        prop="scanCoinCount"
+        min-width="120"
+      >
+        <template #default="scope">
+          <template v-if="currentScanCoinId === scope.row.id">
+            <el-input
+              v-model="scanCoinCount"
+              type="number"
+              placeholder="请输入数量"
+              style="width: 80px"
+            />
+            <el-button link type="primary" @click="saveScanCoinCount"
+              >保存</el-button
+            >
+            <el-button link @click="cancelScanCoin">取消</el-button>
+          </template>
+          <template v-else>
+            <span>{{ scope.row.scanCoinCount }}</span>
+            <el-icon
+              size="16"
+              class="edit-icon"
+              @click="handleScanCoin(scope.row)"
+              ><EditPen
+            /></el-icon>
+          </template>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column
+        label="上市日期"
+        align="center"
+        prop="launchDate"
+        width="180"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.launchDate, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column> -->
+      <!-- <el-table-column
+        label="审核意见"
+        align="center"
+        prop="approvalReason"
+      ></el-table-column> -->
+      <el-table-column
+        label="写酒评送啤酒币数量"
+        align="center"
+        prop="firstReviewCoin"
+        min-width="120"
+      >
+        <template #default="scope">
+          <template v-if="reviewCoinId === scope.row.id">
+            <el-input
+              v-model="reviewCoinCount"
+              type="number"
+              placeholder="请输入数量"
+              style="width: 80px"
+            />
+            <el-button link type="primary" @click="saveReviewCoinCount"
+              >保存</el-button
+            >
+            <el-button link @click="cancelReviewCoin">取消</el-button>
+          </template>
+          <template v-else>
+            <span>{{ scope.row.firstReviewCoin }}</span>
+            <el-icon
+              size="16"
+              class="edit-icon"
+              @click="handleReviewCoin(scope.row)"
+              ><EditPen
+            /></el-icon>
+          </template>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="酒评分数"
+        align="center"
+        prop="beerOverallRating"
+      ></el-table-column>
+
+      <el-table-column
+        label="操作"
+        align="center"
+        width="300"
+        fixed="right"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['brewery:beer:edit']"
+            >查看详情</el-button
+          >
+          <!-- <el-button
+            link
+            type="primary"
+            @click="handleSaleStatus(scope.row)"
+            v-hasPermi="['brewery:beer:edit']"
+            >{{ scope.row.onSale === 1 ? "下架" : "上架" }}</el-button
+          > -->
+          <el-button
+            link
+            type="primary"
+            @click="handlePrint(scope.row)"
+            v-hasPermi="['brewery:beer:edit']"
+            >打印标签</el-button
+          >
+          <!-- <el-button
+            link
+            type="primary"
+            @click="handleScanCoinCount(scope.row)"
+            v-hasPermi="['brewery:beer:edit']"
+            >啤酒币兑换数量</el-button
+          > -->
+          <!-- <el-button
+            link
+            type="danger"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['brewery:beer:remove']"
+            >删除</el-button
+          > -->
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改啤酒对话框 -->
+    <el-dialog
+      :title="title"
+      v-model="open"
+      width="900px"
+      append-to-body
+      fullscreen
+    >
+      <el-form ref="beerRef" :model="form" :rules="rules" label-width="130px">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="啤酒名称" prop="beerName">
+              <el-input v-model="form.beerName" placeholder="请输入啤酒名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="啤酒编码" prop="beerSn">
+              <el-input v-model="form.beerSn" placeholder="请输入啤酒编码" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="啤酒风格" prop="beerStyles">
+              <el-select v-model="form.beerStyles" placeholder="请选择啤酒风格">
+                <el-option
+                  v-for="style in beerStyles"
+                  :key="style.value"
+                  :label="style.name"
+                  :value="style.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="条码" prop="barcode">
+              <el-input v-model="form.barcode" placeholder="请输入条码" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="酒精度" prop="beerAbv">
+              <el-input v-model="form.beerAbv" placeholder="请输入酒精度" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="苦度值" prop="beerIbus">
+              <el-input v-model="form.beerIbus" placeholder="请输入苦度值" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="原麦汁浓度" prop="beerOg">
+              <el-input v-model="form.beerOg" placeholder="请输入原麦汁浓度" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="规格" prop="specs">
+              <el-input v-model="form.specs" placeholder="请输入规格" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="上架状态" prop="onSale">
+              <el-radio-group v-model="form.onSale">
+                <el-radio :label="1">上架</el-radio>
+                <el-radio :label="0">下架</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="市场价" prop="marketPrice">
+              <el-input v-model="form.marketPrice" placeholder="请输入市场价" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="上市日期" prop="launchDate">
+              <el-date-picker
+                clearable
+                v-model="form.launchDate"
+                type="date"
+                value-format="YYYY-MM-DD"
+                placeholder="请选择上市日期"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="扫码获得啤酒币数" prop="scanCoinCount">
+              <el-input
+                v-model="form.scanCoinCount"
+                type="number"
+                min="1"
+                max="9999"
+                placeholder="请输入扫码获得啤酒币数（范围：1～9999）"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="封面图" prop="cover">
+              <ImageUpload v-model="form.cover" :fileSize="5" :limit="1" />
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="6">
+            <el-form-item label="品牌logo" prop="brandLogo">
+              <ImageUpload v-model="form.brandLogo" :fileSize="5" :limit="1" />
+            </el-form-item>
+          </el-col> -->
+          <el-col :span="12">
+            <el-form-item label="描述" prop="desc">
+              <editor v-model="form.desc" :min-height="250" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!-- 标签打印对话框 -->
+    <el-dialog
+      title="标签打印"
+      v-model="openPrint"
+      width="500px"
+      append-to-body
+      align-center
+    >
+      <el-form
+        ref="tempRef"
+        :model="formPrint"
+        :rules="printRules"
+        label-width="130px"
+      >
+        <el-form-item label="标签模板" prop="templateId">
+          <el-select
+            v-model="formPrint.templateId"
+            placeholder="请选择标签模板"
+            style="width: 280px"
+          >
+            <el-option
+              v-for="template in templateList"
+              :key="template.id"
+              :label="template.templateName"
+              :value="template.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="生产日期" prop="productionDate">
+          <el-date-picker
+            clearable
+            v-model="formPrint.productionDate"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="请选择生产日期"
+            style="width: 280px"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="打印数量" prop="printCount">
+          <el-input
+            v-model="formPrint.printCount"
+            type="number"
+            :min="1"
+            :max="10"
+            placeholder="请输入打印数量（范围：1～10）"
+            style="width: 280px"
+          />
+        </el-form-item>
+        <!-- <el-form-item label="批次号" prop="batchNo">
+          <el-input
+            v-model="formPrint.batchNo"
+            placeholder="请输入批次号"
+            style="width: 280px"
+          />
+        </el-form-item> -->
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer" style="text-align: center">
+          <el-button type="primary" @click="startPrint">开始打印</el-button>
+          <el-button @click="cancelPrint">取消打印</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <el-dialog
+      title="标签打印"
+      v-model="showPrintDialog"
+      width="320px"
+      :append-to-body="false"
+      align-center
+    >
+      <div
+        id="hiprint-printTemplate"
+        style="
+          position: relative;
+          overflow-y: auto;
+          width: 300px;
+          height: 800px;
+        "
+      ></div>
+
+      <template #footer>
+        <div class="dialog-footer" style="text-align: center">
+          <el-button type="primary" @click="myprint2">开始打印</el-button>
+          <el-button @click="cancelPrint2">取消打印</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Beer">
+import {
+  listBeer,
+  getBeer,
+  delBeer,
+  addBeer,
+  updateBeer,
+  updateBeerIcons,
+  updateBeerSaleStatus,
+  updateReviewIcons, // 首评赠送啤酒币
+} from "@/api/brewery/beer";
+import { addBatch, getBatch } from "@/api/brewery/batch";
+import { generateQrcodeByBatch } from "@/api/brewery/qrcode";
+import {
+  allTemplate,
+  getBreweryTagPrintTemplate,
+} from "@/api/brewery/printTemplate";
+import {
+  hiprint,
+  defaultElementTypeProvider,
+  disAutoConnect,
+} from "vue-plugin-hiprint";
+import { ElMessageBox } from "element-plus";
+const { proxy } = getCurrentInstance();
+hiprint.init();
+disAutoConnect();
+const router = useRouter();
+const beerStyles = [
+  { name: "皮尔森（Pristner）", value: "皮尔森（Pristner" },
+  {
+    name: "美式淡拉格（American Light Lager）",
+    value: "美式淡拉格（American Light Lager）",
+  },
+  { name: "烟熏啤酒（Rauchbier）", value: "烟熏啤酒（Rauchbier）" },
+  { name: "德式黑啤（Schwarzbier）", value: "德式黑啤（Schwarzbier）" },
+  { name: "博克（Bock）", value: "博克（Bock）" },
+  { name: "淡色艾尔（Pale Ale）", value: "淡色艾尔（Pale Ale）" },
+  { name: "印度淡色艾尔（IPA）", value: "印度淡色艾尔（IPA）" },
+  { name: "小麦啤酒（Wheat beer）", value: "小麦啤酒（Wheat beer）" },
+  { name: "棕色艾尔（Brown Ale）", value: "棕色艾尔（Brown Ale）" },
+  { name: "波特（Porter）", value: "波特（Porter）" },
+  { name: "司陶特（Stout）", value: "司陶特（Stout）" },
+  { name: "酸啤酒（Sour beer）", value: "酸啤酒（Sour beer）" },
+  { name: "修道院啤酒（Trappist Ale）", value: "修道院啤酒（Trappist Ale）" },
+  { name: "西打酒（Cider）", value: "西打酒（Cider）" },
+  { name: "兰比克（Lambic）", value: "兰比克（Lambic）" },
+];
+const beerList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    beerName: null,
+    cover: null,
+    brandLogo: null,
+    beerSn: null,
+    beerStyles: null,
+    beerAbv: null,
+    beerIbus: null,
+    barcode: null,
+    onSale: null,
+    beerOg: null,
+    marketPrice: null,
+    specs: null,
+    desc: null,
+    scanCoinCount: null,
+    launchDate: null,
+  },
+  rules: {
+    beerName: [{ required: true, message: "请输入啤酒名称", trigger: "blur" }],
+    launchDate: [
+      { required: true, message: "请选择上市日期", trigger: "change" },
+    ],
+    scanCoinCount: [
+      { required: true, message: "请输入扫码获得啤酒币数", trigger: "blur" },
+    ],
+    cover: [{ required: true, message: "请上传封面图", trigger: "change" }],
+    // brandLogo: [
+    //   { required: true, message: "请上传品牌logo", trigger: "change" },
+    // ],
+
+    beerStyles: [
+      { required: true, message: "请选择啤酒风格", trigger: "change" },
+    ],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询啤酒列表 */
+function getList() {
+  loading.value = true;
+  listBeer(queryParams.value).then((response) => {
+    beerList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    beerName: null,
+    cover: null,
+    // brandLogo: null,
+    beerSn: null,
+    beerStyles: null,
+    beerAbv: null,
+    beerIbus: null,
+    barcode: null,
+    onSale: null,
+    beerOg: null,
+    marketPrice: null,
+    specs: null,
+    desc: null,
+    scanCoinCount: null,
+    launchDate: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("beerRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  // reset();
+  // open.value = true;
+  // title.value = "添加啤酒";
+  router.push("/product/addBeer");
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  // reset();
+  // const _id = row.id || ids.value;
+  // getBeer(_id).then((response) => {
+  //   form.value = response.data;
+  //   open.value = true;
+  //   title.value = "修改啤酒";
+  // });
+  router.push("/product/beerInfo?id=" + row.id);
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["beerRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateBeer(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addBeer(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除啤酒编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delBeer(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/beer/export",
+    {
+      ...queryParams.value,
+    },
+    `beer_${new Date().getTime()}.xlsx`
+  );
+}
+// 设置兑换啤酒数
+function handleScanCoinCount(row) {
+  ElMessageBox.prompt("扫码兑换啤酒币个数（范围：1～9999）", "设置", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    inputPattern: /^[1-9][0-9]{0,3}$/,
+    inputErrorMessage: "请输入有效的数字（范围：1～9999）",
+  })
+    .then(({ value }) => {
+      updateBeerIcons({ beerId: row.id, icons: value }).then((response) => {
+        proxy.$modal.msgSuccess("设置成功");
+        getList();
+      });
+    })
+    .catch(() => {
+      console.log("取消");
+    });
+}
+/** 啤酒上架按钮操作 */
+function handleSaleStatus(row) {
+  let str = "";
+  if (row.onSale == 1) {
+    str = "下架";
+  } else {
+    str = "上架";
+  }
+
+  proxy.$modal
+    .confirm("是否确认" + str + '编号为"' + row.id + '"的数据项？')
+    .then(() => {
+      updateBeerSaleStatus({
+        beerId: row.id,
+        state: row.onSale == 1 ? 0 : 1,
+      }).then(() => {
+        getList();
+        proxy.$modal.msgSuccess(`${str}成功`);
+      });
+    })
+    .catch(() => {});
+}
+//========== 扫码送啤酒币 ==========
+const currentScanCoinId = ref(null);
+const scanCoinCount = ref(0);
+function handleScanCoin(row) {
+  currentScanCoinId.value = row.id;
+  scanCoinCount.value = row.scanCoinCount;
+}
+function saveScanCoinCount() {
+  updateBeerIcons({
+    beerId: currentScanCoinId.value,
+    icons: scanCoinCount.value,
+  }).then((response) => {
+    proxy.$modal.msgSuccess("修改成功");
+    scanCoinCount.value = 0;
+    currentScanCoinId.value = null;
+    getList();
+  });
+}
+function cancelScanCoin() {
+  currentScanCoinId.value = null;
+  scanCoinCount.value = 0;
+}
+
+//==========
+
+//========= 首评赠送啤酒币
+const reviewCoinId = ref(null);
+const reviewCoinCount = ref(0);
+function handleReviewCoin(row) {
+  reviewCoinId.value = row.id;
+  reviewCoinCount.value = row.firstReviewCoin;
+}
+function saveReviewCoinCount() {
+  updateReviewIcons({
+    beerId: reviewCoinId.value,
+    icons: reviewCoinCount.value,
+  }).then((response) => {
+    proxy.$modal.msgSuccess("修改成功");
+    reviewCoinCount.value = 0;
+    reviewCoinId.value = null;
+    getList();
+  });
+}
+function cancelReviewCoin() {
+  reviewCoinId.value = null;
+  reviewCoinCount.value = 0;
+}
+//=========
+// 获取所有标签模板
+function getAllTemplate() {
+  allTemplate().then((res) => {
+    templateList.value = res.data;
+  });
+}
+// 标签打印
+const templateList = ref([]); // 标签模板列表
+const printRules = {
+  productionDate: [
+    { required: true, message: "请选择生产日期", trigger: "change" },
+  ],
+  printCount: [{ required: true, message: "请输入打印数量", trigger: "blur" }],
+  batchNo: [{ required: false, message: "请输入批次号", trigger: "blur" }],
+  templateId: [
+    { required: true, message: "请选择标签模板", trigger: "change" },
+  ],
+};
+let hiprintTemplate;
+const currentBeer = ref({});
+const openPrint = ref(false);
+const formPrint = ref({});
+const showPrintDialog = ref(false);
+function handlePrint(row) {
+  openPrint.value = true;
+  currentBeer.value = row;
+}
+// 开始打印
+function startPrint() {
+  proxy.$refs["tempRef"].validate((valid) => {
+    if (valid) {
+      showPrintDialog.value = true;
+      // setTimeout(() => {
+      //   buildDesigner();
+      // }, 500);
+      formPrint.value.beerId = currentBeer.value.id;
+      addBatch(formPrint.value).then((response) => {
+        const batchNo = response.data;
+        generateQrcodeByBatch(batchNo).then((response) => {
+          // proxy.$modal.msgSuccess("生成成功");
+          getBatch(batchNo).then((resBatch) => {
+            let batchInfo = resBatch.data;
+
+            getBreweryTagPrintTemplate(formPrint.value.templateId || 3).then(
+              (res) => {
+                const template = JSON.parse(res.data.elements);
+                console.log(template, template.panels[0].printElements);
+                // printData.value = template.panels[0].printElements;
+                // setTimeout(() => {
+                //   hiprintTemplate.update(template);
+                // }, 500);
+                // hiprint.print({ templates: [template.panels[0].printElements] }, {}, {});
+                // printDataFun(
+                //   template.panels[0].printElements,
+                //   batchInfo,
+                //   res.data.pageWidth,
+                //   res.data.pageHeight
+                // );
+                myPrint(template.panels[0].printElements, batchInfo);
+              }
+            );
+          });
+        });
+      });
+    }
+  });
+}
+function myPrint(dataList, batchInfo) {
+  const printTemplate = document.getElementById("hiprint-printTemplate");
+  // console.log(batchInfo);
+  batchInfo.wyBeerQrcodeList.forEach((it, index) => {
+    let box = document.createElement("div");
+    box.style.position = "relative";
+    box.style.left = 0;
+
+    // 不重叠，得加上高度
+    // 获取box元素的实际高度
+    // 130mm 转换成px
+    let realHeight = (130 * 96) / 25.4;
+    let realWidth = (76 * 96) / 25.4;
+    box.style.top = index * realHeight + "px";
+    box.style.width = realWidth + "px";
+
+    // box.style.top = index * 800 + "px";
+    // box.style.width = "100%";
+    dataList.forEach((item) => {
+      let options = item.options;
+      let value = currentBeer.value[options.field];
+
+      if (options.field == "batchSn") {
+        value = batchInfo.batchSn;
+      } else if (options.field == "productionDate") {
+        value = batchInfo.productionDate;
+      }
+      if (item.printElementType.type == "text") {
+        let el = document.createElement("div");
+        el.innerHTML = options.title + ":" + (value || "");
+
+        el.style.position = "absolute";
+        el.style.left = options.left + "px";
+        el.style.top = options.top + "px";
+        el.style.width = options.width + "px";
+        el.style.height = options.height + "px";
+
+        box.append(el);
+
+        //文本
+      } else if (item.printElementType.type == "barcode") {
+      } else if (item.printElementType.type == "qrcode") {
+        let el = document.createElement("img");
+        el.style.position = "absolute";
+
+        el.src = it.qrcodeUrl;
+        el.style.left = options.left + "px";
+        el.style.top = options.top + "px";
+        el.style.width = options.width + "px";
+        el.style.height = options.height + "px";
+
+        box.append(el);
+      }
+      let userBox = document.createElement("div");
+      userBox.style.position = "absolute";
+      // userBox.style.bottom = 40 + "px";
+      userBox.style.top = 360 + "px";
+      userBox.style.left = 16 + "px";
+      userBox.style.width = "100%";
+      let coustom = document.createElement("div");
+      coustom.innerHTML = `<div style="font-size: 12px;font-weight: bold;margin-bottom: 0px;">枝点酒掌柜</div>
+        <div style="font-size: 10px;margin-bottom: 10px;">BrewPivot</div>
+        <div style="font-size: 10px;margin-bottom: 0px;">手机扫码解锁专属活动！</div>
+        <div style="font-size: 10px;margin-bottom: 0px;">更新酒单、领取啤酒币、享受返利、一扫搞定！</div>
+        <img src="https://ma.zdtap.com/profile/upload/2025/03/12/gh_e063633f8600_258_20250312115041A005.jpg" style="width: 50px;height: 50px;position: absolute;bottom: 0px;right: 20px;">`;
+      userBox.append(coustom);
+      box.append(userBox);
+      printTemplate.append(box);
+    });
+  });
+}
+function myprint2() {
+  const printTemplate = document.getElementById("hiprint-printTemplate");
+  // printTemplate.style.width = '76mm'
+  let newstr = document.getElementById("hiprint-printTemplate").innerHTML;
+  let oldWidth = printTemplate.style.width;
+  let oldstr = document.body.innerHTML;
+  document.body.innerHTML = newstr;
+  // document.style.width = "76mm";
+  window.print();
+  document.body.innerHTML = oldstr;
+  // ocument.body.style.width = oldWidth;
+  // window.print();
+}
+function printDataFun(dataList, batchInfo, pageWidth, pageHeight) {
+  let hiprintTemplate = new hiprint.PrintTemplate();
+  let panel = hiprintTemplate.addPrintPanel({
+    width: pageWidth,
+    height: pageHeight,
+    // width: 76,
+    // height: 130,
+    paperFooter: 10,
+    paperHeader: 10,
+  });
+
+  batchInfo.wyBeerQrcodeList.forEach((it) => {
+    dataList.forEach((item) => {
+      let options = item.options;
+      let value = currentBeer.value[options.field];
+      console.log(value);
+      if (options.field == "batchNo") {
+        value = batchInfo.batchNo;
+      } else if (options.field == "qrcode") {
+        value = it.qrcodeUrl;
+      } else if (options.field == "productionDate") {
+        value = batchInfo.productionDate;
+      }
+      if (item.printElementType.type == "text") {
+        // bottom: 47.2500057220459;
+        // field: "beerName";
+        // hCenter: 42.3750057220459;
+        // height: 9.75;
+        // left: 15;
+        // qid: "beerName";
+        // right: 135.75;
+        // testData: "小麦啤酒";
+        // title: "产品名称";
+        // top: 37.5;
+        // vCenter: 75.75;
+        // width: 120;
+        //文本
+        panel.addPrintText({
+          options: {
+            width: options.width,
+            height: options.height,
+            top: options.top,
+            left: options.left,
+            title: options.title + ":" + (value || ""),
+            // text: value,
+            textAlign: "left",
+          },
+        });
+      } else if (item.printElementType.type == "barcode") {
+        //条形码
+        panel.addPrintText({
+          options: {
+            width: options.width,
+            height: options.height,
+            top: options.top,
+            left: options.left,
+            title: options.title + ":" + (value || ""),
+            textType: "barcode",
+          },
+        });
+      } else if (item.printElementType.type == "qrrcode") {
+        //条形码
+        panel.addPrintText({
+          options: {
+            width: options.width,
+            height: options.height,
+            top: options.top,
+            left: options.left,
+            title: value || "",
+            textType: "barcode",
+          },
+        });
+      }
+    });
+  });
+
+  hiprintTemplate.print({
+    title: "标签打印",
+    generateHTMLInterval: 30,
+    printByFragments: true,
+  });
+}
+
+const buildDesigner = (val) => {
+  // eslint-disable-next-line no-undef
+  $("#hiprint-printTemplate").empty(); // 先清空, 避免重复构建
+  hiprintTemplate = new hiprint.PrintTemplate({
+    settingContainer: "#PrintElementOptionSetting", // 元素参数容器
+    fontList: [
+      { title: "微软雅黑", value: "Microsoft YaHei" },
+      { title: "黑体", value: "STHeitiSC-Light" },
+      { title: "思源黑体", value: "SourceHanSansCN-Normal" },
+      { title: "王羲之书法体", value: "王羲之书法体" },
+      { title: "宋体", value: "SimSun" },
+      { title: "华为楷体", value: "STKaiti" },
+      { title: "cursive", value: "cursive" },
+    ],
+    onDataChanged: (type, json) => {
+      // 模板发生改变回调
+      console.log(type); // 新增、移动、删除、修改(参数调整)、大小、旋转
+      console.log(json); // 返回 template
+    },
+  });
+  // 构建 并填充到 容器中
+  hiprintTemplate.design("#hiprint-printTemplate");
+  hiprintTemplate.setPaper(300, 400);
+
+  // hiprintTemplate.print()
+};
+// 取消打印
+function cancelPrint() {
+  openPrint.value = false;
+  formPrint.value = {};
+}
+function cancelPrint2() {
+  showPrintDialog.value = false;
+}
+getAllTemplate();
+getList();
+</script>
+<style lang="scss" scoped>
+.edit-icon {
+  margin-left: 4px;
+  vertical-align: middle;
+  cursor: pointer;
+}
+</style>
diff --git a/src/views/product/billTemplate/index.vue b/src/views/product/billTemplate/index.vue
new file mode 100644
index 0000000..53fecf8
--- /dev/null
+++ b/src/views/product/billTemplate/index.vue
@@ -0,0 +1,351 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="模板名称" prop="templateName">
+        <el-input
+          v-model="queryParams.templateName"
+          placeholder="请输入模板名称"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!-- <el-form-item label="品牌方id" prop="breweryId">
+          <el-input
+            v-model="queryParams.breweryId"
+            placeholder="请输入品牌方id"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item> -->
+      <!-- <el-form-item label="宽度 mm" prop="pageWidth">
+          <el-input
+            v-model="queryParams.pageWidth"
+            placeholder="请输入宽度 mm"
+            clearable
+            @keyup.enter="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="高度 mm" prop="pageHeight">
+          <el-input
+            v-model="queryParams.pageHeight"
+            placeholder="请输入高度 mm"
+            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="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="handleAdd"
+          v-hasPermi="['brewery:breweryTagPrintTemplate:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['brewery:breweryTagPrintTemplate:edit']"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['brewery:breweryTagPrintTemplate:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:breweryTagPrintTemplate:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="breweryTagPrintTemplateList"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="模板id" align="center" prop="id" />
+      <el-table-column label="模板名称" align="center" prop="templateName" />
+      <el-table-column label="宽度 mm" align="center" prop="pageWidth" />
+      <el-table-column label="高度 mm" align="center" prop="pageHeight" />
+      <el-table-column label="打印元素" align="center" prop="elements" />
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            icon="Edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['brewery:breweryTagPrintTemplate:edit']"
+            >修改</el-button
+          >
+          <el-button
+            link
+            type="primary"
+            icon="Delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['brewery:breweryTagPrintTemplate:remove']"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改品牌方标签套打模板对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form
+        ref="breweryTagPrintTemplateRef"
+        :model="form"
+        :rules="rules"
+        label-width="80px"
+      >
+        <el-form-item label="模板名称" prop="templateName">
+          <el-input v-model="form.templateName" placeholder="请输入模板名称" />
+        </el-form-item>
+        <el-form-item label="宽度 mm" prop="pageWidth">
+          <el-input v-model="form.pageWidth" placeholder="请输入宽度 mm" />
+        </el-form-item>
+        <el-form-item label="高度 mm" prop="pageHeight">
+          <el-input v-model="form.pageHeight" placeholder="请输入高度 mm" />
+        </el-form-item>
+        <el-form-item label="打印元素" prop="elements">
+          <el-input
+            v-model="form.elements"
+            type="textarea"
+            placeholder="请输入内容"
+          />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="form.remark"
+            type="textarea"
+            placeholder="请输入内容"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="BreweryTagPrintTemplate">
+import {
+  listBreweryTagPrintTemplate,
+  getBreweryTagPrintTemplate,
+  delBreweryTagPrintTemplate,
+  addBreweryTagPrintTemplate,
+  updateBreweryTagPrintTemplate,
+} from "@/api/brewery/printTemplate";
+
+const { proxy } = getCurrentInstance();
+
+const breweryTagPrintTemplateList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    templateName: null,
+    pageWidth: null,
+    pageHeight: null,
+    elements: null,
+  },
+  rules: {
+    templateName: [
+      { required: true, message: "模板名称不能为空", trigger: "blur" },
+    ],
+    pageWidth: [
+      { required: true, message: "宽度 mm不能为空", trigger: "blur" },
+    ],
+    pageHeight: [
+      { required: true, message: "高度 mm不能为空", trigger: "blur" },
+    ],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询品牌方标签套打模板列表 */
+function getList() {
+  loading.value = true;
+  listBreweryTagPrintTemplate(queryParams.value).then((response) => {
+    breweryTagPrintTemplateList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    templateName: null,
+    pageWidth: null,
+    pageHeight: null,
+    elements: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("breweryTagPrintTemplateRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加模板";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value;
+  getBreweryTagPrintTemplate(_id).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改模板";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["breweryTagPrintTemplateRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateBreweryTagPrintTemplate(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addBreweryTagPrintTemplate(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除模板编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delBreweryTagPrintTemplate(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/breweryTagPrintTemplate/export",
+    {
+      ...queryParams.value,
+    },
+    `breweryTagPrintTemplate_${new Date().getTime()}.xlsx`
+  );
+}
+
+getList();
+</script>
diff --git a/src/views/product/commodity/add.vue b/src/views/product/commodity/add.vue
new file mode 100644
index 0000000..90af860
--- /dev/null
+++ b/src/views/product/commodity/add.vue
@@ -0,0 +1,215 @@
+<template>
+  <div class="app-container" v-loading="loading">
+    <el-form ref="formRef" :model="form" label-width="110px">
+      <div class="zd-card">
+        <h4>新建兑换商品</h4>
+        <div>
+          <el-form-item label="参与活动类型" prop="activityType">
+            <el-radio-group v-model="form.activityType">
+              <el-radio :value="1" border>
+                <div class="btn-title">通用兑换</div>
+                <div class="btn-sub">
+                  发布后上架啤酒币商城展示并支持累积返利兑换。
+                </div>
+              </el-radio>
+              <el-radio :value="2" border>
+                <div class="btn-title">累积返利</div>
+                <div class="btn-sub">仅适用于累积返利兑换，不上架展示。</div>
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </div>
+      </div>
+      <div class="zd-card">
+        <h4>基本信息</h4>
+        <div>
+          <el-form-item label="商品类型" prop="goodsType">
+            <el-radio-group v-model="form.goodsType">
+              <el-radio :value="1">酒款</el-radio>
+              <el-radio :value="2">其他</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="售卖方式" prop="purchaseMethod">
+            <el-radio-group v-model="form.purchaseMethod">
+              <el-radio :value="1">啤酒币兑换</el-radio>
+              <el-radio :value="2">活动奖励</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item
+            v-if="form.goodsType == 1"
+            label="快速套用酒款"
+            prop="goodsCover"
+          >
+            <el-select
+              v-model="selBeer"
+              placeholder="请选择酒款"
+              style="width: 400px"
+              value-key="id"
+              @change="handleSelectChange"
+            >
+              <el-option
+                v-for="item in allBeersList"
+                :key="item.id"
+                :label="item.beerName"
+                :value="item"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="商品图片" prop="goodsCover">
+            <ImageUpload v-model="form.goodsCover" :fileSize="5" :limit="1" />
+          </el-form-item>
+
+          <el-form-item label="商品名称" prop="goodsName">
+            <el-input
+              v-model="form.goodsName"
+              placeholder="请输入商品名称"
+              style="width: 400px"
+            />
+          </el-form-item>
+          <el-form-item label="商品规格" prop="specs">
+            <el-input
+              v-model="form.specs"
+              placeholder="请输入规格"
+              style="width: 400px"
+            />
+          </el-form-item>
+        </div>
+      </div>
+      <div v-if="form.activityType == 1" class="zd-card">
+        <h4>兑换比例与库存</h4>
+        <el-form-item label="可兑换库存数量" prop="stockNum">
+          <el-input
+            v-model="form.stockNum"
+            placeholder="请输入"
+            style="width: 400px"
+            oninput="value=value.replace(/[^0-9]/g,'')"
+          />
+        </el-form-item>
+        <el-form-item label="需啤酒币数量" prop="redeemedNum">
+          <el-input
+            v-model="form.redeemedNum"
+            placeholder="请输入啤酒币兑换数"
+            style="width: 400px"
+            oninput="value=value.replace(/[^0-9]/g,'')"
+          />
+        </el-form-item>
+        <el-form-item label="是否限购" prop="redeemed">
+          <el-radio-group v-model="form.redeemed">
+            <el-radio :value="0">是</el-radio>
+            <el-radio :value="1">否</el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </div>
+
+      <div class="zd-card">
+        <h4>商品详情</h4>
+        <el-form-item label="商品规格" prop="specs">
+          <editor v-model="form.desc" :min-height="150" style="width: 400px" />
+        </el-form-item>
+      </div>
+    </el-form>
+    <div class="btn-container">
+      <el-button type="primary" @click="handlePublish">保存并发布</el-button>
+      <el-button type="primary" @click="handleSubmit">保存</el-button>
+      <el-button @click="handleCancle">取消</el-button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { addGoods } from "@/api/brewery/goods";
+import { allBeers } from "@/api/brewery/beer";
+const { proxy } = getCurrentInstance();
+const router = useRouter();
+const loading = ref(false);
+const goodsType = ref(1);
+const form = ref({
+  activityType: 1,
+  goodsType: 1,
+  purchaseMethod: 1,
+  redeemed: 1,
+});
+const allBeersList = ref([]); // 所有啤酒列表
+// 获取所有啤酒列表
+function getAllBeersFun() {
+  allBeers().then((response) => {
+    allBeersList.value = response.data;
+  });
+}
+const selBeer = ref(null); // 快速套用酒款
+function handleSelectChange(beer) {
+  console.log(beer, beer.beerName);
+  form.value.goodsCover = beer.cover;
+  form.value.goodsName = beer.beerName;
+  form.value.specs = beer.specs;
+  form.value.desc = beer.desc;
+}
+getAllBeersFun(); // 所有啤酒列表
+function handlePublish() {
+  console.log("发布");
+  proxy.$refs["formRef"].validate((valid) => {
+    if (valid) {
+      form.value.onSale = 1;
+      loading.value = true;
+      addGoods(form.value)
+        .then((response) => {
+          loading.value = false;
+          proxy.$modal.msgSuccess("发布成功");
+          router.back();
+        })
+        .catch((error) => {
+          loading.value = false;
+          console.log(error);
+          proxy.$modal.msgError("发布失败");
+        });
+    }
+  });
+}
+function handleSubmit() {
+  console.log("保存");
+  proxy.$refs["formRef"].validate((valid) => {
+    if (valid) {
+      form.value.onSale = 0;
+      loading.value = true;
+      addGoods(form.value)
+        .then((response) => {
+          loading.value = false;
+          proxy.$modal.msgSuccess("保存成功");
+          router.back();
+        })
+        .catch((error) => {
+          loading.value = false;
+          console.log(error);
+          proxy.$modal.msgError("保存失败");
+        });
+    }
+  });
+}
+function handleCancle() {
+  router.back();
+}
+</script>
+
+<style scoped lang="scss">
+:deep(.el-radio.is-bordered) {
+  width: auto;
+  height: auto;
+  padding: 8px 15px;
+}
+.btn-title {
+  font-family: Nunito Sans;
+  font-size: 14px;
+  font-weight: 600;
+  color: #202224;
+}
+.btn-sub {
+  font-family: Nunito Sans;
+  font-size: 10px;
+  font-weight: 600;
+  color: #979797;
+}
+.btn-container {
+  text-align: center;
+}
+</style>
diff --git a/src/views/product/commodity/history.vue b/src/views/product/commodity/history.vue
new file mode 100644
index 0000000..224a318
--- /dev/null
+++ b/src/views/product/commodity/history.vue
@@ -0,0 +1,480 @@
+<template>
+  <div class="app-container">
+    <div class="zd-card">
+      <el-table v-loading="loading" :data="goodsList" class="zd-table">
+        <el-table-column label="商品名称" align="left" prop="goodsName">
+          <template #default="scope">
+            <div style="display: flex; align-items: center; gap: 16px">
+              <el-image
+                style="width: 60px; height: 60px"
+                :src="scope.row.goodsCover"
+                :zoom-rate="1.2"
+                :max-scale="7"
+                :min-scale="0.2"
+                :preview-src-list="[scope.row.goodsCover]"
+                :initial-index="4"
+                fit="cover"
+                title="点击查看大图"
+                preview-teleported
+              />
+              <div>
+                <div>名称：{{ scope.row.goodsName }} {{ scope.row.specs }}</div>
+                <div>编码：{{ scope.row.goodsSn }}</div>
+              </div>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="商品类型" align="center" prop="purchaseMethod">
+          <template #default="scope">
+            <span v-if="scope.row.purchaseMethod == 1">啤酒币兑换</span>
+            <span v-if="scope.row.purchaseMethod == 2">营销返利兑换</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="啤酒币兑换数量"
+          align="center"
+          prop="redeemedNum"
+        >
+          <template #default="scope">
+            <template v-if="currentGoodsCoinId === scope.row.id">
+              <el-input
+                v-model="goodsCoinCount"
+                type="number"
+                placeholder="请输入数量"
+                style="width: 80px"
+              />
+              <el-button link type="primary" @click="saveGoodsCoinCount"
+                >保存</el-button
+              >
+              <el-button link @click="cancelGoodsCoin">取消</el-button>
+            </template>
+            <template v-else>
+              <span>{{ scope.row.redeemedNum }}</span>
+              <el-icon
+                size="16"
+                class="edit-icon"
+                @click="handleGoodsIcons(scope.row)"
+                ><EditPen
+              /></el-icon>
+            </template>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="关联活动数量"
+          align="center"
+          prop="activityCount"
+        />
+
+        <el-table-column label="创建时间" align="center" prop="createTime" />
+        <el-table-column label="商品状态" align="center" prop="onSale">
+          <template #default="scope">
+            <el-tag v-if="scope.row.onSale === 1" type="success"> 在售</el-tag>
+            <el-tag v-else type="danger"> 下架</el-tag>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="zd-card">
+      <h4>啤酒币兑换历史</h4>
+      <el-table :data="exchangeList" class="zd-table">
+        <el-table-column label="兑换单号" align="center" prop="orderSn" />
+        <el-table-column label="兑换时间" align="center" prop="paidTime" />
+        <el-table-column label="门店ID" align="center" prop="barId" />
+        <el-table-column label="门店城市" align="center" prop="barCity" />
+        <el-table-column
+          label="使用啤酒币数量"
+          align="center"
+          prop="beerCoinNum"
+        />
+        <el-table-column label="发货时间" align="center" prop="shippingTime" />
+        <el-table-column
+          label="发货地址"
+          align="center"
+          prop="address"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          label="物流单号"
+          align="center"
+          prop="trackingNumber"
+        />
+        <el-table-column label="发货状态" align="center" prop="shippingStatus">
+          <template #default="scope">
+            {{ scope.row.shippingStatus === 1 ? "已发货" : "未发货" }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          align="center"
+          fixed="right"
+          width="150"
+          class-name="small-padding fixed-width"
+        >
+          <template #default="scope">
+            <el-button
+              v-if="scope.row.shippingStatus != 1"
+              link
+              type="primary"
+              @click="handleDelivery(scope.row)"
+              >发货</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="zd-card">
+      <h4>累积返利活动</h4>
+      <el-table :data="activityList" class="zd-table">
+        <el-table-column label="兑换单号" align="center" prop="id" />
+        <el-table-column label="兑换时间" align="center" prop="claimTime" />
+        <el-table-column label="门店ID" align="center" prop="barId" />
+        <el-table-column
+          label="门店城市"
+          align="center"
+          prop="barCity"
+          show-overflow-tooltip
+        />
+        <el-table-column label="参与活动ID" align="center" prop="activityId" />
+        <el-table-column
+          label="活动目标"
+          align="center"
+          prop="activityTarget"
+        />
+        <el-table-column label="发货时间" align="center" prop="dispatchTime" />
+        <el-table-column label="发货地址" align="center" prop="barAddress" />
+        <el-table-column label="物流单号" align="center" prop="wayBillNo" />
+        <el-table-column label="兑换状态" align="center" prop="rewardStatus">
+          <template #default="scope">
+            <span v-if="scope.row.rewardStatus === 0">未发放</span>
+            <span v-if="scope.row.rewardStatus === 1">已发放</span>
+            <span v-if="scope.row.rewardStatus === 2">已领取</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          align="center"
+          fixed="right"
+          width="150"
+          class-name="small-padding fixed-width"
+        >
+          <template #default="scope">
+            <el-button
+              v-if="scope.row.rewardType === 2 && scope.row.rewardStatus === 0"
+              link
+              type="primary"
+              @click="handleDelivery2(scope.row)"
+              >发货</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <el-dialog
+      title="订单发货"
+      v-model="deliveryOpen"
+      width="500px"
+      append-to-body
+    >
+      <el-form
+        ref="deliveryRef"
+        :model="deliveryForm"
+        :rules="rules"
+        label-width="80px"
+      >
+        <el-form-item label="商品信息">
+          <div
+            style="
+              display: flex;
+              justify-content: flex-start;
+              align-items: center;
+              gap: 20px;
+              width: 100%;
+            "
+          >
+            <el-image
+              style="width: 60px; height: 60px"
+              :src="currentRow.goodsCover"
+              :zoom-rate="1.2"
+              :max-scale="7"
+              :min-scale="0.2"
+              :preview-src-list="[currentRow.goodsCover]"
+              :initial-index="4"
+              fit="cover"
+              title="点击查看大图"
+              preview-teleported
+            />
+            <div>
+              <div>{{ currentRow.goodsName }}</div>
+              <!-- <div>{{ currentRow.goodsName }}</div> -->
+            </div>
+            <div>x {{ currentRow.redeemNum }}</div>
+          </div>
+        </el-form-item>
+        <el-form-item label="收货信息">
+          <div>联系方式：{{ currentRow.contactPhone }}</div>
+          <div>收货地址：{{ currentRow.address }}</div>
+        </el-form-item>
+        <el-form-item label="发货方式" prop="dispatchMethod">
+          <el-radio-group v-model="deliveryForm.dispatchMethod">
+            <el-radio :value="0">自己配送</el-radio>
+            <el-radio :value="1">快递</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <template v-if="deliveryForm.dispatchMethod === 1">
+          <el-form-item label="快递公司" prop="expressCompany">
+            <el-input
+              v-model="deliveryForm.expressCompany"
+              placeholder="请输入快递公司"
+            />
+          </el-form-item>
+          <el-form-item label="快递单号" prop="trackingNumber">
+            <el-input
+              v-model="deliveryForm.trackingNumber"
+              placeholder="请输入快递单号"
+            />
+          </el-form-item>
+        </template>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitDelivery">确 定</el-button>
+          <el-button @click="cancelDelivery">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!-- 2 发货 -->
+    <el-dialog
+      title="订单发货"
+      v-model="deliveryOpen2"
+      width="500px"
+      append-to-body
+    >
+      <el-form
+        ref="deliveryRef2"
+        :model="deliveryForm2"
+        :rules="rules"
+        label-width="80px"
+      >
+        <el-form-item label="商品信息">
+          <div
+            style="
+              display: flex;
+              justify-content: flex-start;
+              align-items: center;
+              gap: 20px;
+              width: 100%;
+            "
+          >
+            <template v-if="currentRow2.rewardType === 2">
+              <el-image
+                style="width: 60px; height: 60px"
+                :src="currentRow2.goodsCover"
+                :zoom-rate="1.2"
+                :max-scale="7"
+                :min-scale="0.2"
+                :preview-src-list="[currentRow2.goodsCover]"
+                :initial-index="4"
+                fit="cover"
+                title="点击查看大图"
+                preview-teleported
+              />
+              <div>
+                <div>{{ currentRow2.rewardGoodsName }}</div>
+                <!-- <div>{{ currentRow.goodsName }}</div> -->
+              </div>
+              <div>x {{ currentRow2.rewardGoodsNum }}</div>
+            </template>
+            <template v-else>
+              啤酒币 * {{ currentRow2.rewardGoodsNum }}
+            </template>
+          </div>
+        </el-form-item>
+        <el-form-item label="收货信息">
+          <div>联系方式：{{ currentRow2.contactPhone }}</div>
+          <div>收货地址：{{ currentRow2.address }}</div>
+        </el-form-item>
+        <el-form-item label="发货方式" prop="dispatchMethod">
+          <el-radio-group v-model="deliveryForm2.dispatchMethod">
+            <el-radio :value="0">自己配送</el-radio>
+            <el-radio :value="1">快递</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="快递公司" prop="expressCompany">
+          <el-input
+            v-model="deliveryForm2.expressCompany"
+            placeholder="请输入快递公司"
+          />
+        </el-form-item>
+        <el-form-item label="快递单号" prop="wayBillNo">
+          <el-input
+            v-model="deliveryForm2.wayBillNo"
+            placeholder="请输入快递单号"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitDelivery2">确 定</el-button>
+          <el-button @click="cancelDelivery2">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { getCurrentInstance, onMounted } from "vue";
+import {
+  getGoods,
+  getGoodsActivityList,
+  getGoodsExchangeList,
+} from "@/api/brewery/goods";
+import { deliveryRedeemOrder, dispatchRew } from "@/api/brewery/redeemOrder";
+const { proxy } = getCurrentInstance();
+const route = useRoute();
+const router = useRouter();
+const loading = ref(false);
+const goodsId = ref(null);
+const rules = ref({
+  dispatchMethod: [
+    { required: true, message: "请选择发货方式", trigger: "change" },
+  ],
+  expressCompany: [
+    { required: true, message: "请输入快递公司", trigger: "blur" },
+  ],
+  trackingNumber: [
+    { required: true, message: "请输入快递单号", trigger: "blur" },
+  ],
+});
+onMounted(() => {
+  goodsId.value = route.query.goodsId;
+  queryActivity.value.goodsId = goodsId.value;
+  queryExchange.value.goodsId = goodsId.value;
+  getGoodsInfo();
+  getGoodsActivity();
+  getGoodsExchange();
+});
+// 获取商品详情
+const goods = ref({});
+const goodsList = ref([]);
+function getGoodsInfo() {
+  loading.value = true;
+  getGoods(goodsId.value).then((response) => {
+    // goods.value = response.data;
+    goodsList.value = [];
+    goodsList.value.push(response.data);
+    loading.value = false;
+  });
+}
+// 获取商品的活动列表
+const activityList = ref([]);
+const queryActivity = ref({
+  pageNum: 1,
+  pageSize: 10,
+  goodsId: goodsId.value,
+});
+const getGoodsActivity = async () => {
+  const res = await getGoodsActivityList(queryActivity.value);
+  activityList.value = res.data;
+};
+// 获取商品的兑换列表
+const exchangeList = ref([]);
+const queryExchange = ref({
+  pageNum: 1,
+  pageSize: 10,
+  goodsId: goodsId.value,
+});
+const getGoodsExchange = async () => {
+  const res = await getGoodsExchangeList(queryExchange.value);
+  exchangeList.value = res.data;
+};
+// 修改兑换啤酒数
+const currentGoodsCoinId = ref(null);
+const goodsCoinCount = ref(0);
+function handleGoodsIcons(row) {
+  currentGoodsCoinId.value = row.id;
+  goodsCoinCount.value = row.redeemedNum;
+}
+function saveGoodsCoinCount() {
+  updateGoodsIcons({
+    goodsId: currentGoodsCoinId.value,
+    icons: goodsCoinCount.value,
+  }).then(() => {
+    proxy.$modal.msgSuccess("修改成功");
+    currentGoodsCoinId.value = null;
+    goodsCoinCount.value = 0;
+    getGoodsInfo();
+  });
+}
+function cancelGoodsCoin() {
+  currentGoodsCoinId.value = null;
+  goodsCoinCount.value = 0;
+}
+//==========//==========
+
+const currentRow = ref({});
+const deliveryOpen = ref(false);
+const deliveryForm = ref({ dispatchMethod: 0 });
+/** 发货按钮操作 */
+function handleDelivery(row) {
+  currentRow.value = row;
+  console.log(row);
+  deliveryOpen.value = true;
+}
+// 发货按钮
+function submitDelivery() {
+  proxy.$refs["deliveryRef"].validate((valid) => {
+    if (valid) {
+      deliveryForm.value.orderId = currentRow.value.id;
+      deliveryRedeemOrder(deliveryForm.value).then((response) => {
+        proxy.$modal.msgSuccess("发货成功");
+        deliveryOpen.value = false;
+        getGoodsExchange();
+      });
+    }
+  });
+}
+function cancelDelivery() {
+  deliveryOpen.value = false;
+  deliveryForm.value = { dispatchMethod: 0 };
+  currentRow.value = {};
+}
+
+// ==========
+const currentRow2 = ref({});
+const deliveryOpen2 = ref(false);
+const deliveryForm2 = ref({ dispatchMethod: 0 });
+/** 发货按钮操作 */
+function handleDelivery2(row) {
+  currentRow2.value = row;
+  console.log(row);
+  deliveryOpen2.value = true;
+}
+// 发货按钮
+function submitDelivery2() {
+  proxy.$refs["deliveryRef2"].validate((valid) => {
+    if (valid) {
+      deliveryForm2.value.rewardId = currentRow.value.id;
+      dispatchRew(deliveryForm2.value).then((response) => {
+        proxy.$modal.msgSuccess("发货成功");
+        deliveryOpen2.value = false;
+        getGoodsActivity();
+      });
+    }
+  });
+}
+function cancelDelivery2() {
+  deliveryOpen2.value = false;
+  deliveryForm2.value = { dispatchMethod: 0 };
+  currentRow2.value = {};
+}
+</script>
+
+<style lang="scss" scoped>
+.edit-icon {
+  margin-left: 4px;
+  vertical-align: middle;
+  cursor: pointer;
+}
+</style>
diff --git a/src/views/product/commodity/index.vue b/src/views/product/commodity/index.vue
new file mode 100644
index 0000000..eac75c5
--- /dev/null
+++ b/src/views/product/commodity/index.vue
@@ -0,0 +1,699 @@
+<template>
+  <div class="app-container">
+    <div
+      style="
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 16px;
+      "
+    >
+      <span>兑换商品</span>
+      <el-button
+        type="primary"
+        @click="handleAdd"
+        v-hasPermi="['brewery:goods:add']"
+        >发布兑换商品</el-button
+      >
+    </div>
+    <el-form
+      v-if="false"
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="100px"
+    >
+      <el-form-item label="商品名称" prop="goodsName">
+        <el-input
+          v-model="queryParams.goodsName"
+          placeholder="请输入商品名称"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!-- <el-form-item label="规格" prop="specs">
+        <el-input
+          v-model="queryParams.specs"
+          placeholder="请输入规格"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item> -->
+      <el-form-item label="使用场景" prop="purchaseMethod">
+        <el-select v-model="queryParams.purchaseMethod" style="width: 150px">
+          <el-option label="啤酒币兑换" :value="1"></el-option>
+          <el-option label="营销返利兑换" :value="2"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="是否可兑换" prop="redeemed">
+        <el-select v-model="queryParams.redeemed" style="width: 150px">
+          <el-option label="不可以" :value="0"></el-option>
+          <el-option label="可以" :value="1"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="啤酒币兑换数" prop="redeemedNum">
+        <el-input
+          v-model="queryParams.redeemedNum"
+          placeholder="请输入啤酒币兑换数"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="编号" prop="goodsSn">
+        <el-input
+          v-model="queryParams.goodsSn"
+          placeholder="请输入编号"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!-- <el-form-item label="本店售价" prop="goodsPrice">
+        <el-input
+          v-model="queryParams.goodsPrice"
+          placeholder="请输入本店售价"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="市场售价" prop="marketPrice">
+        <el-input
+          v-model="queryParams.marketPrice"
+          placeholder="请输入市场售价"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="库存数量" prop="stockNum">
+        <el-input
+          v-model="queryParams.stockNum"
+          placeholder="请输入库存数量"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="冻结数量" prop="frozenNum">
+        <el-input
+          v-model="queryParams.frozenNum"
+          placeholder="请输入冻结数量"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item> -->
+      <el-form-item label="上架" prop="onSale">
+        <el-select v-model="queryParams.onSale" style="width: 150px">
+          <el-option label="下架" :value="0"></el-option>
+          <el-option label="上架" :value="1"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <!-- <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="handleAdd"
+          v-hasPermi="['brewery:goods:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['brewery:goods:edit']"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['brewery:goods:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:goods:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row> -->
+    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
+      <el-tab-pane label="全部商品" name="1"></el-tab-pane>
+      <el-tab-pane label="已售罄" name="2"></el-tab-pane>
+      <el-tab-pane label="通用兑换" name="3"></el-tab-pane>
+      <el-tab-pane label="限累积返利" name="4"></el-tab-pane>
+    </el-tabs>
+    <el-table
+      v-loading="loading"
+      :data="goodsList"
+      class="zd-table"
+      @selection-change="handleSelectionChange"
+    >
+      <!-- <el-table-column type="selection" width="55" align="center" /> -->
+      <!-- <el-table-column label="id" align="center" prop="id" width="50" /> -->
+      <!-- <el-table-column label="编号" align="center" prop="goodsSn" /> -->
+      <el-table-column label="商品名称" align="left" prop="goodsName">
+        <template #default="scope">
+          <div style="display: flex; align-items: center; gap: 16px">
+            <el-image
+              style="width: 60px; height: 60px"
+              :src="scope.row.goodsCover"
+              :zoom-rate="1.2"
+              :max-scale="7"
+              :min-scale="0.2"
+              :preview-src-list="[scope.row.goodsCover]"
+              :initial-index="4"
+              fit="cover"
+              title="点击查看大图"
+              preview-teleported
+            />
+            <div>
+              <div>名称：{{ scope.row.goodsName }} {{ scope.row.specs }}</div>
+              <div>编码：{{ scope.row.goodsSn }}</div>
+            </div>
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column label="商品类型" align="center" prop="purchaseMethod">
+        <template #default="scope">
+          <span v-if="scope.row.purchaseMethod == 1">啤酒币兑换</span>
+          <span v-if="scope.row.purchaseMethod == 2">营销返利兑换</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="库存" align="center" prop="stockNum" />
+      <el-table-column label="啤酒币兑换数量" align="center" prop="redeemedNum">
+        <template #default="scope">
+          <template v-if="currentGoodsCoinId === scope.row.id">
+            <el-input
+              v-model="goodsCoinCount"
+              type="number"
+              placeholder="请输入数量"
+              style="width: 80px"
+            />
+            <el-button link type="primary" @click="saveGoodsCoinCount"
+              >保存</el-button
+            >
+            <el-button link @click="cancelGoodsCoin">取消</el-button>
+          </template>
+          <template v-else>
+            <span>{{ scope.row.redeemedNum }}</span>
+            <el-icon
+              size="16"
+              class="edit-icon"
+              @click="handleGoodsIcons(scope.row)"
+              ><EditPen
+            /></el-icon>
+          </template>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="关联活动数量"
+        align="center"
+        prop="activityCount"
+      />
+      <el-table-column
+        label="待兑付数量"
+        align="center"
+        prop="exchangeWaitingCount"
+      />
+      <el-table-column label="创建时间" align="center" prop="createTime" />
+      <!-- <el-table-column label="库存数量" align="center" prop="stockNum" />
+      <el-table-column label="发布状态" align="center" prop="onSale">
+        <template #default="scope">
+          <el-tag v-if="scope.row.onSale === 1" type="success"> 在售</el-tag>
+          <el-tag v-else type="danger"> 下架</el-tag>
+        </template>
+      </el-table-column> -->
+
+      <el-table-column
+        label="操作"
+        align="center"
+        width="200"
+        fixed="right"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <!-- <el-button
+            link
+            type="primary"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['brewery:goods:edit']"
+            >修改</el-button
+          > -->
+          <el-button
+            link
+            type="primary"
+            @click="handleSaleStatus(scope.row)"
+            v-hasPermi="['brewery:goods:edit']"
+            >{{ scope.row.onSale === 1 ? "下架" : "上架" }}</el-button
+          >
+          <el-button link type="primary" @click="handleHistory(scope.row)"
+            >兑换历史</el-button
+          >
+
+          <el-button
+            link
+            type="danger"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['brewery:goods:remove']"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改兑换商品对话框 -->
+    <el-dialog :title="title" v-model="open" width="800px" append-to-body>
+      <el-form ref="goodsRef" :model="form" :rules="rules" label-width="120px">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="商品名称" prop="goodsName">
+              <el-input v-model="form.goodsName" placeholder="请输入商品名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="是否可兑换" prop="redeemed">
+              <el-radio-group v-model="form.redeemed">
+                <el-radio :label="0">不可以</el-radio>
+                <el-radio :label="1">可以</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12"
+            ><el-form-item label="编号" prop="goodsSn">
+              <el-input
+                v-model="form.goodsSn"
+                placeholder="请输入编号"
+              /> </el-form-item
+          ></el-col>
+          <el-col :span="12">
+            <el-form-item label="上下架" prop="onSale">
+              <el-radio-group v-model="form.onSale">
+                <el-radio :label="0">下架</el-radio>
+                <el-radio :label="1">上架</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <!-- <el-col :span="12">
+            <el-form-item label="本店售价" prop="goodsPrice">
+              <el-input
+                v-model="form.goodsPrice"
+                placeholder="请输入本店售价"
+              />
+            </el-form-item>
+          </el-col> -->
+          <el-col :span="12"
+            ><el-form-item label="购买方式" prop="purchaseMethod">
+              <el-radio-group v-model="form.purchaseMethod">
+                <el-radio :label="1">啤酒币兑换</el-radio>
+                <el-radio :label="2">营销返利兑换</el-radio>
+              </el-radio-group>
+            </el-form-item></el-col
+          >
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="规格" prop="specs">
+              <el-input v-model="form.specs" placeholder="请输入规格" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="啤酒币兑换数" prop="redeemedNum">
+              <el-input
+                v-model="form.redeemedNum"
+                placeholder="请输入啤酒币兑换数"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="库存数量" prop="stockNum">
+              <el-input v-model="form.stockNum" placeholder="请输入库存数量" />
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="12"
+            ><el-form-item label="市场售价" prop="marketPrice">
+              <el-input
+                v-model="form.marketPrice"
+                placeholder="请输入市场售价"
+              /> </el-form-item
+          ></el-col> -->
+        </el-row>
+
+        <el-row>
+          <el-col :span="12"
+            ><el-form-item label="图片" prop="goodsCover">
+              <ImageUpload v-model="form.goodsCover" :fileSize="5" :limit="1" />
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="12">
+            <el-form-item label="冻结数量" prop="frozenNum">
+              <el-input
+                v-model="form.frozenNum"
+                placeholder="请输入冻结数量"
+              /> </el-form-item
+          ></el-col> -->
+        </el-row>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Goods">
+import {
+  listGoods,
+  getGoods,
+  delGoods,
+  addGoods,
+  updateGoods,
+  updateGoodsSaleStatus,
+  updateGoodsStockNum,
+  updateGoodsIcons,
+} from "@/api/brewery/goods";
+import { ElMessageBox } from "element-plus";
+const { proxy } = getCurrentInstance();
+const router = useRouter();
+const goodsList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    goodsName: null,
+    goodsCover: null,
+    specs: null,
+    purchaseMethod: null,
+    redeemed: null,
+    redeemedNum: null,
+    goodsSn: null,
+    goodsPrice: null,
+    marketPrice: null,
+    stockNum: null,
+    frozenNum: null,
+    onSale: null,
+  },
+  rules: {},
+});
+
+const { queryParams, form, rules } = toRefs(data);
+const activeName = ref("1");
+/** 查询兑换商品列表 */
+function getList() {
+  loading.value = true;
+  listGoods(queryParams.value).then((response) => {
+    goodsList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+function handleClick(tab, event) {
+  console.log(tab, activeName.value);
+  queryParams.value.pageNum = 1;
+  if (activeName.value == 1) {
+    delete queryParams.value.stockNum;
+    delete queryParams.value.purchaseMethod;
+  }
+  if (activeName.value == 2) {
+    queryParams.value.stockNum = 0;
+    delete queryParams.value.purchaseMethod;
+  }
+  if (activeName.value == 3) {
+    queryParams.value.purchaseMethod = 1;
+    delete queryParams.value.stockNum;
+  }
+  if (activeName.value == 4) {
+    queryParams.value.purchaseMethod = 2;
+    delete queryParams.value.stockNum;
+  }
+  getList();
+}
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    goodsName: null,
+    goodsCover: null,
+    specs: null,
+    purchaseMethod: null,
+    redeemed: null,
+    redeemedNum: null,
+    goodsSn: null,
+    goodsPrice: null,
+    marketPrice: null,
+    stockNum: null,
+    frozenNum: null,
+    onSale: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("goodsRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  // reset();
+  // open.value = true;
+  // title.value = "添加兑换商品";
+  router.push("/product/commodity/add");
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value;
+  getGoods(_id).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改兑换商品";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["goodsRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateGoods(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addGoods(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除兑换商品编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delGoods(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/goods/export",
+    {
+      ...queryParams.value,
+    },
+    `goods_${new Date().getTime()}.xlsx`
+  );
+}
+// 设置库存数量
+function handleStockNum(row) {
+  ElMessageBox.prompt("请输入库存数量（范围：1～999999）", "设置", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    inputPattern: /^[1-9][0-9]{0,5}$/,
+    inputErrorMessage: "请输入有效的数字（范围：1～999999）",
+  })
+    .then(({ value }) => {
+      updateGoodsStockNum({
+        goodsId: row.id,
+        stock: value,
+      }).then((response) => {
+        proxy.$modal.msgSuccess("设置成功");
+        getList();
+      });
+    })
+    .catch(() => {
+      console.log("取消");
+    });
+}
+// 设置兑换啤酒数
+function handleScanCoinCount(row) {
+  ElMessageBox.prompt("兑换所需啤酒币个数（范围：1～9999）", "设置", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    inputPattern: /^[1-9][0-9]{0,3}$/,
+    inputErrorMessage: "请输入有效的数字（范围：1～9999）",
+  })
+    .then(({ value }) => {
+      updateGoodsIcons({ goodsId: row.id, icons: value }).then((response) => {
+        proxy.$modal.msgSuccess("设置成功");
+        getList();
+      });
+    })
+    .catch(() => {
+      console.log("取消");
+    });
+}
+/** 商品上架按钮操作 */
+function handleSaleStatus(row) {
+  let str = "";
+  if (row.onSale == 1) {
+    str = "下架";
+  } else {
+    str = "上架";
+  }
+
+  proxy.$modal
+    .confirm("是否确认" + str + '编号为"' + row.id + '"的数据项？')
+    .then(() => {
+      updateGoodsSaleStatus({
+        goodsId: row.id,
+        state: row.onSale == 1 ? 0 : 1,
+      }).then(() => {
+        getList();
+        proxy.$modal.msgSuccess(`${str}成功`);
+      });
+    })
+    .catch(() => {});
+}
+
+// 修改兑换啤酒数
+const currentGoodsCoinId = ref(null);
+const goodsCoinCount = ref(0);
+function handleGoodsIcons(row) {
+  currentGoodsCoinId.value = row.id;
+  goodsCoinCount.value = row.redeemedNum;
+}
+function saveGoodsCoinCount() {
+  updateGoodsIcons({
+    goodsId: currentGoodsCoinId.value,
+    icons: goodsCoinCount.value,
+  }).then(() => {
+    proxy.$modal.msgSuccess("修改成功");
+    currentGoodsCoinId.value = null;
+    goodsCoinCount.value = 0;
+    getList();
+  });
+}
+function cancelGoodsCoin() {
+  currentGoodsCoinId.value = null;
+  goodsCoinCount.value = 0;
+}
+//==========//==========
+
+function handleHistory(row) {
+  router.push("/product/commodity/history?goodsId=" + row.id);
+}
+getList();
+</script>
+<style lang="scss" scoped>
+.edit-icon {
+  margin-left: 4px;
+  vertical-align: middle;
+  cursor: pointer;
+}
+</style>
diff --git a/src/views/qrcode/batch/index.vue b/src/views/qrcode/batch/index.vue
new file mode 100644
index 0000000..e24ca53
--- /dev/null
+++ b/src/views/qrcode/batch/index.vue
@@ -0,0 +1,448 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <el-form-item label="批次编号" prop="batchSn">
+        <el-input
+          v-model="queryParams.batchSn"
+          placeholder="请输入批次编号"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="酒款" prop="beerId">
+        <el-select
+          v-model="queryParams.beerId"
+          placeholder="请选择酒款"
+          style="width: 200px"
+        >
+          <el-option
+            v-for="item in allBeersList"
+            :key="item.id"
+            :label="item.beerName"
+            :value="item.id"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <!-- <el-form-item label="生成日期" prop="">
+        <el-input
+          v-model="queryParams.generateNum"
+          placeholder="请输入生成数量"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="打印日期" prop="generateState"> </el-form-item> -->
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="handleAdd"
+          v-hasPermi="['brewery:batch:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['brewery:batch:edit']"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['brewery:batch:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['brewery:batch:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="batchList"
+      class="zd-table"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="id" align="center" prop="id" width="80" />
+      <el-table-column
+        label="批次编号"
+        align="center"
+        prop="batchSn"
+        show-overflow-tooltip
+      />
+      <el-table-column label="酒款名称" align="center" prop="beerName" />
+      <el-table-column label="生成数量" align="center" prop="generateNum" />
+      <el-table-column label="生成状态" align="center" prop="generateState">
+        <template #default="scope">
+          <el-tag type="success" v-if="scope.row.generateState === 1"
+            >已生成</el-tag
+          >
+          <el-tag type="warning" v-else-if="scope.row.generateState == 0"
+            >未生成</el-tag
+          >
+        </template>
+      </el-table-column>
+      <el-table-column label="创建时间" align="center" prop="createTime" />
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            v-if="scope.row.generateState === 0"
+            link
+            type="primary"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['brewery:batch:edit']"
+            >修改</el-button
+          >
+          <el-button
+            link
+            type="primary"
+            @click="handleInfo(scope.row)"
+            v-hasPermi="['brewery:batch:edit']"
+            >详情</el-button
+          >
+          <el-button
+            v-if="scope.row.generateState === 0"
+            link
+            type="primary"
+            @click="handleQrcode(scope.row)"
+            v-hasPermi="['brewery:batch:edit']"
+            >生成二维码</el-button
+          >
+          <el-button
+            v-if="scope.row.generateState === 0"
+            link
+            type="danger"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['brewery:batch:remove']"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改批次对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="batchRef" :model="form" :rules="rules" label-width="130px">
+        <el-form-item label="酒款" prop="beerId">
+          <el-select v-model="form.beerId" placeholder="请选择酒款">
+            <el-option
+              v-for="item in allBeersList"
+              :key="item.id"
+              :label="item.beerName"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="生产日期" prop="productionDate">
+          <el-date-picker
+            v-model="form.productionDate"
+            type="date"
+            placeholder="请选择生产日期"
+            value-format="YYYY-MM-DD"
+          />
+        </el-form-item>
+        <el-form-item label="可生成二维码数量" prop="printCount">
+          <el-input v-model="form.printCount" placeholder="请输入生成数量" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <!-- 批次详情抽屉框 -->
+    <el-drawer v-model="showDrawer" title="批次详情" size="600">
+      <el-descriptions border :column="1" style="margin-bottom: 20px">
+        <el-descriptions-item label="批次编号">{{
+          batchInfo.batchSn
+        }}</el-descriptions-item>
+        <el-descriptions-item label="酒款名称">{{
+          batchInfo.beerName
+        }}</el-descriptions-item>
+        <el-descriptions-item label="生成数量">{{
+          batchInfo.generateNum
+        }}</el-descriptions-item>
+        <el-descriptions-item label="创建时间">{{
+          batchInfo.createTime
+        }}</el-descriptions-item>
+      </el-descriptions>
+      <el-table
+        v-if="
+          batchInfo.wyBeerQrcodeList && batchInfo.wyBeerQrcodeList.length > 0
+        "
+        :data="batchInfo.wyBeerQrcodeList"
+        border
+        style="width: 100%"
+      >
+        <el-table-column label="skuSn" prop="skuSn" />
+        <el-table-column label="二维码图片" prop="qrcodeUrl" width="150px">
+          <template #default="scope">
+            <el-image
+              style="width: 60px; height: 60px"
+              :src="scope.row.qrcodeUrl"
+              :zoom-rate="1.2"
+              :max-scale="7"
+              :min-scale="0.2"
+              :preview-src-list="[scope.row.qrcodeUrl]"
+              :initial-index="4"
+              fit="cover"
+              title="点击查看大图"
+              preview-teleported
+            />
+          </template>
+        </el-table-column>
+        <el-table-column label="核销状态" prop="qrcodeStatus" width="100px">
+          <template #default="scope">
+            <el-tag type="success" v-if="scope.row.qrcodeStatus === 1"
+              >已核销</el-tag
+            >
+            <el-tag type="warning" v-else-if="scope.row.qrcodeStatus === 0"
+              >未核销</el-tag
+            >
+            <el-tag type="info" v-else-if="scope.row.qrcodeStatus === 2"
+              >已失效</el-tag
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-drawer>
+  </div>
+</template>
+
+<script setup name="Batch">
+import {
+  listBatch,
+  getBatch,
+  delBatch,
+  addBatch,
+  updateBatch,
+} from "@/api/brewery/batch";
+import { allBeers } from "@/api/brewery/beer";
+import { generateQrcodeByBatch } from "@/api/brewery/qrcode";
+
+const { proxy } = getCurrentInstance();
+
+const batchList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const allBeersList = ref([]); // 所有啤酒列表
+const batchInfo = ref({}); // 批次详情
+const showDrawer = ref(false); // 批次详情抽屉框
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    batchSn: null,
+    beerId: null,
+    generateNum: null,
+  },
+  rules: {
+    breweryId: [{ required: true, message: "品牌方不能为空", trigger: "blur" }],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询批次列表 */
+function getList() {
+  loading.value = true;
+  listBatch(queryParams.value).then((response) => {
+    batchList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    batchSn: null,
+    beerId: null,
+    generateNum: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("batchRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加批次";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value;
+  getBatch(_id).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改批次";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["batchRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateBatch(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addBatch(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除批次编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delBatch(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/batch/export",
+    {
+      ...queryParams.value,
+    },
+    `batch_${new Date().getTime()}.xlsx`
+  );
+}
+// 获取所有啤酒列表
+function getAllBeersFun() {
+  allBeers().then((response) => {
+    allBeersList.value = response.data;
+  });
+}
+// 查看详情
+function handleInfo(row) {
+  const _id = row.id || ids.value;
+  getBatch(_id).then((response) => {
+    batchInfo.value = response.data;
+    showDrawer.value = true;
+  });
+}
+
+// 生成二维码
+function handleQrcode(row) {
+  generateQrcodeByBatch(row.id).then((response) => {
+    proxy.$modal.msgSuccess("生成成功");
+    getList();
+  });
+}
+
+getAllBeersFun();
+getList();
+</script>
diff --git a/src/views/qrcode/index.vue b/src/views/qrcode/index.vue
new file mode 100644
index 0000000..1ff745f
--- /dev/null
+++ b/src/views/qrcode/index.vue
@@ -0,0 +1,505 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
+      <!-- <el-form-item label="品牌方id" prop="breweryId">
+        <el-input
+          v-model="queryParams.breweryId"
+          placeholder="请输入品牌方id"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="批次id" prop="batchId">
+        <el-input
+          v-model="queryParams.batchId"
+          placeholder="请输入批次id"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="啤酒id" prop="beerId">
+        <el-input
+          v-model="queryParams.beerId"
+          placeholder="请输入啤酒id"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item> -->
+      <el-form-item label="条码ID" prop="skuSn">
+        <el-input
+          v-model="queryParams.skuSn"
+          placeholder="请输入sku编号"
+          clearable
+          style="width: 244px"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!-- <el-form-item label="二维码链接" prop="qrcodeUrl">
+        <el-input
+          v-model="queryParams.qrcodeUrl"
+          placeholder="请输入二维码链接"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="核销时间" prop="verifyTime">
+        <el-date-picker
+          clearable
+          v-model="queryParams.verifyTime"
+          type="date"
+          value-format="YYYY-MM-DD"
+          placeholder="请选择核销时间"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="被扫次数" prop="scanTimes">
+        <el-input
+          v-model="queryParams.scanTimes"
+          placeholder="请输入被扫次数"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="核销城市" prop="verifyCity">
+        <el-input
+          v-model="queryParams.verifyCity"
+          placeholder="请输入核销城市"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="核销ip" prop="verifyIp">
+        <el-input
+          v-model="queryParams.verifyIp"
+          placeholder="请输入核销ip"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item> -->
+      <el-form-item label="核销状态" prop="qrcodeStatus">
+        <el-select
+          v-model="queryParams.qrcodeStatus"
+          placeholder="请选择状态"
+          style="width: 244px"
+        >
+          <el-option label="全部" value=""></el-option>
+          <el-option label="已核销" value="1"></el-option>
+          <el-option label="未核销" value="0"></el-option>
+          <el-option label="已失效" value="2"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <!-- <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button
+            type="primary"
+            plain
+            icon="Plus"
+            @click="handleAdd"
+            v-hasPermi="['brewery:qrcode:add']"
+          >新增</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button
+            type="success"
+            plain
+            icon="Edit"
+            :disabled="single"
+            @click="handleUpdate"
+            v-hasPermi="['brewery:qrcode:edit']"
+          >修改</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button
+            type="danger"
+            plain
+            icon="Delete"
+            :disabled="multiple"
+            @click="handleDelete"
+            v-hasPermi="['brewery:qrcode:remove']"
+          >删除</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button
+            type="warning"
+            plain
+            icon="Download"
+            @click="handleExport"
+            v-hasPermi="['brewery:qrcode:export']"
+          >导出</el-button>
+        </el-col>
+        <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+   -->
+    <el-table
+      v-loading="loading"
+      :data="qrcodeList"
+      class="zd-table"
+      @selection-change="handleSelectionChange"
+    >
+      <!-- <el-table-column type="selection" width="55" align="center" /> -->
+      <el-table-column
+        label="条码ID"
+        align="center"
+        prop="skuSn"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="酒款名称"
+        align="center"
+        prop="beerName"
+        show-overflow-tooltip
+      />
+      <el-table-column label="生产日期" align="center" prop="productionDate" />
+      <!-- <el-table-column label="啤酒id" align="center" prop="beerId" /> -->
+      <!-- <el-table-column label="sku编号" align="center" prop="skuSn" /> -->
+      <!-- <el-table-column
+        label="二维码链接"
+        align="center"
+        prop="qrcodeUrl"
+        show-overflow-tooltip
+      >
+        <template #default="scope">
+          <el-image
+            style="width: 40px; height: 40px"
+            :src="scope.row.qrcodeUrl"
+            :zoom-rate="1.2"
+            :max-scale="7"
+            :min-scale="0.2"
+            :preview-src-list="[scope.row.qrcodeUrl]"
+            :initial-index="4"
+            fit="cover"
+            title="点击查看大图"
+            preview-teleported
+          />
+        </template>
+      </el-table-column> -->
+      <el-table-column label="条码扫码次数" align="center" prop="scanTimes" />
+      <el-table-column
+        label="核销状态"
+        align="center"
+        prop="qrcodeStatus"
+        width="80px"
+      >
+        <template #default="scope">
+          <el-tag type="success" v-if="scope.row.qrcodeStatus === 1"
+            >已核销</el-tag
+          >
+          <el-tag type="warning" v-else-if="scope.row.qrcodeStatus === 0"
+            >未核销</el-tag
+          >
+          <el-tag type="info" v-else-if="scope.row.qrcodeStatus === 2"
+            >已失效</el-tag
+          >
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="核销时间"
+        align="center"
+        prop="verifyTime"
+        width="110"
+      >
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.verifyTime, "{y}-{m}-{d}") }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="门店ID" align="center" prop="barCode" />
+      <el-table-column
+        label="核销城市"
+        align="center"
+        prop="verifyCity"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="核销啤酒币数量"
+        align="center"
+        prop="verifyIconAmount"
+      />
+      <el-table-column label="核销活动ID" align="center" prop="activityId" />
+      <!-- <el-table-column label="核销ip" align="center" prop="verifyIp" /> -->
+      <!-- <el-table-column label="备注" align="center" prop="remark" /> -->
+      <el-table-column
+        label="操作"
+        fixed="right"
+        width="150"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            @click="handleInfo(scope.row)"
+            v-hasPermi="['brewery:qrcode:edit']"
+            >查看详情</el-button
+          >
+          <!-- <el-button
+            link
+            type="primary"
+            icon="Delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['brewery:qrcode:remove']"
+            >删除</el-button
+          > -->
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改酒品二维码对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="qrcodeRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="品牌方id" prop="breweryId">
+          <el-input v-model="form.breweryId" placeholder="请输入品牌方id" />
+        </el-form-item>
+        <el-form-item label="批次id" prop="batchId">
+          <el-input v-model="form.batchId" placeholder="请输入批次id" />
+        </el-form-item>
+        <el-form-item label="啤酒id" prop="beerId">
+          <el-input v-model="form.beerId" placeholder="请输入啤酒id" />
+        </el-form-item>
+        <!-- <el-form-item label="sku编号" prop="skuSn">
+            <el-input v-model="form.skuSn" placeholder="请输入sku编号" />
+          </el-form-item> -->
+        <el-form-item label="二维码" prop="qrcodeUrl">
+          <el-input v-model="form.qrcodeUrl" placeholder="请输入二维码链接" />
+        </el-form-item>
+        <el-form-item label="核销时间" prop="verifyTime">
+          <el-date-picker
+            clearable
+            v-model="form.verifyTime"
+            type="date"
+            value-format="YYYY-MM-DD"
+            placeholder="请选择核销时间"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="被扫次数" prop="scanTimes">
+          <el-input v-model="form.scanTimes" placeholder="请输入被扫次数" />
+        </el-form-item>
+        <el-form-item label="核销城市" prop="verifyCity">
+          <el-input v-model="form.verifyCity" placeholder="请输入核销城市" />
+        </el-form-item>
+        <el-form-item label="核销ip" prop="verifyIp">
+          <el-input v-model="form.verifyIp" placeholder="请输入核销ip" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="form.remark"
+            type="textarea"
+            placeholder="请输入内容"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Qrcode">
+import {
+  listQrcode,
+  getQrcode,
+  delQrcode,
+  addQrcode,
+  updateQrcode,
+} from "@/api/brewery/qrcode";
+import { allBeers } from "@/api/brewery/beer";
+const { proxy } = getCurrentInstance();
+const router = useRouter();
+const qrcodeList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const allBeersList = ref([]); // 所有啤酒列表
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    breweryId: null,
+    batchId: null,
+    beerId: null,
+    skuSn: null,
+    qrcodeUrl: null,
+    qrcodeStatus: null,
+    verifyTime: null,
+    scanTimes: null,
+    verifyCity: null,
+    verifyIp: null,
+  },
+  rules: {},
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询酒品二维码列表 */
+function getList() {
+  loading.value = true;
+  listQrcode(queryParams.value).then((response) => {
+    qrcodeList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    id: null,
+    breweryId: null,
+    batchId: null,
+    beerId: null,
+    skuSn: null,
+    qrcodeUrl: null,
+    qrcodeStatus: null,
+    verifyTime: null,
+    scanTimes: null,
+    verifyCity: null,
+    verifyIp: null,
+    createBy: null,
+    createTime: null,
+    updateBy: null,
+    updateTime: null,
+    remark: null,
+  };
+  proxy.resetForm("qrcodeRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加酒品二维码";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _id = row.id || ids.value;
+  getQrcode(_id).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改酒品二维码";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["qrcodeRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.id != null) {
+        updateQrcode(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addQrcode(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _ids = row.id || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除酒品二维码编号为"' + _ids + '"的数据项？')
+    .then(function () {
+      return delQrcode(_ids);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "brewery/qrcode/export",
+    {
+      ...queryParams.value,
+    },
+    `qrcode_${new Date().getTime()}.xlsx`
+  );
+}
+// 获取所有啤酒列表
+function getAllBeersFun() {
+  allBeers().then((response) => {
+    allBeersList.value = response.data;
+  });
+}
+function handleInfo(row) {
+  router.push({
+    path: "/product/qrcodeInfo",
+    query: {
+      id: row.id,
+    },
+  });
+}
+// getAllBeersFun();
+getList();
+</script>
diff --git a/src/views/qrcode/info.vue b/src/views/qrcode/info.vue
new file mode 100644
index 0000000..e8626d4
--- /dev/null
+++ b/src/views/qrcode/info.vue
@@ -0,0 +1,104 @@
+<template>
+  <div class="app-container">
+    <div style="display: flex; justify-content: space-between">
+      <div class="zd-card" style="width: 49.5%">
+        <h4>基本信息</h4>
+        <el-descriptions :column="1">
+          <el-descriptions-item label="条码ID：">{{
+            info.skuSn
+          }}</el-descriptions-item>
+          <el-descriptions-item label="酒款ID：">{{
+            info.beerId
+          }}</el-descriptions-item>
+          <el-descriptions-item label="酒款名称：">{{
+            info.beerName
+          }}</el-descriptions-item>
+          <el-descriptions-item label="批次号：">{{
+            info.batchSn
+          }}</el-descriptions-item>
+          <el-descriptions-item label="编码生成日期：">{{
+            info.createTime || info.updateTime
+          }}</el-descriptions-item>
+
+          <el-descriptions-item label="生产日期："
+            >{{ info.productionDate }}
+          </el-descriptions-item>
+        </el-descriptions>
+      </div>
+      <div class="zd-card" style="width: 49.5%">
+        <h4>核销门店信息</h4>
+        <el-descriptions :column="1">
+          <el-descriptions-item label="门店ID："
+            >{{ info.barCode }}
+          </el-descriptions-item>
+          <el-descriptions-item label="所在城市："
+            >{{ info.verifyCity }}
+          </el-descriptions-item>
+          <el-descriptions-item label="核销时间："
+            >{{ info.verifyTime }}
+          </el-descriptions-item>
+          <el-descriptions-item label="核销活动信息："
+            >{{ info.activity && info.activity.activityName }}
+          </el-descriptions-item>
+          <el-descriptions-item label="核销啤酒币数量："
+            >{{ info.verifyIconAmount }}
+          </el-descriptions-item>
+          <el-descriptions-item label="参与活动ID："
+            >{{ info.activityId }}
+          </el-descriptions-item>
+          <el-descriptions-item label="活动目标："
+            >{{ info.activity && info.activity.activityTarget }}
+          </el-descriptions-item>
+        </el-descriptions>
+      </div>
+    </div>
+    <div class="zd-card">
+      <h4>扫码记录</h4>
+      <el-table v-loading="loading" :data="scanLog" class="zd-table">
+        <el-table-column prop="scanTime" label="扫码时间"></el-table-column>
+        <el-table-column prop="userId" label="用户ID"></el-table-column>
+        <el-table-column prop="scanCity" label="城市"></el-table-column>
+        <el-table-column prop="remark" label="用户操作"></el-table-column>
+      </el-table>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import {
+  getQrcode,
+  qrcodeScanLogList,
+  cancelConsume,
+} from "@/api/brewery/qrcode";
+import { onMounted } from "vue";
+const route = useRoute();
+const qrcodeId = ref(null);
+const loading = ref(false);
+const scanLog = ref([]);
+const info = ref({});
+onMounted(() => {
+  qrcodeId.value = route.query.id;
+  getQrcodeInfo();
+  qrcodeScanLog();
+});
+function getQrcodeInfo() {
+  getQrcode(qrcodeId.value).then((res) => {
+    console.log(res);
+    info.value = res.data;
+  });
+}
+function qrcodeScanLog() {
+  qrcodeScanLogList(qrcodeId.value).then((res) => {
+    console.log(res);
+    scanLog.value = res.data;
+  });
+}
+function handleCancelConsume(id) {
+  cancelConsume({ logId: id }).then((res) => {
+    console.log(res);
+    qrcodeScanLog();
+  });
+}
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/redirect/index.vue b/src/views/redirect/index.vue
new file mode 100644
index 0000000..a469960
--- /dev/null
+++ b/src/views/redirect/index.vue
@@ -0,0 +1,14 @@
+<template>
+  <div></div>
+</template>
+
+<script setup>
+import { useRoute, useRouter } from 'vue-router'
+
+const route = useRoute();
+const router = useRouter();
+const { params, query } = route
+const { path } = params
+
+router.replace({ path: '/' + path, query })
+</script>
\ No newline at end of file
diff --git a/src/views/register.vue b/src/views/register.vue
new file mode 100644
index 0000000..710ebc7
--- /dev/null
+++ b/src/views/register.vue
@@ -0,0 +1,219 @@
+<template>
+  <div class="register">
+    <el-form ref="registerRef" :model="registerForm" :rules="registerRules" class="register-form">
+      <h3 class="title">枝点品牌方后台管理系统</h3>
+      <el-form-item prop="username">
+        <el-input 
+          v-model="registerForm.username" 
+          type="text" 
+          size="large" 
+          auto-complete="off" 
+          placeholder="账号"
+        >
+          <template #prefix><svg-icon icon-class="user" class="el-input__icon input-icon" /></template>
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="password">
+        <el-input
+          v-model="registerForm.password"
+          type="password"
+          size="large" 
+          auto-complete="off"
+          placeholder="密码"
+          @keyup.enter="handleRegister"
+        >
+          <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template>
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="confirmPassword">
+        <el-input
+          v-model="registerForm.confirmPassword"
+          type="password"
+          size="large" 
+          auto-complete="off"
+          placeholder="确认密码"
+          @keyup.enter="handleRegister"
+        >
+          <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template>
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="code" v-if="captchaEnabled">
+        <el-input
+          size="large" 
+          v-model="registerForm.code"
+          auto-complete="off"
+          placeholder="验证码"
+          style="width: 63%"
+          @keyup.enter="handleRegister"
+        >
+          <template #prefix><svg-icon icon-class="validCode" class="el-input__icon input-icon" /></template>
+        </el-input>
+        <div class="register-code">
+          <img :src="codeUrl" @click="getCode" class="register-code-img"/>
+        </div>
+      </el-form-item>
+      <el-form-item style="width:100%;">
+        <el-button
+          :loading="loading"
+          size="large" 
+          type="primary"
+          style="width:100%;"
+          @click.prevent="handleRegister"
+        >
+          <span v-if="!loading">注 册</span>
+          <span v-else>注 册 中...</span>
+        </el-button>
+        <div style="float: right;">
+          <router-link class="link-type" :to="'/login'">使用已有账户登录</router-link>
+        </div>
+      </el-form-item>
+    </el-form>
+    <!--  底部  -->
+    <div class="el-register-footer">
+      <span>Copyright © 2018-2024 ruoyi.vip All Rights Reserved.</span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ElMessageBox } from "element-plus";
+import { getCodeImg, register } from "@/api/login";
+
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+
+const registerForm = ref({
+  username: "",
+  password: "",
+  confirmPassword: "",
+  code: "",
+  uuid: ""
+});
+
+const equalToPassword = (rule, value, callback) => {
+  if (registerForm.value.password !== value) {
+    callback(new Error("两次输入的密码不一致"));
+  } else {
+    callback();
+  }
+};
+
+const registerRules = {
+  username: [
+    { required: true, trigger: "blur", message: "请输入您的账号" },
+    { min: 2, max: 20, message: "用户账号长度必须介于 2 和 20 之间", trigger: "blur" }
+  ],
+  password: [
+    { required: true, trigger: "blur", message: "请输入您的密码" },
+    { min: 5, max: 20, message: "用户密码长度必须介于 5 和 20 之间", trigger: "blur" },
+    { pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符：< > \" ' \\\ |", trigger: "blur" }
+  ],
+  confirmPassword: [
+    { required: true, trigger: "blur", message: "请再次输入您的密码" },
+    { required: true, validator: equalToPassword, trigger: "blur" }
+  ],
+  code: [{ required: true, trigger: "change", message: "请输入验证码" }]
+};
+
+const codeUrl = ref("");
+const loading = ref(false);
+const captchaEnabled = ref(true);
+
+function handleRegister() {
+  proxy.$refs.registerRef.validate(valid => {
+    if (valid) {
+      loading.value = true;
+      register(registerForm.value).then(res => {
+        const username = registerForm.value.username;
+        ElMessageBox.alert("<font color='red'>恭喜你，您的账号 " + username + " 注册成功！</font>", "系统提示", {
+          dangerouslyUseHTMLString: true,
+          type: "success",
+        }).then(() => {
+          router.push("/login");
+        }).catch(() => {});
+      }).catch(() => {
+        loading.value = false;
+        if (captchaEnabled) {
+          getCode();
+        }
+      });
+    }
+  });
+}
+
+function getCode() {
+  getCodeImg().then(res => {
+    captchaEnabled.value = res.captchaEnabled === undefined ? true : res.captchaEnabled;
+    if (captchaEnabled.value) {
+      codeUrl.value = "data:image/gif;base64," + res.img;
+      registerForm.value.uuid = res.uuid;
+    }
+  });
+}
+
+getCode();
+</script>
+
+<style lang='scss' scoped>
+.register {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  background-image: url("../assets/images/login-background.jpg");
+  background-size: cover;
+}
+.title {
+  margin: 0px auto 30px auto;
+  text-align: center;
+  color: #707070;
+}
+
+.register-form {
+  border-radius: 6px;
+  background: #ffffff;
+  width: 400px;
+  padding: 25px 25px 5px 25px;
+  .el-input {
+    height: 40px;
+    input {
+      height: 40px;
+    }
+  }
+  .input-icon {
+    height: 39px;
+    width: 14px;
+    margin-left: 0px;
+  }
+}
+.register-tip {
+  font-size: 13px;
+  text-align: center;
+  color: #bfbfbf;
+}
+.register-code {
+  width: 33%;
+  height: 40px;
+  float: right;
+  img {
+    cursor: pointer;
+    vertical-align: middle;
+  }
+}
+.el-register-footer {
+  height: 40px;
+  line-height: 40px;
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  text-align: center;
+  color: #fff;
+  font-family: Arial;
+  font-size: 12px;
+  letter-spacing: 1px;
+}
+.register-code-img {
+  height: 40px;
+  padding-left: 12px;
+}
+</style>
diff --git a/src/views/setting/account.vue b/src/views/setting/account.vue
new file mode 100644
index 0000000..3f1d6fc
--- /dev/null
+++ b/src/views/setting/account.vue
@@ -0,0 +1,608 @@
+<template>
+  <div class="app-container home">
+    <el-card class="update-log" shadow="never" style="margin-bottom: 10px">
+      <div class="body">
+        <div class="header-title">
+          <span>品牌信息</span>
+          <div>
+            <el-button type="text" @click="editBrandInfo">编辑</el-button>
+            <el-divider direction="vertical"></el-divider>
+            <el-button v-if="authInfo.id" type="text" @click="showBrandAuth"
+              >更新认证</el-button
+            >
+            <el-button v-else type="text" @click="showBrandAuth"
+              >认证</el-button
+            >
+          </div>
+        </div>
+        <div style="display: flex">
+          <div class="user-info-head" @click="editBrandInfo">
+            <img
+              v-if="breweryInfo.brandLogo"
+              :src="breweryInfo.brandLogo"
+              title="点击上传Logo"
+              class="img-circle img-lg"
+            />
+            <div
+              v-else
+              class="img-circle img-lg"
+              style="
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                border: 1px solid #ccc;
+              "
+            >
+              上传Logo
+            </div>
+          </div>
+          <div style="width: 100%">
+            <div class="name">
+              {{ breweryInfo.brandName }}
+              <el-tag
+                v-if="breweryInfo.authorized == 1"
+                type="primary"
+                style="margin-left: 10px"
+                >已认证</el-tag
+              >
+              <el-tag v-else type="danger" style="margin-left: 10px"
+                >未认证</el-tag
+              >
+            </div>
+            <el-row
+              :gutter="20"
+              style="display: flex; width: 100%; height: 85%"
+            >
+              <el-col :sm="10" :lg="10">
+                <!-- <div class="row">
+                    <div class="label"></div>
+                    
+                  </div> -->
+                <ul>
+                  <li>品牌ID：{{ breweryInfo.brandCode }}</li>
+                  <li>
+                    所在地区：{{ breweryInfo.country }}-{{
+                      breweryInfo.province
+                    }}-{{ breweryInfo.city }}
+                  </li>
+                  <li>联系人：{{ breweryInfo.contactPerson }}</li>
+                  <li>联系方式：{{ breweryInfo.contactPhone }}</li>
+                  <li>创立时间：{{ breweryInfo.buildingDate }}</li>
+                  <li>酒款产品数量： {{ breweryInfo.productCount }}</li>
+                  <li style="display: flex; align-items: flex-start">
+                    <span style="flex-shrink: 0">品牌方简介：</span
+                    ><span>{{ breweryInfo.desc }}</span>
+                  </li>
+                </ul>
+              </el-col>
+              <!-- 屏幕宽度大于1200px时，显示分割线  -->
+              <el-col :sm="1" :lg="1">
+                <div style="height: 85%; border-left: 1px solid #e9e9e9"></div>
+              </el-col>
+              <el-col :sm="8" :lg="8">
+                <ul>
+                  <li>生产商名称：{{ authInfo.producer }}</li>
+                  <li>主体信息：{{ authInfo.businessEntity }}</li>
+                  <li>主体许可证编号：{{ authInfo.productionLicenseSn }}</li>
+                  <li>负责人姓名：{{ authInfo.manager }}</li>
+                  <li>负责人联系方式：{{ authInfo.managerPhone }}</li>
+                  <li>客服电话：{{ authInfo.customerSupportNumber }}</li>
+                </ul>
+              </el-col>
+              <el-col :sm="5" :lg="5">
+                <ul>
+                  <li
+                    style="
+                      display: flex;
+                      align-items: flex-start;
+                      flex-wrap: wrap;
+                    "
+                  >
+                    主体许可证：<el-image
+                      style="width: 100px; height: 100px"
+                      :src="authInfo.productionLicense"
+                      :zoom-rate="1.2"
+                      :max-scale="7"
+                      :min-scale="0.2"
+                      :preview-src-list="[authInfo.productionLicense]"
+                      :initial-index="4"
+                      fit="cover"
+                      title="点击查看大图"
+                    />
+                  </li>
+                  <!-- <li style="display: flex;align-items: flex-start;">品牌授权书：<el-image
+                        style="width: 100px; height: 100px"
+                        :src="authInfo.authorizationUrl"
+                        :zoom-rate="1.2"
+                        :max-scale="7"
+                        :min-scale="0.2"
+                        :preview-src-list="[authInfo.authorizationUrl]"
+                        :initial-index="4"
+                        fit="cover"
+                        title="点击查看大图"
+                      /></li> -->
+                </ul>
+              </el-col>
+            </el-row>
+          </div>
+        </div>
+      </div>
+    </el-card>
+    <!-- <el-row  :gutter="10" style="height: calc(100vh - 414px)">
+      <el-col :sm="12" :lg="12" style="margin-bottom: 10px">
+        <el-card class="update-log" shadow="never" style="height: 100%">
+          <div class="body">
+            <div class="header-title">
+              <span>员工管理</span>
+            </div>
+            <div
+              style="
+                display: flex;
+                justify-content: flex-start;
+                flex-wrap: wrap;
+              "
+            >
+              <div style="width: 180px; text-align: center">
+                <div style="color: #999">已有员工数</div>
+                <div style="font-size: 24px; margin: 8px 0px">10</div>
+                <el-button type="text" size="small">去添加</el-button>
+              </div>
+              <div style="width: 180px; text-align: center">
+                <div style="color: #999">停用员工数</div>
+                <div style="font-size: 24px; margin: 8px 0px">10</div>
+                <el-button type="text" size="small">去启用</el-button>
+              </div>
+            </div>
+            <el-divider></el-divider>
+            <div>
+              <div style="margin-bottom: 10px">最近员工操作</div>
+              <ul style="overflow-y: auto; height: 200px; padding-right: 10px">
+                <li v-for="item in 10" :key="item">
+                  <div
+                    style="
+                      display: flex;
+                      justify-content: space-between;
+                      gap: 20px;
+                    "
+                  >
+                    <span>张三</span>
+                    <div
+                      style="
+                        color: #666;
+                        flex: 1;
+                        text-overflow: ellipsis;
+                        white-space: nowrap;
+                        overflow: hidden;
+                      "
+                    >
+                      新增员工
+                    </div>
+                    <span>2021-01-01 10:00:00</span>
+                  </div>
+                </li>
+              </ul>
+            </div>
+          </div>
+        </el-card>
+      </el-col>
+      <el-col :sm="12" :lg="12" style="margin-bottom: 10px">
+        <el-card class="update-log" shadow="never" style="height: 100%">
+          <div class="body">
+            <div class="header-title">
+              <span>联系地址</span>
+            </div>
+
+            <el-descriptions column="1" label-width="80px">
+              <el-descriptions-item
+                label="客服电话："
+                >{{
+              }}</el-descriptions-item>
+              <el-descriptions-item label="联系地址："
+                >{{ breweryInfo.country }}-{{ breweryInfo.province }}-{{
+                  breweryInfo.city
+                }}</el-descriptions-item
+              >
+            </el-descriptions>
+          </div>
+        </el-card>
+      </el-col>
+    </el-row> -->
+
+    <!-- 编辑品牌信息弹窗 -->
+    <el-dialog
+      title="编辑品牌信息"
+      v-model="editBrandVisible"
+      width="600px"
+      append-to-body
+      :close-on-press-escape="false"
+      :close-on-click-modal="false"
+    >
+      <el-form
+        ref="BrandRef"
+        :model="editBrandForm"
+        :rules="rules"
+        label-width="110px"
+      >
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="品牌Logo" prop="brandLogo">
+              <ImageUpload
+                v-model="editBrandForm.brandLogo"
+                :fileSize="5"
+                :limit="1"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="品牌首页背景图" prop="brandCover">
+              <ImageUpload
+                v-model="editBrandForm.brandCover"
+                :fileSize="5"
+                :limit="1"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="品牌方名称" prop="brandName">
+          <el-input
+            v-model="editBrandForm.brandName"
+            placeholder="请输入品牌方名称"
+          />
+        </el-form-item>
+        <el-row>
+          <el-col :span="12"
+            ><el-form-item label="联系人" prop="contactPerson">
+              <el-input
+                v-model="editBrandForm.contactPerson"
+                placeholder="请输入联系人"
+              /> </el-form-item
+          ></el-col>
+          <el-col :span="12"
+            ><el-form-item label="联系方式" prop="contactPhone">
+              <el-input
+                v-model="editBrandForm.contactPhone"
+                placeholder="请输入联系方式"
+              /> </el-form-item
+          ></el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="国家" prop="country">
+              <el-input
+                :model-value="editBrandForm.country"
+                disabled
+                placeholder="请输入国家"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="16">
+            <el-form-item label="地区" prop="province">
+              <el-cascader
+                placeholder="请选择省市"
+                :options="pcTextArr"
+                v-model="selectedOptions"
+                style="width: 100%"
+                @change="handleChange"
+              >
+              </el-cascader>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="创立时间" prop="buildingDate">
+          <el-date-picker
+            v-model="editBrandForm.buildingDate"
+            type="date"
+            placeholder="选择日期"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="品牌方简介" prop="desc">
+          <el-input
+            v-model="editBrandForm.desc"
+            maxlength="70"
+            show-word-limit
+            type="textarea"
+            placeholder="请输入内容"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!-- 品牌认证弹窗 -->
+    <el-dialog
+      title="认证"
+      v-model="authVisible"
+      width="720px"
+      append-to-body
+      :close-on-press-escape="false"
+      :close-on-click-modal="false"
+    >
+      <el-form
+        ref="authRef"
+        :model="authForm"
+        :rules="rules"
+        label-width="140px"
+      >
+        <el-form-item label="生产商名称" prop="producer">
+          <el-input
+            v-model="authForm.producer"
+            placeholder="请输入生产商名称"
+          />
+        </el-form-item>
+        <el-form-item label="生产许可证号" prop="productionLicenseSn">
+          <el-input
+            v-model="authForm.productionLicenseSn"
+            placeholder="请输入生产许可证号"
+          />
+        </el-form-item>
+        <el-form-item label="主体信息" prop="businessEntity">
+          <el-input
+            v-model="authForm.businessEntity"
+            placeholder="请输入主体信息"
+          />
+        </el-form-item>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="许可证扫描件" prop="productionLicense">
+              <ImageUpload
+                v-model="authForm.productionLicense"
+                :fileSize="5"
+                :limit="1"
+              />
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="12">
+                <el-form-item label="品牌授权书" prop="authorizationUrl">
+              <ImageUpload v-model="authForm.authorizationUrl" :fileSize="5" :limit="1" />
+            </el-form-item>
+              </el-col> -->
+        </el-row>
+        <el-row>
+          <el-col :span="12"
+            ><el-form-item label="负责人" prop="manager">
+              <el-input
+                v-model="authForm.manager"
+                placeholder="请输入负责人"
+              /> </el-form-item
+          ></el-col>
+          <el-col :span="12"
+            ><el-form-item label="负责人联系方式" prop="managerPhone">
+              <el-input
+                v-model="authForm.managerPhone"
+                placeholder="请输入联系方式"
+              /> </el-form-item
+          ></el-col>
+        </el-row>
+
+        <el-form-item label="地址" prop="address">
+          <el-input v-model="authForm.address" placeholder="请输入地址" />
+        </el-form-item>
+        <el-form-item label="客服电话" prop="customerSupportNumber">
+          <el-input
+            v-model="authForm.customerSupportNumber"
+            placeholder="请输入客服电话"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitAuthForm">确 定</el-button>
+          <el-button @click="cancelAuth">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Index">
+import { getBreweryInfo, updateBreweryInfo } from "@/api/brewery/breweryinfo";
+import { addAuth, getAuth, updateAuth } from "@/api/brewery/auth";
+import { pcTextArr } from "element-china-area-data";
+
+import useUserStore from "@/store/modules/user";
+const { proxy } = getCurrentInstance();
+const userInfo = useUserStore().userInfo;
+const breweryInfo = ref({}); // 品牌信息
+const editBrandVisible = ref(false); // 编辑品牌信息弹窗
+const editBrandForm = ref({
+  brandName: "",
+  contactPerson: "",
+  contactPhone: "",
+  province: "",
+  city: "",
+  buildingDate: "",
+  productCount: "",
+  desc: "",
+});
+const authVisible = ref(false); // 品牌认证弹窗
+const authInfo = ref({}); // 品牌认证信息
+const authForm = ref({
+  producer: "",
+  productionLicense: "",
+  productionLicenseSn: "",
+  manager: "",
+  managerPhone: "",
+  businessEntity: "",
+  authorizationUrl: "",
+  address: "",
+  customerSupportNumber: "",
+}); // 品牌认证表单
+const rules = {
+  brandLogo: [{ required: true, message: "请上传品牌Logo", trigger: "change" }],
+  brandName: [
+    { required: true, message: "请输入品牌方名称", trigger: "blur" },
+    { min: 2, max: 50, message: "长度在 2 到 50 个字符", trigger: "blur" },
+  ],
+  contactPerson: [
+    { required: true, message: "请输入联系人", trigger: "blur" },
+    { min: 2, max: 50, message: "长度在 2 到 50 个字符", trigger: "blur" },
+  ],
+  contactPhone: [
+    { required: true, message: "请输入联系方式", trigger: "blur" },
+    { min: 11, max: 11, message: "请输入正确的手机号", trigger: "blur" },
+  ],
+  province: [
+    { required: true, message: "请输入省份", trigger: "blur" },
+    { min: 2, max: 10, message: "长度在 2 到 10 个字符", trigger: "blur" },
+  ],
+  city: [
+    { required: true, message: "请输入城市", trigger: "blur" },
+    { min: 2, max: 10, message: "长度在 2 到 10 个字符", trigger: "blur" },
+  ],
+  buildingDate: [
+    { required: true, message: "请选择创立时间", trigger: "change" },
+  ],
+  productCount: [
+    { required: true, message: "请输入酒款产品数量", trigger: "blur" },
+  ],
+  desc: [
+    { required: true, message: "请输入品牌方简介", trigger: "blur" },
+    { min: 1, max: 200, message: "长度在 1 到 200 个字符", trigger: "blur" },
+  ],
+};
+const getBreweryInfoData = async () => {
+  console.log(userInfo);
+  const res = await getBreweryInfo(userInfo.breweryId);
+  if (res.code === 200) {
+    breweryInfo.value = res.data;
+  }
+};
+
+onMounted(() => {
+  getBreweryInfoData(); // 获取品牌信息
+  getAuthData(); // 获取品牌认证信息
+});
+// 上传logo
+const editBrandInfo = () => {
+  console.log("编辑品牌信息");
+  editBrandForm.value = { ...breweryInfo.value };
+  editBrandVisible.value = true;
+};
+const submitForm = () => {
+  console.log("提交表单");
+  updateBreweryInfo(editBrandForm.value).then((res) => {
+    if (res.code === 200) {
+      proxy.$modal.msgSuccess("编辑成功");
+      editBrandVisible.value = false;
+      getBreweryInfoData();
+    }
+  });
+};
+const cancel = () => {
+  editBrandVisible.value = false;
+};
+// 品牌认证信息
+async function getAuthData() {
+  const res = await getAuth();
+  console.log(res);
+  authInfo.value = res.data || {};
+}
+
+function showBrandAuth() {
+  authForm.value = { ...authInfo.value };
+  authVisible.value = true;
+}
+// 提交认证信息
+async function submitAuthForm() {
+  // authForm.value.breweryId = userInfo.breweryId;
+  if (authForm.value.id) {
+    const res = await updateAuth(authForm.value);
+    if (res.code === 200) {
+      proxy.$modal.msgSuccess("更新提交成功");
+      authVisible.value = false;
+      getAuthData();
+    } else {
+      console.log("认证失败");
+    }
+  } else {
+    const res = await addAuth(authForm.value);
+    if (res.code === 200) {
+      proxy.$modal.msgSuccess("提交成功");
+      authVisible.value = false;
+      getAuthData();
+    } else {
+      console.log("认证失败");
+    }
+  }
+}
+// 取消认证
+const cancelAuth = () => {
+  authVisible.value = false;
+};
+
+const selectedOptions = ref([]);
+function handleChange() {
+  console.log(selectedOptions.value);
+  editBrandForm.value.province = selectedOptions.value[0];
+  editBrandForm.value.city = selectedOptions.value[1];
+}
+</script>
+
+<style scoped lang="scss">
+ul {
+  // padding: 0;
+  margin: 0;
+}
+li {
+  list-style: none;
+  margin-bottom: 10px;
+}
+.app-container {
+  padding: 20px;
+  .header-title {
+    font-size: 20px;
+    font-weight: bold;
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 10px;
+  }
+  .name {
+    font-size: 18px;
+    font-weight: bold;
+    margin-left: 40px;
+    margin-bottom: 15px;
+  }
+}
+.user-info-head {
+  position: relative;
+  display: inline-block;
+  width: 120px;
+  height: 120px;
+}
+
+.user-info-head:hover:after {
+  content: "+";
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  color: #eee;
+  background: rgba(0, 0, 0, 0.5);
+  font-size: 24px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  cursor: pointer;
+  line-height: 110px;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+::v-deep .el-divider--vertical {
+  height: 85%;
+}
+
+.row {
+  display: flex;
+  .label {
+    width: 100px;
+  }
+}
+</style>
diff --git a/src/views/setting/els/beerName.js b/src/views/setting/els/beerName.js
new file mode 100644
index 0000000..cf20983
--- /dev/null
+++ b/src/views/setting/els/beerName.js
@@ -0,0 +1,333 @@
+import { hiprint } from "vue-plugin-hiprint";
+
+export default function (options) {
+  const addElementTypes = function (context) {
+    // 移除 旧的 customModule "元素"类型, 以避免重复
+    context.removePrintElementTypes("customModule"); // 这里不可用defaultModule，以为已经被插件占用了，如果用了，会导致与默认的provider冲突
+    // 添加 customModule "元素"类型
+    context.addPrintElementTypes("customModule", [
+      // 如果使用 hiprint.PrintElementTypeManager.build('.hiprintEpContainer2', "customModule") 这里会渲染这个 "常规" 分组名称
+      new hiprint.PrintElementTypeGroup("常规", [
+        {
+          tid: "customModule.beerName", // 唯一 key
+          type: "text", // 元素类型
+          title: "产品名称", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "产品名称",
+            field: "beerName",
+            testData: "小麦啤酒",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.materials", // 唯一 key
+          type: "text", // 元素类型
+          title: "原料/辅料", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "原料/辅料",
+            field: "materials",
+            testData: "大麦",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.netContent", // 唯一 key
+          type: "text", // 元素类型
+          title: "净含量", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "净含量",
+            field: "netContent",
+            testData: "20L",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+
+        {
+          tid: "customModule.beerAbv", // 唯一 key
+          type: "text", // 元素类型
+          title: "酒精度", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "酒精度",
+            field: "beerAbv",
+            testData: "≥4.3%vol",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.beerIbus", // 唯一 key
+          type: "text", // 元素类型
+          title: "苦度", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "苦度",
+            field: "beerIbus",
+            testData: "≥ 25",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.beerOg", // 唯一 key
+          type: "text", // 元素类型
+          title: "原麦汁浓度", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "原麦汁浓度",
+            field: "beerOg",
+            testData: "≥ 12P",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.shelfLife", // 唯一 key
+          type: "text", // 元素类型
+          title: "保质期", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "保质期",
+            field: "shelfLife",
+            testData: "12个月",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.productionDate", // 唯一 key
+          type: "text", // 元素类型
+          title: "生产日期", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "生产日期",
+            field: "productionDate",
+            testData: "2025-01-01",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.batchSn", // 唯一 key
+          type: "text", // 元素类型
+          title: "批次号", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "批次号",
+            field: "batchSn",
+            testData: "2025010101",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.executeStandard", // 唯一 key
+          type: "text", // 元素类型
+          title: "执行标准", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "执行标准",
+            field: "executeStandard",
+            testData: "GB/123123",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.qualityLevel", // 唯一 key
+          type: "text", // 元素类型
+          title: "质量等级", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "质量等级",
+            field: "qualityLevel",
+            testData: "优",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.storageMethod", // 唯一 key
+          type: "text", // 元素类型
+          title: "存储方式", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "存储方式",
+            field: "storageMethod",
+            testData: "冷藏储存",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.manufacturer", // 唯一 key
+          type: "text", // 元素类型
+          title: "生产商", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "生产商",
+            field: "manufacturer",
+            testData: "内蒙古",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.distributor", // 唯一 key
+          type: "text", // 元素类型
+          title: "委托生产商", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "委托生产商",
+            field: "distributor",
+            testData: "内蒙古",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.productionAddress", // 唯一 key
+          type: "text", // 元素类型
+          title: "生产地址", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "生产地址",
+            field: "productionAddress",
+            testData: "内蒙古",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.companyName", // 唯一 key
+          type: "text", // 元素类型
+          title: "公司地址", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "公司地址",
+            field: "companyName",
+            testData: "内蒙古",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.contactPerson", // 唯一 key
+          type: "text", // 元素类型
+          title: "产地", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "产地",
+            field: "contactPerson",
+            testData: "内蒙古",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.contactPhone", // 唯一 key
+          type: "text", // 元素类型
+          title: "联系电话", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "联系电话",
+            field: "contactPhone",
+            testData: "13888888888",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.remarks", // 唯一 key
+          type: "text", // 元素类型
+          title: "注意事项", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "注意事项",
+            field: "remarks",
+            testData: "请勿撞击！",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.licenseNumber", // 唯一 key
+          type: "text", // 元素类型
+          title: "生产许可证编号", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "生产许可证编号",
+            field: "licenseNumber",
+            testData: "SC1234567890",
+            fontSize: 12,
+            width: 200,
+            height: 14,
+          },
+        },
+        {
+          tid: "customModule.numberInChina", // 唯一 key
+          type: "text", // 元素类型
+          title: "境外生产企业在华注册编号", // 这里和 options 中的 title 一样。"拖拽时就显示" 优先级高于 options 的, "无法彻底删除"
+          // field: 'text' // 这里和 options 中的 field 一样。优先级高于 options 的, "无法彻底删除"
+          // data: "1111", // 这里和 options 中的 testData 一样。会有冲突, "无法彻底删除"
+          options: {
+            title: "境外生产企业在华注册编号",
+            field: "numberInChina",
+            testData: "000000001",
+            fontSize: 12,
+            width: 300,
+            height: 14,
+          },
+        },
+      ]),
+    ]);
+  };
+  return {
+    addElementTypes: addElementTypes,
+  };
+}
diff --git a/src/views/setting/material.vue b/src/views/setting/material.vue
new file mode 100644
index 0000000..fc4093c
--- /dev/null
+++ b/src/views/setting/material.vue
@@ -0,0 +1,11 @@
+<template>
+  <div>
+    <h1>Material</h1>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive } from "vue";
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/setting/print.vue b/src/views/setting/print.vue
new file mode 100644
index 0000000..8c65bdd
--- /dev/null
+++ b/src/views/setting/print.vue
@@ -0,0 +1,112 @@
+<template>
+  <div class="app-container">
+    <div
+      style="
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 16px;
+      "
+    >
+      <span>打印模版</span>
+    </div>
+    <el-button type="primary" @click="handleAdd">新建模板</el-button>
+    <div class="box-container">
+      <div class="box" v-for="(item, index) in list" :key="index">
+        <div class="bottom">
+          <div class="title">{{ item.templateName }}</div>
+          <div>
+            <el-button link type="primary" @click="handleEdit(item.id)"
+              >编辑</el-button
+            >
+            <!-- <el-button link type="primary" @click="handleView(item.id)"
+              >查看</el-button
+            > -->
+            <el-button link type="danger" @click="handleDelete(item.id)"
+              >删除</el-button
+            >
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, getCurrentInstance } from "vue";
+import {
+  listBreweryTagPrintTemplate,
+  delBreweryTagPrintTemplate,
+} from "@/api/brewery/printTemplate";
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+function handleAdd() {
+  router.push("/setting/templateInfo");
+}
+onMounted(() => {
+  getList();
+});
+const queryForm = ref({
+  pageNum: 1,
+  pageSize: 10,
+});
+const list = ref([]);
+const total = ref(0);
+function getList() {
+  listBreweryTagPrintTemplate(queryForm.value).then((res) => {
+    console.log(res);
+    list.value = res.rows;
+    total.value = res.total;
+  });
+}
+// 编辑
+function handleEdit(id) {
+  router.push({
+    path: "/setting/templateInfo",
+    query: { id },
+  });
+}
+// 删除
+function handleDelete(id) {
+  console.log(id);
+  proxy.$modal
+    .confirm('是否确认删除品牌方广告图编号为"' + id + '"的数据项？')
+    .then(() => {
+      delBreweryTagPrintTemplate(id).then(() => {
+        getList();
+        proxy.$message.success("删除成功");
+      });
+    })
+    .catch(() => {});
+}
+</script>
+
+<style scoped lang="scss">
+.box-container {
+  display: flex;
+  justify-content: flex-start;
+  margin-top: 16px;
+  .box {
+    border-radius: 4px;
+    background-color: #fff;
+    width: 200px;
+    height: 200px;
+    position: relative;
+    margin: 10px;
+    .bottom {
+      position: absolute;
+      bottom: 0;
+      // height: 50px;
+      background-color: #fff;
+      padding: 8px;
+      .title {
+        font-size: 16px;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        overflow: hidden;
+        margin-bottom: 6px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/setting/templateInfo.vue b/src/views/setting/templateInfo.vue
new file mode 100644
index 0000000..7a2208a
--- /dev/null
+++ b/src/views/setting/templateInfo.vue
@@ -0,0 +1,346 @@
+<template>
+  <div class="app-container">
+    <div>基础设置</div>
+    <div style="display: flex; justify-content: flex-start">
+      <div class="left">
+        <el-form ref="formRef" :model="form" label-width="100px">
+          <el-form-item label="模板名称：">
+            <el-input
+              v-model="form.templateName"
+              style="width: 300px"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="纸张尺寸：">
+            <!-- <el-input
+              v-model="form.pageSize"
+              readonly
+              style="width: 300px"
+            ></el-input> -->
+            <el-input
+              v-model="form.pageWidth"
+              placeholder="宽"
+              style="width: 100px"
+              oninput="value=value.replace(/[^0-9]/g,'')"
+            ></el-input>
+            <div style="padding: 0 10px">x</div>
+            <el-input
+              v-model="form.pageHeight"
+              placeholder="高"
+              style="width: 100px"
+              oninput="value=value.replace(/[^0-9]/g,'')"
+            ></el-input>
+          </el-form-item>
+          <!-- <el-form-item label="模板设置：">
+            <el-button type="primary" @click="print">打印</el-button>
+          </el-form-item> -->
+        </el-form>
+        <div class="ele-container">
+          <div style="font-weight: bold; margin-bottom: 20px">酒款信息</div>
+          <div
+            style="
+              display: flex;
+              flex-wrap: wrap;
+              justify-content: flex-start;
+              gap: 16px;
+            "
+          >
+            <div
+              class="ep-draggable-item item"
+              v-for="(item, index) in list1"
+              :key="index"
+              :tid="item.tid"
+            >
+              {{ item.title }}
+            </div>
+          </div>
+
+          <!-- <div
+            id="provider-container1"
+            class="container rect-printElement-types"
+          ></div> -->
+        </div>
+        <div class="ele-container" style="margin: 10px 0">
+          <div style="font-weight: bold; margin-bottom: 20px">生产信息</div>
+          <div
+            style="
+              display: flex;
+              flex-wrap: wrap;
+              justify-content: flex-start;
+              gap: 16px;
+            "
+          >
+            <div
+              class="ep-draggable-item item2"
+              v-for="(item, index) in list2"
+              :key="index"
+              :tid="item.tid"
+            >
+              {{ item.title }}
+            </div>
+          </div>
+        </div>
+        <div>
+          <el-button type="primary" @click="save">保存</el-button>
+          <el-button @click="cancel">取消</el-button>
+        </div>
+      </div>
+      <div class="right">
+        <div id="hiprint-printTemplate"></div>
+      </div>
+      <div class="right2">
+        <div id="PrintElementOptionSetting" style="width: 400px"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted } from "vue";
+import {
+  hiprint,
+  defaultElementTypeProvider,
+  disAutoConnect,
+} from "vue-plugin-hiprint";
+import beerName from "./els/beerName";
+
+import {
+  getBreweryTagPrintTemplate,
+  addBreweryTagPrintTemplate,
+  updateBreweryTagPrintTemplate,
+} from "@/api/brewery/printTemplate";
+import { getCurrentInstance } from "vue";
+const { proxy } = getCurrentInstance();
+const route = useRoute();
+const router = useRouter();
+let hiprintTemplate;
+const list1 = [
+  {
+    tid: "customModule.beerName",
+    title: "产品名称",
+  },
+  {
+    tid: "customModule.materials",
+    title: "原料/辅料",
+  },
+  {
+    tid: "customModule.netContent",
+    title: "净含量",
+  },
+  {
+    tid: "customModule.beerAbv",
+    title: "酒精度",
+  },
+  {
+    tid: "customModule.beerIbus",
+    title: "苦度",
+  },
+  {
+    tid: "customModule.beerOg",
+    title: "原麦汁浓度度",
+  },
+  {
+    tid: "customModule.shelfLife",
+    title: "保质期",
+  },
+  {
+    tid: "customModule.productionDate",
+    title: "生产日期",
+  },
+  {
+    tid: "customModule.batchSn",
+    title: "批次号",
+  },
+];
+const list2 = [
+  { tid: "customModule.executeStandard", title: "执行标准" },
+  { tid: "customModule.qualityLevel", title: "质量等级" },
+  { tid: "customModule.storageMethod", title: "存储方式" },
+  { tid: "customModule.manufacturer", title: "生产商" },
+  { tid: "customModule.distributor", title: "委托生产商" },
+  { tid: "customModule.productionAddress", title: "生产地址" },
+  { tid: "customModule.companyName", title: "公司地址" },
+  { tid: "customModule.contactPerson", title: "产地" },
+  { tid: "customModule.contactPhone", title: "联系电话" },
+  // { tid: "defaultModule.barcode", title: "条形码" },
+  { tid: "defaultModule.qrcode", title: "二维码" },
+  { tid: "customModule.remarks", title: "注意事项" },
+  { tid: "customModule.licenseNumber", title: "生产许可证编号" },
+
+  { tid: "customModule.numberInChina", title: "境外生产企业在华注册编号" },
+];
+// 文本：defaultModule.text
+// 图片：defaultModule.image
+// 长文：defaultModule.longText
+// 表格：defaultModule.table
+// 空白表格：defaultModule.emptyTable
+// 自定义文本：defaultModule.customText
+// 横线：defaultModule.hline
+// 竖线：defaultModule.vline
+// 矩形：defaultModule.rect
+// 椭圆：defaultModule.oval
+// 条形码：defaultModule.barcode
+// 二维码：defaultModule.qrcode
+disAutoConnect(); // 禁用自动连接
+
+const templateId = ref(null);
+hiprint.init({
+  providers: [defaultElementTypeProvider(), , beerName()],
+});
+onMounted(() => {
+  buildLeftElement();
+  buildDesigner();
+  templateId.value = route.query.id;
+  if (templateId.value) {
+    getTemplateInfo();
+  }
+});
+function getTemplateInfo() {
+  getBreweryTagPrintTemplate(templateId.value).then((res) => {
+    form.value.templateName = res.data.templateName;
+    // form.value.pageSize = `${res.data.pageWidth}MM * ${res.data.pageHeight}MM`;
+    form.value.pageHeight = res.data.pageHeight;
+    form.value.pageWidth = res.data.pageWidth;
+    hiprintTemplate.update(JSON.parse(res.data.elements));
+    // buildDesigner();
+  });
+}
+const form = ref({
+  pageSize: "76MM * 120MM",
+});
+
+function save() {
+  let arr = hiprintTemplate.getJson().panels[0].printElements;
+  // console.log(data.panels[0].printElements);
+  if (templateId.value) {
+    let data = {
+      id: templateId.value,
+      elements: JSON.stringify(hiprintTemplate.getJson()),
+      templateName: form.value.templateName,
+      pageWidth: form.value.pageWidth,
+      pageHeight: form.value.pageHeight,
+    };
+    updateBreweryTagPrintTemplate(data).then((res) => {
+      proxy.$message.success("保存成功");
+      router.go(-1);
+    });
+  } else {
+    let data = {
+      elements: JSON.stringify(hiprintTemplate.getJson()),
+      templateName: form.value.templateName,
+      pageWidth: form.value.pageWidth,
+      pageHeight: form.value.pageHeight,
+    };
+    addBreweryTagPrintTemplate(data).then((res) => {
+      proxy.$message.success("保存成功");
+      router.go(-1);
+    });
+  }
+}
+function cancel() {
+  router.go(-1);
+}
+function addProvider() {
+  let panel = hiprintTemplate.addPrintPanel({
+    width: 100,
+    height: 130,
+    // paperFooter: 340,
+    // paperHeader: 10,
+  });
+  //文本
+  panel.addPrintText({
+    options: {
+      width: 140,
+      height: 15,
+      top: 20,
+      left: 20,
+      title: "你好，世界！",
+      textAlign: "center",
+    },
+  });
+  hiprintTemplate.print({});
+}
+
+function print() {
+  let printData = { name: "CcSimple" };
+  // 参数: 打印时设置 左偏移量，上偏移量
+  let options = { leftOffset: -1, topOffset: -1 };
+  // 扩展
+  let ext = {
+    callback: () => {
+      console.log("浏览器打印窗口已打开");
+    },
+    styleHandler: () => {
+      // 重写 文本 打印样式
+      return "<style>.hiprint-printElement-text{color:red !important;}</style>";
+    },
+  };
+  // 调用浏览器打印
+  hiprintTemplate.print(printData, options, ext);
+}
+const buildLeftElement = () => {
+  // eslint-disable-next-line no-undef
+  hiprint.PrintElementTypeManager.buildByHtml($(".ep-draggable-item"));
+};
+
+const buildDesigner = () => {
+  // eslint-disable-next-line no-undef
+  $("#hiprint-printTemplate").empty(); // 先清空, 避免重复构建
+  hiprintTemplate = new hiprint.PrintTemplate({
+    settingContainer: "#PrintElementOptionSetting", // 元素参数容器
+    fontList: [
+      { title: "微软雅黑", value: "Microsoft YaHei" },
+      { title: "黑体", value: "STHeitiSC-Light" },
+      { title: "思源黑体", value: "SourceHanSansCN-Normal" },
+      { title: "王羲之书法体", value: "王羲之书法体" },
+      { title: "宋体", value: "SimSun" },
+      { title: "华为楷体", value: "STKaiti" },
+      { title: "cursive", value: "cursive" },
+    ],
+    onDataChanged: (type, json) => {
+      // 模板发生改变回调
+      console.log(type); // 新增、移动、删除、修改(参数调整)、大小、旋转
+      console.log(json); // 返回 template
+    },
+  });
+  // 构建 并填充到 容器中
+  hiprintTemplate.design("#hiprint-printTemplate");
+};
+</script>
+
+<style scoped lang="scss">
+.left {
+  width: 400px;
+  min-height: 100vh;
+  background-color: #fff;
+  padding: 10px;
+  .ele-container {
+    padding: 20px;
+    background-color: #f5f5f5;
+    margin-bottom: 10px;
+    .item {
+      width: 100px;
+      height: 32px;
+      line-height: 32px;
+      text-align: center;
+      border: 1px solid #ccc;
+      cursor: pointer;
+      margin-bottom: 10px;
+    }
+    .item2 {
+      min-width: 100px;
+      height: 32px;
+      line-height: 32px;
+      text-align: center;
+      border: 1px solid #ccc;
+      cursor: pointer;
+      margin-bottom: 10px;
+    }
+  }
+}
+.right {
+  width: 800px;
+  min-height: 100vh;
+  background-color: #f5f5f5;
+  padding: 10px;
+}
+</style>
diff --git a/src/views/statistics/ranking.vue b/src/views/statistics/ranking.vue
new file mode 100644
index 0000000..d960a0f
--- /dev/null
+++ b/src/views/statistics/ranking.vue
@@ -0,0 +1,12 @@
+<template>
+  <div>
+    核销数量排行
+  </div>
+</template>
+
+<script  setup>
+</script>
+
+<style scoped lang='scss'>
+
+</style>
\ No newline at end of file
diff --git a/src/views/statistics/verification.vue b/src/views/statistics/verification.vue
new file mode 100644
index 0000000..61fe432
--- /dev/null
+++ b/src/views/statistics/verification.vue
@@ -0,0 +1,13 @@
+<template>
+  <div>
+    核销数据统计
+  </div>
+</template>
+
+<script lang='ts' setup>
+import { ref,reactive } from 'vue'
+</script>
+
+<style scoped lang='scss'>
+
+</style>
\ No newline at end of file
diff --git a/src/views/system/config/index.vue b/src/views/system/config/index.vue
new file mode 100644
index 0000000..34a4b87
--- /dev/null
+++ b/src/views/system/config/index.vue
@@ -0,0 +1,316 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+         <el-form-item label="参数名称" prop="configName">
+            <el-input
+               v-model="queryParams.configName"
+               placeholder="请输入参数名称"
+               clearable
+               style="width: 240px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="参数键名" prop="configKey">
+            <el-input
+               v-model="queryParams.configKey"
+               placeholder="请输入参数键名"
+               clearable
+               style="width: 240px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="系统内置" prop="configType">
+            <el-select v-model="queryParams.configType" placeholder="系统内置" clearable>
+               <el-option
+                  v-for="dict in sys_yes_no"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="创建时间" style="width: 308px;">
+            <el-date-picker
+               v-model="dateRange"
+               value-format="YYYY-MM-DD"
+               type="daterange"
+               range-separator="-"
+               start-placeholder="开始日期"
+               end-placeholder="结束日期"
+            ></el-date-picker>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="handleAdd"
+               v-hasPermi="['system:config:add']"
+            >新增</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="success"
+               plain
+               icon="Edit"
+               :disabled="single"
+               @click="handleUpdate"
+               v-hasPermi="['system:config:edit']"
+            >修改</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['system:config:remove']"
+            >删除</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Download"
+               @click="handleExport"
+               v-hasPermi="['system:config:export']"
+            >导出</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Refresh"
+               @click="handleRefreshCache"
+               v-hasPermi="['system:config:remove']"
+            >刷新缓存</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table v-loading="loading" :data="configList" @selection-change="handleSelectionChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="参数主键" align="center" prop="configId" />
+         <el-table-column label="参数名称" align="center" prop="configName" :show-overflow-tooltip="true" />
+         <el-table-column label="参数键名" align="center" prop="configKey" :show-overflow-tooltip="true" />
+         <el-table-column label="参数键值" align="center" prop="configValue" :show-overflow-tooltip="true" />
+         <el-table-column label="系统内置" align="center" prop="configType">
+            <template #default="scope">
+               <dict-tag :options="sys_yes_no" :value="scope.row.configType" />
+            </template>
+         </el-table-column>
+         <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
+         <el-table-column label="创建时间" align="center" prop="createTime" width="180">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" width="150" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:config:edit']" >修改</el-button>
+               <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:config:remove']">删除</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+
+      <!-- 添加或修改参数配置对话框 -->
+      <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+         <el-form ref="configRef" :model="form" :rules="rules" label-width="80px">
+            <el-form-item label="参数名称" prop="configName">
+               <el-input v-model="form.configName" placeholder="请输入参数名称" />
+            </el-form-item>
+            <el-form-item label="参数键名" prop="configKey">
+               <el-input v-model="form.configKey" placeholder="请输入参数键名" />
+            </el-form-item>
+            <el-form-item label="参数键值" prop="configValue">
+               <el-input v-model="form.configValue" type="textarea" placeholder="请输入参数键值" />
+            </el-form-item>
+            <el-form-item label="系统内置" prop="configType">
+               <el-radio-group v-model="form.configType">
+                  <el-radio
+                     v-for="dict in sys_yes_no"
+                     :key="dict.value"
+                     :value="dict.value"
+                  >{{ dict.label }}</el-radio>
+               </el-radio-group>
+            </el-form-item>
+            <el-form-item label="备注" prop="remark">
+               <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+            </el-form-item>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitForm">确 定</el-button>
+               <el-button @click="cancel">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Config">
+import { listConfig, getConfig, delConfig, addConfig, updateConfig, refreshCache } from "@/api/system/config";
+
+const { proxy } = getCurrentInstance();
+const { sys_yes_no } = proxy.useDict("sys_yes_no");
+
+const configList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const dateRange = ref([]);
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    configName: undefined,
+    configKey: undefined,
+    configType: undefined
+  },
+  rules: {
+    configName: [{ required: true, message: "参数名称不能为空", trigger: "blur" }],
+    configKey: [{ required: true, message: "参数键名不能为空", trigger: "blur" }],
+    configValue: [{ required: true, message: "参数键值不能为空", trigger: "blur" }]
+  }
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询参数列表 */
+function getList() {
+  loading.value = true;
+  listConfig(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => {
+    configList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    configId: undefined,
+    configName: undefined,
+    configKey: undefined,
+    configValue: undefined,
+    configType: "Y",
+    remark: undefined
+  };
+  proxy.resetForm("configRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  dateRange.value = [];
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.configId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加参数";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const configId = row.configId || ids.value;
+  getConfig(configId).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改参数";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["configRef"].validate(valid => {
+    if (valid) {
+      if (form.value.configId != undefined) {
+        updateConfig(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addConfig(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const configIds = row.configId || ids.value;
+  proxy.$modal.confirm('是否确认删除参数编号为"' + configIds + '"的数据项？').then(function () {
+    return delConfig(configIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("system/config/export", {
+    ...queryParams.value
+  }, `config_${new Date().getTime()}.xlsx`);
+}
+
+/** 刷新缓存按钮操作 */
+function handleRefreshCache() {
+  refreshCache().then(() => {
+    proxy.$modal.msgSuccess("刷新缓存成功");
+  });
+}
+
+getList();
+</script>
diff --git a/src/views/system/dept/index.vue b/src/views/system/dept/index.vue
new file mode 100644
index 0000000..b356179
--- /dev/null
+++ b/src/views/system/dept/index.vue
@@ -0,0 +1,283 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
+         <el-form-item label="部门名称" prop="deptName">
+            <el-input
+               v-model="queryParams.deptName"
+               placeholder="请输入部门名称"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="状态" prop="status">
+            <el-select v-model="queryParams.status" placeholder="部门状态" clearable style="width: 200px">
+               <el-option
+                  v-for="dict in sys_normal_disable"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="handleAdd"
+               v-hasPermi="['system:dept:add']"
+            >新增</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="info"
+               plain
+               icon="Sort"
+               @click="toggleExpandAll"
+            >展开/折叠</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table
+         v-if="refreshTable"
+         v-loading="loading"
+         :data="deptList"
+         row-key="deptId"
+         :default-expand-all="isExpandAll"
+         :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+      >
+         <el-table-column prop="deptName" label="部门名称" width="260"></el-table-column>
+         <el-table-column prop="orderNum" label="排序" width="200"></el-table-column>
+         <el-table-column prop="status" label="状态" width="100">
+            <template #default="scope">
+               <dict-tag :options="sys_normal_disable" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="创建时间" align="center" prop="createTime" width="200">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dept:edit']">修改</el-button>
+               <el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['system:dept:add']">新增</el-button>
+               <el-button v-if="scope.row.parentId != 0" link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dept:remove']">删除</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <!-- 添加或修改部门对话框 -->
+      <el-dialog :title="title" v-model="open" width="600px" append-to-body>
+         <el-form ref="deptRef" :model="form" :rules="rules" label-width="80px">
+            <el-row>
+               <el-col :span="24" v-if="form.parentId !== 0">
+                  <el-form-item label="上级部门" prop="parentId">
+                     <el-tree-select
+                        v-model="form.parentId"
+                        :data="deptOptions"
+                        :props="{ value: 'deptId', label: 'deptName', children: 'children' }"
+                        value-key="deptId"
+                        placeholder="选择上级部门"
+                        check-strictly
+                     />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="部门名称" prop="deptName">
+                     <el-input v-model="form.deptName" placeholder="请输入部门名称" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="显示排序" prop="orderNum">
+                     <el-input-number v-model="form.orderNum" controls-position="right" :min="0" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="负责人" prop="leader">
+                     <el-input v-model="form.leader" placeholder="请输入负责人" maxlength="20" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="联系电话" prop="phone">
+                     <el-input v-model="form.phone" placeholder="请输入联系电话" maxlength="11" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="邮箱" prop="email">
+                     <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="部门状态">
+                     <el-radio-group v-model="form.status">
+                        <el-radio
+                           v-for="dict in sys_normal_disable"
+                           :key="dict.value"
+                           :value="dict.value"
+                        >{{ dict.label }}</el-radio>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+            </el-row>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitForm">确 定</el-button>
+               <el-button @click="cancel">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Dept">
+import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept";
+
+const { proxy } = getCurrentInstance();
+const { sys_normal_disable } = proxy.useDict("sys_normal_disable");
+
+const deptList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const title = ref("");
+const deptOptions = ref([]);
+const isExpandAll = ref(true);
+const refreshTable = ref(true);
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    deptName: undefined,
+    status: undefined
+  },
+  rules: {
+    parentId: [{ required: true, message: "上级部门不能为空", trigger: "blur" }],
+    deptName: [{ required: true, message: "部门名称不能为空", trigger: "blur" }],
+    orderNum: [{ required: true, message: "显示排序不能为空", trigger: "blur" }],
+    email: [{ type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }],
+    phone: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }]
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询部门列表 */
+function getList() {
+  loading.value = true;
+  listDept(queryParams.value).then(response => {
+    deptList.value = proxy.handleTree(response.data, "deptId");
+    loading.value = false;
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    deptId: undefined,
+    parentId: undefined,
+    deptName: undefined,
+    orderNum: 0,
+    leader: undefined,
+    phone: undefined,
+    email: undefined,
+    status: "0"
+  };
+  proxy.resetForm("deptRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 新增按钮操作 */
+function handleAdd(row) {
+  reset();
+  listDept().then(response => {
+    deptOptions.value = proxy.handleTree(response.data, "deptId");
+  });
+  if (row != undefined) {
+    form.value.parentId = row.deptId;
+  }
+  open.value = true;
+  title.value = "添加部门";
+}
+
+/** 展开/折叠操作 */
+function toggleExpandAll() {
+  refreshTable.value = false;
+  isExpandAll.value = !isExpandAll.value;
+  nextTick(() => {
+    refreshTable.value = true;
+  });
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  listDeptExcludeChild(row.deptId).then(response => {
+    deptOptions.value = proxy.handleTree(response.data, "deptId");
+  });
+  getDept(row.deptId).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改部门";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["deptRef"].validate(valid => {
+    if (valid) {
+      if (form.value.deptId != undefined) {
+        updateDept(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addDept(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  proxy.$modal.confirm('是否确认删除名称为"' + row.deptName + '"的数据项?').then(function() {
+    return delDept(row.deptId);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+getList();
+</script>
diff --git a/src/views/system/dict/data.vue b/src/views/system/dict/data.vue
new file mode 100644
index 0000000..9dc8eaf
--- /dev/null
+++ b/src/views/system/dict/data.vue
@@ -0,0 +1,362 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
+         <el-form-item label="字典名称" prop="dictType">
+            <el-select v-model="queryParams.dictType" style="width: 200px">
+               <el-option
+                  v-for="item in typeOptions"
+                  :key="item.dictId"
+                  :label="item.dictName"
+                  :value="item.dictType"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="字典标签" prop="dictLabel">
+            <el-input
+               v-model="queryParams.dictLabel"
+               placeholder="请输入字典标签"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="状态" prop="status">
+            <el-select v-model="queryParams.status" placeholder="数据状态" clearable style="width: 200px">
+               <el-option
+                  v-for="dict in sys_normal_disable"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="handleAdd"
+               v-hasPermi="['system:dict:add']"
+            >新增</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="success"
+               plain
+               icon="Edit"
+               :disabled="single"
+               @click="handleUpdate"
+               v-hasPermi="['system:dict:edit']"
+            >修改</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['system:dict:remove']"
+            >删除</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Download"
+               @click="handleExport"
+               v-hasPermi="['system:dict:export']"
+            >导出</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Close"
+               @click="handleClose"
+            >关闭</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="字典编码" align="center" prop="dictCode" />
+         <el-table-column label="字典标签" align="center" prop="dictLabel">
+            <template #default="scope">
+               <span v-if="(scope.row.listClass == '' || scope.row.listClass == 'default') && (scope.row.cssClass == '' || scope.row.cssClass == null)">{{ scope.row.dictLabel }}</span>
+               <el-tag v-else :type="scope.row.listClass == 'primary' ? '' : scope.row.listClass" :class="scope.row.cssClass">{{ scope.row.dictLabel }}</el-tag>
+            </template>
+         </el-table-column>
+         <el-table-column label="字典键值" align="center" prop="dictValue" />
+         <el-table-column label="字典排序" align="center" prop="dictSort" />
+         <el-table-column label="状态" align="center" prop="status">
+            <template #default="scope">
+               <dict-tag :options="sys_normal_disable" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
+         <el-table-column label="创建时间" align="center" prop="createTime" width="180">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dict:edit']">修改</el-button>
+               <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dict:remove']">删除</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+
+      <!-- 添加或修改参数配置对话框 -->
+      <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+         <el-form ref="dataRef" :model="form" :rules="rules" label-width="80px">
+            <el-form-item label="字典类型">
+               <el-input v-model="form.dictType" :disabled="true" />
+            </el-form-item>
+            <el-form-item label="数据标签" prop="dictLabel">
+               <el-input v-model="form.dictLabel" placeholder="请输入数据标签" />
+            </el-form-item>
+            <el-form-item label="数据键值" prop="dictValue">
+               <el-input v-model="form.dictValue" placeholder="请输入数据键值" />
+            </el-form-item>
+            <el-form-item label="样式属性" prop="cssClass">
+               <el-input v-model="form.cssClass" placeholder="请输入样式属性" />
+            </el-form-item>
+            <el-form-item label="显示排序" prop="dictSort">
+               <el-input-number v-model="form.dictSort" controls-position="right" :min="0" />
+            </el-form-item>
+            <el-form-item label="回显样式" prop="listClass">
+               <el-select v-model="form.listClass">
+                  <el-option
+                     v-for="item in listClassOptions"
+                     :key="item.value"
+                     :label="item.label + '(' + item.value + ')'"
+                     :value="item.value"
+                  ></el-option>
+               </el-select>
+            </el-form-item>
+            <el-form-item label="状态" prop="status">
+               <el-radio-group v-model="form.status">
+                  <el-radio
+                     v-for="dict in sys_normal_disable"
+                     :key="dict.value"
+                     :value="dict.value"
+                  >{{ dict.label }}</el-radio>
+               </el-radio-group>
+            </el-form-item>
+            <el-form-item label="备注" prop="remark">
+               <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
+            </el-form-item>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitForm">确 定</el-button>
+               <el-button @click="cancel">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Data">
+import useDictStore from '@/store/modules/dict'
+import { optionselect as getDictOptionselect, getType } from "@/api/system/dict/type";
+import { listData, getData, delData, addData, updateData } from "@/api/system/dict/data";
+
+const { proxy } = getCurrentInstance();
+const { sys_normal_disable } = proxy.useDict("sys_normal_disable");
+
+const dataList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const defaultDictType = ref("");
+const typeOptions = ref([]);
+const route = useRoute();
+// 数据标签回显样式
+const listClassOptions = ref([
+  { value: "default", label: "默认" }, 
+  { value: "primary", label: "主要" }, 
+  { value: "success", label: "成功" },
+  { value: "info", label: "信息" },
+  { value: "warning", label: "警告" },
+  { value: "danger", label: "危险" }
+]);
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    dictType: undefined,
+    dictLabel: undefined,
+    status: undefined
+  },
+  rules: {
+    dictLabel: [{ required: true, message: "数据标签不能为空", trigger: "blur" }],
+    dictValue: [{ required: true, message: "数据键值不能为空", trigger: "blur" }],
+    dictSort: [{ required: true, message: "数据顺序不能为空", trigger: "blur" }]
+  }
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询字典类型详细 */
+function getTypes(dictId) {
+  getType(dictId).then(response => {
+    queryParams.value.dictType = response.data.dictType;
+    defaultDictType.value = response.data.dictType;
+    getList();
+  });
+}
+
+/** 查询字典类型列表 */
+function getTypeList() {
+  getDictOptionselect().then(response => {
+    typeOptions.value = response.data;
+  });
+}
+
+/** 查询字典数据列表 */
+function getList() {
+  loading.value = true;
+  listData(queryParams.value).then(response => {
+    dataList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    dictCode: undefined,
+    dictLabel: undefined,
+    dictValue: undefined,
+    cssClass: undefined,
+    listClass: "default",
+    dictSort: 0,
+    status: "0",
+    remark: undefined
+  };
+  proxy.resetForm("dataRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 返回按钮操作 */
+function handleClose() {
+  const obj = { path: "/system/dict" };
+  proxy.$tab.closeOpenPage(obj);
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  queryParams.value.dictType = defaultDictType.value;
+  handleQuery();
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加字典数据";
+  form.value.dictType = queryParams.value.dictType;
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.dictCode);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const dictCode = row.dictCode || ids.value;
+  getData(dictCode).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改字典数据";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["dataRef"].validate(valid => {
+    if (valid) {
+      if (form.value.dictCode != undefined) {
+        updateData(form.value).then(response => {
+          useDictStore().removeDict(queryParams.value.dictType);
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addData(form.value).then(response => {
+          useDictStore().removeDict(queryParams.value.dictType);
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const dictCodes = row.dictCode || ids.value;
+  proxy.$modal.confirm('是否确认删除字典编码为"' + dictCodes + '"的数据项？').then(function() {
+    return delData(dictCodes);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+    useDictStore().removeDict(queryParams.value.dictType);
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("system/dict/data/export", {
+    ...queryParams.value
+  }, `dict_data_${new Date().getTime()}.xlsx`);
+}
+
+getTypes(route.params && route.params.dictId);
+getTypeList();
+</script>
diff --git a/src/views/system/dict/index.vue b/src/views/system/dict/index.vue
new file mode 100644
index 0000000..8f87966
--- /dev/null
+++ b/src/views/system/dict/index.vue
@@ -0,0 +1,323 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+         <el-form-item label="字典名称" prop="dictName">
+            <el-input
+               v-model="queryParams.dictName"
+               placeholder="请输入字典名称"
+               clearable
+               style="width: 240px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="字典类型" prop="dictType">
+            <el-input
+               v-model="queryParams.dictType"
+               placeholder="请输入字典类型"
+               clearable
+               style="width: 240px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="状态" prop="status">
+            <el-select
+               v-model="queryParams.status"
+               placeholder="字典状态"
+               clearable
+               style="width: 240px"
+            >
+               <el-option
+                  v-for="dict in sys_normal_disable"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="创建时间" style="width: 308px">
+            <el-date-picker
+               v-model="dateRange"
+               value-format="YYYY-MM-DD"
+               type="daterange"
+               range-separator="-"
+               start-placeholder="开始日期"
+               end-placeholder="结束日期"
+            ></el-date-picker>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="handleAdd"
+               v-hasPermi="['system:dict:add']"
+            >新增</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="success"
+               plain
+               icon="Edit"
+               :disabled="single"
+               @click="handleUpdate"
+               v-hasPermi="['system:dict:edit']"
+            >修改</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['system:dict:remove']"
+            >删除</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Download"
+               @click="handleExport"
+               v-hasPermi="['system:dict:export']"
+            >导出</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Refresh"
+               @click="handleRefreshCache"
+               v-hasPermi="['system:dict:remove']"
+            >刷新缓存</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table v-loading="loading" :data="typeList" @selection-change="handleSelectionChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="字典编号" align="center" prop="dictId" />
+         <el-table-column label="字典名称" align="center" prop="dictName" :show-overflow-tooltip="true"/>
+         <el-table-column label="字典类型" align="center" :show-overflow-tooltip="true">
+            <template #default="scope">
+               <router-link :to="'/system/dict-data/index/' + scope.row.dictId" class="link-type">
+                  <span>{{ scope.row.dictType }}</span>
+               </router-link>
+            </template>
+         </el-table-column>
+         <el-table-column label="状态" align="center" prop="status">
+            <template #default="scope">
+               <dict-tag :options="sys_normal_disable" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
+         <el-table-column label="创建时间" align="center" prop="createTime" width="180">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dict:edit']">修改</el-button>
+               <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dict:remove']">删除</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+
+      <!-- 添加或修改参数配置对话框 -->
+      <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+         <el-form ref="dictRef" :model="form" :rules="rules" label-width="80px">
+            <el-form-item label="字典名称" prop="dictName">
+               <el-input v-model="form.dictName" placeholder="请输入字典名称" />
+            </el-form-item>
+            <el-form-item label="字典类型" prop="dictType">
+               <el-input v-model="form.dictType" placeholder="请输入字典类型" />
+            </el-form-item>
+            <el-form-item label="状态" prop="status">
+               <el-radio-group v-model="form.status">
+                  <el-radio
+                     v-for="dict in sys_normal_disable"
+                     :key="dict.value"
+                     :value="dict.value"
+                  >{{ dict.label }}</el-radio>
+               </el-radio-group>
+            </el-form-item>
+            <el-form-item label="备注" prop="remark">
+               <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
+            </el-form-item>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitForm">确 定</el-button>
+               <el-button @click="cancel">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Dict">
+import useDictStore from '@/store/modules/dict'
+import { listType, getType, delType, addType, updateType, refreshCache } from "@/api/system/dict/type";
+
+const { proxy } = getCurrentInstance();
+const { sys_normal_disable } = proxy.useDict("sys_normal_disable");
+
+const typeList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const dateRange = ref([]);
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    dictName: undefined,
+    dictType: undefined,
+    status: undefined
+  },
+  rules: {
+    dictName: [{ required: true, message: "字典名称不能为空", trigger: "blur" }],
+    dictType: [{ required: true, message: "字典类型不能为空", trigger: "blur" }]
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询字典类型列表 */
+function getList() {
+  loading.value = true;
+  listType(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => {
+    typeList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    dictId: undefined,
+    dictName: undefined,
+    dictType: undefined,
+    status: "0",
+    remark: undefined
+  };
+  proxy.resetForm("dictRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  dateRange.value = [];
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加字典类型";
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.dictId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const dictId = row.dictId || ids.value;
+  getType(dictId).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改字典类型";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["dictRef"].validate(valid => {
+    if (valid) {
+      if (form.value.dictId != undefined) {
+        updateType(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addType(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const dictIds = row.dictId || ids.value;
+  proxy.$modal.confirm('是否确认删除字典编号为"' + dictIds + '"的数据项？').then(function() {
+    return delType(dictIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("system/dict/type/export", {
+    ...queryParams.value
+  }, `dict_${new Date().getTime()}.xlsx`);
+}
+
+/** 刷新缓存按钮操作 */
+function handleRefreshCache() {
+  refreshCache().then(() => {
+    proxy.$modal.msgSuccess("刷新成功");
+    useDictStore().cleanDict();
+  });
+}
+
+getList();
+</script>
diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue
new file mode 100644
index 0000000..6cd0a93
--- /dev/null
+++ b/src/views/system/menu/index.vue
@@ -0,0 +1,452 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
+         <el-form-item label="菜单名称" prop="menuName">
+            <el-input
+               v-model="queryParams.menuName"
+               placeholder="请输入菜单名称"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="状态" prop="status">
+            <el-select v-model="queryParams.status" placeholder="菜单状态" clearable style="width: 200px">
+               <el-option
+                  v-for="dict in sys_normal_disable"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="handleAdd"
+               v-hasPermi="['system:menu:add']"
+            >新增</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button 
+               type="info"
+               plain
+               icon="Sort"
+               @click="toggleExpandAll"
+            >展开/折叠</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table
+         v-if="refreshTable"
+         v-loading="loading"
+         :data="menuList"
+         row-key="menuId"
+         :default-expand-all="isExpandAll"
+         :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+      >
+         <el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>
+         <el-table-column prop="icon" label="图标" align="center" width="100">
+            <template #default="scope">
+               <svg-icon :icon-class="scope.row.icon" />
+            </template>
+         </el-table-column>
+         <el-table-column prop="orderNum" label="排序" width="60"></el-table-column>
+         <el-table-column prop="perms" label="权限标识" :show-overflow-tooltip="true"></el-table-column>
+         <el-table-column prop="component" label="组件路径" :show-overflow-tooltip="true"></el-table-column>
+         <el-table-column prop="status" label="状态" width="80">
+            <template #default="scope">
+               <dict-tag :options="sys_normal_disable" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="创建时间" align="center" width="160" prop="createTime">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" width="210" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:menu:edit']">修改</el-button>
+               <el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['system:menu:add']">新增</el-button>
+               <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:menu:remove']">删除</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <!-- 添加或修改菜单对话框 -->
+      <el-dialog :title="title" v-model="open" width="680px" append-to-body>
+         <el-form ref="menuRef" :model="form" :rules="rules" label-width="100px">
+            <el-row>
+               <el-col :span="24">
+                  <el-form-item label="上级菜单">
+                     <el-tree-select
+                        v-model="form.parentId"
+                        :data="menuOptions"
+                        :props="{ value: 'menuId', label: 'menuName', children: 'children' }"
+                        value-key="menuId"
+                        placeholder="选择上级菜单"
+                        check-strictly
+                     />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="菜单类型" prop="menuType">
+                     <el-radio-group v-model="form.menuType">
+                        <el-radio value="M">目录</el-radio>
+                        <el-radio value="C">菜单</el-radio>
+                        <el-radio value="F">按钮</el-radio>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12" v-if="form.menuType != 'F'">
+                  <el-form-item label="菜单图标" prop="icon">
+                     <el-popover
+                        placement="bottom-start"
+                        :width="540"
+                        trigger="click"
+                     >
+                        <template #reference>
+                           <el-input v-model="form.icon" placeholder="点击选择图标" @blur="showSelectIcon" readonly>
+                              <template #prefix>
+                                 <svg-icon
+                                    v-if="form.icon"
+                                    :icon-class="form.icon"
+                                    class="el-input__icon"
+                                    style="height: 32px;width: 16px;"
+                                 />
+                                 <el-icon v-else style="height: 32px;width: 16px;"><search /></el-icon>
+                              </template>
+                           </el-input>
+                        </template>
+                        <icon-select ref="iconSelectRef" @selected="selected" :active-icon="form.icon" />
+                     </el-popover>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="显示排序" prop="orderNum">
+                     <el-input-number v-model="form.orderNum" controls-position="right" :min="0" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="菜单名称" prop="menuName">
+                     <el-input v-model="form.menuName" placeholder="请输入菜单名称" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12" v-if="form.menuType == 'C'">
+                  <el-form-item prop="routeName">
+                     <template #label>
+                        <span>
+                           <el-tooltip content="默认不填则和路由地址相同：如地址为：`user`，则名称为`User`（注意：因为router会删除名称相同路由，为避免名字的冲突，特殊情况下请自定义，保证唯一性）" placement="top">
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>
+                           路由名称
+                        </span>
+                     </template>
+                     <el-input v-model="form.routeName" placeholder="请输入路由名称" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12" v-if="form.menuType != 'F'">
+                  <el-form-item>
+                     <template #label>
+                        <span>
+                           <el-tooltip content="选择是外链则路由地址需要以`http(s)://`开头" placement="top">
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>是否外链
+                        </span>
+                     </template>
+                     <el-radio-group v-model="form.isFrame">
+                        <el-radio value="0">是</el-radio>
+                        <el-radio value="1">否</el-radio>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12" v-if="form.menuType != 'F'">
+                  <el-form-item prop="path">
+                     <template #label>
+                        <span>
+                           <el-tooltip content="访问的路由地址，如：`user`，如外网地址需内链访问则以`http(s)://`开头" placement="top">
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>
+                           路由地址
+                        </span>
+                     </template>
+                     <el-input v-model="form.path" placeholder="请输入路由地址" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12" v-if="form.menuType == 'C'">
+                  <el-form-item prop="component">
+                     <template #label>
+                        <span>
+                           <el-tooltip content="访问的组件路径，如：`system/user/index`，默认在`views`目录下" placement="top">
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>
+                           组件路径
+                        </span>
+                     </template>
+                     <el-input v-model="form.component" placeholder="请输入组件路径" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12" v-if="form.menuType != 'M'">
+                  <el-form-item>
+                     <el-input v-model="form.perms" placeholder="请输入权限标识" maxlength="100" />
+                     <template #label>
+                        <span>
+                           <el-tooltip content="控制器中定义的权限字符，如：@PreAuthorize(`@ss.hasPermi('system:user:list')`)" placement="top">
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>
+                           权限字符
+                        </span>
+                     </template>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12" v-if="form.menuType == 'C'">
+                  <el-form-item>
+                     <el-input v-model="form.query" placeholder="请输入路由参数" maxlength="255" />
+                     <template #label>
+                        <span>
+                           <el-tooltip content='访问路由的默认传递参数，如：`{"id": 1, "name": "ry"}`' placement="top">
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>
+                           路由参数
+                        </span>
+                     </template>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12" v-if="form.menuType == 'C'">
+                  <el-form-item>
+                     <template #label>
+                        <span>
+                           <el-tooltip content="选择是则会被`keep-alive`缓存，需要匹配组件的`name`和地址保持一致" placement="top">
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>
+                           是否缓存
+                        </span>
+                     </template>
+                     <el-radio-group v-model="form.isCache">
+                        <el-radio value="0">缓存</el-radio>
+                        <el-radio value="1">不缓存</el-radio>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12" v-if="form.menuType != 'F'">
+                  <el-form-item>
+                     <template #label>
+                        <span>
+                           <el-tooltip content="选择隐藏则路由将不会出现在侧边栏，但仍然可以访问" placement="top">
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>
+                           显示状态
+                        </span>
+                     </template>
+                     <el-radio-group v-model="form.visible">
+                        <el-radio
+                           v-for="dict in sys_show_hide"
+                           :key="dict.value"
+                           :value="dict.value"
+                        >{{ dict.label }}</el-radio>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item>
+                     <template #label>
+                        <span>
+                           <el-tooltip content="选择停用则路由将不会出现在侧边栏，也不能被访问" placement="top">
+                              <el-icon><question-filled /></el-icon>
+                           </el-tooltip>
+                           菜单状态
+                        </span>
+                     </template>
+                     <el-radio-group v-model="form.status">
+                        <el-radio
+                           v-for="dict in sys_normal_disable"
+                           :key="dict.value"
+                           :value="dict.value"
+                        >{{ dict.label }}</el-radio>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+            </el-row>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitForm">确 定</el-button>
+               <el-button @click="cancel">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Menu">
+import { addMenu, delMenu, getMenu, listMenu, updateMenu } from "@/api/system/menu";
+import SvgIcon from "@/components/SvgIcon";
+import IconSelect from "@/components/IconSelect";
+
+const { proxy } = getCurrentInstance();
+const { sys_show_hide, sys_normal_disable } = proxy.useDict("sys_show_hide", "sys_normal_disable");
+
+const menuList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const title = ref("");
+const menuOptions = ref([]);
+const isExpandAll = ref(false);
+const refreshTable = ref(true);
+const iconSelectRef = ref(null);
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    menuName: undefined,
+    visible: undefined
+  },
+  rules: {
+    menuName: [{ required: true, message: "菜单名称不能为空", trigger: "blur" }],
+    orderNum: [{ required: true, message: "菜单顺序不能为空", trigger: "blur" }],
+    path: [{ required: true, message: "路由地址不能为空", trigger: "blur" }]
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询菜单列表 */
+function getList() {
+  loading.value = true;
+  listMenu(queryParams.value).then(response => {
+    menuList.value = proxy.handleTree(response.data, "menuId");
+    loading.value = false;
+  });
+}
+
+/** 查询菜单下拉树结构 */
+function getTreeselect() {
+  menuOptions.value = [];
+  listMenu().then(response => {
+    const menu = { menuId: 0, menuName: "主类目", children: [] };
+    menu.children = proxy.handleTree(response.data, "menuId");
+    menuOptions.value.push(menu);
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    menuId: undefined,
+    parentId: 0,
+    menuName: undefined,
+    icon: undefined,
+    menuType: "M",
+    orderNum: undefined,
+    isFrame: "1",
+    isCache: "0",
+    visible: "0",
+    status: "0"
+  };
+  proxy.resetForm("menuRef");
+}
+
+/** 展示下拉图标 */
+function showSelectIcon() {
+  iconSelectRef.value.reset();
+}
+
+/** 选择图标 */
+function selected(name) {
+  form.value.icon = name;
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 新增按钮操作 */
+function handleAdd(row) {
+  reset();
+  getTreeselect();
+  if (row != null && row.menuId) {
+    form.value.parentId = row.menuId;
+  } else {
+    form.value.parentId = 0;
+  }
+  open.value = true;
+  title.value = "添加菜单";
+}
+
+/** 展开/折叠操作 */
+function toggleExpandAll() {
+  refreshTable.value = false;
+  isExpandAll.value = !isExpandAll.value;
+  nextTick(() => {
+    refreshTable.value = true;
+  });
+}
+
+/** 修改按钮操作 */
+async function handleUpdate(row) {
+  reset();
+  await getTreeselect();
+  getMenu(row.menuId).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改菜单";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["menuRef"].validate(valid => {
+    if (valid) {
+      if (form.value.menuId != undefined) {
+        updateMenu(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addMenu(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  proxy.$modal.confirm('是否确认删除名称为"' + row.menuName + '"的数据项?').then(function() {
+    return delMenu(row.menuId);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+getList();
+</script>
diff --git a/src/views/system/notice/index.vue b/src/views/system/notice/index.vue
new file mode 100644
index 0000000..b009d7c
--- /dev/null
+++ b/src/views/system/notice/index.vue
@@ -0,0 +1,292 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
+         <el-form-item label="公告标题" prop="noticeTitle">
+            <el-input
+               v-model="queryParams.noticeTitle"
+               placeholder="请输入公告标题"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="操作人员" prop="createBy">
+            <el-input
+               v-model="queryParams.createBy"
+               placeholder="请输入操作人员"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="类型" prop="noticeType">
+            <el-select v-model="queryParams.noticeType" placeholder="公告类型" clearable style="width: 200px">
+               <el-option
+                  v-for="dict in sys_notice_type"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="handleAdd"
+               v-hasPermi="['system:notice:add']"
+            >新增</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="success"
+               plain
+               icon="Edit"
+               :disabled="single"
+               @click="handleUpdate"
+               v-hasPermi="['system:notice:edit']"
+            >修改</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['system:notice:remove']"
+            >删除</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table v-loading="loading" :data="noticeList" @selection-change="handleSelectionChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="序号" align="center" prop="noticeId" width="100" />
+         <el-table-column
+            label="公告标题"
+            align="center"
+            prop="noticeTitle"
+            :show-overflow-tooltip="true"
+         />
+         <el-table-column label="公告类型" align="center" prop="noticeType" width="100">
+            <template #default="scope">
+               <dict-tag :options="sys_notice_type" :value="scope.row.noticeType" />
+            </template>
+         </el-table-column>
+         <el-table-column label="状态" align="center" prop="status" width="100">
+            <template #default="scope">
+               <dict-tag :options="sys_notice_status" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="创建者" align="center" prop="createBy" width="100" />
+         <el-table-column label="创建时间" align="center" prop="createTime" width="100">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:notice:edit']">修改</el-button>
+               <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:notice:remove']" >删除</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+
+      <!-- 添加或修改公告对话框 -->
+      <el-dialog :title="title" v-model="open" width="780px" append-to-body>
+         <el-form ref="noticeRef" :model="form" :rules="rules" label-width="80px">
+            <el-row>
+               <el-col :span="12">
+                  <el-form-item label="公告标题" prop="noticeTitle">
+                     <el-input v-model="form.noticeTitle" placeholder="请输入公告标题" />
+                  </el-form-item>
+               </el-col>
+               <el-col :span="12">
+                  <el-form-item label="公告类型" prop="noticeType">
+                     <el-select v-model="form.noticeType" placeholder="请选择">
+                        <el-option
+                           v-for="dict in sys_notice_type"
+                           :key="dict.value"
+                           :label="dict.label"
+                           :value="dict.value"
+                        ></el-option>
+                     </el-select>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="状态">
+                     <el-radio-group v-model="form.status">
+                        <el-radio
+                           v-for="dict in sys_notice_status"
+                           :key="dict.value"
+                           :value="dict.value"
+                        >{{ dict.label }}</el-radio>
+                     </el-radio-group>
+                  </el-form-item>
+               </el-col>
+               <el-col :span="24">
+                  <el-form-item label="内容">
+                    <editor v-model="form.noticeContent" :min-height="192"/>
+                  </el-form-item>
+               </el-col>
+            </el-row>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitForm">确 定</el-button>
+               <el-button @click="cancel">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Notice">
+import { listNotice, getNotice, delNotice, addNotice, updateNotice } from "@/api/system/notice";
+
+const { proxy } = getCurrentInstance();
+const { sys_notice_status, sys_notice_type } = proxy.useDict("sys_notice_status", "sys_notice_type");
+
+const noticeList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    noticeTitle: undefined,
+    createBy: undefined,
+    status: undefined
+  },
+  rules: {
+    noticeTitle: [{ required: true, message: "公告标题不能为空", trigger: "blur" }],
+    noticeType: [{ required: true, message: "公告类型不能为空", trigger: "change" }]
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询公告列表 */
+function getList() {
+  loading.value = true;
+  listNotice(queryParams.value).then(response => {
+    noticeList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    noticeId: undefined,
+    noticeTitle: undefined,
+    noticeType: undefined,
+    noticeContent: undefined,
+    status: "0"
+  };
+  proxy.resetForm("noticeRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.noticeId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加公告";
+}
+
+/**修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const noticeId = row.noticeId || ids.value;
+  getNotice(noticeId).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改公告";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["noticeRef"].validate(valid => {
+    if (valid) {
+      if (form.value.noticeId != undefined) {
+        updateNotice(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addNotice(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const noticeIds = row.noticeId || ids.value
+  proxy.$modal.confirm('是否确认删除公告编号为"' + noticeIds + '"的数据项？').then(function() {
+    return delNotice(noticeIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+getList();
+</script>
diff --git a/src/views/system/post/index.vue b/src/views/system/post/index.vue
new file mode 100644
index 0000000..045ed41
--- /dev/null
+++ b/src/views/system/post/index.vue
@@ -0,0 +1,287 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
+         <el-form-item label="岗位编码" prop="postCode">
+            <el-input
+               v-model="queryParams.postCode"
+               placeholder="请输入岗位编码"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="岗位名称" prop="postName">
+            <el-input
+               v-model="queryParams.postName"
+               placeholder="请输入岗位名称"
+               clearable
+               style="width: 200px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="状态" prop="status">
+            <el-select v-model="queryParams.status" placeholder="岗位状态" clearable style="width: 200px">
+               <el-option
+                  v-for="dict in sys_normal_disable"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="handleAdd"
+               v-hasPermi="['system:post:add']"
+            >新增</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="success"
+               plain
+               icon="Edit"
+               :disabled="single"
+               @click="handleUpdate"
+               v-hasPermi="['system:post:edit']"
+            >修改</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['system:post:remove']"
+            >删除</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Download"
+               @click="handleExport"
+               v-hasPermi="['system:post:export']"
+            >导出</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table v-loading="loading" :data="postList" @selection-change="handleSelectionChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="岗位编号" align="center" prop="postId" />
+         <el-table-column label="岗位编码" align="center" prop="postCode" />
+         <el-table-column label="岗位名称" align="center" prop="postName" />
+         <el-table-column label="岗位排序" align="center" prop="postSort" />
+         <el-table-column label="状态" align="center" prop="status">
+            <template #default="scope">
+               <dict-tag :options="sys_normal_disable" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="创建时间" align="center" prop="createTime" width="180">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" width="180" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:post:edit']">修改</el-button>
+               <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:post:remove']">删除</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+
+      <!-- 添加或修改岗位对话框 -->
+      <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+         <el-form ref="postRef" :model="form" :rules="rules" label-width="80px">
+            <el-form-item label="岗位名称" prop="postName">
+               <el-input v-model="form.postName" placeholder="请输入岗位名称" />
+            </el-form-item>
+            <el-form-item label="岗位编码" prop="postCode">
+               <el-input v-model="form.postCode" placeholder="请输入编码名称" />
+            </el-form-item>
+            <el-form-item label="岗位顺序" prop="postSort">
+               <el-input-number v-model="form.postSort" controls-position="right" :min="0" />
+            </el-form-item>
+            <el-form-item label="岗位状态" prop="status">
+               <el-radio-group v-model="form.status">
+                  <el-radio
+                     v-for="dict in sys_normal_disable"
+                     :key="dict.value"
+                     :value="dict.value"
+                  >{{ dict.label }}</el-radio>
+               </el-radio-group>
+            </el-form-item>
+            <el-form-item label="备注" prop="remark">
+               <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+            </el-form-item>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitForm">确 定</el-button>
+               <el-button @click="cancel">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Post">
+import { listPost, addPost, delPost, getPost, updatePost } from "@/api/system/post";
+
+const { proxy } = getCurrentInstance();
+const { sys_normal_disable } = proxy.useDict("sys_normal_disable");
+
+const postList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    postCode: undefined,
+    postName: undefined,
+    status: undefined
+  },
+  rules: {
+    postName: [{ required: true, message: "岗位名称不能为空", trigger: "blur" }],
+    postCode: [{ required: true, message: "岗位编码不能为空", trigger: "blur" }],
+    postSort: [{ required: true, message: "岗位顺序不能为空", trigger: "blur" }],
+  }
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询岗位列表 */
+function getList() {
+  loading.value = true;
+  listPost(queryParams.value).then(response => {
+    postList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    postId: undefined,
+    postCode: undefined,
+    postName: undefined,
+    postSort: 0,
+    status: "0",
+    remark: undefined
+  };
+  proxy.resetForm("postRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.postId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加岗位";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const postId = row.postId || ids.value;
+  getPost(postId).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改岗位";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["postRef"].validate(valid => {
+    if (valid) {
+      if (form.value.postId != undefined) {
+        updatePost(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addPost(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const postIds = row.postId || ids.value;
+  proxy.$modal.confirm('是否确认删除岗位编号为"' + postIds + '"的数据项？').then(function() {
+    return delPost(postIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("system/post/export", {
+    ...queryParams.value
+  }, `post_${new Date().getTime()}.xlsx`);
+}
+
+getList();
+</script>
diff --git a/src/views/system/role/authUser.vue b/src/views/system/role/authUser.vue
new file mode 100644
index 0000000..5bc3404
--- /dev/null
+++ b/src/views/system/role/authUser.vue
@@ -0,0 +1,179 @@
+
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true">
+         <el-form-item label="用户名称" prop="userName">
+            <el-input
+               v-model="queryParams.userName"
+               placeholder="请输入用户名称"
+               clearable
+               style="width: 240px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="手机号码" prop="phonenumber">
+            <el-input
+               v-model="queryParams.phonenumber"
+               placeholder="请输入手机号码"
+               clearable
+               style="width: 240px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="openSelectUser"
+               v-hasPermi="['system:role:add']"
+            >添加用户</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="CircleClose"
+               :disabled="multiple"
+               @click="cancelAuthUserAll"
+               v-hasPermi="['system:role:remove']"
+            >批量取消授权</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button 
+               type="warning" 
+               plain 
+               icon="Close"
+               @click="handleClose"
+            >关闭</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="用户名称" prop="userName" :show-overflow-tooltip="true" />
+         <el-table-column label="用户昵称" prop="nickName" :show-overflow-tooltip="true" />
+         <el-table-column label="邮箱" prop="email" :show-overflow-tooltip="true" />
+         <el-table-column label="手机" prop="phonenumber" :show-overflow-tooltip="true" />
+         <el-table-column label="状态" align="center" prop="status">
+            <template #default="scope">
+               <dict-tag :options="sys_normal_disable" :value="scope.row.status" />
+            </template>
+         </el-table-column>
+         <el-table-column label="创建时间" align="center" prop="createTime" width="180">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+               <el-button link type="primary" icon="CircleClose" @click="cancelAuthUser(scope.row)" v-hasPermi="['system:role:remove']">取消授权</el-button>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+      <select-user ref="selectRef" :roleId="queryParams.roleId" @ok="handleQuery" />
+   </div>
+</template>
+
+<script setup name="AuthUser">
+import selectUser from "./selectUser";
+import { allocatedUserList, authUserCancel, authUserCancelAll } from "@/api/system/role";
+
+const route = useRoute();
+const { proxy } = getCurrentInstance();
+const { sys_normal_disable } = proxy.useDict("sys_normal_disable");
+
+const userList = ref([]);
+const loading = ref(true);
+const showSearch = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const userIds = ref([]);
+
+const queryParams = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  roleId: route.params.roleId,
+  userName: undefined,
+  phonenumber: undefined,
+});
+
+/** 查询授权用户列表 */
+function getList() {
+  loading.value = true;
+  allocatedUserList(queryParams).then(response => {
+    userList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 返回按钮 */
+function handleClose() {
+  const obj = { path: "/system/role" };
+  proxy.$tab.closeOpenPage(obj);
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  userIds.value = selection.map(item => item.userId);
+  multiple.value = !selection.length;
+}
+
+/** 打开授权用户表弹窗 */
+function openSelectUser() {
+  proxy.$refs["selectRef"].show();
+}
+
+/** 取消授权按钮操作 */
+function cancelAuthUser(row) {
+  proxy.$modal.confirm('确认要取消该用户"' + row.userName + '"角色吗？').then(function () {
+    return authUserCancel({ userId: row.userId, roleId: queryParams.roleId });
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("取消授权成功");
+  }).catch(() => {});
+}
+
+/** 批量取消授权按钮操作 */
+function cancelAuthUserAll(row) {
+  const roleId = queryParams.roleId;
+  const uIds = userIds.value.join(",");
+  proxy.$modal.confirm("是否取消选中用户授权数据项?").then(function () {
+    return authUserCancelAll({ roleId: roleId, userIds: uIds });
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("取消授权成功");
+  }).catch(() => {});
+}
+
+getList();
+</script>
diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
new file mode 100644
index 0000000..df624d3
--- /dev/null
+++ b/src/views/system/role/index.vue
@@ -0,0 +1,584 @@
+<template>
+   <div class="app-container">
+      <el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true" label-width="68px">
+         <el-form-item label="角色名称" prop="roleName">
+            <el-input
+               v-model="queryParams.roleName"
+               placeholder="请输入角色名称"
+               clearable
+               style="width: 240px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="权限字符" prop="roleKey">
+            <el-input
+               v-model="queryParams.roleKey"
+               placeholder="请输入权限字符"
+               clearable
+               style="width: 240px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="状态" prop="status">
+            <el-select
+               v-model="queryParams.status"
+               placeholder="角色状态"
+               clearable
+               style="width: 240px"
+            >
+               <el-option
+                  v-for="dict in sys_normal_disable"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+               />
+            </el-select>
+         </el-form-item>
+         <el-form-item label="创建时间" style="width: 308px">
+            <el-date-picker
+               v-model="dateRange"
+               value-format="YYYY-MM-DD"
+               type="daterange"
+               range-separator="-"
+               start-placeholder="开始日期"
+               end-placeholder="结束日期"
+            ></el-date-picker>
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+      <el-row :gutter="10" class="mb8">
+         <el-col :span="1.5">
+            <el-button
+               type="primary"
+               plain
+               icon="Plus"
+               @click="handleAdd"
+               v-hasPermi="['system:role:add']"
+            >新增</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="success"
+               plain
+               icon="Edit"
+               :disabled="single"
+               @click="handleUpdate"
+               v-hasPermi="['system:role:edit']"
+            >修改</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="danger"
+               plain
+               icon="Delete"
+               :disabled="multiple"
+               @click="handleDelete"
+               v-hasPermi="['system:role:remove']"
+            >删除</el-button>
+         </el-col>
+         <el-col :span="1.5">
+            <el-button
+               type="warning"
+               plain
+               icon="Download"
+               @click="handleExport"
+               v-hasPermi="['system:role:export']"
+            >导出</el-button>
+         </el-col>
+         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+
+      <!-- 表格数据 -->
+      <el-table v-loading="loading" :data="roleList" @selection-change="handleSelectionChange">
+         <el-table-column type="selection" width="55" align="center" />
+         <el-table-column label="角色编号" prop="roleId" width="120" />
+         <el-table-column label="角色名称" prop="roleName" :show-overflow-tooltip="true" width="150" />
+         <el-table-column label="权限字符" prop="roleKey" :show-overflow-tooltip="true" width="150" />
+         <el-table-column label="显示顺序" prop="roleSort" width="100" />
+         <el-table-column label="状态" align="center" width="100">
+            <template #default="scope">
+               <el-switch
+                  v-model="scope.row.status"
+                  active-value="0"
+                  inactive-value="1"
+                  @change="handleStatusChange(scope.row)"
+               ></el-switch>
+            </template>
+         </el-table-column>
+         <el-table-column label="创建时间" align="center" prop="createTime">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template #default="scope">
+              <el-tooltip content="修改" placement="top" v-if="scope.row.roleId !== 1">
+                <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:role:edit']"></el-button>
+              </el-tooltip>
+              <el-tooltip content="删除" placement="top" v-if="scope.row.roleId !== 1">
+                <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:role:remove']"></el-button>
+              </el-tooltip>
+              <el-tooltip content="数据权限" placement="top" v-if="scope.row.roleId !== 1">
+                <el-button link type="primary" icon="CircleCheck" @click="handleDataScope(scope.row)" v-hasPermi="['system:role:edit']"></el-button>
+              </el-tooltip>
+              <el-tooltip content="分配用户" placement="top" v-if="scope.row.roleId !== 1">
+                <el-button link type="primary" icon="User" @click="handleAuthUser(scope.row)" v-hasPermi="['system:role:edit']"></el-button>
+              </el-tooltip>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination
+         v-show="total > 0"
+         :total="total"
+         v-model:page="queryParams.pageNum"
+         v-model:limit="queryParams.pageSize"
+         @pagination="getList"
+      />
+
+      <!-- 添加或修改角色配置对话框 -->
+      <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+         <el-form ref="roleRef" :model="form" :rules="rules" label-width="100px">
+            <el-form-item label="角色名称" prop="roleName">
+               <el-input v-model="form.roleName" placeholder="请输入角色名称" />
+            </el-form-item>
+            <el-form-item prop="roleKey">
+               <template #label>
+                  <span>
+                     <el-tooltip content="控制器中定义的权限字符，如：@PreAuthorize(`@ss.hasRole('admin')`)" placement="top">
+                        <el-icon><question-filled /></el-icon>
+                     </el-tooltip>
+                     权限字符
+                  </span>
+               </template>
+               <el-input v-model="form.roleKey" placeholder="请输入权限字符" />
+            </el-form-item>
+            <el-form-item label="角色顺序" prop="roleSort">
+               <el-input-number v-model="form.roleSort" controls-position="right" :min="0" />
+            </el-form-item>
+            <el-form-item label="状态">
+               <el-radio-group v-model="form.status">
+                  <el-radio
+                     v-for="dict in sys_normal_disable"
+                     :key="dict.value"
+                     :value="dict.value"
+                  >{{ dict.label }}</el-radio>
+               </el-radio-group>
+            </el-form-item>
+            <el-form-item label="菜单权限">
+               <el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>
+               <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox>
+               <el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">父子联动</el-checkbox>
+               <el-tree
+                  class="tree-border"
+                  :data="menuOptions"
+                  show-checkbox
+                  ref="menuRef"
+                  node-key="id"
+                  :check-strictly="!form.menuCheckStrictly"
+                  empty-text="加载中，请稍候"
+                  :props="{ label: 'label', children: 'children' }"
+               ></el-tree>
+            </el-form-item>
+            <el-form-item label="备注">
+               <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
+            </el-form-item>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitForm">确 定</el-button>
+               <el-button @click="cancel">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+
+      <!-- 分配角色数据权限对话框 -->
+      <el-dialog :title="title" v-model="openDataScope" width="500px" append-to-body>
+         <el-form :model="form" label-width="80px">
+            <el-form-item label="角色名称">
+               <el-input v-model="form.roleName" :disabled="true" />
+            </el-form-item>
+            <el-form-item label="权限字符">
+               <el-input v-model="form.roleKey" :disabled="true" />
+            </el-form-item>
+            <el-form-item label="权限范围">
+               <el-select v-model="form.dataScope" @change="dataScopeSelectChange">
+                  <el-option
+                     v-for="item in dataScopeOptions"
+                     :key="item.value"
+                     :label="item.label"
+                     :value="item.value"
+                  ></el-option>
+               </el-select>
+            </el-form-item>
+            <el-form-item label="数据权限" v-show="form.dataScope == 2">
+               <el-checkbox v-model="deptExpand" @change="handleCheckedTreeExpand($event, 'dept')">展开/折叠</el-checkbox>
+               <el-checkbox v-model="deptNodeAll" @change="handleCheckedTreeNodeAll($event, 'dept')">全选/全不选</el-checkbox>
+               <el-checkbox v-model="form.deptCheckStrictly" @change="handleCheckedTreeConnect($event, 'dept')">父子联动</el-checkbox>
+               <el-tree
+                  class="tree-border"
+                  :data="deptOptions"
+                  show-checkbox
+                  default-expand-all
+                  ref="deptRef"
+                  node-key="id"
+                  :check-strictly="!form.deptCheckStrictly"
+                  empty-text="加载中，请稍候"
+                  :props="{ label: 'label', children: 'children' }"
+               ></el-tree>
+            </el-form-item>
+         </el-form>
+         <template #footer>
+            <div class="dialog-footer">
+               <el-button type="primary" @click="submitDataScope">确 定</el-button>
+               <el-button @click="cancelDataScope">取 消</el-button>
+            </div>
+         </template>
+      </el-dialog>
+   </div>
+</template>
+
+<script setup name="Role">
+import { addRole, changeRoleStatus, dataScope, delRole, getRole, listRole, updateRole, deptTreeSelect } from "@/api/system/role";
+import { roleMenuTreeselect, treeselect as menuTreeselect } from "@/api/system/menu";
+
+const router = useRouter();
+const { proxy } = getCurrentInstance();
+const { sys_normal_disable } = proxy.useDict("sys_normal_disable");
+
+const roleList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const dateRange = ref([]);
+const menuOptions = ref([]);
+const menuExpand = ref(false);
+const menuNodeAll = ref(false);
+const deptExpand = ref(true);
+const deptNodeAll = ref(false);
+const deptOptions = ref([]);
+const openDataScope = ref(false);
+const menuRef = ref(null);
+const deptRef = ref(null);
+
+/** 数据范围选项*/
+const dataScopeOptions = ref([
+  { value: "1", label: "全部数据权限" },
+  { value: "2", label: "自定数据权限" },
+  { value: "3", label: "本部门数据权限" },
+  { value: "4", label: "本部门及以下数据权限" },
+  { value: "5", label: "仅本人数据权限" }
+]);
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    roleName: undefined,
+    roleKey: undefined,
+    status: undefined
+  },
+  rules: {
+    roleName: [{ required: true, message: "角色名称不能为空", trigger: "blur" }],
+    roleKey: [{ required: true, message: "权限字符不能为空", trigger: "blur" }],
+    roleSort: [{ required: true, message: "角色顺序不能为空", trigger: "blur" }]
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询角色列表 */
+function getList() {
+  loading.value = true;
+  listRole(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => {
+    roleList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  dateRange.value = [];
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const roleIds = row.roleId || ids.value;
+  proxy.$modal.confirm('是否确认删除角色编号为"' + roleIds + '"的数据项?').then(function () {
+    return delRole(roleIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("system/role/export", {
+    ...queryParams.value,
+  }, `role_${new Date().getTime()}.xlsx`);
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.roleId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 角色状态修改 */
+function handleStatusChange(row) {
+  let text = row.status === "0" ? "启用" : "停用";
+  proxy.$modal.confirm('确认要"' + text + '""' + row.roleName + '"角色吗?').then(function () {
+    return changeRoleStatus(row.roleId, row.status);
+  }).then(() => {
+    proxy.$modal.msgSuccess(text + "成功");
+  }).catch(function () {
+    row.status = row.status === "0" ? "1" : "0";
+  });
+}
+
+/** 更多操作 */
+function handleCommand(command, row) {
+  switch (command) {
+    case "handleDataScope":
+      handleDataScope(row);
+      break;
+    case "handleAuthUser":
+      handleAuthUser(row);
+      break;
+    default:
+      break;
+  }
+}
+
+/** 分配用户 */
+function handleAuthUser(row) {
+  router.push("/system/role-auth/user/" + row.roleId);
+}
+
+/** 查询菜单树结构 */
+function getMenuTreeselect() {
+  menuTreeselect().then(response => {
+    menuOptions.value = response.data;
+  });
+}
+
+/** 所有部门节点数据 */
+function getDeptAllCheckedKeys() {
+  // 目前被选中的部门节点
+  let checkedKeys = deptRef.value.getCheckedKeys();
+  // 半选中的部门节点
+  let halfCheckedKeys = deptRef.value.getHalfCheckedKeys();
+  checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
+  return checkedKeys;
+}
+
+/** 重置新增的表单以及其他数据  */
+function reset() {
+  if (menuRef.value != undefined) {
+    menuRef.value.setCheckedKeys([]);
+  }
+  menuExpand.value = false;
+  menuNodeAll.value = false;
+  deptExpand.value = true;
+  deptNodeAll.value = false;
+  form.value = {
+    roleId: undefined,
+    roleName: undefined,
+    roleKey: undefined,
+    roleSort: 0,
+    status: "0",
+    menuIds: [],
+    deptIds: [],
+    menuCheckStrictly: true,
+    deptCheckStrictly: true,
+    remark: undefined
+  };
+  proxy.resetForm("roleRef");
+}
+
+/** 添加角色 */
+function handleAdd() {
+  reset();
+  getMenuTreeselect();
+  open.value = true;
+  title.value = "添加角色";
+}
+
+/** 修改角色 */
+function handleUpdate(row) {
+  reset();
+  const roleId = row.roleId || ids.value;
+  const roleMenu = getRoleMenuTreeselect(roleId);
+  getRole(roleId).then(response => {
+    form.value = response.data;
+    form.value.roleSort = Number(form.value.roleSort);
+    open.value = true;
+    nextTick(() => {
+      roleMenu.then((res) => {
+        let checkedKeys = res.checkedKeys;
+        checkedKeys.forEach((v) => {
+          nextTick(() => {
+            menuRef.value.setChecked(v, true, false);
+          });
+        });
+      });
+    });
+  });
+  title.value = "修改角色";
+}
+
+/** 根据角色ID查询菜单树结构 */
+function getRoleMenuTreeselect(roleId) {
+  return roleMenuTreeselect(roleId).then(response => {
+    menuOptions.value = response.menus;
+    return response;
+  });
+}
+
+/** 根据角色ID查询部门树结构 */
+function getDeptTree(roleId) {
+  return deptTreeSelect(roleId).then(response => {
+    deptOptions.value = response.depts;
+    return response;
+  });
+}
+
+/** 树权限（展开/折叠）*/
+function handleCheckedTreeExpand(value, type) {
+  if (type == "menu") {
+    let treeList = menuOptions.value;
+    for (let i = 0; i < treeList.length; i++) {
+      menuRef.value.store.nodesMap[treeList[i].id].expanded = value;
+    }
+  } else if (type == "dept") {
+    let treeList = deptOptions.value;
+    for (let i = 0; i < treeList.length; i++) {
+      deptRef.value.store.nodesMap[treeList[i].id].expanded = value;
+    }
+  }
+}
+
+/** 树权限（全选/全不选） */
+function handleCheckedTreeNodeAll(value, type) {
+  if (type == "menu") {
+    menuRef.value.setCheckedNodes(value ? menuOptions.value : []);
+  } else if (type == "dept") {
+    deptRef.value.setCheckedNodes(value ? deptOptions.value : []);
+  }
+}
+
+/** 树权限（父子联动） */
+function handleCheckedTreeConnect(value, type) {
+  if (type == "menu") {
+    form.value.menuCheckStrictly = value ? true : false;
+  } else if (type == "dept") {
+    form.value.deptCheckStrictly = value ? true : false;
+  }
+}
+
+/** 所有菜单节点数据 */
+function getMenuAllCheckedKeys() {
+  // 目前被选中的菜单节点
+  let checkedKeys = menuRef.value.getCheckedKeys();
+  // 半选中的菜单节点
+  let halfCheckedKeys = menuRef.value.getHalfCheckedKeys();
+  checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
+  return checkedKeys;
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["roleRef"].validate(valid => {
+    if (valid) {
+      if (form.value.roleId != undefined) {
+        form.value.menuIds = getMenuAllCheckedKeys();
+        updateRole(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        form.value.menuIds = getMenuAllCheckedKeys();
+        addRole(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 选择角色权限范围触发 */
+function dataScopeSelectChange(value) {
+  if (value !== "2") {
+    deptRef.value.setCheckedKeys([]);
+  }
+}
+
+/** 分配数据权限操作 */
+function handleDataScope(row) {
+  reset();
+  const deptTreeSelect = getDeptTree(row.roleId);
+  getRole(row.roleId).then(response => {
+    form.value = response.data;
+    openDataScope.value = true;
+    nextTick(() => {
+      deptTreeSelect.then(res => {
+        nextTick(() => {
+          if (deptRef.value) {
+            deptRef.value.setCheckedKeys(res.checkedKeys);
+          }
+        });
+      });
+    });
+  });
+  title.value = "分配数据权限";
+}
+
+/** 提交按钮（数据权限） */
+function submitDataScope() {
+  if (form.value.roleId != undefined) {
+    form.value.deptIds = getDeptAllCheckedKeys();
+    dataScope(form.value).then(response => {
+      proxy.$modal.msgSuccess("修改成功");
+      openDataScope.value = false;
+      getList();
+    });
+  }
+}
+
+/** 取消按钮（数据权限）*/
+function cancelDataScope() {
+  openDataScope.value = false;
+  reset();
+}
+
+getList();
+</script>
diff --git a/src/views/system/role/selectUser.vue b/src/views/system/role/selectUser.vue
new file mode 100644
index 0000000..6e61b4c
--- /dev/null
+++ b/src/views/system/role/selectUser.vue
@@ -0,0 +1,144 @@
+<template>
+   <!-- 授权用户 -->
+   <el-dialog title="选择用户" v-model="visible" width="800px" top="5vh" append-to-body>
+      <el-form :model="queryParams" ref="queryRef" :inline="true">
+         <el-form-item label="用户名称" prop="userName">
+            <el-input
+               v-model="queryParams.userName"
+               placeholder="请输入用户名称"
+               clearable
+               style="width: 180px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item label="手机号码" prop="phonenumber">
+            <el-input
+               v-model="queryParams.phonenumber"
+               placeholder="请输入手机号码"
+               clearable
+               style="width: 180px"
+               @keyup.enter="handleQuery"
+            />
+         </el-form-item>
+         <el-form-item>
+            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+         </el-form-item>
+      </el-form>
+      <el-row>
+         <el-table @row-click="clickRow" ref="refTable" :data="userList" @selection-change="handleSelectionChange" height="260px">
+            <el-table-column type="selection" width="55"></el-table-column>
+            <el-table-column label="用户名称" prop="userName" :show-overflow-tooltip="true" />
+            <el-table-column label="用户昵称" prop="nickName" :show-overflow-tooltip="true" />
+            <el-table-column label="邮箱" prop="email" :show-overflow-tooltip="true" />
+            <el-table-column label="手机" prop="phonenumber" :show-overflow-tooltip="true" />
+            <el-table-column label="状态" align="center" prop="status">
+               <template #default="scope">
+                  <dict-tag :options="sys_normal_disable" :value="scope.row.status" />
+               </template>
+            </el-table-column>
+            <el-table-column label="创建时间" align="center" prop="createTime" width="180">
+               <template #default="scope">
+                  <span>{{ parseTime(scope.row.createTime) }}</span>
+               </template>
+            </el-table-column>
+         </el-table>
+         <pagination
+            v-show="total > 0"
+            :total="total"
+            v-model:page="queryParams.pageNum"
+            v-model:limit="queryParams.pageSize"
+            @pagination="getList"
+         />
+      </el-row>
+      <template #footer>
+         <div class="dialog-footer">
+            <el-button type="primary" @click="handleSelectUser">确 定</el-button>
+            <el-button @click="visible = false">取 消</el-button>
+         </div>
+      </template>
+   </el-dialog>
+</template>
+
+<script setup name="SelectUser">
+import { authUserSelectAll, unallocatedUserList } from "@/api/system/role";
+
+const props = defineProps({
+  roleId: {
+    type: [Number, String]
+  }
+});
+
+const { proxy } = getCurrentInstance();
+const { sys_normal_disable } = proxy.useDict("sys_normal_disable");
+
+const userList = ref([]);
+const visible = ref(false);
+const total = ref(0);
+const userIds = ref([]);
+
+const queryParams = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  roleId: undefined,
+  userName: undefined,
+  phonenumber: undefined
+});
+
+// 显示弹框
+function show() {
+  queryParams.roleId = props.roleId;
+  getList();
+  visible.value = true;
+}
+
+/**选择行 */
+function clickRow(row) {
+  proxy.$refs["refTable"].toggleRowSelection(row);
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  userIds.value = selection.map(item => item.userId);
+}
+
+// 查询表数据
+function getList() {
+  unallocatedUserList(queryParams).then(res => {
+    userList.value = res.rows;
+    total.value = res.total;
+  });
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+const emit = defineEmits(["ok"]);
+/** 选择授权用户操作 */
+function handleSelectUser() {
+  const roleId = queryParams.roleId;
+  const uIds = userIds.value.join(",");
+  if (uIds == "") {
+    proxy.$modal.msgError("请选择要分配的用户");
+    return;
+  }
+  authUserSelectAll({ roleId: roleId, userIds: uIds }).then(res => {
+    proxy.$modal.msgSuccess(res.msg);
+    visible.value = false;
+    emit("ok");
+  });
+}
+
+defineExpose({
+  show,
+});
+</script>
diff --git a/src/views/system/user/authRole.vue b/src/views/system/user/authRole.vue
new file mode 100644
index 0000000..7555cac
--- /dev/null
+++ b/src/views/system/user/authRole.vue
@@ -0,0 +1,116 @@
+<template>
+   <div class="app-container">
+      <h4 class="form-header h4">基本信息</h4>
+      <el-form :model="form" label-width="80px">
+         <el-row>
+            <el-col :span="8" :offset="2">
+               <el-form-item label="用户昵称" prop="nickName">
+                  <el-input v-model="form.nickName" disabled />
+               </el-form-item>
+            </el-col>
+            <el-col :span="8" :offset="2">
+               <el-form-item label="登录账号" prop="userName">
+                  <el-input v-model="form.userName" disabled />
+               </el-form-item>
+            </el-col>
+         </el-row>
+      </el-form>
+
+      <h4 class="form-header h4">角色信息</h4>
+      <el-table v-loading="loading" :row-key="getRowKey" @row-click="clickRow" ref="roleRef" @selection-change="handleSelectionChange" :data="roles.slice((pageNum - 1) * pageSize, pageNum * pageSize)">
+         <el-table-column label="序号" width="55" type="index" align="center">
+            <template #default="scope">
+               <span>{{ (pageNum - 1) * pageSize + scope.$index + 1 }}</span>
+            </template>
+         </el-table-column>
+         <el-table-column type="selection" :reserve-selection="true" width="55"></el-table-column>
+         <el-table-column label="角色编号" align="center" prop="roleId" />
+         <el-table-column label="角色名称" align="center" prop="roleName" />
+         <el-table-column label="权限字符" align="center" prop="roleKey" />
+         <el-table-column label="创建时间" align="center" prop="createTime" width="180">
+            <template #default="scope">
+               <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+         </el-table-column>
+      </el-table>
+
+      <pagination v-show="total > 0" :total="total" v-model:page="pageNum" v-model:limit="pageSize" />
+
+      <el-form label-width="100px">
+         <div style="text-align: center;margin-left:-120px;margin-top:30px;">
+            <el-button type="primary" @click="submitForm()">提交</el-button>
+            <el-button @click="close()">返回</el-button>
+         </div>
+      </el-form>
+   </div>
+</template>
+
+<script setup name="AuthRole">
+import { getAuthRole, updateAuthRole } from "@/api/system/user";
+
+const route = useRoute();
+const { proxy } = getCurrentInstance();
+
+const loading = ref(true);
+const total = ref(0);
+const pageNum = ref(1);
+const pageSize = ref(10);
+const roleIds = ref([]);
+const roles = ref([]);
+const form = ref({
+  nickName: undefined,
+  userName: undefined,
+  userId: undefined
+});
+
+/** 单击选中行数据 */
+function clickRow(row) {
+  proxy.$refs["roleRef"].toggleRowSelection(row);
+};
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  roleIds.value = selection.map(item => item.roleId);
+};
+
+/** 保存选中的数据编号 */
+function getRowKey(row) {
+  return row.roleId;
+};
+
+/** 关闭按钮 */
+function close() {
+  const obj = { path: "/system/user" };
+  proxy.$tab.closeOpenPage(obj);
+};
+
+/** 提交按钮 */
+function submitForm() {
+  const userId = form.value.userId;
+  const rIds = roleIds.value.join(",");
+  updateAuthRole({ userId: userId, roleIds: rIds }).then(response => {
+    proxy.$modal.msgSuccess("授权成功");
+    close();
+  });
+};
+
+(() => {
+  const userId = route.params && route.params.userId;
+  if (userId) {
+    loading.value = true;
+    getAuthRole(userId).then(response => {
+      form.value = response.user;
+      roles.value = response.roles;
+      total.value = roles.value.length;
+      nextTick(() => {
+        roles.value.forEach(row => {
+          if (row.flag) {
+            proxy.$refs["roleRef"].toggleRowSelection(row);
+          }
+        });
+      });
+      loading.value = false;
+    });
+  }
+})();
+</script>
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
new file mode 100644
index 0000000..b3cb7c9
--- /dev/null
+++ b/src/views/system/user/index.vue
@@ -0,0 +1,523 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <splitpanes :horizontal="appStore.device === 'mobile'" class="default-theme">
+        <!--部门数据-->
+        <pane size="16">
+          <el-col>
+            <div class="head-container">
+              <el-input v-model="deptName" placeholder="请输入部门名称" clearable prefix-icon="Search" style="margin-bottom: 20px" />
+            </div>
+            <div class="head-container">
+              <el-tree :data="deptOptions" :props="{ label: 'label', children: 'children' }" :expand-on-click-node="false" :filter-node-method="filterNode" ref="deptTreeRef" node-key="id" highlight-current default-expand-all @node-click="handleNodeClick" />
+            </div>
+          </el-col>
+        </pane>
+        <!--用户数据-->
+        <pane size="84">
+          <el-col>
+            <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+              <el-form-item label="用户名称" prop="userName">
+                <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px" @keyup.enter="handleQuery" />
+              </el-form-item>
+              <el-form-item label="手机号码" prop="phonenumber">
+                <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px" @keyup.enter="handleQuery" />
+              </el-form-item>
+              <el-form-item label="状态" prop="status">
+                <el-select v-model="queryParams.status" placeholder="用户状态" clearable style="width: 240px">
+                  <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="创建时间" style="width: 308px">
+                <el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+                <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+              </el-form-item>
+            </el-form>
+
+            <el-row :gutter="10" class="mb8">
+              <el-col :span="1.5">
+                <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:user:add']">新增</el-button>
+              </el-col>
+              <el-col :span="1.5">
+                <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate" v-hasPermi="['system:user:edit']">修改</el-button>
+              </el-col>
+              <el-col :span="1.5">
+                <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete" v-hasPermi="['system:user:remove']">删除</el-button>
+              </el-col>
+              <el-col :span="1.5">
+                <el-button type="info" plain icon="Upload" @click="handleImport" v-hasPermi="['system:user:import']">导入</el-button>
+              </el-col>
+              <el-col :span="1.5">
+                <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:user:export']">导出</el-button>
+              </el-col>
+              <right-toolbar v-model:showSearch="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
+            </el-row>
+
+            <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
+              <el-table-column type="selection" width="50" align="center" />
+              <el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
+              <el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
+              <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
+              <el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
+              <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
+              <el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
+                <template #default="scope">
+                  <el-switch
+                    v-model="scope.row.status"
+                    active-value="0"
+                    inactive-value="1"
+                    @change="handleStatusChange(scope.row)"
+                  ></el-switch>
+                </template>
+              </el-table-column>
+              <el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="160">
+                <template #default="scope">
+                  <span>{{ parseTime(scope.row.createTime) }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作" align="center" width="150" class-name="small-padding fixed-width">
+                <template #default="scope">
+                  <el-tooltip content="修改" placement="top" v-if="scope.row.userId !== 1">
+                    <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:user:edit']"></el-button>
+                  </el-tooltip>
+                  <el-tooltip content="删除" placement="top" v-if="scope.row.userId !== 1">
+                    <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:user:remove']"></el-button>
+                  </el-tooltip>
+                  <el-tooltip content="重置密码" placement="top" v-if="scope.row.userId !== 1">
+                    <el-button link type="primary" icon="Key" @click="handleResetPwd(scope.row)" v-hasPermi="['system:user:resetPwd']"></el-button>
+                  </el-tooltip>
+                  <el-tooltip content="分配角色" placement="top" v-if="scope.row.userId !== 1">
+                    <el-button link type="primary" icon="CircleCheck" @click="handleAuthRole(scope.row)" v-hasPermi="['system:user:edit']"></el-button>
+                  </el-tooltip>
+                </template>
+              </el-table-column>
+            </el-table>
+            <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
+          </el-col>
+        </pane>
+      </splitpanes>
+    </el-row>
+
+    <!-- 添加或修改用户配置对话框 -->
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body>
+      <el-form :model="form" :rules="rules" ref="userRef" label-width="80px">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="用户昵称" prop="nickName">
+              <el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="归属部门" prop="deptId">
+              <el-tree-select v-model="form.deptId" :data="deptOptions" :props="{ value: 'id', label: 'label', children: 'children' }" value-key="id" placeholder="请选择归属部门" check-strictly />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="手机号码" prop="phonenumber">
+              <el-input v-model="form.phonenumber" placeholder="请输入手机号码" maxlength="11" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="邮箱" prop="email">
+              <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
+              <el-input v-model="form.userName" placeholder="请输入用户名称" maxlength="30" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
+              <el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20" show-password />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="用户性别">
+              <el-select v-model="form.sex" placeholder="请选择">
+                <el-option v-for="dict in sys_user_sex" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="状态">
+              <el-radio-group v-model="form.status">
+                <el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label }}</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="岗位">
+              <el-select v-model="form.postIds" multiple placeholder="请选择">
+                <el-option v-for="item in postOptions" :key="item.postId" :label="item.postName" :value="item.postId" :disabled="item.status == 1"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="角色">
+              <el-select v-model="form.roleIds" multiple placeholder="请选择">
+                <el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId" :disabled="item.status == 1"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="备注">
+              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!-- 用户导入对话框 -->
+    <el-dialog :title="upload.title" v-model="upload.open" width="400px" append-to-body>
+      <el-upload ref="uploadRef" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
+        <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+        <template #tip>
+          <div class="el-upload__tip text-center">
+            <div class="el-upload__tip">
+              <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据
+            </div>
+            <span>仅允许导入xls、xlsx格式文件。</span>
+            <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>
+          </div>
+        </template>
+      </el-upload>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitFileForm">确 定</el-button>
+          <el-button @click="upload.open = false">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="User">
+import { getToken } from "@/utils/auth";
+import useAppStore from '@/store/modules/app'
+import { changeUserStatus, listUser, resetUserPwd, delUser, getUser, updateUser, addUser, deptTreeSelect } from "@/api/system/user";
+import { Splitpanes, Pane } from "splitpanes"
+import "splitpanes/dist/splitpanes.css"
+
+const router = useRouter();
+const appStore = useAppStore()
+const { proxy } = getCurrentInstance();
+const { sys_normal_disable, sys_user_sex } = proxy.useDict("sys_normal_disable", "sys_user_sex");
+
+const userList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const dateRange = ref([]);
+const deptName = ref("");
+const deptOptions = ref(undefined);
+const initPassword = ref(undefined);
+const postOptions = ref([]);
+const roleOptions = ref([]);
+/*** 用户导入参数 */
+const upload = reactive({
+  // 是否显示弹出层（用户导入）
+  open: false,
+  // 弹出层标题（用户导入）
+  title: "",
+  // 是否禁用上传
+  isUploading: false,
+  // 是否更新已经存在的用户数据
+  updateSupport: 0,
+  // 设置上传的请求头部
+  headers: { Authorization: "Bearer " + getToken() },
+  // 上传的地址
+  url: import.meta.env.VITE_APP_BASE_API + "/system/user/importData"
+});
+// 列显隐信息
+const columns = ref([
+  { key: 0, label: `用户编号`, visible: true },
+  { key: 1, label: `用户名称`, visible: true },
+  { key: 2, label: `用户昵称`, visible: true },
+  { key: 3, label: `部门`, visible: true },
+  { key: 4, label: `手机号码`, visible: true },
+  { key: 5, label: `状态`, visible: true },
+  { key: 6, label: `创建时间`, visible: true }
+]);
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    userName: undefined,
+    phonenumber: undefined,
+    status: undefined,
+    deptId: undefined
+  },
+  rules: {
+    userName: [{ required: true, message: "用户名称不能为空", trigger: "blur" }, { min: 2, max: 20, message: "用户名称长度必须介于 2 和 20 之间", trigger: "blur" }],
+    nickName: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
+    password: [{ required: true, message: "用户密码不能为空", trigger: "blur" }, { min: 5, max: 20, message: "用户密码长度必须介于 5 和 20 之间", trigger: "blur" }, { pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符：< > \" ' \\\ |", trigger: "blur" }],
+    email: [{ type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }],
+    phonenumber: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }]
+  }
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 通过条件过滤节点  */
+const filterNode = (value, data) => {
+  if (!value) return true;
+  return data.label.indexOf(value) !== -1;
+};
+
+/** 根据名称筛选部门树 */
+watch(deptName, val => {
+  proxy.$refs["deptTreeRef"].filter(val);
+});
+
+/** 查询部门下拉树结构 */
+function getDeptTree() {
+  deptTreeSelect().then(response => {
+    deptOptions.value = response.data;
+  });
+};
+
+/** 查询用户列表 */
+function getList() {
+  loading.value = true;
+  listUser(proxy.addDateRange(queryParams.value, dateRange.value)).then(res => {
+    loading.value = false;
+    userList.value = res.rows;
+    total.value = res.total;
+  });
+};
+
+/** 节点单击事件 */
+function handleNodeClick(data) {
+  queryParams.value.deptId = data.id;
+  handleQuery();
+};
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+};
+
+/** 重置按钮操作 */
+function resetQuery() {
+  dateRange.value = [];
+  proxy.resetForm("queryRef");
+  queryParams.value.deptId = undefined;
+  proxy.$refs.deptTreeRef.setCurrentKey(null);
+  handleQuery();
+};
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const userIds = row.userId || ids.value;
+  proxy.$modal.confirm('是否确认删除用户编号为"' + userIds + '"的数据项？').then(function () {
+    return delUser(userIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+};
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("system/user/export", {
+    ...queryParams.value,
+  },`user_${new Date().getTime()}.xlsx`);
+};
+
+/** 用户状态修改  */
+function handleStatusChange(row) {
+  let text = row.status === "0" ? "启用" : "停用";
+  proxy.$modal.confirm('确认要"' + text + '""' + row.userName + '"用户吗?').then(function () {
+    return changeUserStatus(row.userId, row.status);
+  }).then(() => {
+    proxy.$modal.msgSuccess(text + "成功");
+  }).catch(function () {
+    row.status = row.status === "0" ? "1" : "0";
+  });
+};
+
+/** 更多操作 */
+function handleCommand(command, row) {
+  switch (command) {
+    case "handleResetPwd":
+      handleResetPwd(row);
+      break;
+    case "handleAuthRole":
+      handleAuthRole(row);
+      break;
+    default:
+      break;
+  }
+};
+
+/** 跳转角色分配 */
+function handleAuthRole(row) {
+  const userId = row.userId;
+  router.push("/system/user-auth/role/" + userId);
+};
+
+/** 重置密码按钮操作 */
+function handleResetPwd(row) {
+  proxy.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    closeOnClickModal: false,
+    inputPattern: /^.{5,20}$/,
+    inputErrorMessage: "用户密码长度必须介于 5 和 20 之间",
+    inputValidator: (value) => {
+      if (/<|>|"|'|\||\\/.test(value)) {
+        return "不能包含非法字符：< > \" ' \\\ |"
+      }
+    },
+  }).then(({ value }) => {
+    resetUserPwd(row.userId, value).then(response => {
+      proxy.$modal.msgSuccess("修改成功，新密码是：" + value);
+    });
+  }).catch(() => {});
+};
+
+/** 选择条数  */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.userId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+};
+
+/** 导入按钮操作 */
+function handleImport() {
+  upload.title = "用户导入";
+  upload.open = true;
+};
+
+/** 下载模板操作 */
+function importTemplate() {
+  proxy.download("system/user/importTemplate", {
+  }, `user_template_${new Date().getTime()}.xlsx`);
+};
+
+/**文件上传中处理 */
+const handleFileUploadProgress = (event, file, fileList) => {
+  upload.isUploading = true;
+};
+
+/** 文件上传成功处理 */
+const handleFileSuccess = (response, file, fileList) => {
+  upload.open = false;
+  upload.isUploading = false;
+  proxy.$refs["uploadRef"].handleRemove(file);
+  proxy.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
+  getList();
+};
+
+/** 提交上传文件 */
+function submitFileForm() {
+  proxy.$refs["uploadRef"].submit();
+};
+
+/** 重置操作表单 */
+function reset() {
+  form.value = {
+    userId: undefined,
+    deptId: undefined,
+    userName: undefined,
+    nickName: undefined,
+    password: undefined,
+    phonenumber: undefined,
+    email: undefined,
+    sex: undefined,
+    status: "0",
+    remark: undefined,
+    postIds: [],
+    roleIds: []
+  };
+  proxy.resetForm("userRef");
+};
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+};
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  getUser().then(response => {
+    postOptions.value = response.posts;
+    roleOptions.value = response.roles;
+    open.value = true;
+    title.value = "添加用户";
+    form.value.password = initPassword.value;
+  });
+};
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const userId = row.userId || ids.value;
+  getUser(userId).then(response => {
+    form.value = response.data;
+    postOptions.value = response.posts;
+    roleOptions.value = response.roles;
+    form.value.postIds = response.postIds;
+    form.value.roleIds = response.roleIds;
+    open.value = true;
+    title.value = "修改用户";
+    form.password = "";
+  });
+};
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["userRef"].validate(valid => {
+    if (valid) {
+      if (form.value.userId != undefined) {
+        updateUser(form.value).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addUser(form.value).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+};
+
+getDeptTree();
+getList();
+</script>
diff --git a/src/views/system/user/profile/index.vue b/src/views/system/user/profile/index.vue
new file mode 100644
index 0000000..f165ed4
--- /dev/null
+++ b/src/views/system/user/profile/index.vue
@@ -0,0 +1,87 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="6" :xs="24">
+        <el-card class="box-card">
+          <template v-slot:header>
+            <div class="clearfix">
+              <span>个人信息</span>
+            </div>
+          </template>
+          <div>
+            <div class="text-center">
+              <userAvatar />
+            </div>
+            <ul class="list-group list-group-striped">
+              <li class="list-group-item">
+                <svg-icon icon-class="user" />用户名称
+                <div class="pull-right">{{ state.user.userName }}</div>
+              </li>
+              <li class="list-group-item">
+                <svg-icon icon-class="phone" />手机号码
+                <div class="pull-right">{{ state.user.phonenumber }}</div>
+              </li>
+              <li class="list-group-item">
+                <svg-icon icon-class="email" />用户邮箱
+                <div class="pull-right">{{ state.user.email }}</div>
+              </li>
+              <!-- <li class="list-group-item">
+                        <svg-icon icon-class="tree" />所属部门
+                        <div class="pull-right" v-if="state.user.dept">{{ state.user.dept.deptName }} / {{ state.postGroup }}</div>
+                     </li>
+                     <li class="list-group-item">
+                        <svg-icon icon-class="peoples" />所属角色
+                        <div class="pull-right">{{ state.roleGroup }}</div>
+                     </li> -->
+              <li class="list-group-item">
+                <svg-icon icon-class="date" />创建日期
+                <div class="pull-right">{{ state.user.createTime }}</div>
+              </li>
+            </ul>
+          </div>
+        </el-card>
+      </el-col>
+      <el-col :span="18" :xs="24">
+        <el-card>
+          <template v-slot:header>
+            <div class="clearfix">
+              <span>基本资料</span>
+            </div>
+          </template>
+          <el-tabs v-model="activeTab">
+            <el-tab-pane label="基本资料" name="userinfo">
+              <userInfo :user="state.user" />
+            </el-tab-pane>
+            <el-tab-pane label="修改密码" name="resetPwd">
+              <resetPwd />
+            </el-tab-pane>
+          </el-tabs>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup name="Profile">
+import userAvatar from "./userAvatar";
+import userInfo from "./userInfo";
+import resetPwd from "./resetPwd";
+import { getUserProfile } from "@/api/system/user";
+
+const activeTab = ref("userinfo");
+const state = reactive({
+  user: {},
+  roleGroup: {},
+  postGroup: {},
+});
+
+function getUser() {
+  getUserProfile().then((response) => {
+    state.user = response.data;
+    state.roleGroup = response.roleGroup;
+    state.postGroup = response.postGroup;
+  });
+}
+
+getUser();
+</script>
diff --git a/src/views/system/user/profile/resetPwd.vue b/src/views/system/user/profile/resetPwd.vue
new file mode 100644
index 0000000..b484755
--- /dev/null
+++ b/src/views/system/user/profile/resetPwd.vue
@@ -0,0 +1,59 @@
+<template>
+   <el-form ref="pwdRef" :model="user" :rules="rules" label-width="80px">
+      <el-form-item label="旧密码" prop="oldPassword">
+         <el-input v-model="user.oldPassword" placeholder="请输入旧密码" type="password" show-password />
+      </el-form-item>
+      <el-form-item label="新密码" prop="newPassword">
+         <el-input v-model="user.newPassword" placeholder="请输入新密码" type="password" show-password />
+      </el-form-item>
+      <el-form-item label="确认密码" prop="confirmPassword">
+         <el-input v-model="user.confirmPassword" placeholder="请确认新密码" type="password" show-password/>
+      </el-form-item>
+      <el-form-item>
+      <el-button type="primary" @click="submit">保存</el-button>
+      <el-button type="danger" @click="close">关闭</el-button>
+      </el-form-item>
+   </el-form>
+</template>
+
+<script setup>
+import { updateUserPwd } from "@/api/system/user";
+
+const { proxy } = getCurrentInstance();
+
+const user = reactive({
+  oldPassword: undefined,
+  newPassword: undefined,
+  confirmPassword: undefined
+});
+
+const equalToPassword = (rule, value, callback) => {
+  if (user.newPassword !== value) {
+    callback(new Error("两次输入的密码不一致"));
+  } else {
+    callback();
+  }
+};
+
+const rules = ref({
+  oldPassword: [{ required: true, message: "旧密码不能为空", trigger: "blur" }],
+  newPassword: [{ required: true, message: "新密码不能为空", trigger: "blur" }, { min: 6, max: 20, message: "长度在 6 到 20 个字符", trigger: "blur" }, { pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符：< > \" ' \\\ |", trigger: "blur" }],
+  confirmPassword: [{ required: true, message: "确认密码不能为空", trigger: "blur" }, { required: true, validator: equalToPassword, trigger: "blur" }]
+});
+
+/** 提交按钮 */
+function submit() {
+  proxy.$refs.pwdRef.validate(valid => {
+    if (valid) {
+      updateUserPwd(user.oldPassword, user.newPassword).then(response => {
+        proxy.$modal.msgSuccess("修改成功");
+      });
+    }
+  });
+};
+
+/** 关闭按钮 */
+function close() {
+  proxy.$tab.closePage();
+};
+</script>
diff --git a/src/views/system/user/profile/userAvatar.vue b/src/views/system/user/profile/userAvatar.vue
new file mode 100644
index 0000000..a375576
--- /dev/null
+++ b/src/views/system/user/profile/userAvatar.vue
@@ -0,0 +1,180 @@
+<template>
+  <div class="user-info-head" @click="editCropper()">
+    <img :src="options.img" title="点击上传头像" class="img-circle img-lg" />
+    <el-dialog :title="title" v-model="open" width="800px" append-to-body @opened="modalOpened" @close="closeDialog">
+      <el-row>
+        <el-col :xs="24" :md="12" :style="{ height: '350px' }">
+          <vue-cropper
+            ref="cropper"
+            :img="options.img"
+            :info="true"
+            :autoCrop="options.autoCrop"
+            :autoCropWidth="options.autoCropWidth"
+            :autoCropHeight="options.autoCropHeight"
+            :fixedBox="options.fixedBox"
+            :outputType="options.outputType"
+            @realTime="realTime"
+            v-if="visible"
+          />
+        </el-col>
+        <el-col :xs="24" :md="12" :style="{ height: '350px' }">
+          <div class="avatar-upload-preview">
+            <img :src="options.previews.url" :style="options.previews.img" />
+          </div>
+        </el-col>
+      </el-row>
+      <br />
+      <el-row>
+        <el-col :lg="2" :md="2">
+          <el-upload
+            action="#"
+            :http-request="requestUpload"
+            :show-file-list="false"
+            :before-upload="beforeUpload"
+          >
+            <el-button>
+              选择
+              <el-icon class="el-icon--right"><Upload /></el-icon>
+            </el-button>
+          </el-upload>
+        </el-col>
+        <el-col :lg="{ span: 1, offset: 2 }" :md="2">
+          <el-button icon="Plus" @click="changeScale(1)"></el-button>
+        </el-col>
+        <el-col :lg="{ span: 1, offset: 1 }" :md="2">
+          <el-button icon="Minus" @click="changeScale(-1)"></el-button>
+        </el-col>
+        <el-col :lg="{ span: 1, offset: 1 }" :md="2">
+          <el-button icon="RefreshLeft" @click="rotateLeft()"></el-button>
+        </el-col>
+        <el-col :lg="{ span: 1, offset: 1 }" :md="2">
+          <el-button icon="RefreshRight" @click="rotateRight()"></el-button>
+        </el-col>
+        <el-col :lg="{ span: 2, offset: 6 }" :md="2">
+          <el-button type="primary" @click="uploadImg()">提 交</el-button>
+        </el-col>
+      </el-row>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import "vue-cropper/dist/index.css";
+import { VueCropper } from "vue-cropper";
+import { uploadAvatar } from "@/api/system/user";
+import useUserStore from "@/store/modules/user";
+
+const userStore = useUserStore();
+const { proxy } = getCurrentInstance();
+
+const open = ref(false);
+const visible = ref(false);
+const title = ref("修改头像");
+
+//图片裁剪数据
+const options = reactive({
+  img: userStore.avatar,     // 裁剪图片的地址
+  autoCrop: true,            // 是否默认生成截图框
+  autoCropWidth: 200,        // 默认生成截图框宽度
+  autoCropHeight: 200,       // 默认生成截图框高度
+  fixedBox: true,            // 固定截图框大小 不允许改变
+  outputType: "png",         // 默认生成截图为PNG格式
+  filename: 'avatar',        // 文件名称
+  previews: {}               //预览数据
+});
+
+/** 编辑头像 */
+function editCropper() {
+  open.value = true;
+}
+
+/** 打开弹出层结束时的回调 */
+function modalOpened() {
+  visible.value = true;
+}
+
+/** 覆盖默认上传行为 */
+function requestUpload() {}
+
+/** 向左旋转 */
+function rotateLeft() {
+  proxy.$refs.cropper.rotateLeft();
+}
+
+/** 向右旋转 */
+function rotateRight() {
+  proxy.$refs.cropper.rotateRight();
+}
+
+/** 图片缩放 */
+function changeScale(num) {
+  num = num || 1;
+  proxy.$refs.cropper.changeScale(num);
+}
+
+/** 上传预处理 */
+function beforeUpload(file) {
+  if (file.type.indexOf("image/") == -1) {
+    proxy.$modal.msgError("文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。");
+  } else {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.onload = () => {
+      options.img = reader.result;
+      options.filename = file.name;
+    };
+  }
+}
+
+/** 上传图片 */
+function uploadImg() {
+  proxy.$refs.cropper.getCropBlob(data => {
+    let formData = new FormData();
+    formData.append("avatarfile", data, options.filename);
+    uploadAvatar(formData).then(response => {
+      open.value = false;
+      options.img = import.meta.env.VITE_APP_BASE_API + response.imgUrl;
+      userStore.avatar = options.img;
+      proxy.$modal.msgSuccess("修改成功");
+      visible.value = false;
+    });
+  });
+}
+
+/** 实时预览 */
+function realTime(data) {
+  options.previews = data;
+}
+
+/** 关闭窗口 */
+function closeDialog() {
+  options.img = userStore.avatar;
+  options.visible = false;
+}
+</script>
+
+<style lang='scss' scoped>
+.user-info-head {
+  position: relative;
+  display: inline-block;
+  height: 120px;
+}
+
+.user-info-head:hover:after {
+  content: "+";
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  color: #eee;
+  background: rgba(0, 0, 0, 0.5);
+  font-size: 24px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  cursor: pointer;
+  line-height: 110px;
+  border-radius: 50%;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/system/user/profile/userInfo.vue b/src/views/system/user/profile/userInfo.vue
new file mode 100644
index 0000000..2737fe1
--- /dev/null
+++ b/src/views/system/user/profile/userInfo.vue
@@ -0,0 +1,67 @@
+<template>
+   <el-form ref="userRef" :model="form" :rules="rules" label-width="80px">
+      <el-form-item label="用户昵称" prop="nickName">
+         <el-input v-model="form.nickName" maxlength="30" />
+      </el-form-item>
+      <el-form-item label="手机号码" prop="phonenumber">
+         <el-input v-model="form.phonenumber" maxlength="11" />
+      </el-form-item>
+      <el-form-item label="邮箱" prop="email">
+         <el-input v-model="form.email" maxlength="50" />
+      </el-form-item>
+      <el-form-item label="性别">
+         <el-radio-group v-model="form.sex">
+            <el-radio value="0">男</el-radio>
+            <el-radio value="1">女</el-radio>
+         </el-radio-group>
+      </el-form-item>
+      <el-form-item>
+      <el-button type="primary" @click="submit">保存</el-button>
+      <el-button type="danger" @click="close">关闭</el-button>
+      </el-form-item>
+   </el-form>
+</template>
+
+<script setup>
+import { updateUserProfile } from "@/api/system/user";
+
+const props = defineProps({
+  user: {
+    type: Object
+  }
+});
+
+const { proxy } = getCurrentInstance();
+
+const form = ref({});
+const rules = ref({
+  nickName: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
+  email: [{ required: true, message: "邮箱地址不能为空", trigger: "blur" }, { type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }],
+  phonenumber: [{ required: true, message: "手机号码不能为空", trigger: "blur" }, { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }],
+});
+
+/** 提交按钮 */
+function submit() {
+  proxy.$refs.userRef.validate(valid => {
+    if (valid) {
+      updateUserProfile(form.value).then(response => {
+        proxy.$modal.msgSuccess("修改成功");
+        props.user.phonenumber = form.value.phonenumber;
+        props.user.email = form.value.email;
+      });
+    }
+  });
+};
+
+/** 关闭按钮 */
+function close() {
+  proxy.$tab.closePage();
+};
+
+// 回显当前登录用户信息
+watch(() => props.user, user => {
+  if (user) {
+    form.value = { nickName: user.nickName, phonenumber: user.phonenumber, email: user.email, sex: user.sex };
+  }
+},{ immediate: true });
+</script>
diff --git a/src/views/tool/build/index.vue b/src/views/tool/build/index.vue
new file mode 100644
index 0000000..c3543a9
--- /dev/null
+++ b/src/views/tool/build/index.vue
@@ -0,0 +1,3 @@
+<template>
+   <div> 表单构建 <svg-icon icon-class="build" /> </div>
+</template>
\ No newline at end of file
diff --git a/src/views/tool/gen/basicInfoForm.vue b/src/views/tool/gen/basicInfoForm.vue
new file mode 100644
index 0000000..39c8515
--- /dev/null
+++ b/src/views/tool/gen/basicInfoForm.vue
@@ -0,0 +1,48 @@
+<template>
+  <el-form ref="basicInfoForm" :model="info" :rules="rules" label-width="150px">
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="表名称" prop="tableName">
+          <el-input placeholder="请输入仓库名称" v-model="info.tableName" />
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="表描述" prop="tableComment">
+          <el-input placeholder="请输入" v-model="info.tableComment" />
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="实体类名称" prop="className">
+          <el-input placeholder="请输入" v-model="info.className" />
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="作者" prop="functionAuthor">
+          <el-input placeholder="请输入" v-model="info.functionAuthor" />
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item label="备注" prop="remark">
+          <el-input type="textarea" :rows="3" v-model="info.remark"></el-input>
+        </el-form-item>
+      </el-col>
+    </el-row>
+  </el-form>
+</template>
+
+<script setup>
+defineProps({
+  info: {
+    type: Object,
+    default: null
+  }
+});
+
+// 表单校验
+const rules = ref({
+  tableName: [{ required: true, message: "请输入表名称", trigger: "blur" }],
+  tableComment: [{ required: true, message: "请输入表描述", trigger: "blur" }],
+  className: [{ required: true, message: "请输入实体类名称", trigger: "blur" }],
+  functionAuthor: [{ required: true, message: "请输入作者", trigger: "blur" }]
+});
+</script>
diff --git a/src/views/tool/gen/createTable.vue b/src/views/tool/gen/createTable.vue
new file mode 100644
index 0000000..00fdfdb
--- /dev/null
+++ b/src/views/tool/gen/createTable.vue
@@ -0,0 +1,46 @@
+<template>
+  <!-- 创建表 -->
+  <el-dialog title="创建表" v-model="visible" width="800px" top="5vh" append-to-body>
+    <span>创建表语句(支持多个建表语句)：</span>
+    <el-input type="textarea" :rows="10" placeholder="请输入文本" v-model="content"></el-input>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button type="primary" @click="handleImportTable">确 定</el-button>
+        <el-button @click="visible = false">取 消</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { createTable } from "@/api/tool/gen";
+
+const visible = ref(false);
+const content = ref("");
+const { proxy } = getCurrentInstance();
+const emit = defineEmits(["ok"]);
+
+/** 显示弹框 */
+function show() {
+  visible.value = true;
+}
+
+/** 导入按钮操作 */
+function handleImportTable() {
+  if (content.value === "") {
+    proxy.$modal.msgError("请输入建表语句");
+    return;
+  }
+  createTable({ sql: content.value }).then(res => {
+    proxy.$modal.msgSuccess(res.msg);
+    if (res.code === 200) {
+      visible.value = false;
+      emit("ok");
+    }
+  });
+}
+
+defineExpose({
+  show,
+});
+</script>
diff --git a/src/views/tool/gen/editTable.vue b/src/views/tool/gen/editTable.vue
new file mode 100644
index 0000000..5d22780
--- /dev/null
+++ b/src/views/tool/gen/editTable.vue
@@ -0,0 +1,200 @@
+<template>
+  <el-card>
+    <el-tabs v-model="activeName">
+      <el-tab-pane label="基本信息" name="basic">
+        <basic-info-form ref="basicInfo" :info="info" />
+      </el-tab-pane>
+      <el-tab-pane label="字段信息" name="columnInfo">
+        <el-table ref="dragTable" :data="columns" row-key="columnId" :max-height="tableHeight">
+          <el-table-column label="序号" type="index" min-width="5%"/>
+          <el-table-column
+            label="字段列名"
+            prop="columnName"
+            min-width="10%"
+            :show-overflow-tooltip="true"
+          />
+          <el-table-column label="字段描述" min-width="10%">
+            <template #default="scope">
+              <el-input v-model="scope.row.columnComment"></el-input>
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="物理类型"
+            prop="columnType"
+            min-width="10%"
+            :show-overflow-tooltip="true"
+          />
+          <el-table-column label="Java类型" min-width="11%">
+            <template #default="scope">
+              <el-select v-model="scope.row.javaType">
+                <el-option label="Long" value="Long" />
+                <el-option label="String" value="String" />
+                <el-option label="Integer" value="Integer" />
+                <el-option label="Double" value="Double" />
+                <el-option label="BigDecimal" value="BigDecimal" />
+                <el-option label="Date" value="Date" />
+                <el-option label="Boolean" value="Boolean" />
+              </el-select>
+            </template>
+          </el-table-column>
+          <el-table-column label="java属性" min-width="10%">
+            <template #default="scope">
+              <el-input v-model="scope.row.javaField"></el-input>
+            </template>
+          </el-table-column>
+
+          <el-table-column label="插入" min-width="5%">
+            <template #default="scope">
+              <el-checkbox true-label="1" false-label="0" v-model="scope.row.isInsert"></el-checkbox>
+            </template>
+          </el-table-column>
+          <el-table-column label="编辑" min-width="5%">
+            <template #default="scope">
+              <el-checkbox true-label="1" false-label="0" v-model="scope.row.isEdit"></el-checkbox>
+            </template>
+          </el-table-column>
+          <el-table-column label="列表" min-width="5%">
+            <template #default="scope">
+              <el-checkbox true-label="1" false-label="0" v-model="scope.row.isList"></el-checkbox>
+            </template>
+          </el-table-column>
+          <el-table-column label="查询" min-width="5%">
+            <template #default="scope">
+              <el-checkbox true-label="1" false-label="0" v-model="scope.row.isQuery"></el-checkbox>
+            </template>
+          </el-table-column>
+          <el-table-column label="查询方式" min-width="10%">
+            <template #default="scope">
+              <el-select v-model="scope.row.queryType">
+                <el-option label="=" value="EQ" />
+                <el-option label="!=" value="NE" />
+                <el-option label=">" value="GT" />
+                <el-option label=">=" value="GTE" />
+                <el-option label="<" value="LT" />
+                <el-option label="<=" value="LTE" />
+                <el-option label="LIKE" value="LIKE" />
+                <el-option label="BETWEEN" value="BETWEEN" />
+              </el-select>
+            </template>
+          </el-table-column>
+          <el-table-column label="必填" min-width="5%">
+            <template #default="scope">
+              <el-checkbox true-label="1" false-label="0" v-model="scope.row.isRequired"></el-checkbox>
+            </template>
+          </el-table-column>
+          <el-table-column label="显示类型" min-width="12%">
+            <template #default="scope">
+              <el-select v-model="scope.row.htmlType">
+                <el-option label="文本框" value="input" />
+                <el-option label="文本域" value="textarea" />
+                <el-option label="下拉框" value="select" />
+                <el-option label="单选框" value="radio" />
+                <el-option label="复选框" value="checkbox" />
+                <el-option label="日期控件" value="datetime" />
+                <el-option label="图片上传" value="imageUpload" />
+                <el-option label="文件上传" value="fileUpload" />
+                <el-option label="富文本控件" value="editor" />
+              </el-select>
+            </template>
+          </el-table-column>
+          <el-table-column label="字典类型" min-width="12%">
+            <template #default="scope">
+              <el-select v-model="scope.row.dictType" clearable filterable placeholder="请选择">
+                <el-option
+                  v-for="dict in dictOptions"
+                  :key="dict.dictType"
+                  :label="dict.dictName"
+                  :value="dict.dictType">
+                  <span style="float: left">{{ dict.dictName }}</span>
+                  <span style="float: right; color: #8492a6; font-size: 13px">{{ dict.dictType }}</span>
+              </el-option>
+              </el-select>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+      <el-tab-pane label="生成信息" name="genInfo">
+        <gen-info-form ref="genInfo" :info="info" :tables="tables" />
+      </el-tab-pane>
+    </el-tabs>
+    <el-form label-width="100px">
+      <div style="text-align: center;margin-left:-100px;margin-top:10px;">
+        <el-button type="primary" @click="submitForm()">提交</el-button>
+        <el-button @click="close()">返回</el-button>
+      </div>
+    </el-form>
+  </el-card>
+</template>
+
+<script setup name="GenEdit">
+import { getGenTable, updateGenTable } from "@/api/tool/gen";
+import { optionselect as getDictOptionselect } from "@/api/system/dict/type";
+import basicInfoForm from "./basicInfoForm";
+import genInfoForm from "./genInfoForm";
+
+const route = useRoute();
+const { proxy } = getCurrentInstance();
+
+const activeName = ref("columnInfo");
+const tableHeight = ref(document.documentElement.scrollHeight - 245 + "px");
+const tables = ref([]);
+const columns = ref([]);
+const dictOptions = ref([]);
+const info = ref({});
+
+/** 提交按钮 */
+function submitForm() {
+  const basicForm = proxy.$refs.basicInfo.$refs.basicInfoForm;
+  const genForm = proxy.$refs.genInfo.$refs.genInfoForm;
+  Promise.all([basicForm, genForm].map(getFormPromise)).then(res => {
+    const validateResult = res.every(item => !!item);
+    if (validateResult) {
+      const genTable = Object.assign({}, info.value);
+      genTable.columns = columns.value;
+      genTable.params = {
+        treeCode: info.value.treeCode,
+        treeName: info.value.treeName,
+        treeParentCode: info.value.treeParentCode,
+        parentMenuId: info.value.parentMenuId
+      };
+      updateGenTable(genTable).then(res => {
+        proxy.$modal.msgSuccess(res.msg);
+        if (res.code === 200) {
+          close();
+        }
+      });
+    } else {
+      proxy.$modal.msgError("表单校验未通过，请重新检查提交内容");
+    }
+  });
+}
+
+function getFormPromise(form) {
+  return new Promise(resolve => {
+    form.validate(res => {
+      resolve(res);
+    });
+  });
+}
+
+function close() {
+  const obj = { path: "/tool/gen", query: { t: Date.now(), pageNum: route.query.pageNum } };
+  proxy.$tab.closeOpenPage(obj);
+}
+
+(() => {
+  const tableId = route.params && route.params.tableId;
+  if (tableId) {
+    // 获取表详细信息
+    getGenTable(tableId).then(res => {
+      columns.value = res.data.rows;
+      info.value = res.data.info;
+      tables.value = res.data.tables;
+    });
+    /** 查询字典下拉列表 */
+    getDictOptionselect().then(response => {
+      dictOptions.value = response.data;
+    });
+  }
+})();
+</script>
diff --git a/src/views/tool/gen/genInfoForm.vue b/src/views/tool/gen/genInfoForm.vue
new file mode 100644
index 0000000..e5189c5
--- /dev/null
+++ b/src/views/tool/gen/genInfoForm.vue
@@ -0,0 +1,306 @@
+<template>
+  <el-form ref="genInfoForm" :model="info" :rules="rules" label-width="150px">
+    <el-row>
+      <el-col :span="12">
+        <el-form-item prop="tplCategory">
+          <template #label>生成模板</template>
+          <el-select v-model="info.tplCategory" @change="tplSelectChange">
+            <el-option label="单表（增删改查）" value="crud" />
+            <el-option label="树表（增删改查）" value="tree" />
+            <el-option label="主子表（增删改查）" value="sub" />
+          </el-select>
+        </el-form-item>
+      </el-col>
+
+      <el-col :span="12">
+        <el-form-item prop="tplWebType">
+          <template #label>前端类型</template>
+          <el-select v-model="info.tplWebType">
+            <el-option label="Vue2 Element UI 模版" value="element-ui" />
+            <el-option label="Vue3 Element Plus 模版" value="element-plus" />
+          </el-select>
+        </el-form-item>
+      </el-col>
+
+      <el-col :span="12">
+        <el-form-item prop="packageName">
+          <template #label>
+            生成包路径
+            <el-tooltip content="生成在哪个java包下，例如 com.ruoyi.system" placement="top">
+              <el-icon><question-filled /></el-icon>
+            </el-tooltip>
+          </template>
+          <el-input v-model="info.packageName" />
+        </el-form-item>
+      </el-col>
+
+      <el-col :span="12">
+        <el-form-item prop="moduleName">
+          <template #label>
+            生成模块名
+            <el-tooltip content="可理解为子系统名，例如 system" placement="top">
+              <el-icon><question-filled /></el-icon>
+            </el-tooltip>
+          </template>
+          <el-input v-model="info.moduleName" />
+        </el-form-item>
+      </el-col>
+
+      <el-col :span="12">
+        <el-form-item prop="businessName">
+          <template #label>
+            生成业务名
+            <el-tooltip content="可理解为功能英文名，例如 user" placement="top">
+              <el-icon><question-filled /></el-icon>
+            </el-tooltip>
+          </template>
+          <el-input v-model="info.businessName" />
+        </el-form-item>
+      </el-col>
+
+      <el-col :span="12">
+        <el-form-item prop="functionName">
+          <template #label>
+            生成功能名
+            <el-tooltip content="用作类描述，例如 用户" placement="top">
+              <el-icon><question-filled /></el-icon>
+            </el-tooltip>
+          </template>
+          <el-input v-model="info.functionName" />
+        </el-form-item>
+      </el-col>
+
+      <el-col :span="12">
+        <el-form-item prop="genType">
+          <template #label>
+            生成代码方式
+            <el-tooltip content="默认为zip压缩包下载，也可以自定义生成路径" placement="top">
+              <el-icon><question-filled /></el-icon>
+            </el-tooltip>
+          </template>
+          <el-radio v-model="info.genType" value="0">zip压缩包</el-radio>
+          <el-radio v-model="info.genType" value="1">自定义路径</el-radio>
+        </el-form-item>
+      </el-col>
+
+      <el-col :span="12">
+        <el-form-item>
+          <template #label>
+            上级菜单
+            <el-tooltip content="分配到指定菜单下，例如 系统管理" placement="top">
+              <el-icon><question-filled /></el-icon>
+            </el-tooltip>
+          </template>
+          <el-tree-select
+            v-model="info.parentMenuId"
+            :data="menuOptions"
+            :props="{ value: 'menuId', label: 'menuName', children: 'children' }"
+            value-key="menuId"
+            placeholder="请选择系统菜单"
+            check-strictly
+          />
+        </el-form-item>
+      </el-col>
+
+      <el-col :span="24" v-if="info.genType == '1'">
+        <el-form-item prop="genPath">
+          <template #label>
+            自定义路径
+            <el-tooltip content="填写磁盘绝对路径，若不填写，则生成到当前Web项目下" placement="top">
+              <el-icon><question-filled /></el-icon>
+            </el-tooltip>
+          </template>
+          <el-input v-model="info.genPath">
+            <template #append>
+              <el-dropdown>
+                <el-button type="primary">
+                  最近路径快速选择
+                  <i class="el-icon-arrow-down el-icon--right"></i>
+                </el-button>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item @click="info.genPath = '/'">恢复默认的生成基础路径</el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </template>
+          </el-input>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    
+    <template v-if="info.tplCategory == 'tree'">
+      <h4 class="form-header">其他信息</h4>
+      <el-row v-show="info.tplCategory == 'tree'">
+        <el-col :span="12">
+          <el-form-item>
+            <template #label>
+              树编码字段
+              <el-tooltip content="树显示的编码字段名， 如：dept_id" placement="top">
+                <el-icon><question-filled /></el-icon>
+              </el-tooltip>
+            </template>
+            <el-select v-model="info.treeCode" placeholder="请选择">
+              <el-option
+                v-for="(column, index) in info.columns"
+                :key="index"
+                :label="column.columnName + '：' + column.columnComment"
+                :value="column.columnName"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item>
+            <template #label>
+              树父编码字段
+              <el-tooltip content="树显示的父编码字段名， 如：parent_Id" placement="top">
+                <el-icon><question-filled /></el-icon>
+              </el-tooltip>
+            </template>
+            <el-select v-model="info.treeParentCode" placeholder="请选择">
+              <el-option
+                v-for="(column, index) in info.columns"
+                :key="index"
+                :label="column.columnName + '：' + column.columnComment"
+                :value="column.columnName"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item>
+            <template #label>
+              树名称字段
+              <el-tooltip content="树节点的显示名称字段名， 如：dept_name" placement="top">
+                <el-icon><question-filled /></el-icon>
+              </el-tooltip>
+            </template>
+            <el-select v-model="info.treeName" placeholder="请选择">
+              <el-option
+                v-for="(column, index) in info.columns"
+                :key="index"
+                :label="column.columnName + '：' + column.columnComment"
+                :value="column.columnName"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </template>
+
+    <template v-if="info.tplCategory == 'sub'">
+      <h4 class="form-header">关联信息</h4>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item>
+            <template #label>
+              关联子表的表名
+              <el-tooltip content="关联子表的表名， 如：sys_user" placement="top">
+                <el-icon><question-filled /></el-icon>
+              </el-tooltip>
+            </template>
+            <el-select v-model="info.subTableName" placeholder="请选择" @change="subSelectChange">
+              <el-option
+                v-for="(table, index) in tables"
+                :key="index"
+                :label="table.tableName + '：' + table.tableComment"
+                :value="table.tableName"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item>
+            <template #label>
+              子表关联的外键名
+              <el-tooltip content="子表关联的外键名， 如：user_id" placement="top">
+                <el-icon><question-filled /></el-icon>
+              </el-tooltip>
+            </template>
+            <el-select v-model="info.subTableFkName" placeholder="请选择">
+              <el-option
+                v-for="(column, index) in subColumns"
+                :key="index"
+                :label="column.columnName + '：' + column.columnComment"
+                :value="column.columnName"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </template>
+
+  </el-form>
+</template>
+
+<script setup>
+import { listMenu } from "@/api/system/menu";
+
+const subColumns = ref([]);
+const menuOptions = ref([]);
+const { proxy } = getCurrentInstance();
+
+const props = defineProps({
+  info: {
+    type: Object,
+    default: null
+  },
+  tables: {
+    type: Array,
+    default: null
+  }
+});
+
+// 表单校验
+const rules = ref({
+  tplCategory: [{ required: true, message: "请选择生成模板", trigger: "blur" }],
+  packageName: [{ required: true, message: "请输入生成包路径", trigger: "blur" }],
+  moduleName: [{ required: true, message: "请输入生成模块名", trigger: "blur" }],
+  businessName: [{ required: true, message: "请输入生成业务名", trigger: "blur" }],
+  functionName: [{ required: true, message: "请输入生成功能名", trigger: "blur" }]
+});
+
+function subSelectChange(value) {
+  props.info.subTableFkName = "";
+}
+
+function tplSelectChange(value) {
+  if (value !== "sub") {
+    props.info.subTableName = "";
+    props.info.subTableFkName = "";
+  }
+}
+
+function setSubTableColumns(value) {
+  for (var item in props.tables) {
+    const name = props.tables[item].tableName;
+    if (value === name) {
+      subColumns.value = props.tables[item].columns;
+      break;
+    }
+  }
+}
+
+/** 查询菜单下拉树结构 */
+function getMenuTreeselect() {
+  listMenu().then(response => {
+    menuOptions.value = proxy.handleTree(response.data, "menuId");
+  });
+}
+
+onMounted(() => {
+  getMenuTreeselect();
+})
+
+watch(() => props.info.subTableName, val => {
+  setSubTableColumns(val);
+});
+
+watch(() => props.info.tplWebType, val => {
+  if (val === '') {
+    props.info.tplWebType = "element-plus";
+  }
+});
+
+</script>
diff --git a/src/views/tool/gen/importTable.vue b/src/views/tool/gen/importTable.vue
new file mode 100644
index 0000000..d0115c4
--- /dev/null
+++ b/src/views/tool/gen/importTable.vue
@@ -0,0 +1,126 @@
+<template>
+  <!-- 导入表 -->
+  <el-dialog title="导入表" v-model="visible" width="800px" top="5vh" append-to-body>
+    <el-form :model="queryParams" ref="queryRef" :inline="true">
+      <el-form-item label="表名称" prop="tableName">
+        <el-input
+          v-model="queryParams.tableName"
+          placeholder="请输入表名称"
+          clearable
+          style="width: 180px"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="表描述" prop="tableComment">
+        <el-input
+          v-model="queryParams.tableComment"
+          placeholder="请输入表描述"
+          clearable
+          style="width: 180px"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-row>
+      <el-table @row-click="clickRow" ref="table" :data="dbTableList" @selection-change="handleSelectionChange" height="260px">
+        <el-table-column type="selection" width="55"></el-table-column>
+        <el-table-column prop="tableName" label="表名称" :show-overflow-tooltip="true"></el-table-column>
+        <el-table-column prop="tableComment" label="表描述" :show-overflow-tooltip="true"></el-table-column>
+        <el-table-column prop="createTime" label="创建时间"></el-table-column>
+        <el-table-column prop="updateTime" label="更新时间"></el-table-column>
+      </el-table>
+      <pagination
+        v-show="total>0"
+        :total="total"
+        v-model:page="queryParams.pageNum"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </el-row>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button type="primary" @click="handleImportTable">确 定</el-button>
+        <el-button @click="visible = false">取 消</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { listDbTable, importTable } from "@/api/tool/gen";
+
+const total = ref(0);
+const visible = ref(false);
+const tables = ref([]);
+const dbTableList = ref([]);
+const { proxy } = getCurrentInstance();
+
+const queryParams = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  tableName: undefined,
+  tableComment: undefined
+});
+
+const emit = defineEmits(["ok"]);
+
+/** 查询参数列表 */
+function show() {
+  getList();
+  visible.value = true;
+}
+
+/** 单击选择行 */
+function clickRow(row) {
+  proxy.$refs.table.toggleRowSelection(row);
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  tables.value = selection.map(item => item.tableName);
+}
+
+/** 查询表数据 */
+function getList() {
+  listDbTable(queryParams).then(res => {
+    dbTableList.value = res.rows;
+    total.value = res.total;
+  });
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 导入按钮操作 */
+function handleImportTable() {
+  const tableNames = tables.value.join(",");
+  if (tableNames == "") {
+    proxy.$modal.msgError("请选择要导入的表");
+    return;
+  }
+  importTable({ tables: tableNames }).then(res => {
+    proxy.$modal.msgSuccess(res.msg);
+    if (res.code === 200) {
+      visible.value = false;
+      emit("ok");
+    }
+  });
+}
+
+defineExpose({
+  show,
+});
+</script>
diff --git a/src/views/tool/gen/index.vue b/src/views/tool/gen/index.vue
new file mode 100644
index 0000000..e6bf638
--- /dev/null
+++ b/src/views/tool/gen/index.vue
@@ -0,0 +1,310 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
+      <el-form-item label="表名称" prop="tableName">
+        <el-input
+          v-model="queryParams.tableName"
+          placeholder="请输入表名称"
+          clearable
+          style="width: 200px"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="表描述" prop="tableComment">
+        <el-input
+          v-model="queryParams.tableComment"
+          placeholder="请输入表描述"
+          clearable
+          style="width: 200px"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="创建时间" style="width: 308px">
+        <el-date-picker
+          v-model="dateRange"
+          value-format="YYYY-MM-DD"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        ></el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Download"
+          :disabled="multiple"
+          @click="handleGenTable"
+          v-hasPermi="['tool:gen:code']"
+        >生成</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="Plus"
+          @click="openCreateTable"
+          v-hasRole="['admin']"
+        >创建</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="info"
+          plain
+          icon="Upload"
+          @click="openImportTable"
+          v-hasPermi="['tool:gen:import']"
+        >导入</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleEditTable"
+          v-hasPermi="['tool:gen:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['tool:gen:remove']"
+        >删除</el-button>
+      </el-col>
+      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" align="center" width="55"></el-table-column>
+      <el-table-column label="序号" type="index" width="50" align="center">
+        <template #default="scope">
+          <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="表名称"
+        align="center"
+        prop="tableName"
+        :show-overflow-tooltip="true"
+      />
+      <el-table-column
+        label="表描述"
+        align="center"
+        prop="tableComment"
+        :show-overflow-tooltip="true"
+      />
+      <el-table-column
+        label="实体"
+        align="center"
+        prop="className"
+        :show-overflow-tooltip="true"
+      />
+      <el-table-column label="创建时间" align="center" prop="createTime" width="160" />
+      <el-table-column label="更新时间" align="center" prop="updateTime" width="160" />
+      <el-table-column label="操作" align="center" width="330" class-name="small-padding fixed-width">
+        <template #default="scope">
+          <el-tooltip content="预览" placement="top">
+            <el-button link type="primary" icon="View" @click="handlePreview(scope.row)" v-hasPermi="['tool:gen:preview']"></el-button>
+          </el-tooltip>
+          <el-tooltip content="编辑" placement="top">
+            <el-button link type="primary" icon="Edit" @click="handleEditTable(scope.row)" v-hasPermi="['tool:gen:edit']"></el-button>
+          </el-tooltip>
+          <el-tooltip content="删除" placement="top">
+            <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['tool:gen:remove']"></el-button>
+          </el-tooltip>
+          <el-tooltip content="同步" placement="top">
+            <el-button link type="primary" icon="Refresh" @click="handleSynchDb(scope.row)" v-hasPermi="['tool:gen:edit']"></el-button>
+          </el-tooltip>
+          <el-tooltip content="生成代码" placement="top">
+            <el-button link type="primary" icon="Download" @click="handleGenTable(scope.row)" v-hasPermi="['tool:gen:code']"></el-button>
+          </el-tooltip>
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="total>0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+    <!-- 预览界面 -->
+    <el-dialog :title="preview.title" v-model="preview.open" width="80%" top="5vh" append-to-body class="scrollbar">
+      <el-tabs v-model="preview.activeName">
+        <el-tab-pane
+          v-for="(value, key) in preview.data"
+          :label="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))"
+          :name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))"
+          :key="value"
+        >
+          <el-link :underline="false" icon="DocumentCopy" v-copyText="value" v-copyText:callback="copyTextSuccess" style="float:right">&nbsp;复制</el-link>
+          <pre>{{ value }}</pre>
+        </el-tab-pane>
+      </el-tabs>
+    </el-dialog>
+    <import-table ref="importRef" @ok="handleQuery" />
+    <create-table ref="createRef" @ok="handleQuery" />
+  </div>
+</template>
+
+<script setup name="Gen">
+import { listTable, previewTable, delTable, genCode, synchDb } from "@/api/tool/gen";
+import router from "@/router";
+import importTable from "./importTable";
+import createTable from "./createTable";
+
+const route = useRoute();
+const { proxy } = getCurrentInstance();
+
+const tableList = ref([]);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const tableNames = ref([]);
+const dateRange = ref([]);
+const uniqueId = ref("");
+
+const data = reactive({
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    tableName: undefined,
+    tableComment: undefined
+  },
+  preview: {
+    open: false,
+    title: "代码预览",
+    data: {},
+    activeName: "domain.java"
+  }
+});
+
+const { queryParams, preview } = toRefs(data);
+
+onActivated(() => {
+  const time = route.query.t;
+  if (time != null && time != uniqueId.value) {
+    uniqueId.value = time;
+    queryParams.value.pageNum = Number(route.query.pageNum);
+    dateRange.value = [];
+    proxy.resetForm("queryForm");
+    getList();
+  }
+})
+
+/** 查询表集合 */
+function getList() {
+  loading.value = true;
+  listTable(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => {
+    tableList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 生成代码操作 */
+function handleGenTable(row) {
+  const tbNames = row.tableName || tableNames.value;
+  if (tbNames == "") {
+    proxy.$modal.msgError("请选择要生成的数据");
+    return;
+  }
+  if (row.genType === "1") {
+    genCode(row.tableName).then(response => {
+      proxy.$modal.msgSuccess("成功生成到自定义路径：" + row.genPath);
+    });
+  } else {
+    proxy.$download.zip("/tool/gen/batchGenCode?tables=" + tbNames, "ruoyi.zip");
+  }
+}
+
+/** 同步数据库操作 */
+function handleSynchDb(row) {
+  const tableName = row.tableName;
+  proxy.$modal.confirm('确认要强制同步"' + tableName + '"表结构吗？').then(function () {
+    return synchDb(tableName);
+  }).then(() => {
+    proxy.$modal.msgSuccess("同步成功");
+  }).catch(() => {});
+}
+
+/** 打开导入表弹窗 */
+function openImportTable() {
+  proxy.$refs["importRef"].show();
+}
+
+/** 打开创建表弹窗 */
+function openCreateTable() {
+  proxy.$refs["createRef"].show();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  dateRange.value = [];
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 预览按钮 */
+function handlePreview(row) {
+  previewTable(row.tableId).then(response => {
+    preview.value.data = response.data;
+    preview.value.open = true;
+    preview.value.activeName = "domain.java";
+  });
+}
+
+/** 复制代码成功 */
+function copyTextSuccess() {
+  proxy.$modal.msgSuccess("复制成功");
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.tableId);
+  tableNames.value = selection.map(item => item.tableName);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 修改按钮操作 */
+function handleEditTable(row) {
+  const tableId = row.tableId || ids.value[0];
+  router.push({ path: "/tool/gen-edit/index/" + tableId, query: { pageNum: queryParams.value.pageNum } });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const tableIds = row.tableId || ids.value;
+  proxy.$modal.confirm('是否确认删除表编号为"' + tableIds + '"的数据项？').then(function () {
+    return delTable(tableIds);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+getList();
+</script>
diff --git a/src/views/tool/swagger/index.vue b/src/views/tool/swagger/index.vue
new file mode 100644
index 0000000..a44fa71
--- /dev/null
+++ b/src/views/tool/swagger/index.vue
@@ -0,0 +1,9 @@
+<template>
+   <i-frame v-model:src="url"></i-frame>
+</template>
+
+<script setup>
+import iFrame from '@/components/iFrame'
+
+const url = ref(import.meta.env.VITE_APP_BASE_API + "/swagger-ui/index.html")
+</script>
diff --git a/src/views/valueAdded/index.vue b/src/views/valueAdded/index.vue
new file mode 100644
index 0000000..8fb7b5f
--- /dev/null
+++ b/src/views/valueAdded/index.vue
@@ -0,0 +1,12 @@
+<template>
+  <div>
+    增值服务
+  </div>
+</template>
+
+<script setup>
+</script>
+
+<style scoped lang='scss'>
+
+</style>
\ No newline at end of file
diff --git a/vite.config.js b/vite.config.js
new file mode 100644
index 0000000..ac65b3a
--- /dev/null
+++ b/vite.config.js
@@ -0,0 +1,62 @@
+import { defineConfig, loadEnv } from "vite";
+import path from "path";
+import createVitePlugins from "./vite/plugins";
+
+// https://vitejs.dev/config/
+export default defineConfig(({ mode, command }) => {
+  const env = loadEnv(mode, process.cwd());
+  const { VITE_APP_ENV } = env;
+  return {
+    // 部署生产环境和开发环境下的URL。
+    // 默认情况下，vite 会假设你的应用是被部署在一个域名的根路径上
+    // 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.ruoyi.vip/admin/，则设置 baseUrl 为 /admin/。
+    base: VITE_APP_ENV === "production" ? "/" : "/",
+    plugins: createVitePlugins(env, command === "build"),
+    resolve: {
+      // https://cn.vitejs.dev/config/#resolve-alias
+      alias: {
+        // 设置路径
+        "~": path.resolve(__dirname, "./"),
+        // 设置别名
+        "@": path.resolve(__dirname, "./src"),
+      },
+      // https://cn.vitejs.dev/config/#resolve-extensions
+      extensions: [".mjs", ".js", ".ts", ".jsx", ".tsx", ".json", ".vue"],
+    },
+    // vite 相关配置
+    server: {
+      port: 80,
+      host: true,
+      open: true,
+      proxy: {
+        // https://cn.vitejs.dev/config/#server-proxy
+        "/dev-api": {
+          target: 'http://localhost:9090',
+          // target: 'http://121.37.100.169:9090',
+          // target: "https://ma.zdtap.com",
+          // target: "http://39.104.21.219:28082",
+
+          changeOrigin: true,
+          rewrite: (p) => p.replace(/^\/dev-api/, ""),
+        },
+      },
+    },
+    //fix:error:stdin>:7356:1: warning: "@charset" must be the first rule in the file
+    css: {
+      postcss: {
+        plugins: [
+          {
+            postcssPlugin: "internal:charset-removal",
+            AtRule: {
+              charset: (atRule) => {
+                if (atRule.name === "charset") {
+                  atRule.remove();
+                }
+              },
+            },
+          },
+        ],
+      },
+    },
+  };
+});
diff --git a/vite/plugins/auto-import.js b/vite/plugins/auto-import.js
new file mode 100644
index 0000000..a5d3576
--- /dev/null
+++ b/vite/plugins/auto-import.js
@@ -0,0 +1,12 @@
+import autoImport from 'unplugin-auto-import/vite'
+
+export default function createAutoImport() {
+    return autoImport({
+        imports: [
+            'vue',
+            'vue-router',
+            'pinia'
+        ],
+        dts: false
+    })
+}
diff --git a/vite/plugins/compression.js b/vite/plugins/compression.js
new file mode 100644
index 0000000..e90aaec
--- /dev/null
+++ b/vite/plugins/compression.js
@@ -0,0 +1,28 @@
+import compression from 'vite-plugin-compression'
+
+export default function createCompression(env) {
+    const { VITE_BUILD_COMPRESS } = env
+    const plugin = []
+    if (VITE_BUILD_COMPRESS) {
+        const compressList = VITE_BUILD_COMPRESS.split(',')
+        if (compressList.includes('gzip')) {
+            // http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件
+            plugin.push(
+                compression({
+                    ext: '.gz',
+                    deleteOriginFile: false
+                })
+            )
+        }
+        if (compressList.includes('brotli')) {
+            plugin.push(
+                compression({
+                    ext: '.br',
+                    algorithm: 'brotliCompress',
+                    deleteOriginFile: false
+                })
+            )
+        }
+    }
+    return plugin
+}
diff --git a/vite/plugins/index.js b/vite/plugins/index.js
new file mode 100644
index 0000000..10e17c3
--- /dev/null
+++ b/vite/plugins/index.js
@@ -0,0 +1,15 @@
+import vue from '@vitejs/plugin-vue'
+
+import createAutoImport from './auto-import'
+import createSvgIcon from './svg-icon'
+import createCompression from './compression'
+import createSetupExtend from './setup-extend'
+
+export default function createVitePlugins(viteEnv, isBuild = false) {
+    const vitePlugins = [vue()]
+    vitePlugins.push(createAutoImport())
+	vitePlugins.push(createSetupExtend())
+    vitePlugins.push(createSvgIcon(isBuild))
+	isBuild && vitePlugins.push(...createCompression(viteEnv))
+    return vitePlugins
+}
diff --git a/vite/plugins/setup-extend.js b/vite/plugins/setup-extend.js
new file mode 100644
index 0000000..ed8342e
--- /dev/null
+++ b/vite/plugins/setup-extend.js
@@ -0,0 +1,5 @@
+import setupExtend from 'unplugin-vue-setup-extend-plus/vite'
+
+export default function createSetupExtend() {
+    return setupExtend({})
+}
diff --git a/vite/plugins/svg-icon.js b/vite/plugins/svg-icon.js
new file mode 100644
index 0000000..30a4140
--- /dev/null
+++ b/vite/plugins/svg-icon.js
@@ -0,0 +1,10 @@
+import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
+import path from 'path'
+
+export default function createSvgIcon(isBuild) {
+    return createSvgIconsPlugin({
+		iconDirs: [path.resolve(process.cwd(), 'src/assets/icons/svg')],
+        symbolId: 'icon-[dir]-[name]',
+        svgoOptions: isBuild
+    })
+}