diff --git a/scripts/release.mjs b/scripts/release.mjs
new file mode 100644
index 0000000..84461b6
--- /dev/null
+++ b/scripts/release.mjs
@@ -0,0 +1,35 @@
+import path from 'path'
+import fsExtra from 'fs-extra'
+const { existsSync, remove, copy } = fsExtra
+const cwd = process.cwd()
+//打包发布路径，谨慎改动
+const releaseRelativePath = '../server/public/admin'
+const distPath = path.resolve(cwd, 'dist')
+const releasePath = path.resolve(cwd, releaseRelativePath)
+
+async function build() {
+    if (existsSync(releasePath)) {
+        await remove(releasePath)
+    }
+    console.log(`文件正在复制 ==> ${releaseRelativePath}`)
+    try {
+        await copyFile(distPath, releasePath)
+    } catch (error) {
+        console.log(`\n ${error}`)
+    }
+    console.log(`文件已复制 ==> ${releaseRelativePath}`)
+}
+
+function copyFile(sourceDir, targetDir) {
+    return new Promise((resolve, reject) => {
+        copy(sourceDir, targetDir, (err) => {
+            if (err) {
+                reject(err)
+            } else {
+                resolve()
+            }
+        })
+    })
+}
+
+build()
diff --git a/src/App.vue b/src/App.vue
new file mode 100644
index 0000000..b9f6fca
--- /dev/null
+++ b/src/App.vue
@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import { useDark, useWindowSize, useThrottleFn } from '@vueuse/core'
+import zhCn from "element-plus/es/locale/lang/zh-cn";
+import useAppStore from './stores/modules/app'
+import useSettingStore from './stores/modules/setting'
+import { ScreenEnum } from './enums/appEnums'
+const appStore = useAppStore()
+const settingStore = useSettingStore()
+const elConfig = {
+    zIndex: 3000,
+    locale: zhCn
+}
+const isDark = useDark()
+onMounted(async () => {
+    //设置主题色
+    settingStore.setTheme(isDark.value)
+})
+
+const { width } = useWindowSize()
+watch(
+    width,
+    useThrottleFn((value) => {
+        if (value > ScreenEnum.SM) {
+            appStore.setMobile(false)
+            appStore.toggleCollapsed(false)
+        } else {
+            appStore.setMobile(true)
+            appStore.toggleCollapsed(true)
+        }
+        if (value < ScreenEnum.MD) {
+            appStore.toggleCollapsed(true)
+        }
+    }),
+    {
+        immediate: true
+    }
+)
+</script>
+
+<template>
+    <el-config-provider :locale="elConfig.locale" :z-index="elConfig.zIndex">
+        <router-view />
+    </el-config-provider>
+</template>
+
+<style></style>
diff --git a/src/api/app.ts b/src/api/app.ts
new file mode 100644
index 0000000..fec3423
--- /dev/null
+++ b/src/api/app.ts
@@ -0,0 +1,16 @@
+import request from '@/utils/request'
+
+// 配置
+export function getConfig() {
+    return request.get({ url: '/config/getConfig' })
+}
+
+// 工作台主页
+export function getWorkbench() {
+    return request.get({ url: '/workbench/index' })
+}
+
+//字典数据
+export function getDictData(params: any) {
+    return request.get({ url: '/config/dict', params })
+}
diff --git a/src/api/app/recharge.ts b/src/api/app/recharge.ts
new file mode 100644
index 0000000..2b3bdf5
--- /dev/null
+++ b/src/api/app/recharge.ts
@@ -0,0 +1,10 @@
+import request from '@/utils/request'
+
+export function getRechargeConfig() {
+    return request.get({ url: '/recharge.recharge/getConfig' })
+}
+
+// 设置
+export function setRechargeConfig(params: any) {
+    return request.post({ url: '/recharge.recharge/setConfig', params })
+}
diff --git a/src/api/article.ts b/src/api/article.ts
new file mode 100644
index 0000000..7c3a559
--- /dev/null
+++ b/src/api/article.ts
@@ -0,0 +1,69 @@
+import request from '@/utils/request'
+
+// 文章分类列表
+export function articleCateLists(params?: any) {
+    return request.get({ url: '/article.articleCate/lists', params })
+}
+// 文章分类列表
+export function articleCateAll(params?: any) {
+    return request.get({ url: '/article.articleCate/all', params })
+}
+
+// 添加文章分类
+export function articleCateAdd(params: any) {
+    return request.post({ url: '/article.articleCate/add', params })
+}
+
+// 编辑文章分类
+export function articleCateEdit(params: any) {
+    return request.post({ url: '/article.articleCate/edit', params })
+}
+
+// 删除文章分类
+export function articleCateDelete(params: any) {
+    return request.post({ url: '/article.articleCate/delete', params })
+}
+
+// 文章分类详情
+export function articleCateDetail(params: any) {
+    return request.get({ url: '/article.articleCate/detail', params })
+}
+
+// 文章分类状态
+export function articleCateStatus(params: any) {
+    return request.post({ url: '/article.articleCate/updateStatus', params })
+}
+
+// 文章列表
+export function articleLists(params?: any) {
+    return request.get({ url: '/article.article/lists', params })
+}
+// 文章列表
+export function articleAll(params?: any) {
+    return request.get({ url: '/article/all', params })
+}
+
+// 添加文章
+export function articleAdd(params: any) {
+    return request.post({ url: '/article.article/add', params })
+}
+
+// 编辑文章
+export function articleEdit(params: any) {
+    return request.post({ url: '/article.article/edit', params })
+}
+
+// 删除文章
+export function articleDelete(params: any) {
+    return request.post({ url: '/article.article/delete', params })
+}
+
+// 文章详情
+export function articleDetail(params: any) {
+    return request.get({ url: '/article.article/detail', params })
+}
+
+// 文章分类状态
+export function articleStatus(params: any) {
+    return request.post({ url: '/article.article/updateStatus', params })
+}
diff --git a/src/api/channel/h5.ts b/src/api/channel/h5.ts
new file mode 100644
index 0000000..d997e54
--- /dev/null
+++ b/src/api/channel/h5.ts
@@ -0,0 +1,11 @@
+import request from '@/utils/request'
+
+// H5渠道配置保存
+export function setH5Config(params: any) {
+    return request.post({ url: '/channel.web_page_setting/setConfig', params })
+}
+
+// H5渠道配置详情
+export function getH5Config() {
+    return request.get({ url: '/channel.web_page_setting/getConfig' })
+}
diff --git a/src/api/channel/open_setting.ts b/src/api/channel/open_setting.ts
new file mode 100644
index 0000000..51a6ece
--- /dev/null
+++ b/src/api/channel/open_setting.ts
@@ -0,0 +1,11 @@
+import request from '@/utils/request'
+
+// 微信开发平台配置保存
+export function setOpenSettingConfig(params: any) {
+    return request.post({ url: '/channel.open_setting/setConfig', params })
+}
+
+// 微信开发平台配置详情
+export function getOpenSettingConfig() {
+    return request.get({ url: '/channel.open_setting/getConfig' })
+}
diff --git a/src/api/channel/weapp.ts b/src/api/channel/weapp.ts
new file mode 100644
index 0000000..a3a8976
--- /dev/null
+++ b/src/api/channel/weapp.ts
@@ -0,0 +1,11 @@
+import request from '@/utils/request'
+
+// 微信小程序配置保存
+export function setWeappConfig(params: any) {
+    return request.post({ url: '/channel.mnp_settings/setConfig', params })
+}
+
+// 微信小程序配置详情
+export function getWeappConfig() {
+    return request.get({ url: '/channel.mnp_settings/getConfig' })
+}
diff --git a/src/api/channel/wx_oa.ts b/src/api/channel/wx_oa.ts
new file mode 100644
index 0000000..f496b52
--- /dev/null
+++ b/src/api/channel/wx_oa.ts
@@ -0,0 +1,110 @@
+import request from '@/utils/request'
+
+// 微信公众号配置保存
+export function setOaConfig(params: any) {
+    return request.post({ url: '/channel.official_account_setting/setConfig', params })
+}
+
+// 微信公众号配置详情
+export function getOaConfig() {
+    return request.get({ url: '/channel.official_account_setting/getConfig' })
+}
+
+export interface Menu {
+    name: string
+    has_menu?: boolean
+    type?: string
+    url?: string
+    appid?: string
+    pagepath?: string
+    sub_button: Menu[] | any
+}
+
+/**
+ * @return { Promise }
+ * @description 获取菜单
+ */
+export function getOaMenu() {
+    return request.get({ url: '/channel.official_account_menu/detail' })
+}
+
+/**
+ * @return { Promise }
+ * @param { Menu } Menu
+ * @description 菜单保存
+ */
+export function setOaMenuSave(params: Menu | any) {
+    return request.post({ url: '/channel.official_account_menu/save', params })
+}
+
+/**
+ * @return { Promise }
+ * @param { Menu } Menu
+ * @description 菜单发布
+ */
+export function setOaMenuPublish(params: Menu | any) {
+    return request.post({ url: '/channel.official_account_menu/saveAndPublish', params })
+}
+
+/**
+ * @return { Promise }
+ * @param { string } reply_type
+ * @description 获取回复列表
+ */
+export function getOaReplyList(params: { reply_type: string }) {
+    return request.get({ url: '/channel.official_account_reply/lists', params })
+}
+
+/**
+ * @return { Promise }
+ * @param { number } id
+ * @description 回复列表删除
+ */
+export function oaReplyDel(params: { id: number }) {
+    return request.post({ url: '/channel.official_account_reply/delete', params })
+}
+
+/**
+ * @return { Promise }
+ * @param { number } id
+ * @description 回复状态修改
+ */
+export function changeOaReplyStatus(params: { id: number }) {
+    return request.post({ url: '/channel.official_account_reply/status', params })
+}
+
+export interface Reply {
+    content: string // 内容
+    content_type: number // 内容类型: 1=文本
+    keyword?: string // 关键词
+    matching_type?: number // 匹配方式: [1=全匹配, 2=模糊匹配]
+    name: string // 规则名称
+    status: number // 状态: 1=开启, 0=关闭
+    reply_type: number // 类型: 回复类型 1-关注回复 2-关键词回复 3-默认回复
+    reply_num: number // 回复数量`
+    sort: number // 排序
+}
+/**
+ * @return { Promise }
+ * @description 回复添加
+ */
+export function oaReplyAdd(params: Reply) {
+    return request.post({ url: '/channel.official_account_reply/add', params })
+}
+
+/**
+ * @return { Promise }
+ * @description 回复编辑
+ */
+export function oaReplyEdit(params: Reply) {
+    return request.post({ url: '/channel.official_account_reply/edit', params })
+}
+
+/**
+ * @return { Promise }
+ * @param { string } type
+ * @description 获取回复详情
+ */
+export function getOaReplyDetail(params: { id: number }) {
+    return request.get({ url: '/channel.official_account_reply/detail', params })
+}
diff --git a/src/api/consumer.ts b/src/api/consumer.ts
new file mode 100644
index 0000000..ef92143
--- /dev/null
+++ b/src/api/consumer.ts
@@ -0,0 +1,21 @@
+import request from '@/utils/request'
+
+// 用户列表
+export function getUserList(params: any) {
+    return request.get({ url: '/user.user/lists', params }, { ignoreCancelToken: true })
+}
+
+// 用户详情
+export function getUserDetail(params: any) {
+    return request.get({ url: '/user.user/detail', params })
+}
+
+// 用户编辑
+export function userEdit(params: any) {
+    return request.post({ url: '/user.user/edit', params })
+}
+
+// 用户编辑
+export function adjustMoney(params: any) {
+    return request.post({ url: '/user.user/adjustMoney', params })
+}
diff --git a/src/api/decoration.ts b/src/api/decoration.ts
new file mode 100644
index 0000000..0e754db
--- /dev/null
+++ b/src/api/decoration.ts
@@ -0,0 +1,31 @@
+import request from '@/utils/request'
+
+// 页面装修详情
+export function getDecoratePages(params: any) {
+    return request.get({ url: '/decorate.page/detail', params }, { ignoreCancelToken: true })
+}
+
+// 页面装修保存
+export function setDecoratePages(params: any) {
+    return request.post({ url: '/decorate.page/save', params })
+}
+
+// 获取首页文章数据
+export function getDecorateArticle(params?: any) {
+    return request.get({ url: '/decorate.data/article', params })
+}
+
+// 底部导航详情
+export function getDecorateTabbar(params?: any) {
+    return request.get({ url: '/decorate.tabbar/detail', params })
+}
+
+// 底部导航保存
+export function setDecorateTabbar(params: any) {
+    return request.post({ url: '/decorate.tabbar/save', params })
+}
+
+// pc装修数据
+export function getDecoratePc() {
+    return request.get({ url: '/decorate.data/pc' })
+}
\ No newline at end of file
diff --git a/src/api/file.ts b/src/api/file.ts
new file mode 100644
index 0000000..2181001
--- /dev/null
+++ b/src/api/file.ts
@@ -0,0 +1,39 @@
+import request from '@/utils/request'
+
+export function fileCateAdd(params: Record<string, any>) {
+    return request.post({url: '/file/addCate', params})
+}
+
+export function fileCateEdit(params: Record<string, any>) {
+    return request.post({url: '/file/editCate', params})
+}
+
+// 文件分类删除
+export function fileCateDelete(params: Record<string, any>) {
+    return request.post({url: '/file/delCate', params})
+}
+
+// 文件分类列表
+export function fileCateLists(params: Record<string, any>) {
+    return request.get({url: '/file/listCate', params})
+}
+
+// 文件列表
+export function fileList(params: Record<string, any>) {
+    return request.get({url: '/file/lists', params}, {ignoreCancelToken: true, isOpenRetry: false})
+}
+
+// 文件删除
+export function fileDelete(params: Record<string, any>) {
+    return request.post({url: '/file/delete', params})
+}
+
+// 文件移动
+export function fileMove(params: Record<string, any>) {
+    return request.post({url: '/file/move', params})
+}
+
+// 文件重命名
+export function fileRename(params: { id: number; name: string }) {
+    return request.post({url: '/file/rename', params})
+}
diff --git a/src/api/finance.ts b/src/api/finance.ts
new file mode 100644
index 0000000..7e0ed53
--- /dev/null
+++ b/src/api/finance.ts
@@ -0,0 +1,41 @@
+import request from '@/utils/request'
+
+// 余额明细
+export function accountLog(params?: any) {
+    return request.get({ url: '/finance.account_log/lists', params })
+}
+
+// 充值记录
+export function rechargeLists(params?: any) {
+    return request.get({ url: '/recharge.recharge/lists', params }, { ignoreCancelToken: true })
+}
+
+// 余额变动类型
+export function getUmChangeType(params?: any) {
+    return request.get({ url: '/finance.account_log/getUmChangeType', params })
+}
+
+//退款
+export function refund(params?: any) {
+    return request.post({ url: '/recharge.recharge/refund', params })
+}
+
+//重新退款
+export function refundAgain(params?: any) {
+    return request.post({ url: '/recharge.recharge/refundAgain', params })
+}
+
+//退款记录
+export function refundRecord(params?: any) {
+    return request.get({ url: '/finance.refund/record', params })
+}
+
+//退款日志
+export function refundLog(params?: any) {
+    return request.get({ url: '/finance.refund/log', params })
+}
+
+//退款统计
+export function refundStat(params?: any) {
+    return request.get({ url: '/finance.refund/stat', params })
+}
diff --git a/src/api/message.ts b/src/api/message.ts
new file mode 100644
index 0000000..9c0ba84
--- /dev/null
+++ b/src/api/message.ts
@@ -0,0 +1,31 @@
+import request from '@/utils/request'
+
+// 通知设置列表
+export function noticeLists(params: any) {
+    return request.get({ url: '/notice.notice/settingLists', params })
+}
+
+// 通知设置详情
+export function noticeDetail(params: any) {
+    return request.get({ url: '/notice.notice/detail', params })
+}
+
+// 通知设置保存
+export function setNoticeConfig(params: any) {
+    return request.post({ url: '/notice.notice/set', params })
+}
+
+// 短信设置列表
+export function smsLists() {
+    return request.get({ url: '/notice.sms_config/getConfig' })
+}
+
+// 短信设置详情
+export function smsDetail(params: any) {
+    return request.get({ url: '/notice.sms_config/detail', params })
+}
+
+// 短信设置保存
+export function setSmsConfig(params: any) {
+    return request.post({ url: '/notice.sms_config/setConfig', params })
+}
diff --git a/src/api/org/department.ts b/src/api/org/department.ts
new file mode 100644
index 0000000..3673ed5
--- /dev/null
+++ b/src/api/org/department.ts
@@ -0,0 +1,31 @@
+import request from '@/utils/request'
+
+// 部门列表
+export function deptLists(params?: any) {
+    return request.get({ url: '/dept.dept/lists', params })
+}
+
+// 添加部门
+export function deptAdd(params: any) {
+    return request.post({ url: '/dept.dept/add', params })
+}
+
+// 编辑部门
+export function deptEdit(params: any) {
+    return request.post({ url: '/dept.dept/edit', params })
+}
+
+// 删除部门
+export function deptDelete(params: any) {
+    return request.post({ url: '/dept.dept/delete', params })
+}
+
+// 部门详情
+export function deptDetail(params: any) {
+    return request.get({ url: '/dept.dept/detail', params })
+}
+
+// 部门列表全部
+export function deptAll() {
+    return request.get({ url: '/dept.dept/all' })
+}
diff --git a/src/api/org/post.ts b/src/api/org/post.ts
new file mode 100644
index 0000000..4b0f262
--- /dev/null
+++ b/src/api/org/post.ts
@@ -0,0 +1,31 @@
+import request from '@/utils/request'
+
+// 岗位列表
+export function jobsLists(params: any) {
+    return request.get({ url: '/dept.jobs/lists', params }, { ignoreCancelToken: true })
+}
+
+// 岗位列表全部
+export function jobsAll(params: any) {
+    return request.get({ url: '/dept.jobs/all', params })
+}
+
+// 添加岗位
+export function jobsAdd(params: any) {
+    return request.post({ url: '/dept.jobs/add', params })
+}
+
+// 编辑岗位
+export function jobsEdit(params: any) {
+    return request.post({ url: '/dept.jobs/edit', params })
+}
+
+// 删除岗位
+export function jobsDelete(params: any) {
+    return request.post({ url: '/dept.jobs/delete', params })
+}
+
+// 岗位详情
+export function jobsDetail(params: any) {
+    return request.get({ url: '/dept.jobs/detail', params })
+}
diff --git a/src/api/perms/admin.ts b/src/api/perms/admin.ts
new file mode 100644
index 0000000..dd40ff9
--- /dev/null
+++ b/src/api/perms/admin.ts
@@ -0,0 +1,29 @@
+import request from '@/utils/request'
+
+// 管理员列表
+export function adminLists(params: any) {
+    return request.get({ url: '/auth.admin/lists', params }, { ignoreCancelToken: true })
+}
+// 管理员列表全部
+export function adminAll(params: any) {
+    return request.get({ url: '/auth.admin/all', params })
+}
+// 管理员添加
+export function adminAdd(params: any) {
+    return request.post({ url: '/auth.admin/add', params })
+}
+
+// 管理员编辑
+export function adminEdit(params: any) {
+    return request.post({ url: '/auth.admin/edit', params })
+}
+
+// 管理员删除
+export function adminDelete(params: any) {
+    return request.post({ url: '/auth.admin/delete', params })
+}
+
+// 管理员详情
+export function adminDetail(params: any) {
+    return request.get({ url: '/auth.admin/detail', params })
+}
diff --git a/src/api/perms/menu.ts b/src/api/perms/menu.ts
new file mode 100644
index 0000000..ea13670
--- /dev/null
+++ b/src/api/perms/menu.ts
@@ -0,0 +1,30 @@
+import request from '@/utils/request'
+
+// 菜单列表
+export function menuLists(params: Record<string, any>) {
+    return request.get({ url: '/auth.menu/lists', params })
+}
+// 菜单全部
+export function menuAll(params?: Record<string, any>) {
+    return request.get({ url: '/auth.menu/all', params })
+}
+
+// 添加菜单
+export function menuAdd(params: Record<string, any>) {
+    return request.post({ url: '/auth.menu/add', params })
+}
+
+// 编辑菜单
+export function menuEdit(params: Record<string, any>) {
+    return request.post({ url: '/auth.menu/edit', params })
+}
+
+// 菜单删除
+export function menuDelete(params: Record<string, any>) {
+    return request.post({ url: '/auth.menu/delete', params })
+}
+
+//  菜单详情
+export function menuDetail(params: Record<string, any>) {
+    return request.get({ url: '/auth.menu/detail', params })
+}
diff --git a/src/api/perms/role.ts b/src/api/perms/role.ts
new file mode 100644
index 0000000..7c81d40
--- /dev/null
+++ b/src/api/perms/role.ts
@@ -0,0 +1,27 @@
+import request from '@/utils/request'
+
+// 角色列表
+export function roleLists(params: any) {
+    return request.get({ url: '/auth.role/lists', params })
+}
+// 角色列表全部
+export function roleAll(params: any) {
+    return request.get({ url: '/auth.role/all', params })
+}
+// 添加角色
+export function roleAdd(params: any) {
+    return request.post({ url: '/auth.role/add', params })
+}
+// 编辑角色
+export function roleEdit(params: any) {
+    return request.post({ url: '/auth.role/edit', params })
+}
+// 删除角色
+export function roleDelete(params: any) {
+    return request.post({ url: '/auth.role/delete', params })
+}
+
+// 角色详情
+export function roleDetail(params: any) {
+    return request.get({ url: '/auth.role/detail', params })
+}
diff --git a/src/api/record.ts b/src/api/record.ts
new file mode 100644
index 0000000..2b24e7d
--- /dev/null
+++ b/src/api/record.ts
@@ -0,0 +1,26 @@
+import request from '@/utils/request'
+
+// 跟踪记录表列表
+export function apiRecordLists(params: any) {
+    return request.get({ url: '/record.record/lists', params })
+}
+
+// 添加跟踪记录表
+export function apiRecordAdd(params: any) {
+    return request.post({ url: '/record.record/add', params })
+}
+
+// 编辑跟踪记录表
+export function apiRecordEdit(params: any) {
+    return request.post({ url: '/record.record/edit', params })
+}
+
+// 删除跟踪记录表
+export function apiRecordDelete(params: any) {
+    return request.post({ url: '/record.record/delete', params })
+}
+
+// 跟踪记录表详情
+export function apiRecordDetail(params: any) {
+    return request.get({ url: '/record.record/detail', params })
+}
\ No newline at end of file
diff --git a/src/api/record_cate.ts b/src/api/record_cate.ts
new file mode 100644
index 0000000..b2a397f
--- /dev/null
+++ b/src/api/record_cate.ts
@@ -0,0 +1,26 @@
+import request from '@/utils/request'
+
+// 记录类型表列表
+export function apiRecordCateLists(params: any) {
+    return request.get({ url: '/record.record_cate/lists', params })
+}
+
+// 添加记录类型表
+export function apiRecordCateAdd(params: any) {
+    return request.post({ url: '/record.record_cate/add', params })
+}
+
+// 编辑记录类型表
+export function apiRecordCateEdit(params: any) {
+    return request.post({ url: '/record.record_cate/edit', params })
+}
+
+// 删除记录类型表
+export function apiRecordCateDelete(params: any) {
+    return request.post({ url: '/record.record_cate/delete', params })
+}
+
+// 记录类型表详情
+export function apiRecordCateDetail(params: any) {
+    return request.get({ url: '/record.record_cate/detail', params })
+}
\ No newline at end of file
diff --git a/src/api/setting/dict.ts b/src/api/setting/dict.ts
new file mode 100644
index 0000000..cef4e83
--- /dev/null
+++ b/src/api/setting/dict.ts
@@ -0,0 +1,61 @@
+import request from '@/utils/request'
+
+// 字典类型列表
+export function dictTypeLists(params: any) {
+    return request.get({ url: '/setting.dict.dict_type/lists', params })
+}
+
+// 字典类型列表全部
+export function dictTypeAll(params: any) {
+    return request.get({ url: '/setting.dict.dict_type/all', params })
+}
+
+// 添加字典类型
+export function dictTypeAdd(params: any) {
+    return request.post({ url: '/setting.dict.dict_type/add', params })
+}
+
+// 编辑字典类型
+export function dictTypeEdit(params: any) {
+    return request.post({ url: '/setting.dict.dict_type/edit', params })
+}
+
+// 删除字典类型
+export function dictTypeDelete(params: any) {
+    return request.post({ url: '/setting.dict.dict_type/delete', params })
+}
+
+// 字典类型详情
+export function dictTypeDetail(params: any) {
+    return request.get({ url: '/setting.dict.dict_type/detail', params })
+}
+
+// 字典数据列表
+export function dictDataLists(params: any) {
+    return request.get(
+        { url: '/setting.dict.dict_data/lists', params },
+        {
+            ignoreCancelToken: true
+        }
+    )
+}
+
+// 添加字典数据
+export function dictDataAdd(params: any) {
+    return request.post({ url: '/setting.dict.dict_data/add', params })
+}
+
+// 编辑字典数据
+export function dictDataEdit(params: any) {
+    return request.post({ url: '/setting.dict.dict_data/edit', params })
+}
+
+// 删除字典数据
+export function dictDataDelete(params: any) {
+    return request.post({ url: '/setting.dict.dict_data/delete', params })
+}
+
+// 字典数据详情
+export function dictDataDetail(params: any) {
+    return request.get({ url: '/setting.dict.dict_data/detail', params })
+}
diff --git a/src/api/setting/pay.ts b/src/api/setting/pay.ts
new file mode 100644
index 0000000..6bbad41
--- /dev/null
+++ b/src/api/setting/pay.ts
@@ -0,0 +1,26 @@
+import request from '@/utils/request'
+
+// 获取支付方式
+export function getPayWay() {
+    return request.get({ url: '/setting.pay.pay_way/getPayWay' })
+}
+
+// 设置支付方式
+export function setPayWay(params: any) {
+    return request.post({ url: '/setting.pay.pay_way/setPayWay', params })
+}
+
+// 获取支付方式
+export function getPayConfigLists() {
+    return request.get({ url: '/setting.pay.pay_config/lists' })
+}
+
+// 设置支付方式
+export function setPayConfig(params: any) {
+    return request.post({ url: '/setting.pay.pay_config/setConfig', params })
+}
+
+// 设置支付方式
+export function getPayConfig(params: any) {
+    return request.get({ url: '/setting.pay.pay_config/getConfig', params })
+}
diff --git a/src/api/setting/search.ts b/src/api/setting/search.ts
new file mode 100644
index 0000000..4d7e289
--- /dev/null
+++ b/src/api/setting/search.ts
@@ -0,0 +1,27 @@
+import request from '@/utils/request'
+
+/**
+ * @return { Promise }
+ * @description 获取热门搜索数据
+ */
+export function getSearch() {
+    return request.get({ url: '/setting.hot_search/getConfig' })
+}
+
+export interface List {
+    name: string // 搜索关键字
+    sort: number // 热门搜索排序
+}
+
+export interface Search {
+    status: number // 是否开启搜索0/1
+    data: List[]
+}
+/**
+ * @return { Promise }
+ * @param { Search } Search
+ * @description 设置热门搜索
+ */
+export function setSearch(params: Search) {
+    return request.post({ url: '/setting.hot_search/setConfig', params })
+}
diff --git a/src/api/setting/storage.ts b/src/api/setting/storage.ts
new file mode 100644
index 0000000..6fcbff7
--- /dev/null
+++ b/src/api/setting/storage.ts
@@ -0,0 +1,21 @@
+import request from '@/utils/request'
+
+// 获取存储引擎列表
+export function storageLists() {
+    return request.get({ url: '/setting.storage/lists' })
+}
+
+// 设置存储引擎信息
+export function storageChange(params: any) {
+    return request.post({ url: '/setting.storage/change', params })
+}
+
+// 设置存储引擎信息
+export function storageSetup(params: any) {
+    return request.post({ url: '/setting.storage/setup', params })
+}
+
+// 获取存储配置信息
+export function storageDetail(params: any) {
+    return request.get({ url: '/setting.storage/detail', params })
+}
diff --git a/src/api/setting/system.ts b/src/api/setting/system.ts
new file mode 100644
index 0000000..4e73a53
--- /dev/null
+++ b/src/api/setting/system.ts
@@ -0,0 +1,51 @@
+import request from '@/utils/request'
+
+// 获取系统环境
+export function systemInfo() {
+    return request.get({ url: '/setting.system.system/info' })
+}
+
+// 获取系统日志列表
+export function systemLogLists(params: any) {
+    return request.get({ url: '/setting.system.log/lists', params }, { ignoreCancelToken: true })
+}
+
+// 清除系统缓存
+export function systemCacheClear() {
+    return request.post({ url: '/setting.system.cache/clear' })
+}
+
+// 定时任务列表
+export function crontabLists(params: any) {
+    return request.get({ url: '/crontab.crontab/lists', params })
+}
+
+// 添加定时任务
+export function crontabAdd(params: any) {
+    return request.post({ url: '/crontab.crontab/add', params })
+}
+
+// 定时任务详情
+export function crontabDetail(params: any) {
+    return request.get({ url: '/crontab.crontab/detail', params })
+}
+
+// 编辑定时任务
+export function crontabEdit(params: any) {
+    return request.post({ url: '/crontab.crontab/edit', params })
+}
+
+// 删除定时任务
+export function crontabDel(params: any) {
+    return request.post({ url: '/crontab.crontab/delete', params })
+}
+
+// 获取规则执行时间
+export function crontabExpression(params: any) {
+    return request.get({ url: '/crontab.crontab/expression', params })
+}
+
+// 操作定时任务
+export function srontabOperate(params: any) {
+    return request.post({ url: '/crontab.crontab/operate', params })
+}
diff --git a/src/api/setting/user.ts b/src/api/setting/user.ts
new file mode 100644
index 0000000..2e8b341
--- /dev/null
+++ b/src/api/setting/user.ts
@@ -0,0 +1,43 @@
+import request from '@/utils/request'
+
+/**
+ * @return { Promise }
+ * @description 获取用户设置
+ */
+export function getUserSetup() {
+    return request.get({ url: '/setting.user.user/getConfig' })
+}
+
+/**
+ * @return { Promise }
+ * @param { string } default_avatar 默认用户头像
+ * @description 设置用户设置
+ */
+export function setUserSetup(params: { default_avatar: string }) {
+    return request.post({ url: '/setting.user.user/setConfig', params })
+}
+
+/**
+ * @return { Promise }
+ * @description 设置登录注册规则
+ */
+export function getLogin() {
+    return request.get({ url: '/setting.user.user/getRegisterConfig' })
+}
+
+export interface LoginSetup {
+    login_way: number[] | any // 登录方式, 逗号隔开
+    coerce_mobile: number // 强制绑定手机 0/1
+    login_agreement: number // 是否开启协议 0/1
+    third_auth: number // 第三方登录 0/1
+    wechat_auth: number // 微信授权登录 0-关闭 1-开启
+    qq_auth: number // qq授权登录 0-关闭 1-开启
+}
+/**
+ * @return { Promise }
+ * @param { LoginSetup } LoginSetup
+ * @description 设置登录注册规则
+ */
+export function setLogin(params: LoginSetup) {
+    return request.post({ url: '/setting.user.user/setRegisterConfig', params })
+}
diff --git a/src/api/setting/website.ts b/src/api/setting/website.ts
new file mode 100644
index 0000000..0b96571
--- /dev/null
+++ b/src/api/setting/website.ts
@@ -0,0 +1,27 @@
+import request from '@/utils/request'
+
+// 获取备案信息
+export function getCopyright() {
+    return request.get({ url: '/setting.web.web_setting/getCopyright' })
+}
+// 设置备案信息
+export function setCopyright(params: any) {
+    return request.post({ url: '/setting.web.web_setting/setCopyright', params })
+}
+// 获取网站信息
+export function getWebsite() {
+    return request.get({ url: '/setting.web.web_setting/getWebsite' })
+}
+// 设置网站信息
+export function setWebsite(params: any) {
+    return request.post({ url: '/setting.web.web_setting/setWebsite', params })
+}
+
+// 获取政策协议
+export function getProtocol() {
+    return request.get({ url: '/setting.web.web_setting/getAgreement' })
+}
+// 设置政策协议
+export function setProtocol(params: any) {
+    return request.post({ url: '/setting.web.web_setting/setAgreement', params })
+}
diff --git a/src/api/tools/code.ts b/src/api/tools/code.ts
new file mode 100644
index 0000000..69056de
--- /dev/null
+++ b/src/api/tools/code.ts
@@ -0,0 +1,51 @@
+import request from '@/utils/request'
+
+// 代码生成已选数据表列表接口
+export function generateTable(params: any) {
+    return request.get({ url: '/tools.generator/generateTable', params })
+}
+
+// 数据表列表接口
+export function dataTable(params: any) {
+    return request.get({ url: '/tools.generator/dataTable', params })
+}
+
+//选择要生成代码的数据表
+export function selectTable(params: any) {
+    return request.post({ url: '/tools.generator/selectTable', params })
+}
+
+// 已选择的数据表详情
+export function tableDetail(params: any) {
+    return request.get({ url: '/tools.generator/detail', params })
+}
+
+//同步字段
+export function syncColumn(params: any) {
+    return request.post({ url: '/tools.generator/syncColumn', params })
+}
+
+//删除已选择的数据表
+export function generateDelete(params: any) {
+    return request.post({ url: '/tools.generator/delete', params })
+}
+
+//编辑已选表字段
+export function generateEdit(params: any) {
+    return request.post({ url: '/tools.generator/edit', params })
+}
+
+//预览代码
+export function generatePreview(params: any) {
+    return request.post({ url: '/tools.generator/preview', params })
+}
+
+//生成代码
+export function generateCode(params: any) {
+    return request.post({ url: '/tools.generator/generate', params })
+}
+
+//获取模型
+export function getModels() {
+    return request.get({ url: '/tools.generator/getModels' })
+}
diff --git a/src/api/user.ts b/src/api/user.ts
new file mode 100644
index 0000000..39d2010
--- /dev/null
+++ b/src/api/user.ts
@@ -0,0 +1,22 @@
+import config from '@/config'
+import request from '@/utils/request'
+
+// 登录
+export function login(params: Record<string, any>) {
+    return request.post({ url: '/login/account', params: { ...params, terminal: config.terminal } })
+}
+
+// 退出登录
+export function logout() {
+    return request.post({ url: '/login/logout' })
+}
+
+// 用户信息
+export function getUserInfo() {
+    return request.get({ url: '/auth.admin/mySelf' })
+}
+
+// 编辑管理员信息
+export function setUserInfo(params: any) {
+    return request.post({ url: '/auth.admin/editSelf', params })
+}
diff --git a/src/assets/icons/Androidfanhui.svg b/src/assets/icons/Androidfanhui.svg
new file mode 100644
index 0000000..e9ada24
--- /dev/null
+++ b/src/assets/icons/Androidfanhui.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M502.869333 201.408a32.853333 32.853333 0 0 1 0 45.44L276.906667 480h544.384a32 32 0 0 1 0 64H276.885333l225.984 233.130667a32.853333 32.853333 0 0 1 0 45.44 30.485333 30.485333 0 0 1-44.053333 0L179.776 534.741333a32.128 32.128 0 0 1-6.848-10.688 32.213333 32.213333 0 0 1-0.085333-23.808l0.106666-0.32c1.514667-3.861333 3.797333-7.488 6.826667-10.624L458.837333 201.386667a30.485333 30.485333 0 0 1 44.053334 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/KMSguanli.svg b/src/assets/icons/KMSguanli.svg
new file mode 100644
index 0000000..7c65298
--- /dev/null
+++ b/src/assets/icons/KMSguanli.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M853.333333 170.666667a85.333333 85.333333 0 0 1 85.333334 85.333333v426.666667a85.333333 85.333333 0 0 1-85.333334 85.333333H576v42.666667h74.666667a32 32 0 0 1 0 64h-277.333334a32 32 0 0 1 0-64H448v-42.666667H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V256a85.333333 85.333333 0 0 1 85.333334-85.333333h682.666666z m-127.957333 213.333333c-37.056 0.277333-77.824 17.258667-77.824 58.666667 0 45.12 37.909333 56.042667 78.976 60.928 26.709333 2.88 46.506667 10.666667 46.506667 29.632 0 21.845333-22.4 30.186667-46.229334 30.186666-24.405333 0-47.658667-9.792-56.576-31.914666l-31.573333 16.384c14.933333 36.8 46.506667 49.450667 87.573333 49.450666 44.8 0 84.437333-19.264 84.437334-64.106666 0-46.506667-36.650667-58.24-77.056-63.616l-3.925334-0.512c-24.106667-2.88-44.8-7.765333-44.8-25.301334 0-14.933333 13.504-26.730667 41.642667-26.730666 21.824 0 40.768 10.922667 47.658667 22.421333l30.165333-15.530667C789.12 392.917333 756.672 384 725.376 384z m-280 7.189333H401.706667v201.258667h37.909333v-146.346667l64.042667 87.68h7.466666l65.472-87.381333v146.048h37.909334v-201.258667h-43.370667l-62.890667 86.549334-62.890666-86.549334z m-194.133333-0.298666H213.333333v201.258666h37.909334V503.04l84.138666 89.109333h46.805334v-2.282666l-96.768-101.504 89.301333-96.32v-1.152h-47.082667l-76.394666 85.12v-85.12z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/KTVyuding.svg b/src/assets/icons/KTVyuding.svg
new file mode 100644
index 0000000..8187b5f
--- /dev/null
+++ b/src/assets/icons/KTVyuding.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M385.6 371.242667c12.16 113.578667 92.906667 206.634667 200 236.949333l1.664 0.448-2.453333 2.005333-317.888 237.418667c-12.16 9.066667-28.8 8.533333-40.32-0.917333l-2.410667-2.154667-28.928-28.885333c0.213333 1.898667 0.490667 3.797333 0.810667 5.717333 6.186667 35.754667 31.338667 57.962667 79.808 49.322667 26.986667-4.821333 44.117333-11.242667 63.509333-22.464l6.336-3.776 11.541333-7.168 5.397334-3.285334c35.562667-21.248 64.96-29.909333 117.973333-30.442666 69.909333-0.704 129.088 21.056 175.701333 65.173333a32.853333 32.853333 0 0 1 1.28 46.4 32.746667 32.746667 0 0 1-46.293333 1.28c-33.898667-32.042667-76.608-47.744-130.026667-47.210667-40.597333 0.426667-59.029333 5.632-84.864 21.056l-17.642666 10.88c-28.266667 17.216-53.461333 27.413333-91.413334 34.176-87.808 15.658667-144-33.92-155.882666-102.741333a151.765333 151.765333 0 0 1 4.522666-72.042667l1.066667-2.965333-20.778667-20.736a32.853333 32.853333 0 0 1-3.968-41.706667l2.048-2.688 268.437334-318.72c0.874667-1.045333 1.813333-2.005333 2.773333-2.922666z m4.181333 169.344l-2.474666 2.24-46.357334 46.421333-2.24 2.496a32.853333 32.853333 0 0 0 2.24 43.925333 32.746667 32.746667 0 0 0 43.861334 2.24l2.496-2.24 46.336-46.421333 2.261333-2.496a32.853333 32.853333 0 0 0-2.261333-43.925333 32.746667 32.746667 0 0 0-43.861334-2.24zM661.333333 85.333333c141.376 0 256 114.624 256 256s-114.624 256-256 256-256-114.624-256-256S519.957333 85.333333 661.333333 85.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/a-tixingdengpao.svg b/src/assets/icons/a-tixingdengpao.svg
new file mode 100644
index 0000000..7074ae7
--- /dev/null
+++ b/src/assets/icons/a-tixingdengpao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M579.2 874.666667a21.333333 21.333333 0 0 1 14.421333 37.056C574.037333 929.685333 546.837333 938.666667 512 938.666667s-62.037333-8.981333-81.621333-26.944A21.333333 21.333333 0 0 1 444.821333 874.666667h134.357334z m28.8-85.333334a32 32 0 0 1 0 64h-192a32 32 0 0 1 0-64h192zM512 85.333333c176.725333 0 320 143.274667 320 320 0 114.090667-59.733333 214.250667-149.610667 270.912A85.333333 85.333333 0 0 1 597.333333 768h-170.666666a85.333333 85.333333 0 0 1-85.098667-91.776C251.733333 619.584 192 519.424 192 405.333333c0-176.725333 143.274667-320 320-320z m29.098667 106.666667a29.098667 29.098667 0 1 0 0 58.176 126.08 126.08 0 0 1 126.058666 126.08 29.098667 29.098667 0 1 0 58.176 0A184.234667 184.234667 0 0 0 541.098667 192z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/anquan.svg b/src/assets/icons/anquan.svg
new file mode 100644
index 0000000..bf90259
--- /dev/null
+++ b/src/assets/icons/anquan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M486.570667 97.216a33.130667 33.130667 0 0 1 51.264 0.512c34.709333 43.328 152.064 98.261333 307.776 117.034667 16.576 2.005333 29.056 16 29.056 32.64v372.629333a167.04 167.04 0 0 1-20.096 79.402667C761.813333 871.146667 633.770667 938.666667 511.530667 938.666667l-6.528-0.106667c-118.954667-3.413333-244.586667-70.741333-335.573334-239.125333a167.808 167.808 0 0 1-19.925333-71.914667L149.333333 620.032V247.402667c0-16.64 12.48-30.634667 29.056-32.64 152.426667-18.368 269.077333-72.277333 305.237334-114.005334z m25.408 67.178667l-1.792 1.450666c-52.693333 41.813333-163.456 91.882667-290.389334 109.802667l-4.416 0.597333v342.976l0.149334 5.866667c0.746667 15.104 4.864 29.866667 12.074666 43.221333 80.96 149.845333 188.714667 201.962667 278.826667 204.544l5.568 0.085334c92.522667 0 201.92-51.989333 284.373333-204.629334a101.546667 101.546667 0 0 0 12.224-48.277333V276.245333l-16.277333-2.325333c-120.938667-18.048-227.904-67.690667-278.954667-108.416l-1.386666-1.109333z m161.194666 250.517333a32.853333 32.853333 0 0 1 0 46.186667l-187.306666 190.656a32.256 32.256 0 0 1-45.845334 0l-89.173333-91.157334a32.853333 32.853333 0 0 1 0-46.208 32.256 32.256 0 0 1 45.845333 0l51.029334 52.416a21.333333 21.333333 0 0 0 30.165333 0.426667l0.341333-0.362667 149.077334-151.957333a32.256 32.256 0 0 1 45.866666 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/anquan_mian.svg b/src/assets/icons/anquan_mian.svg
new file mode 100644
index 0000000..f3486b5
--- /dev/null
+++ b/src/assets/icons/anquan_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M486.570667 97.216a33.130667 33.130667 0 0 1 51.264 0.512c34.709333 43.328 152.064 98.261333 307.776 117.034667 16.576 2.005333 29.056 16 29.056 32.64v372.629333a167.04 167.04 0 0 1-20.096 79.402667C761.813333 871.146667 633.770667 938.666667 511.530667 938.666667l-6.528-0.106667c-118.954667-3.413333-244.586667-70.741333-335.573334-239.125333a167.808 167.808 0 0 1-19.925333-71.914667L149.333333 620.032V247.402667c0-16.64 12.48-30.634667 29.056-32.64 152.426667-18.368 269.077333-72.277333 305.237334-114.005334z m186.602666 317.696a32.256 32.256 0 0 0-45.866666 0l-149.077334 151.957333-0.341333 0.341334a21.333333 21.333333 0 0 1-30.165333-0.405334l-51.029334-52.416a32.256 32.256 0 0 0-45.866666 0 32.853333 32.853333 0 0 0 0 46.208l89.194666 91.157334a32.256 32.256 0 0 0 45.866667 0l187.285333-190.656a32.853333 32.853333 0 0 0 0-46.186667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/anquan_mian1.svg b/src/assets/icons/anquan_mian1.svg
new file mode 100644
index 0000000..f3486b5
--- /dev/null
+++ b/src/assets/icons/anquan_mian1.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M486.570667 97.216a33.130667 33.130667 0 0 1 51.264 0.512c34.709333 43.328 152.064 98.261333 307.776 117.034667 16.576 2.005333 29.056 16 29.056 32.64v372.629333a167.04 167.04 0 0 1-20.096 79.402667C761.813333 871.146667 633.770667 938.666667 511.530667 938.666667l-6.528-0.106667c-118.954667-3.413333-244.586667-70.741333-335.573334-239.125333a167.808 167.808 0 0 1-19.925333-71.914667L149.333333 620.032V247.402667c0-16.64 12.48-30.634667 29.056-32.64 152.426667-18.368 269.077333-72.277333 305.237334-114.005334z m186.602666 317.696a32.256 32.256 0 0 0-45.866666 0l-149.077334 151.957333-0.341333 0.341334a21.333333 21.333333 0 0 1-30.165333-0.405334l-51.029334-52.416a32.256 32.256 0 0 0-45.866666 0 32.853333 32.853333 0 0 0 0 46.208l89.194666 91.157334a32.256 32.256 0 0 0 45.866667 0l187.285333-190.656a32.853333 32.853333 0 0 0 0-46.186667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/banxing_mian.svg b/src/assets/icons/banxing_mian.svg
new file mode 100644
index 0000000..3cb468f
--- /dev/null
+++ b/src/assets/icons/banxing_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 107.136v707.093333l-221.248 99.434667a32 32 0 0 1-44.586667-34.986667l41.834667-227.413333-182.826667-195.84a32 32 0 0 1 18.474667-53.461333l228.586667-35.733334 141.226666-248.298666A21.333333 21.333333 0 0 1 512 107.136z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/baoxian.svg b/src/assets/icons/baoxian.svg
new file mode 100644
index 0000000..9885e88
--- /dev/null
+++ b/src/assets/icons/baoxian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M486.570667 97.216a33.130667 33.130667 0 0 1 51.264 0.512c34.709333 43.328 152.064 98.261333 307.776 117.034667 16.576 2.005333 29.056 16 29.056 32.64v372.629333a167.04 167.04 0 0 1-20.096 79.402667C761.813333 871.146667 633.770667 938.666667 511.530667 938.666667l-6.528-0.106667c-118.954667-3.413333-244.586667-70.741333-335.573334-239.125333a167.808 167.808 0 0 1-19.925333-71.914667L149.333333 620.032V247.402667c0-16.64 12.48-30.634667 29.056-32.64 152.426667-18.368 269.077333-72.277333 305.237334-114.005334z m-10.026667 256.213333h-122.090667v346.026667h38.442667V389.845333h45.205333c-9.045333 30.997333-21.845333 65.493333-38.058666 104.234667 24.490667 32.170667 36.906667 61.226667 36.906666 87.189333 0 6.186667-1.493333 10.453333-4.117333 12.8-3.029333 2.304-9.045333 3.861333-17.706667 4.629334-5.290667 0-12.053333-0.768-20.352-2.325334l12.437334 40.32c26.752-0.405333 45.589333-5.44 56.874666-15.509333 7.552-8.149333 11.306667-21.333333 11.306667-39.914667-2.261333-26.346667-14.293333-57.344-36.906667-93.397333a1520.768 1520.768 0 0 0 38.037334-104.234667v-30.208z m155.946667 148.8c-11.306667 58.112-24.106667 107.306667-39.168 147.626667h-132.608v38.741333h226.773333v-38.741333h-55.744c15.445333-40.32 28.629333-85.632 39.189333-136.789333l-38.442666-10.837334z m-121.685334 11.221334l-33.514666 11.626666c12.8 34.88 23.722667 71.68 32 110.058667l33.92-8.533333c-9.813333-42.624-20.352-80.213333-32.405334-113.152z m59.904-13.952l-33.514666 11.626666c11.306667 33.706667 20.330667 68.970667 27.861333 106.176l33.536-8.917333c-8.277333-41.066667-17.322667-77.098667-27.882667-108.885333z m21.12-158.869334h-34.688c-23.338667 51.541333-57.258667 93.397333-101.333333 125.930667l19.968 31.786667c13.568-9.685333 26.752-20.928 39.189333-33.322667v20.522667h120.533334v-19.370667a338.133333 338.133333 0 0 0 38.826666 32.554667l21.461334-33.706667c-49.344-35.648-84.010667-77.12-103.978667-124.373333z m-17.344 39.530667a279.530667 279.530667 0 0 0 44.821334 68.970667h-90.026667a370.410667 370.410667 0 0 0 45.205333-68.970667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/bendishenghuodaxue.svg b/src/assets/icons/bendishenghuodaxue.svg
new file mode 100644
index 0000000..4754e16
--- /dev/null
+++ b/src/assets/icons/bendishenghuodaxue.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M789.333333 486.250667V746.666667c0 58.901333-124.16 106.666667-277.333333 106.666666-150.570667 0-273.109333-46.144-277.226667-103.68L234.666667 746.666667V486.250667l260.053333 115.285333a42.666667 42.666667 0 0 0 30.848 1.450667l3.733333-1.450667L789.333333 486.250667zM529.28 166.464l398.592 176.704a21.333333 21.333333 0 0 1 0 38.997333L874.666667 405.76 874.666667 603.093333A42.666667 42.666667 0 1 1 832 603.029333v-178.410666l-302.72 134.229333a42.666667 42.666667 0 0 1-34.56 0L96.106667 382.165333a21.333333 21.333333 0 0 1 0-38.997333l398.570666-176.704a42.666667 42.666667 0 0 1 34.602667 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/bianji.svg b/src/assets/icons/bianji.svg
new file mode 100644
index 0000000..c8674e7
--- /dev/null
+++ b/src/assets/icons/bianji.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M864 832a32 32 0 0 1 0 64h-704a32 32 0 0 1 0-64h704zM710.613333 152.533333l3.541334 3.413334 89.92 89.898666a95.36 95.36 0 0 1 3.370666 131.285334l-3.370666 3.562666-332.309334 332.309334c-9.386667 9.386667-21.077333 16.042667-33.856 19.349333l-4.842666 1.088-178.261334 33.642667a52.970667 52.970667 0 0 1-62.464-57.984l0.576-3.904L226.56 526.933333c2.453333-13.013333 8.362667-25.130667 17.045333-35.072l3.392-3.626666L579.306667 155.946667a95.36 95.36 0 0 1 131.285333-3.370667z m-83.946666 46.165334l-2.410667 2.176-332.309333 332.309333a10.602667 10.602667 0 0 0-2.517334 3.989333l-0.405333 1.536-30.741333 162.986667 119.978666-22.634667-51.968-51.968a31.786667 31.786667 0 1 1 44.949334-44.949333l70.72 70.72 317.141333-317.12a31.786667 31.786667 0 0 0 2.197333-42.538667l-2.197333-2.410666-89.898667-89.92a31.786667 31.786667 0 0 0-42.538666-2.176z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/biaoqing.svg b/src/assets/icons/biaoqing.svg
new file mode 100644
index 0000000..fcc84fb
--- /dev/null
+++ b/src/assets/icons/biaoqing.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m-145.173333 471.338667A180.970667 180.970667 0 0 0 512 693.333333a180.650667 180.650667 0 0 0 128.746667-53.653333c5.888-5.930667 11.370667-12.266667 16.384-18.944a32 32 0 0 1 51.2 38.421333c-6.784 9.024-14.186667 17.578667-22.122667 25.6A244.629333 244.629333 0 0 1 512 757.333333c-78.208 0-150.357333-36.906667-196.373333-98.261333a32 32 0 1 1 51.2-38.4zM341.333333 384a42.666667 42.666667 0 1 1 0 85.333333 42.666667 42.666667 0 0 1 0-85.333333z m341.333334 0a42.666667 42.666667 0 1 1 0 85.333333 42.666667 42.666667 0 0 1 0-85.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/bukejian.svg b/src/assets/icons/bukejian.svg
new file mode 100644
index 0000000..c79cd78
--- /dev/null
+++ b/src/assets/icons/bukejian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512.042667 213.333333c82.752 0 161.088 24.106667 234.88 71.786667l53.525333-53.482667a32 32 0 1 1 45.248 45.248L287.573333 835.029333a32 32 0 1 1-45.248-45.248l44.693334-44.714666c-62.72-38.528-122.154667-93.909333-178.261334-165.802667a108.522667 108.522667 0 0 1-3.093333-130.56l3.136-4.202667 6.805333-8.64C233.045333 288.533333 365.546667 213.333333 512.042667 213.333333z m334.506666 153.216a842.88 842.88 0 0 1 68.693334 78.08 108.522667 108.522667 0 0 1 3.029333 130.688l-3.136 4.202667-6.826667 8.64C790.570667 735.466667 658.133333 810.666667 512.042667 810.666667a410.88 410.88 0 0 1-97.898667-11.733334l53.013333-52.970666a344.32 344.32 0 0 0 44.885334 2.901333c120.896 0 233.088-62.229333 337.408-189.482667l6.784-8.405333 6.613333-8.341333a49.344 49.344 0 0 0 0-61.226667 787.370667 787.370667 0 0 0-61.205333-69.973333l44.906666-44.885334z m-334.506666-91.413333c-121.28 0-233.493333 62.229333-337.557334 189.44l-6.784 8.405333-6.570666 8.341334a49.344 49.344 0 0 0 0.042666 61.205333c54.954667 70.442667 112.106667 122.581333 171.562667 156.8l92.864-92.885333a128 128 0 1 1 180.842667-180.842667l94.976-94.933333c-60.650667-37.184-123.733333-55.530667-189.376-55.530667zM512 443.072a68.906667 68.906667 0 0 0-44.522667 121.536l97.130667-97.130667A68.778667 68.778667 0 0 0 512 443.072z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/caipinguanli.svg b/src/assets/icons/caipinguanli.svg
new file mode 100644
index 0000000..3b1fc28
--- /dev/null
+++ b/src/assets/icons/caipinguanli.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M384 554.666667a85.333333 85.333333 0 0 1 85.333333 85.333333v170.666667a85.333333 85.333333 0 0 1-85.333333 85.333333h-170.666667a85.333333 85.333333 0 0 1-85.333333-85.333333v-170.666667a85.333333 85.333333 0 0 1 85.333333-85.333333h170.666667z m245.333333 213.333333a32 32 0 0 1 32 32v42.666667a32 32 0 0 1-64 0v-42.666667a32 32 0 0 1 32-32z m192-21.333333a32 32 0 0 1 32 32v64a32 32 0 0 1-64 0v-64a32 32 0 0 1 32-32zM384 618.666667h-170.666667a21.333333 21.333333 0 0 0-21.184 18.837333L192 640v170.666667a21.333333 21.333333 0 0 0 18.837333 21.184L213.333333 832h170.666667a21.333333 21.333333 0 0 0 21.184-18.837333L405.333333 810.666667v-170.666667a21.333333 21.333333 0 0 0-18.837333-21.184L384 618.666667z m245.333333-42.666667a32 32 0 0 1 32 32v85.333333a32 32 0 0 1-64 0v-85.333333a32 32 0 0 1 32-32z m192 0a32 32 0 0 1 32 32v64a32 32 0 0 1-64 0v-64a32 32 0 0 1 32-32zM384 128a85.333333 85.333333 0 0 1 85.333333 85.333333v170.666667a85.333333 85.333333 0 0 1-85.333333 85.333333h-170.666667a85.333333 85.333333 0 0 1-85.333333-85.333333v-170.666667a85.333333 85.333333 0 0 1 85.333333-85.333333h170.666667z m426.666667 0a85.333333 85.333333 0 0 1 85.333333 85.333333v170.666667a85.333333 85.333333 0 0 1-85.333333 85.333333h-170.666667a85.333333 85.333333 0 0 1-85.333333-85.333333v-170.666667a85.333333 85.333333 0 0 1 85.333333-85.333333h170.666667zM384 192h-170.666667a21.333333 21.333333 0 0 0-21.184 18.837333L192 213.333333v170.666667a21.333333 21.333333 0 0 0 18.837333 21.184L213.333333 405.333333h170.666667a21.333333 21.333333 0 0 0 21.184-18.837333L405.333333 384v-170.666667a21.333333 21.333333 0 0 0-18.837333-21.184L384 192z m426.666667 0h-170.666667a21.333333 21.333333 0 0 0-21.184 18.837333L618.666667 213.333333v170.666667a21.333333 21.333333 0 0 0 18.837333 21.184L640 405.333333h170.666667a21.333333 21.333333 0 0 0 21.184-18.837333L832 384v-170.666667a21.333333 21.333333 0 0 0-18.837333-21.184L810.666667 192z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/caiwu.svg b/src/assets/icons/caiwu.svg
new file mode 100644
index 0000000..e3e92f4
--- /dev/null
+++ b/src/assets/icons/caiwu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64z m265.9 713.9a377.2 377.2 0 0 1-119.6 80.6 377.5 377.5 0 0 1-292.6 0 377.1 377.1 0 0 1-200.2-200.2 377.5 377.5 0 0 1 0-292.6 377.1 377.1 0 0 1 200.2-200.2 377.5 377.5 0 0 1 292.6 0 377.1 377.1 0 0 1 200.2 200.2 377.5 377.5 0 0 1 0 292.6 377.2 377.2 0 0 1-80.6 119.6zM651.3 258.8a3.9 3.9 0 0 0-5.6 0L512 392.5 378.3 258.8a3.9 3.9 0 0 0-5.6 0l-39.6 39.6a3.9 3.9 0 0 0 0 5.6l102.3 102.4H376a4 4 0 0 0-4 4v56a4 4 0 0 0 4 4h104v80H376a4 4 0 0 0-4 4v56a4 4 0 0 0 4 4h104v148a4 4 0 0 0 4 4h56a4 4 0 0 0 4-4v-148h104a4 4 0 0 0 4-4v-56a4 4 0 0 0-4-4H544v-80h104a4 4 0 0 0 4-4v-56a4 4 0 0 0-4-4h-59.4L690.9 304a3.9 3.9 0 0 0 0-5.6z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/caiwu_jifen.svg b/src/assets/icons/caiwu_jifen.svg
new file mode 100644
index 0000000..07d01df
--- /dev/null
+++ b/src/assets/icons/caiwu_jifen.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M511 64C263.6 64 63 264.6 63 512s200.6 448 448 448 448-200.6 448-448S758.4 64 511 64z m265.9 713.9a377.2 377.2 0 0 1-119.6 80.6 377.5 377.5 0 0 1-292.6 0 377.1 377.1 0 0 1-200.2-200.2 377.5 377.5 0 0 1 0-292.6 377.1 377.1 0 0 1 200.2-200.2 377.5 377.5 0 0 1 292.6 0 377.1 377.1 0 0 1 200.2 200.2 377.5 377.5 0 0 1 0 292.6 377.2 377.2 0 0 1-80.6 119.6zM513.8 288.6a3.9 3.9 0 0 0-5.6 0L287.6 509.2a3.9 3.9 0 0 0 0 5.6l220.6 220.6a3.9 3.9 0 0 0 5.6 0l220.6-220.6a3.9 3.9 0 0 0 0-5.6zM511 636.5L386.5 512 511 387.5 635.5 512z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/caiwu_tixian.svg b/src/assets/icons/caiwu_tixian.svg
new file mode 100644
index 0000000..982ac58
--- /dev/null
+++ b/src/assets/icons/caiwu_tixian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M285.8 406.9l137.3 83.7a7.7 7.7 0 0 0 11.8-6.6v-51.7h175a68.1 68.1 0 0 1 67.9 64.1 4.1 4.1 0 0 0 4 3.9h56.1a4.1 4.1 0 0 0 4-4.2c-2.2-70.8-60.6-127.8-132-127.8h-175v-51.8a7.7 7.7 0 0 0-11.8-6.6l-137.3 83.7a7.8 7.8 0 0 0 0 13.3z m452.4 210.2l-137.3-83.7a7.7 7.7 0 0 0-11.8 6.6v51.7h-175a68.1 68.1 0 0 1-67.9-64.1 4.1 4.1 0 0 0-4-3.9h-56.1a4.1 4.1 0 0 0-4 4.2c2.2 70.8 60.6 127.8 132 127.8h175v51.8a7.7 7.7 0 0 0 11.8 6.6l137.3-83.7a7.8 7.8 0 0 0 0-13.3zM856 128H168a40 40 0 0 0-40 40v688a40 40 0 0 0 40 40h688a40 40 0 0 0 40-40V168a40 40 0 0 0-40-40z m-32 696H200V200h624z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/canyinfuwu.svg b/src/assets/icons/canyinfuwu.svg
new file mode 100644
index 0000000..5d87395
--- /dev/null
+++ b/src/assets/icons/canyinfuwu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 106.666667c103.68 0 192.96 61.632 233.194667 150.250666C853.717333 266.944 938.666667 358.186667 938.666667 469.333333c0 95.509333-62.762667 176.362667-149.333334 203.562667V832a85.333333 85.333333 0 0 1-85.333333 85.333333H320a85.333333 85.333333 0 0 1-85.333333-85.333333v-180.437333C148.117333 624.384 85.333333 543.530667 85.333333 448c0-114.986667 90.944-208.704 204.8-213.162667A255.893333 255.893333 0 0 1 512 106.666667z m-104.725333 583.893333a25.557333 25.557333 0 0 0-36.949334 0 27.605333 27.605333 0 0 0 0 38.186667c78.250667 80.789333 205.098667 80.789333 283.349334 0a27.605333 27.605333 0 0 0 0-38.186667 25.557333 25.557333 0 0 0-36.949334 0 144.810667 144.810667 0 0 1-209.450666 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/carryout.svg b/src/assets/icons/carryout.svg
new file mode 100644
index 0000000..4a06640
--- /dev/null
+++ b/src/assets/icons/carryout.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32z m-40 656H184V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v584zM688 420h-55.2c-5.1 0-10 2.5-13 6.6L468.9 634.4l-64.7-89c-3-4.1-7.8-6.6-13-6.6H336c-6.5 0-10.3 7.4-6.5 12.7l126.4 174c6.4 8.8 19.6 8.8 26 0l212.6-292.7c3.8-5.4 0-12.8-6.5-12.8z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/chexiao.svg b/src/assets/icons/chexiao.svg
new file mode 100644
index 0000000..b9e6e5d
--- /dev/null
+++ b/src/assets/icons/chexiao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M332.202667 347.136c12.16 12.373333 12.16 32.426667 0 44.821333-12.16 12.373333-31.893333 12.373333-44.053334 0l-151.04-115.584a32.085333 32.085333 0 0 1 0-44.842666l151.04-115.584c12.16-12.373333 31.893333-12.373333 44.053334 0 12.16 12.373333 12.16 32.448 0 44.842666l-85.290667 61.589334H565.333333c182.613333 0 330.666667 146.026667 330.666667 326.144 0 177.92-144.426667 322.538667-323.925333 326.08L565.333333 874.666667h-213.333333a31.786667 31.786667 0 0 1-32-31.573334c0-16.384 12.693333-29.866667 28.928-31.402666l3.072-0.149334h213.333333c147.285333 0 266.666667-117.76 266.666667-263.018666 0-143.082667-115.84-259.477333-260.096-262.933334l-6.570667-0.064-318.442666-0.021333 85.333333 61.632z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/chihuohongbao.svg b/src/assets/icons/chihuohongbao.svg
new file mode 100644
index 0000000..bb1fb66
--- /dev/null
+++ b/src/assets/icons/chihuohongbao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M853.333333 338.944V537.6c-32-16.362667-68.266667-25.6-106.666666-25.6-129.6 0-234.666667 105.066667-234.666667 234.666667 0 79.381333 39.424 149.546667 99.754667 192.021333L256 938.666667a85.333333 85.333333 0 0 1-85.333333-85.333334V338.965333a510.229333 510.229333 0 0 0 257.216 123.498667 85.312 85.312 0 0 0 168.192 0 510.165333 510.165333 0 0 0 257.28-123.52zM768 85.333333a85.333333 85.333333 0 0 1 85.333333 85.333334l0.021334 108.778666a468.437333 468.437333 0 0 1-260.842667 140.330667 85.354667 85.354667 0 0 0-161.088 0 468.373333 468.373333 0 0 1-260.778667-140.330667L170.666667 170.666667a85.333333 85.333333 0 0 1 85.333333-85.333334h512z m-21.354667 469.333334a191.957333 191.957333 0 0 1 168.597334 100.053333L746.666667 746.666667l135.765333 135.744A192 192 0 1 1 746.645333 554.666667z m32 106.666666a32 32 0 1 0 0-64 32 32 0 0 0 0 64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/chuangyiwuliao.svg b/src/assets/icons/chuangyiwuliao.svg
new file mode 100644
index 0000000..045057d
--- /dev/null
+++ b/src/assets/icons/chuangyiwuliao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M103.082667 632.704c1.493333 1.130667 3.093333 2.176 4.778666 3.136l2.56 1.344L490.666667 822.421333a49.066667 49.066667 0 0 0 38.976 1.621334l3.690666-1.621334 380.224-185.237333c2.624-1.28 5.077333-2.773333 7.36-4.458667 17.216 12.650667 22.954667 35.477333 12.544 54.4a45.162667 45.162667 0 0 1-19.904 18.752L533.333333 891.093333a49.024 49.024 0 0 1-42.666666 0L110.442667 705.877333c-22.784-11.093333-31.701333-37.482667-19.904-58.922666 3.072-5.546667 7.338667-10.410667 12.544-14.250667z m0-153.6c1.493333 1.130667 3.093333 2.176 4.778666 3.136l2.56 1.344L490.666667 668.821333a49.066667 49.066667 0 0 0 38.976 1.621334l3.690666-1.621334 380.224-185.237333c2.624-1.28 5.077333-2.773333 7.36-4.458667 17.216 12.650667 22.954667 35.477333 12.544 54.4a45.162667 45.162667 0 0 1-19.904 18.752L533.333333 737.493333a49.024 49.024 0 0 1-42.666666 0L110.442667 552.277333c-22.784-11.093333-31.701333-37.482667-19.904-58.922666 3.072-5.546667 7.338667-10.410667 12.544-14.250667zM533.333333 132.970667l380.224 187.968c22.784 11.264 31.701333 38.037333 19.904 59.776a45.44 45.44 0 0 1-19.904 19.008L533.333333 587.733333c-13.376 6.613333-29.290667 6.613333-42.666666 0L110.442667 399.722667c-22.784-11.264-31.701333-38.016-19.904-59.776a45.44 45.44 0 0 1 19.904-18.986667L490.666667 132.949333a48.362667 48.362667 0 0 1 42.666666 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/daiyunying.svg b/src/assets/icons/daiyunying.svg
new file mode 100644
index 0000000..dc1c7c5
--- /dev/null
+++ b/src/assets/icons/daiyunying.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M857.770667 163.882667c75.157333 75.136 72.448 209.237333 6.122666 346.944-17.792 36.309333-41.130667 72.725333-69.248 107.904a64 64 0 1 0 48.533334 41.792 697.173333 697.173333 0 0 0 51.328-72.682667c33.962667 109.098667 24.277333 208.938667-36.736 269.930667-67.84 67.84-183.701333 72.234667-306.922667 23.658666l-1.642667-0.938666-2.816-1.237334a475.690667 475.690667 0 0 1-34.410666-14.784v-0.021333c-40.170667-19.093333-80.64-44.842667-119.530667-76.288a32 32 0 0 0-40.234667 49.792c26.368 21.312 53.504 40.32 80.96 56.746667-108.842667 33.728-208.426667 23.957333-269.290666-36.906667-73.749333-73.749333-72.533333-204.309333-9.749334-339.328l3.434667-7.253333c19.882667-34.432 45.141333-68.693333 74.986667-101.482667a64 64 0 1 0-43.733334-46.997333 688.085333 688.085333 0 0 0-60.394666 75.093333c-35.477333-110.656-26.304-212.202667 35.456-273.941333 75.136-75.157333 209.237333-72.448 346.944-6.122667 137.706667-66.325333 271.808-69.034667 346.944 6.122667z m-347.306667 261.248a85.333333 85.333333 0 1 0 0 170.666666 85.333333 85.333333 0 0 0 0-170.666666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/danwei.svg b/src/assets/icons/danwei.svg
new file mode 100644
index 0000000..ba527e8
--- /dev/null
+++ b/src/assets/icons/danwei.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M683.918222 910.222222h-341.333333a227.555556 227.555556 0 0 1-227.555556-227.555555V341.333333a227.555556 227.555556 0 0 1 227.555556-227.555555h341.333333a227.555556 227.555556 0 0 1 227.555556 227.555555v341.333334a227.555556 227.555556 0 0 1-227.555556 227.555555z m-341.333333-728.177778a159.288889 159.288889 0 0 0-159.288889 159.288889v341.333334a159.288889 159.288889 0 0 0 159.288889 159.288889h341.333333a159.288889 159.288889 0 0 0 159.288889-159.288889V341.333333a159.288889 159.288889 0 0 0-159.288889-159.288889z"  /><path d="M513.251556 711.111111a199.111111 199.111111 0 1 1 199.111111-199.111111 199.395556 199.395556 0 0 1-199.111111 199.111111z m0-329.955555a130.844444 130.844444 0 1 0 130.844444 130.844444 130.844444 130.844444 0 0 0-130.844444-130.901333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/danxuankuang.svg b/src/assets/icons/danxuankuang.svg
new file mode 100644
index 0000000..2ef171c
--- /dev/null
+++ b/src/assets/icons/danxuankuang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/danxuanxuanzhong.svg b/src/assets/icons/danxuanxuanzhong.svg
new file mode 100644
index 0000000..c7f230c
--- /dev/null
+++ b/src/assets/icons/danxuanxuanzhong.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m0 149.333334c117.824 0 213.333333 95.509333 213.333333 213.333333s-95.509333 213.333333-213.333333 213.333333-213.333333-95.509333-213.333333-213.333333 95.509333-213.333333 213.333333-213.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dayin.svg b/src/assets/icons/dayin.svg
new file mode 100644
index 0000000..0d2291d
--- /dev/null
+++ b/src/assets/icons/dayin.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M714.666667 106.666667a74.666667 74.666667 0 0 1 74.56 70.570666L789.333333 181.333333V213.333333h10.666667a117.333333 117.333333 0 0 1 117.248 112.618667L917.333333 330.666667v320a117.333333 117.333333 0 0 1-112.618666 117.248L800 768H789.333333v10.666667a117.333333 117.333333 0 0 1-117.333333 117.333333h-320a117.333333 117.333333 0 0 1-117.333333-117.333333V768h-10.666667a117.333333 117.333333 0 0 1-117.248-112.618667L106.666667 650.666667v-320a117.333333 117.333333 0 0 1 112.618666-117.248L224 213.333333h10.666667V181.333333a74.666667 74.666667 0 0 1 70.570666-74.56L309.333333 106.666667h405.333334z m-42.666667 490.666666h-320a53.333333 53.333333 0 0 0-53.333333 53.333334v128a53.333333 53.333333 0 0 0 53.333333 53.333333h320a53.333333 53.333333 0 0 0 53.333333-53.333333v-128a53.333333 53.333333 0 0 0-53.333333-53.333334z m128-320h-576a53.333333 53.333333 0 0 0-53.226667 49.834667L170.666667 330.666667v320a53.333333 53.333333 0 0 0 49.834666 53.226666L224 704h10.666667v-53.333333a117.333333 117.333333 0 0 1 117.333333-117.333334h320a117.333333 117.333333 0 0 1 117.333333 117.333334V704h10.666667a53.333333 53.333333 0 0 0 53.226667-49.834667L853.333333 650.666667v-320a53.333333 53.333333 0 0 0-49.834666-53.226667L800 277.333333z m-42.666667 64a32 32 0 0 1 0 64h-42.666666a32 32 0 0 1 0-64h42.666666z m-42.666666-170.666666h-405.333334a10.666667 10.666667 0 0 0-10.496 8.746666L298.666667 181.333333V213.333333h426.666666V181.333333a10.666667 10.666667 0 0 0-8.746666-10.496L714.666667 170.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dayin_mian.svg b/src/assets/icons/dayin_mian.svg
new file mode 100644
index 0000000..7989ff6
--- /dev/null
+++ b/src/assets/icons/dayin_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M672 640a53.333333 53.333333 0 0 1 53.333333 53.333333v128a53.333333 53.333333 0 0 1-53.333333 53.333334h-320a53.333333 53.333333 0 0 1-53.333333-53.333334v-128a53.333333 53.333333 0 0 1 53.333333-53.333333h320z m42.666667-490.666667a74.666667 74.666667 0 0 1 74.56 70.570667L789.333333 224V256h10.666667a117.333333 117.333333 0 0 1 117.248 112.618667L917.333333 373.333333v320a117.333333 117.333333 0 0 1-112.618666 117.248L800 810.666667H789.333333v-117.333334a117.333333 117.333333 0 0 0-117.333333-117.333333h-320a117.333333 117.333333 0 0 0-117.333333 117.333333V810.666667h-10.666667a117.333333 117.333333 0 0 1-117.248-112.618667L106.666667 693.333333v-320a117.333333 117.333333 0 0 1 112.618666-117.248L224 256h10.666667v-32a74.666667 74.666667 0 0 1 70.570666-74.56L309.333333 149.333333h405.333334z m42.666666 234.666667h-42.666666a32 32 0 0 0-3.072 63.850667L714.666667 448h42.666666a32 32 0 0 0 0-64z m-42.666666-170.666667h-405.333334a10.666667 10.666667 0 0 0-10.496 8.746667L298.666667 224V256h426.666666v-32a10.666667 10.666667 0 0 0-8.746666-10.496L714.666667 213.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/del.svg b/src/assets/icons/del.svg
new file mode 100644
index 0000000..f938140
--- /dev/null
+++ b/src/assets/icons/del.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M889.287111 219.420444h-178.005333V154.737778a97.28 97.28 0 0 0-96.995556-96.711111h-193.991111a97.28 97.28 0 0 0-96.995555 96.711111v64.682666H145.464889a32.312889 32.312889 0 0 0-32.312889 32.312889 32.312889 32.312889 0 0 0 32.312889 32.369778h48.469333v517.290667a129.706667 129.706667 0 0 0 129.308445 129.308444h387.982222a129.706667 129.706667 0 0 0 129.308444-129.308444V284.103111h48.469334a32.369778 32.369778 0 0 0 32.369777-32.369778 32.312889 32.312889 0 0 0-32.369777-32.312889zM388.152889 154.737778a32.426667 32.426667 0 0 1 32.312889-32.312889h193.991111a32.426667 32.426667 0 0 1 32.312889 32.312889v64.682666H388.152889z m387.982222 646.599111a64.853333 64.853333 0 0 1-64.682667 64.682667h-387.982222a64.910222 64.910222 0 0 1-64.682666-64.682667V284.046222h517.290666zM420.750222 413.411556a32.426667 32.426667 0 0 0-32.312889 32.312888v258.616889a32.312889 32.312889 0 0 0 32.369778 32.312889 32.312889 32.312889 0 0 0 32.312889-32.312889V445.724444a32.426667 32.426667 0 0 0-32.312889-32.312888z m193.991111 0a32.426667 32.426667 0 0 0-32.312889 32.312888v258.616889a32.312889 32.312889 0 0 0 32.369778 32.312889 32.312889 32.312889 0 0 0 32.312889-32.312889V445.724444a32.426667 32.426667 0 0 0-32.312889-32.312888z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/diancanshezhi.svg b/src/assets/icons/diancanshezhi.svg
new file mode 100644
index 0000000..8723cbf
--- /dev/null
+++ b/src/assets/icons/diancanshezhi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M502.016 789.333333l37.056 64H96a32 32 0 0 1 0-64h406.016zM512 149.333333a106.666667 106.666667 0 0 1 105.770667 120.597334 406.122667 406.122667 0 0 1 240.384 180.416 72.981333 72.981333 0 0 0-27.562667-5.397334h-210.517333c-26.090667 0-50.197333 13.866667-63.253334 36.416l-95.488 164.906667a72.64 72.64 0 0 0 0 72.810667l3.626667 6.250666H96a32 32 0 0 1 0-64H106.666667c0-187.264 126.997333-344.874667 299.584-391.402666A106.666667 106.666667 0 0 1 512 149.333333z m0 64a42.666667 42.666667 0 0 0-42.602667 44.864 411.584 411.584 0 0 1 85.184 0L554.666667 256a42.666667 42.666667 0 0 0-42.666667-42.666667z"  /><path d="M802.496 490.666667c21.077333 0 40.554667 11.2 51.114667 29.397333l77.141333 133.205333a58.645333 58.645333 0 0 1 0 58.794667l-77.141333 133.205333A59.050667 59.050667 0 0 1 802.496 874.666667h-154.325333a59.050667 59.050667 0 0 1-51.114667-29.397334l-77.141333-133.205333a58.645333 58.645333 0 0 1 0-58.794667l77.141333-133.205333A59.050667 59.050667 0 0 1 648.170667 490.666667zM725.333333 618.666667a64 64 0 1 0 0 128 64 64 0 0 0 0-128z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dianhua.svg b/src/assets/icons/dianhua.svg
new file mode 100644
index 0000000..be006a9
--- /dev/null
+++ b/src/assets/icons/dianhua.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M219.093333 197.717333l-2.986666 3.2c-1.898667 2.24-3.626667 4.608-5.141334 7.125334l-0.938666 1.514666 1.984-2.432a172.8 172.8 0 0 0-28.586667 47.488C139.114667 365.589333 214.037333 546.133333 348.821333 680.533333c108.693333 108.373333 262.4 194.176 362.24 194.133334 28.757333 0 55.68-4.714667 79.786667-14.314667 22.549333-8.917333 42.154667-21.482667 58.133333-37.418667l30.848-30.762666a54.976 54.976 0 0 0 0-77.824l-141.696-141.226667-2.986666-2.773333a55.082667 55.082667 0 0 0-74.816 2.816l-48.768 48.64-5.077334 0.042666c-35.221333-0.725333-74.794667-21.738667-118.72-65.514666l-5.610666-5.696c-40.085333-41.493333-59.306667-79.04-59.84-112.704l0.042666-5.077334 48.512-48.384a54.869333 54.869333 0 0 0 0-77.824L329.344 165.546667a54.997333 54.997333 0 0 0-77.994667 0L219.093333 197.717333z m49.152 47.018667l22.101334-22.058667 123.242666 122.88-42.282666 42.24a56.661333 56.661333 0 0 0-16.426667 35.264c-5.162667 60.437333 24.213333 120.96 84.885333 181.418667 60.586667 60.373333 121.045333 89.749333 181.312 84.906667l4.416-0.554667a56.682667 56.682667 0 0 0 31.04-15.829333l42.730667-42.624 123.306667 122.88-21.589334 21.525333c-9.258667 9.216-20.992 16.746667-35.2 22.357333-15.829333 6.293333-34.218667 9.536-54.72 9.536-78.314667 0.021333-217.024-77.44-314.176-174.293333-117.653333-117.290667-182.165333-272.725333-150.293333-352.576 3.328-8.341333 7.722667-16.170667 13.162667-23.488l5.909333-7.509333 1.493333-2.24 1.088-1.834667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dianhua_mian.svg b/src/assets/icons/dianhua_mian.svg
new file mode 100644
index 0000000..5554077
--- /dev/null
+++ b/src/assets/icons/dianhua_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M197.76 197.717333l-2.986667 3.2c-1.898667 2.24-3.626667 4.608-5.141333 7.125334l-0.938667 1.514666 1.984-2.432a172.8 172.8 0 0 0-28.586666 47.488C117.781333 365.589333 192.704 546.133333 327.488 680.533333c108.693333 108.373333 262.4 194.176 362.24 194.133334 28.757333 0 55.68-4.714667 79.786667-14.314667 22.549333-8.917333 42.154667-21.482667 58.133333-37.418667l30.848-30.762666a54.976 54.976 0 0 0 0-77.824l-141.696-141.226667-2.986667-2.773333a55.082667 55.082667 0 0 0-74.816 2.816l-48.768 48.64-5.077333 0.042666c-35.221333-0.725333-74.794667-21.738667-118.72-65.514666l-5.610667-5.696c-40.085333-41.493333-59.306667-79.04-59.84-112.704l0.042667-5.077334 48.512-48.384a54.869333 54.869333 0 0 0 0-77.824L308.010667 165.546667a54.997333 54.997333 0 0 0-77.994667 0L197.76 197.717333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dianpu_fengge.svg b/src/assets/icons/dianpu_fengge.svg
new file mode 100644
index 0000000..a7dc3e1
--- /dev/null
+++ b/src/assets/icons/dianpu_fengge.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 65C264.6 65 64 265.6 64 513.1a448.9 448.9 0 0 0 19.2 130.3c28.8 43.7 88.5 57.2 124.8 64.8 198 41 235 20 348.8 250.8C783.2 936.5 960 745.5 960 513.1 960 265.6 759.4 65 512 65z m278.1 701.3a375.3 375.3 0 0 1-193 113.2c-17.2-32.3-32.6-58.4-47.3-80.2-24.6-36.2-48.6-62.6-75.8-83.2s-54.6-33.6-90.4-44.4c-29.3-8.8-61.4-14.9-98.6-21.9-19.5-3.7-39.7-7.4-62.4-12.1-16.4-3.4-35.3-7.7-51.7-14.6-9.6-4.1-17.2-8.7-22.4-13.4a377.6 377.6 0 0 1-12.5-96.6 376 376 0 1 1 725.9 138.1 377.6 377.6 0 0 1-71.8 115.1zM512 208a48 48 0 1 0 48 48 48 48 0 0 0-48-48z m-181 75a48 48 0 1 0 0 96 48 48 0 1 0 0-96z m-75 181a48 48 0 1 0 48 48 48 48 0 0 0-48-48z m437 157a72 72 0 1 0 50.9 21.1A71.5 71.5 0 0 0 693 621z m75-157a48 48 0 1 0 48 48 48 48 0 0 0-48-48z m-75-85a48.1 48.1 0 1 0-33.9-14.1A47.9 47.9 0 0 0 693 379z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dianputuijian.svg b/src/assets/icons/dianputuijian.svg
new file mode 100644
index 0000000..0e8a4c8
--- /dev/null
+++ b/src/assets/icons/dianputuijian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M377.258667 597.333333c39.68 28.437333 84.608 42.666667 134.741333 42.666667 7.914667 0 15.701333-0.362667 23.36-1.066667-22.314667 41.6-34.026667 87.637333-34.026667 130.581334 0 65.834667 25.173333 114.752 67.477334 147.84L238.037333 917.333333a85.333333 85.333333 0 0 1-85.333333-85.333333V618.666667c29.930667 14.229333 59.882667 21.333333 89.813333 21.333333 29.952 0 74.88-14.229333 134.741334-42.666667zM746.666667 469.333333c58.901333 0 106.666667 28.650667 106.666666 64 0 15.786667-9.514667 30.208-25.28 41.386667C897.813333 611.541333 938.666667 693.376 938.666667 768c0 100.138667-85.973333 149.333333-192 149.333333s-192-49.194667-192-149.333333c0-74.602667 40.832-156.437333 110.613333-193.344C649.493333 563.562667 640 549.12 640 533.333333c0-35.349333 47.765333-64 106.666667-64z m-38.378667 171.989334l-2.026667 0.938666-0.981333 0.554667-1.024 0.64a14.613333 14.613333 0 0 0-5.056 18.389333l1.066667 1.877334 12.757333 19.008H688a16 16 0 0 0-2.176 31.850666l2.176 0.149334h42.666667v21.312h-32a16 16 0 0 0-2.176 31.850666l2.176 0.149334 32-0.021334v37.312a16 16 0 0 0 31.850666 2.176l0.149334-2.176V768l32 0.042667a16 16 0 0 0 2.176-31.850667l-2.176-0.149333h-32v-21.333334l42.666666 0.021334a16 16 0 0 0 2.176-31.829334l-2.176-0.149333h-25.045333l12.778667-19.029333 1.066666-1.877334a14.634667 14.634667 0 0 0-3.2-16.896l-1.856-1.493333-1.024-0.64-0.981333-0.554667-2.026667-0.938666a16 16 0 0 0-17.536 4.053333l-1.536 1.941333-19.328 28.8-19.285333-28.8a16 16 0 0 0-19.072-5.994666zM811.413333 106.666667c57.216 0 104.981333 40.789333 111.530667 94.293333l0.469333 4.608 13.632 199.573333a144.042667 144.042667 0 0 1-31.637333 113.408C895.488 460.736 828.16 416 746.666667 416c-88.362667 0-160 52.522667-160 117.333333 0 7.893333 1.066667 15.637333 3.114666 23.125334-19.754667 10.730667-42.24 17.493333-66.197333 19.136l-6.186667 0.32L512 576c-53.973333 0-101.632-25.856-129.92-65.258667l-3.2-4.608-1.621333-2.538666-1.621334 2.56c-25.898667 39.04-70.314667 65.92-121.536 69.44l-6.186666 0.32-5.397334 0.085333C155.733333 576 85.333333 509.141333 85.333333 426.666667c0-5.930667 0.362667-11.84 1.002667-16.853334l0.512-3.626666 13.738667-200.597334c4.16-54.208 50.474667-96.512 107.114666-98.816L212.586667 106.666667h598.826666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dianzifapiao.svg b/src/assets/icons/dianzifapiao.svg
new file mode 100644
index 0000000..b2db463
--- /dev/null
+++ b/src/assets/icons/dianzifapiao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M768 85.333333a85.333333 85.333333 0 0 1 85.333333 85.333334v768a42.666667 42.666667 0 0 1-42.56-39.466667L810.666667 896a42.666667 42.666667 0 0 0-85.226667-3.2L725.333333 896a42.666667 42.666667 0 0 1-85.226666 3.2L640 896a42.666667 42.666667 0 0 0-85.226667-3.2L554.666667 896a42.666667 42.666667 0 0 1-85.226667 3.2L469.333333 896a42.666667 42.666667 0 0 0-85.226666-3.2L384 896a42.666667 42.666667 0 0 1-85.226667 3.2L298.666667 896a42.666667 42.666667 0 0 0-85.226667-3.2L213.333333 896a42.666667 42.666667 0 0 1-39.466666 42.56L170.666667 938.666667V170.666667a85.333333 85.333333 0 0 1 85.333333-85.333334h512z m-53.333333 469.333334h-405.333334a32 32 0 0 0 0 64h405.333334a32 32 0 0 0 0-64z m0-234.666667h-405.333334a32 32 0 0 0 0 64h405.333334a32 32 0 0 0 0-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dingcan.svg b/src/assets/icons/dingcan.svg
new file mode 100644
index 0000000..46d4e95
--- /dev/null
+++ b/src/assets/icons/dingcan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M928 789.333333a32 32 0 0 1 0 64h-832a32 32 0 0 1 0-64h832zM512 149.333333a106.666667 106.666667 0 0 1 105.770667 120.597334c170.346667 45.930667 296.298667 200.106667 299.52 384.213333L917.333333 661.333333h10.666667a32 32 0 0 1 0 64h-832a32 32 0 0 1 0-64H106.666667c0-187.264 126.997333-344.874667 299.584-391.402666A106.666667 106.666667 0 0 1 512 149.333333z m0 64a42.666667 42.666667 0 0 0-42.602667 44.864 411.584 411.584 0 0 1 85.184 0L554.666667 256a42.666667 42.666667 0 0 0-42.666667-42.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dingdan.svg b/src/assets/icons/dingdan.svg
new file mode 100644
index 0000000..e5b35a9
--- /dev/null
+++ b/src/assets/icons/dingdan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M810.666667 85.333333a85.333333 85.333333 0 0 1 85.333333 85.333334v682.666666a85.333333 85.333333 0 0 1-85.333333 85.333334H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333334V170.666667a85.333333 85.333333 0 0 1 85.333333-85.333334h597.333334z m0 64H213.333333a21.333333 21.333333 0 0 0-21.184 18.837334L192 170.666667v682.666666a21.333333 21.333333 0 0 0 18.837333 21.184L213.333333 874.666667h597.333334a21.333333 21.333333 0 0 0 21.184-18.837334L832 853.333333V170.666667a21.333333 21.333333 0 0 0-18.837333-21.184L810.666667 149.333333z m-117.333334 362.666667a32 32 0 0 1 0 64h-362.666666a32 32 0 0 1 0-64h362.666666z m-170.666666-170.666667a32 32 0 0 1 0 64h-192a32 32 0 0 1 0-64h192z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dingdan1.svg b/src/assets/icons/dingdan1.svg
new file mode 100644
index 0000000..5330a6a
--- /dev/null
+++ b/src/assets/icons/dingdan1.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M789.333333 106.666667a85.333333 85.333333 0 0 1 85.333334 85.333333v640a85.333333 85.333333 0 0 1-85.333334 85.333333H277.333333a85.333333 85.333333 0 0 1-85.333333-85.333333v-64a42.666667 42.666667 0 1 1 0-85.333333v-128a42.666667 42.666667 0 1 1 0-85.333334v-128a42.666667 42.666667 0 1 1 0-85.333333V192a85.333333 85.333333 0 0 1 85.333333-85.333333h512z m-74.666666 426.666666h-362.666667a32 32 0 0 0 0 64h362.666667a32 32 0 0 0 0-64z m-170.666667-170.666666h-192a32 32 0 0 0 0 64h192a32 32 0 0 0 0-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dingdan_mian.svg b/src/assets/icons/dingdan_mian.svg
new file mode 100644
index 0000000..0929276
--- /dev/null
+++ b/src/assets/icons/dingdan_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M810.666667 85.333333a85.333333 85.333333 0 0 1 85.333333 85.333334v682.666666a85.333333 85.333333 0 0 1-85.333333 85.333334H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333334V170.666667a85.333333 85.333333 0 0 1 85.333333-85.333334h597.333334z m-117.333334 426.666667h-362.666666a32 32 0 0 0 0 64h362.666666a32 32 0 0 0 0-64z m-170.666666-170.666667h-192a32 32 0 0 0 0 64h192a32 32 0 0 0 0-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dingwei.svg b/src/assets/icons/dingwei.svg
new file mode 100644
index 0000000..ef573a7
--- /dev/null
+++ b/src/assets/icons/dingwei.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c188.373333 0 341.333333 150.250667 341.333333 335.914667 0 108.032-82.453333 263.402667-246.293333 471.274667a120.96 120.96 0 0 1-190.144-0.064l-16.746667-21.44C247.509333 673.92 170.666667 525.568 170.666667 421.248 170.666667 235.584 323.626667 85.333333 512 85.333333z m0 64c-153.322667 0-277.333333 121.642667-277.333333 271.36 0 87.296 74.816 229.717333 225.472 422.250667l8.32 10.624a55.445333 55.445333 0 0 0 87.061333 0C711.744 655.637333 789.333333 509.632 789.333333 420.693333 789.333333 270.954667 665.322667 149.333333 512 149.333333z m0 128a128 128 0 1 1 0 256 128 128 0 0 1 0-256z m0 64a64 64 0 1 0 0 128 64 64 0 0 0 0-128z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/dingwei_mian.svg b/src/assets/icons/dingwei_mian.svg
new file mode 100644
index 0000000..8c86674
--- /dev/null
+++ b/src/assets/icons/dingwei_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c188.373333 0 341.333333 150.250667 341.333333 335.914667 0 108.032-82.453333 263.402667-246.293333 471.274667a120.96 120.96 0 0 1-190.144-0.064l-16.746667-21.44C247.509333 673.92 170.666667 525.568 170.666667 421.248 170.666667 235.584 323.626667 85.333333 512 85.333333z m0 192a128 128 0 1 0 0 256 128 128 0 0 0 0-256z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/ditu.svg b/src/assets/icons/ditu.svg
new file mode 100644
index 0000000..6b5e5f2
--- /dev/null
+++ b/src/assets/icons/ditu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M224 554.666667a32 32 0 0 1 3.072 63.850666L224 618.666667h-21.333333a10.666667 10.666667 0 0 0-10.496 8.746666L192 629.333333v192a53.333333 53.333333 0 0 0 49.834667 53.226667L245.333333 874.666667h533.333334a53.333333 53.333333 0 0 0 53.226666-49.834667L832 821.333333v-192a10.666667 10.666667 0 0 0-8.746667-10.496L821.333333 618.666667h-21.333333a32 32 0 0 1-3.072-63.850667L800 554.666667h21.333333a74.666667 74.666667 0 0 1 74.56 70.570666L896 629.333333v192a117.333333 117.333333 0 0 1-112.618667 117.248L778.666667 938.666667h-533.333334a117.333333 117.333333 0 0 1-117.248-112.618667L128 821.333333v-192a74.666667 74.666667 0 0 1 70.570667-74.56L202.666667 554.666667h21.333333zM512 85.333333c153.045333 0 277.333333 123.946667 277.333333 277.12 0 89.130667-66.986667 217.322667-200.106666 388.821334a99.285333 99.285333 0 0 1-16.213334 16.512 97.28 97.28 0 0 1-138.282666-16.576l-13.610667-17.706667C297.088 570.944 234.666667 448.533333 234.666667 362.496 234.666667 209.28 358.954667 85.333333 512 85.333333z m0 64c-117.930667 0-213.333333 96.597333-213.333333 215.488 0 69.333333 57.536 182.421333 173.44 335.317334l6.4 8.426666a41.749333 41.749333 0 0 0 59.946666 7.274667c2.602667-2.133333 4.970667-4.565333 7.04-7.253333C665.642667 551.36 725.333333 435.413333 725.333333 364.8 725.333333 245.930667 629.930667 149.333333 512 149.333333z m0 106.666667a106.666667 106.666667 0 1 1 0 213.333333 106.666667 106.666667 0 0 1 0-213.333333z m0 64a42.666667 42.666667 0 1 0 0 85.333333 42.666667 42.666667 0 0 0 0-85.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/ditu_mian.svg b/src/assets/icons/ditu_mian.svg
new file mode 100644
index 0000000..bb542bf
--- /dev/null
+++ b/src/assets/icons/ditu_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M393.173333 785.685333l17.792 21.44c44.096 52.672 125.013333 61.632 180.8 20.074667 7.893333-5.866667 14.997333-12.586667 21.226667-20.010667 79.509333-94.954667 141.013333-178.986667 184.32-252.501333L821.333333 554.666667a74.666667 74.666667 0 0 1 74.56 70.570666L896 629.333333v192a117.333333 117.333333 0 0 1-112.618667 117.248L778.666667 938.666667h-533.333334a117.333333 117.333333 0 0 1-117.248-112.618667L128 821.333333v-192a74.666667 74.666667 0 0 1 70.570667-74.56L202.666667 554.666667h24.021333c40.021333 67.946667 95.552 144.832 166.464 231.018666zM512 85.333333c153.045333 0 277.333333 123.946667 277.333333 277.12 0 89.130667-66.986667 217.322667-200.106666 388.821334a99.285333 99.285333 0 0 1-16.213334 16.512 97.28 97.28 0 0 1-138.282666-16.576l-13.610667-17.706667C297.088 570.944 234.666667 448.533333 234.666667 362.496 234.666667 209.28 358.954667 85.333333 512 85.333333z m0 170.666667a106.666667 106.666667 0 1 0 0 213.333333 106.666667 106.666667 0 0 0 0-213.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/duizhang.svg b/src/assets/icons/duizhang.svg
new file mode 100644
index 0000000..f63d6df
--- /dev/null
+++ b/src/assets/icons/duizhang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M789.333333 106.666667a85.333333 85.333333 0 0 1 85.333334 85.333333v640a85.333333 85.333333 0 0 1-85.333334 85.333333H277.333333a85.333333 85.333333 0 0 1-85.333333-85.333333v-64a42.666667 42.666667 0 1 1 0-85.333333v-128a42.666667 42.666667 0 1 1 0-85.333334v-128a42.666667 42.666667 0 1 1 0-85.333333V192a85.333333 85.333333 0 0 1 85.333333-85.333333h512zM473.109333 371.456a32 32 0 0 0-44.074666 0l-0.832 0.789333a29.952 29.952 0 0 0 0 43.456l40.085333 38.08h-32.213333a30.72 30.72 0 0 0 0 61.44h66.282666v40.96h-44.736a30.72 30.72 0 1 0 0 61.461334h44.736v49.92a32 32 0 0 0 32 32h0.704a32 32 0 0 0 32-32l-0.021333-49.92h44.757333a30.72 30.72 0 0 0 0-61.44l-44.757333-0.021334v-40.96h66.325333a30.72 30.72 0 0 0 0-61.44h-37.034666l40.106666-38.08 2.112-2.218666a29.973333 29.973333 0 0 0-2.133333-41.237334l-0.810667-0.789333-2.389333-2.048a32 32 0 0 0-41.685333 2.048l-59.221334 56.234667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/elemo.svg b/src/assets/icons/elemo.svg
new file mode 100644
index 0000000..c1d5388
--- /dev/null
+++ b/src/assets/icons/elemo.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M513.557333 85.333333a428.266667 428.266667 0 0 1 362.624 199.616l4.416 7.146667c23.893333 39.466667-15.445333 68.757333-348.416 296.213333a33.024 33.024 0 0 1-45.781333-8.533333 32.746667 32.746667 0 0 1 8.533333-45.610667l55.317334-37.930666c88.042667-60.629333 155.456-108.352 202.154666-143.104l17.92-13.461334c14.869333-11.306667 26.922667-20.864 36.117334-28.565333l5.162666-4.458667-0.533333-0.789333A362.282667 362.282667 0 0 0 521.749333 151.04l-8.192-0.085333c-200.106667 0-362.346667 161.642667-362.346666 361.024 0 199.381333 162.24 361.024 362.346666 361.024 82.922667 0 161.493333-27.797333 225.066667-78.08a33.024 33.024 0 0 1 46.293333 5.333333c11.306667 14.186667 8.917333 34.837333-5.333333 46.101333A427.477333 427.477333 0 0 1 513.557333 938.666667C277.056 938.666667 85.333333 747.648 85.333333 512S277.056 85.333333 513.557333 85.333333z m401.28 433.514667a32.853333 32.853333 0 0 1 22.528 40.661333c-6.016 20.757333-16.512 40.256-30.997333 58.069334a33.002667 33.002667 0 0 1-46.336 4.821333 32.746667 32.746667 0 0 1-4.885333-46.165333c9.109333-11.2 15.402667-22.890667 18.901333-34.986667a32.917333 32.917333 0 0 1 40.789333-22.4z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/ezhanggui.svg b/src/assets/icons/ezhanggui.svg
new file mode 100644
index 0000000..cd50b0b
--- /dev/null
+++ b/src/assets/icons/ezhanggui.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M682.773333 128a152.576 152.576 0 0 1 130.645334 73.749333L947.882667 424.533333a76.288 76.288 0 0 1-12.288 94.250667l-369.706667 357.44a76.288 76.288 0 0 1-107.136-1.066667L87.338667 501.354667a76.288 76.288 0 0 1-10.197334-94.784l132.565334-208A152.576 152.576 0 0 1 338.389333 128h344.384z m-172.330666 149.333333a188.714667 188.714667 0 0 0-103.594667 30.997334 190.72 190.72 0 0 0-82.624 121.088 191.957333 191.957333 0 0 0 26.581333 144.490666A189.610667 189.610667 0 0 0 510.72 661.333333a187.904 187.904 0 0 0 100.949333-29.312c1.088-0.576 1.984-1.066667 2.816-1.6a17.6 17.6 0 0 0 1.92-1.408l0.213334-0.149333a192.704 192.704 0 0 0 11.2-8.192 12.16 12.16 0 0 0 3.392-14.72 2.389333 2.389333 0 0 0-0.234667-0.597333l-0.170667-0.213334-0.362666-0.682666-7.914667-12.650667a27.370667 27.370667 0 0 0-36.992-8.704h-0.021333l-0.597334 0.384a3.498667 3.498667 0 0 0-0.490666 0.277333 3.626667 3.626667 0 0 0-0.725334 0.533334 134.848 134.848 0 0 1-186.752-40.576 136.533333 136.533333 0 0 1-18.901333-102.762667 135.765333 135.765333 0 0 1 58.752-86.122667 134.08 134.08 0 0 1 73.642667-22.037333c32.853333 0 64.533333 11.946667 89.173333 33.6a8.682667 8.682667 0 0 1 2.816 5.546667 7.338667 7.338667 0 0 1-3.541333 6.592l-116.821334 76.437333a27.52 27.52 0 0 0-11.946666 17.493333c-1.536 7.253333-0.149333 14.634667 3.84 20.864l8.384 13.013334a12.117333 12.117333 0 0 0 16.789333 3.562666l172.16-112.64c4.650667-3.328 6.741333-8.618667 6.464-14.4-0.341333-7.68-4.693333-13.973333-7.338667-18.090666a189.717333 189.717333 0 0 0-160-87.445334z m167.04 186.026667a13.717333 13.717333 0 0 0-7.509334 2.24l-30.122666 19.733333-0.704 0.469334a13.845333 13.845333 0 0 0-5.269334 8.32 13.952 13.952 0 0 0 1.92 10.453333l19.541334 30.357333 0.512 0.725334a13.76 13.76 0 0 0 18.602666 3.349333l15.061334-9.834667 1.002666-0.682666c6.570667-4.650667 11.093333-11.562667 12.778667-19.52 1.770667-8.362667 0.213333-16.938667-4.416-24.106667l-9.770667-15.146667-0.512-0.746666a13.824 13.824 0 0 0-11.093333-5.632z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/falvfuwubaoxiaohei.svg b/src/assets/icons/falvfuwubaoxiaohei.svg
new file mode 100644
index 0000000..27ea856
--- /dev/null
+++ b/src/assets/icons/falvfuwubaoxiaohei.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M561.621333 174.186667c76.736 6.848 152.042667 19.925333 212.714667 76.778666 20.565333 19.242667 93.141333 2.688 101.44 1.344 20.096-3.221333 53.866667-18.88 61.354667 18.922667 6.442667 32.533333-7.530667 60.416-38.890667 75.904-7.722667 3.84-16.384 8.064-24.618667 8.106667-30.549333 0.128-27.349333 14.997333-18.624 36.245333 22.293333 54.293333 36.266667 110.976 45.290667 169.088 19.434667 125.397333-53.397333 230.826667-177.322667 254.250667-69.973333 13.226667-140.714667 19.242667-211.989333 16.533333-71.317333 2.688-142.037333-3.498667-211.946667-17.024-121.002667-23.402667-193.6-129.408-174.72-252.309333 9.173333-59.584 23.424-117.696 46.677334-173.226667 8.746667-20.906667 8.192-31.701333-18.282667-33.578667-18.645333-1.322667-37.12-8.874667-48.96-25.365333-14.016-19.562667-24.469333-41.728-14.421333-65.557333 11.093333-26.368 36.181333-15.722667 53.824-12.202667 56.256 11.242667 101.994667 1.834667 153.173333-31.808 78.506667-51.626667 173.248-54.293333 265.301333-46.08z m-175.36 139.157333c-108.373333 8.789333-165.333333 49.642667-203.2 187.690667-5.717333 20.821333-8.96 42.602667-11.050666 64.149333-9.493333 96.789333 23.872 149.461333 114.645333 181.610667 72.234667 25.578667 147.285333 30.186667 222.976 28.928 80.405333 1.749333 160.021333-3.498667 236.48-31.36 55.552-20.245333 99.2-54.506667 105.109333-117.717334 8.661333-92.821333-11.882667-179.136-71.082666-253.226666-19.882667-24.853333-45.909333-40.661333-77.12-48-104.853333-24.725333-210.56-20.693333-316.757334-12.074667z m304.810667 31.68c29.269333 6.698667 53.653333 21.077333 72.298667 43.669333 55.488 67.349333 74.752 145.813333 66.624 230.186667-5.525333 57.472-46.464 88.64-98.538667 107.029333-71.68 25.322667-146.304 30.08-221.696 28.501334-70.954667 1.152-141.312-3.050667-209.024-26.304-85.12-29.226667-116.394667-77.098667-107.498667-165.077334 1.962667-19.605333 5.013333-39.402667 10.368-58.346666 35.477333-125.482667 88.874667-162.624 190.506667-170.624 99.541333-7.829333 198.656-11.477333 296.96 10.965333z m-318.101333 125.205333c-19.264 0-34.88 15.594667-34.88 34.858667v62.421333a34.858667 34.858667 0 1 0 69.738666 0v-62.421333c0-19.264-15.616-34.858667-34.858666-34.858667z m278.912 0c-19.264 0-34.88 15.594667-34.88 34.858667v62.421333a34.858667 34.858667 0 1 0 69.738666 0v-62.421333c0-19.264-15.616-34.858667-34.858666-34.858667zM510.144 213.333333c2.090667 27.797333-9.6 44.096-40.810667 54.613334 30.314667 14.613333 46.826667 12.074667 58.154667-6.954667 11.2-18.816 6.4-34.133333-17.344-47.658667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/fengniaopaotui.svg b/src/assets/icons/fengniaopaotui.svg
new file mode 100644
index 0000000..3f5f7b1
--- /dev/null
+++ b/src/assets/icons/fengniaopaotui.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M725.333333 128a170.666667 170.666667 0 0 1 170.666667 170.666667v426.666666a170.666667 170.666667 0 0 1-170.666667 170.666667H298.666667a170.666667 170.666667 0 0 1-170.666667-170.666667V298.666667a170.666667 170.666667 0 0 1 170.666667-170.666667h426.666666z m-94.72 308.330667H192c0.277333 1.984 3.264 18.368 24.426667 21.44 44.842667 6.528 110.144 14.101333 153.856 40.533333 39.146667 23.68 56.064 59.072 47.04 114.730667C410.837333 652.928 393.813333 704 393.813333 704c87.850667 0 161.493333-69.44 193.002667-150.272a5850.56 5850.56 0 0 0 43.776-117.397333zM832 320h-199.893333l-5.866667 0.085333c-66.154667 2.005333-127.296 37.76-146.304 97.472h155.093333l1.194667-3.072c0.746667-1.898667 1.429333-3.541333 2.24-5.333333 21.482667-48.618667 59.157333-70.208 114.389333-75.349333 23.466667-2.176 45.994667-3.733333 59.989334-5.013334 10.346667-0.938667 17.28-1.813333 19.157333-8.789333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/fenxiang.svg b/src/assets/icons/fenxiang.svg
new file mode 100644
index 0000000..e4eb7cc
--- /dev/null
+++ b/src/assets/icons/fenxiang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M490.666667 128a31.146667 31.146667 0 0 1 2.986666 62.122667L490.666667 190.293333H242.154667a51.904 51.904 0 0 0-51.776 48.469334l-0.106667 3.413333V781.866667a51.904 51.904 0 0 0 48.469333 51.776l3.413334 0.106666H781.866667a51.904 51.904 0 0 0 51.776-48.469333l0.106666-3.413333V533.333333a31.146667 31.146667 0 0 1 62.122667-2.986666L896 533.333333v248.512a114.154667 114.154667 0 0 1-109.568 114.069334l-4.586667 0.085333H242.133333a114.154667 114.154667 0 0 1-114.069333-109.568L128 781.845333V242.133333a114.154667 114.154667 0 0 1 109.568-114.069333L242.154667 128H490.666667z m291.178666 0a114.154667 114.154667 0 0 1 114.069334 109.568l0.085333 4.586667v145.301333a31.146667 31.146667 0 0 1-62.122667 2.986667l-0.149333-2.986667v-145.28c0-2.496-0.170667-4.949333-0.512-7.338667L471.744 596.266667a31.146667 31.146667 0 0 1-46.165333-41.664l2.133333-2.368L789.184 190.784a52.074667 52.074667 0 0 0-3.925333-0.405333l-3.413334-0.106667h-145.301333a31.146667 31.146667 0 0 1-2.986667-62.122667l2.986667-0.149333h145.28z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/fukuan.svg b/src/assets/icons/fukuan.svg
new file mode 100644
index 0000000..939c745
--- /dev/null
+++ b/src/assets/icons/fukuan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m98.389333 173.290667l2.88 1.429333 2.816 1.578667a28.266667 28.266667 0 0 1 10.730667 38.784l-1.578667 2.432-43.242666 59.968h68.693333a32 32 0 1 1 0 64l-106.688-0.021333v63.957333h85.333333a32 32 0 1 1 0 64l-85.333333-0.021333V714.666667a32 32 0 0 1-64 0v-95.936h-85.333333a32 32 0 1 1 0-63.957334l85.333333-0.021333v-63.957333h-106.666667a32 32 0 1 1 0-63.957334l68.650667-0.021333-43.221333-59.968a28.266667 28.266667 0 0 1 9.152-41.216l2.816-1.578667a32 32 0 0 1 41.557333 9.237334l59.690667 82.816 59.733333-82.816a32 32 0 0 1 38.677333-10.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/fukuan_mian.svg b/src/assets/icons/fukuan_mian.svg
new file mode 100644
index 0000000..ba094cc
--- /dev/null
+++ b/src/assets/icons/fukuan_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m98.389333 237.290667a32 32 0 0 0-38.677333 10.666667L512 416.106667l-59.690667-82.816a32 32 0 0 0-41.557333-9.237334l-2.816 1.578667a28.266667 28.266667 0 0 0-9.173333 41.216l43.242666 59.968h-68.672a32 32 0 1 0 0 64l106.688-0.021333v63.957333h-85.333333a32 32 0 1 0 0 64l85.333333-0.021333V714.666667a32 32 0 0 0 64 0v-95.936h85.333334a32 32 0 1 0 0-63.957334l-85.333334-0.021333v-63.957333h106.666667a32 32 0 1 0 0-63.957334l-68.672-0.021333 43.242667-59.968 1.578666-2.432a28.266667 28.266667 0 0 0-10.730666-38.784l-2.816-1.578667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/fullscreen-exit.svg b/src/assets/icons/fullscreen-exit.svg
new file mode 100644
index 0000000..e845a79
--- /dev/null
+++ b/src/assets/icons/fullscreen-exit.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 class="icon" width="64px" height="64.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M379.336 697.237L153.362 921.55c-14.11 14.007-36.905 13.922-50.912-0.188-14.007-14.11-13.922-36.905 0.188-50.912l227.6-225.927H138.645c-18.99 0-34.385-15.446-34.385-34.5 0-19.053 15.395-34.5 34.385-34.5H413.72c18.99 0 34.384 15.447 34.384 34.5v276c0 9.15-3.622 17.926-10.07 24.396a34.326 34.326 0 0 1-24.314 10.104 34.326 34.326 0 0 1-24.314-10.104 34.559 34.559 0 0 1-10.071-24.396V697.237z m263.395-366.88l227.813-227.813c14.059-14.059 36.853-14.059 50.912 0 14.059 14.059 14.059 36.853 0 50.912l-225.18 225.18h187.147c18.99 0 34.385 15.445 34.385 34.5 0 19.053-15.395 34.5-34.385 34.5H608.346c-18.99 0-34.384-15.447-34.384-34.5v-276c0-9.15 3.622-17.926 10.07-24.396a34.326 34.326 0 0 1 24.314-10.105c9.12 0 17.865 3.635 24.314 10.105a34.559 34.559 0 0 1 10.07 24.395v193.223zM99.385 410a34.326 34.326 0 0 1-24.314-10.105A34.559 34.559 0 0 1 65 375.5v-276C65 80.446 80.395 65 99.385 65h275.077c18.99 0 34.384 15.446 34.384 34.5 0 19.054-15.394 34.5-34.384 34.5H133.769v241.5c0 9.15-3.622 17.925-10.07 24.395A34.326 34.326 0 0 1 99.384 410z m825.23 552H649.538c-18.99 0-34.384-15.446-34.384-34.5 0-19.054 15.394-34.5 34.384-34.5h240.693V651.5c0-19.054 15.394-34.5 34.384-34.5 18.99 0 34.385 15.446 34.385 34.5v276c0 19.054-15.395 34.5-34.385 34.5z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/fullscreen.svg b/src/assets/icons/fullscreen.svg
new file mode 100644
index 0000000..516e890
--- /dev/null
+++ b/src/assets/icons/fullscreen.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 class="icon" width="64px" height="64.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M924 616a36 36 0 0 0-36 36v236H652a36 36 0 0 0 0 72h272a36 36 0 0 0 36-36V652a36 36 0 0 0-36-36zM372 64H100a36 36 0 0 0-36 36v272a36 36 0 0 0 72 0V136h236a36 36 0 0 0 0-72zM924 64H652a36 36 0 0 0 0 72h185.09L626.54 346.54a36 36 0 1 0 50.92 50.91L888 186.91V372a36 36 0 0 0 72 0V100a36 36 0 0 0-36-36zM372 616a35.87 35.87 0 0 0-25.46 10.55L136 837.09V652a36 36 0 0 0-72 0v272a36 36 0 0 0 36 36h272a36 36 0 0 0 0-72H186.91l210.55-210.54A36 36 0 0 0 372 616z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/fuwushichang.svg b/src/assets/icons/fuwushichang.svg
new file mode 100644
index 0000000..2564370
--- /dev/null
+++ b/src/assets/icons/fuwushichang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M777.045333 128a85.333333 85.333333 0 0 1 85.205334 80.533333l33.6 597.333334A85.333333 85.333333 0 0 1 810.666667 896H213.333333a85.333333 85.333333 0 0 1-85.205333-90.133333l33.621333-597.333334A85.333333 85.333333 0 0 1 246.954667 128h530.090666zM682.666667 256a42.666667 42.666667 0 0 0-37.738667 62.528c-25.237333 56.768-72.789333 86.826667-132.928 86.826667-60.522667 0-107.882667-29.866667-132.949333-86.741334a42.666667 42.666667 0 1 0-63.36 14.165334C349.184 420.16 421.973333 469.333333 512 469.333333c89.642667 0 162.602667-49.408 196.266667-136.533333A42.666667 42.666667 0 0 0 682.666667 256z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/fuzhi.svg b/src/assets/icons/fuzhi.svg
new file mode 100644
index 0000000..659c6e0
--- /dev/null
+++ b/src/assets/icons/fuzhi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M650.666667 277.333333h-405.333334A53.333333 53.333333 0 0 0 192 330.666667v490.666666a53.333333 53.333333 0 0 0 53.333333 53.333334h405.333334a53.333333 53.333333 0 0 0 53.333333-53.333334v-490.666666a53.333333 53.333333 0 0 0-53.333333-53.333334zM768 746.666667h10.666667a53.333333 53.333333 0 0 0 53.226666-49.834667L832 693.333333v-490.666666a53.333333 53.333333 0 0 0-49.834667-53.226667L778.666667 149.333333h-405.333334a53.333333 53.333333 0 0 0-53.226666 49.834667L320 202.666667v10.666666h330.666667a117.333333 117.333333 0 0 1 117.333333 117.333334V746.666667z m-181.333333-106.666667a32 32 0 0 1 0 64h-277.333334a32 32 0 0 1 0-64h277.333334z m0-192a32 32 0 0 1 0 64h-277.333334a32 32 0 0 1 0-64h277.333334zM768 821.333333a117.333333 117.333333 0 0 1-117.333333 117.333334h-405.333334A117.333333 117.333333 0 0 1 128 821.333333v-490.666666a117.333333 117.333333 0 0 1 117.333333-117.333334h10.666667v-10.666666a117.333333 117.333333 0 0 1 112.618667-117.248L373.333333 85.333333h405.333334a117.333333 117.333333 0 0 1 117.248 112.618667L896 202.666667v490.666666a117.333333 117.333333 0 0 1-112.618667 117.248L778.666667 810.666667H768z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gaode.svg b/src/assets/icons/gaode.svg
new file mode 100644
index 0000000..8d26343
--- /dev/null
+++ b/src/assets/icons/gaode.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M652.288 798.784l-190.4-119.466667-86.677333 86.058667 33.578666-118.485333 384.533334-395.989334-430.976 365.952-154.176-96.768 585.173333-269.184-141.056 547.882667z m-263.253333-429.376h92.16l-92.16 39.68v-39.68z m506.965333 0v-56.533333C896 210.261333 816.085333 128 715.2 128h-63.637333v168.064l-60.352 25.984V128H309.973333C209.066667 128 128 210.282667 128 312.874667v56.533333h146.346667v60.373333H128v282.197334C128 814.592 209.066667 896 309.973333 896h281.237334v-109.44l60.373333 38.464V896h63.616C816.085333 896 896 814.570667 896 711.978667V429.76h-129.194667l15.530667-60.352H896z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gengduo.svg b/src/assets/icons/gengduo.svg
new file mode 100644
index 0000000..2956729
--- /dev/null
+++ b/src/assets/icons/gengduo.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M256 448a64 64 0 1 1 0 128 64 64 0 0 1 0-128z m256 0a64 64 0 1 1 0 128 64 64 0 0 1 0-128z m256 0a64 64 0 1 1 0 128 64 64 0 0 1 0-128z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gengduoandroid.svg b/src/assets/icons/gengduoandroid.svg
new file mode 100644
index 0000000..ecde71b
--- /dev/null
+++ b/src/assets/icons/gengduoandroid.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 704a64 64 0 1 1 0 128 64 64 0 0 1 0-128z m0-256a64 64 0 1 1 0 128 64 64 0 0 1 0-128z m0-256a64 64 0 1 1 0 128 64 64 0 0 1 0-128z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gift.svg b/src/assets/icons/gift.svg
new file mode 100644
index 0000000..add9ce8
--- /dev/null
+++ b/src/assets/icons/gift.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M880 310H732.4c13.6-21.4 21.6-46.8 21.6-74 0-76.1-61.9-138-138-138-41.4 0-78.7 18.4-104 47.4-25.3-29-62.6-47.4-104-47.4-76.1 0-138 61.9-138 138 0 27.2 7.9 52.6 21.6 74H144c-17.7 0-32 14.3-32 32v200c0 4.4 3.6 8 8 8h40v344c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V550h40c4.4 0 8-3.6 8-8V342c0-17.7-14.3-32-32-32z m-334-74c0-38.6 31.4-70 70-70s70 31.4 70 70-31.4 70-70 70h-70v-70z m-138-70c38.6 0 70 31.4 70 70v70h-70c-38.6 0-70-31.4-70-70s31.4-70 70-70zM180 482V378h298v104H180z m48 68h250v308H228V550z m568 308H546V550h250v308z m48-376H546V378h298v104z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gongyingshang.svg b/src/assets/icons/gongyingshang.svg
new file mode 100644
index 0000000..9426995
--- /dev/null
+++ b/src/assets/icons/gongyingshang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M412.444444 335.815111z m70.940445 0"  /><path d="M768.739556 595.399111l-1.536-1.422222z m45.511111-54.556444l3.299555 3.072c-1.251556-1.080889-2.218667-2.104889-3.470222-3.072z"  /><path d="M540.046222 114.460444a212.423111 212.423111 0 1 0 212.423111 212.48 212.48 212.48 0 0 0-212.423111-212.48z m0 354.076445a141.653333 141.653333 0 1 1 141.596445-141.596445 141.596444 141.596444 0 0 1-141.596445 141.596445z"  /><path d="M737.507556 521.443556l-3.413334-1.877334a396.686222 396.686222 0 0 0-590.506666 345.827556v6.769778a23.324444 23.324444 0 0 0 0 2.787555 35.441778 35.441778 0 1 0 70.826666-1.649778v-7.907555a325.802667 325.802667 0 0 1 485.489778-283.932445l2.104889 1.251556a35.441778 35.441778 0 0 0 36.295111-60.871111l-0.625778-0.398222z m112.071111 164.522666h-102.513778a30.378667 30.378667 0 0 0-30.378667 30.378667v2.218667a30.378667 30.378667 0 0 0 30.378667 30.378666h25.713778l-82.830223 82.830222-93.468444-93.468444a31.402667 31.402667 0 0 0-44.430222 0L436.337778 854.016a31.459556 31.459556 0 1 0 44.487111 44.544l93.468444-93.468444 93.468445 93.468444a31.630222 31.630222 0 0 0 44.544 0l105.073778-105.130667v25.713778a30.321778 30.321778 0 0 0 30.321777 30.321778h2.275556a30.264889 30.264889 0 0 0 30.321778-30.321778v-102.798222a30.321778 30.321778 0 0 0-30.321778-30.378667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/goods.svg b/src/assets/icons/goods.svg
new file mode 100644
index 0000000..b80fbed
--- /dev/null
+++ b/src/assets/icons/goods.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M796.444444 910.222222H227.555556a113.777778 113.777778 0 0 1-113.777778-113.777778V227.555556a113.777778 113.777778 0 0 1 113.777778-113.777778h568.888888a113.777778 113.777778 0 0 1 113.777778 113.777778v568.888888a113.777778 113.777778 0 0 1-113.777778 113.777778zM227.555556 182.044444a45.511111 45.511111 0 0 0-45.511112 45.511112v568.888888a45.511111 45.511111 0 0 0 45.511112 45.511112h568.888888a45.511111 45.511111 0 0 0 45.511112-45.511112V227.555556a45.511111 45.511111 0 0 0-45.511112-45.511112z"  /><path d="M671.288889 270.222222a159.288889 159.288889 0 0 1-318.577778 0H284.444444a230.343111 230.343111 0 0 0 227.555556 227.555556c1.365333 0 2.616889-0.398222 3.925333-0.398222A230.001778 230.001778 0 0 0 739.555556 270.222222z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gou.svg b/src/assets/icons/gou.svg
new file mode 100644
index 0000000..6354197
--- /dev/null
+++ b/src/assets/icons/gou.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M137.493333 450.389333a32.256 32.256 0 0 1 45.866667 0L405.12 673.856a21.333333 21.333333 0 0 0 30.293333 0L840.64 265.6a32.256 32.256 0 0 1 45.866667 0 32.853333 32.853333 0 0 1 0 46.186667l-443.306667 446.656a32.256 32.256 0 0 1-45.845333 0L137.514667 496.597333a32.853333 32.853333 0 0 1 0-46.208z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gouwuche.svg b/src/assets/icons/gouwuche.svg
new file mode 100644
index 0000000..6e76f7d
--- /dev/null
+++ b/src/assets/icons/gouwuche.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M384 768a42.666667 42.666667 0 1 1 0 85.333333 42.666667 42.666667 0 0 1 0-85.333333z m341.333333 0a42.666667 42.666667 0 1 1 0 85.333333 42.666667 42.666667 0 0 1 0-85.333333zM188.352 128c33.685333 0 62.869333 23.253333 71.146667 56.064l0.896 3.989333 84.586666 430.4a52.778667 52.778667 0 0 0 47.914667 42.752l3.541333 0.128h331.733334c24.021333 0 44.8-16.533333 50.773333-39.872l0.789333-3.541333 53.098667-284.949333a10.666667 10.666667 0 0 0-8.362667-12.458667l-0.981333-0.149333-0.981333-0.042667H390.549333a31.744 31.744 0 0 1-31.488-32c0-16.64 12.48-30.293333 28.458667-31.850667l3.029333-0.149333h431.957334c4.586667 0 9.173333 0.426667 13.674666 1.301333 38.549333 7.424 64.32 44.16 59.157334 83.2l-0.64 4.053334-53.077334 284.949333c-10.026667 53.717333-55.104 93.056-108.416 95.402667l-5.034666 0.106666h-331.733334c-53.376 0-99.541333-37.12-112.128-89.408l-1.066666-4.949333L198.613333 200.576a10.581333 10.581333 0 0 0-8.448-8.405333L188.373333 192H159.488A31.744 31.744 0 0 1 128 160c0-16.64 12.48-30.293333 28.458667-31.850667L159.488 128h28.864z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gouxuan.svg b/src/assets/icons/gouxuan.svg
new file mode 100644
index 0000000..8fe88a6
--- /dev/null
+++ b/src/assets/icons/gouxuan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m225.173333 201.578667a32.853333 32.853333 0 0 1 0 46.186667l-272.64 275.989333a32.256 32.256 0 0 1-45.845333 0l-131.84-133.824a32.853333 32.853333 0 0 1 0-46.208 32.256 32.256 0 0 1 45.845333 0l93.738667 95.296a21.333333 21.333333 0 0 0 30.165333 0.256l0.213334-0.213333 234.496-237.482667a32.256 32.256 0 0 1 45.866666 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gouxuan_mian.svg b/src/assets/icons/gouxuan_mian.svg
new file mode 100644
index 0000000..375972b
--- /dev/null
+++ b/src/assets/icons/gouxuan_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m225.173333 265.578667a32.256 32.256 0 0 0-45.866666 0L456.832 588.373333l-0.213333 0.213334a21.333333 21.333333 0 0 1-30.186667-0.256l-93.738667-95.296a32.256 32.256 0 0 0-45.866666 0 32.853333 32.853333 0 0 0 0 46.208l131.861333 133.824a32.256 32.256 0 0 0 45.866667 0l272.618666-275.989334a32.853333 32.853333 0 0 0 0-46.186666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/guanbi.svg b/src/assets/icons/guanbi.svg
new file mode 100644
index 0000000..831bd0e
--- /dev/null
+++ b/src/assets/icons/guanbi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M844.330667 179.669333a30.72 30.72 0 0 1 0 43.456l-288.853334 288.853334 288.853334 288.896a30.72 30.72 0 1 1-43.456 43.456l-288.853334-288.896-288.896 288.896a30.72 30.72 0 1 1-43.456-43.456L468.565333 512 179.669333 223.146667a30.72 30.72 0 0 1 43.456-43.456L512 468.522667l288.853333-288.853334a30.72 30.72 0 0 1 43.456 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/guanli.svg b/src/assets/icons/guanli.svg
new file mode 100644
index 0000000..4848092
--- /dev/null
+++ b/src/assets/icons/guanli.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M804.224 106.666667c62.805333 0 115.029333 47.061333 119.978667 108.096l12.757333 178.496 0.832 6.101333c0.277333 2.752 0.512 5.525333 0.64 8.298667L938.666667 416c0 53.098667-26.517333 100.138667-67.349334 129.258667V800c0 63.210667-52.650667 114.773333-118.570666 117.248l-4.949334 0.085333H276.202667c-66.56 0-120.789333-50.005333-123.413334-112.618666l-0.085333-4.714667V545.258667C111.829333 516.138667 85.333333 469.098667 85.333333 416c0-8.469333 0.682667-16.853333 2.026667-25.130667l-0.213333 1.344 12.650666-177.450666c4.693333-57.770667 51.733333-103.04 110.016-107.690667l5.013334-0.298667 4.949333-0.106666z m-160.938667 405.312l-1.429333 1.898666a165.461333 165.461333 0 0 1-123.861333 62.016L512 576a165.589333 165.589333 0 0 1-129.856-62.122667l-1.450667-1.898666-1.408 1.898666a165.461333 165.461333 0 0 1-123.861333 62.016l-5.973333 0.106667c-10.026667 0-19.861333-0.874667-29.397334-2.56V800c0 28.266667 23.189333 51.413333 52.48 53.226667l3.669334 0.106666h471.594666c29.76 0 54.122667-22.016 56.021334-49.834666l0.106666-3.498667V573.44a169.173333 169.173333 0 0 1-29.354666 2.56 165.589333 165.589333 0 0 1-129.856-62.122667l-1.429334-1.898666zM804.224 170.666667H219.776C191.232 170.666667 167.466667 192.064 165.226667 219.797333l-12.736 178.581334-0.981334 7.466666a95.061333 95.061333 0 0 0-0.533333 10.154667c0 53.013333 44.074667 96 98.453333 96 42.069333 0 79.082667-25.962667 92.864-64 4.650667-12.778667 17.045333-21.333333 30.933334-21.333333h14.976c13.909333 0 26.304 8.554667 30.933333 21.333333 13.802667 38.037333 50.794667 64 92.864 64s79.061333-25.962667 92.864-64c4.629333-12.778667 17.024-21.333333 30.933333-21.333333h14.954667c13.909333 0 26.304 8.554667 30.933333 21.333333 13.802667 38.037333 50.816 64 92.885334 64 54.378667 0 98.453333-42.986667 98.453333-96 0-5.056-0.405333-10.069333-1.194667-14.976l-0.277333-2.410667-12.8-178.816C856.533333 192.064 832.789333 170.666667 804.245333 170.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/guanli_mian.svg b/src/assets/icons/guanli_mian.svg
new file mode 100644
index 0000000..db46ff1
--- /dev/null
+++ b/src/assets/icons/guanli_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M871.296 832a85.333333 85.333333 0 0 1-85.333333 85.333333H238.037333a85.333333 85.333333 0 0 1-85.333333-85.333333V618.666667c29.930667 14.229333 59.882667 21.333333 89.813333 21.333333 29.952 0 74.88-14.229333 134.741334-42.666667 39.68 28.437333 84.608 42.666667 134.741333 42.666667 50.133333 0 95.061333-14.229333 134.741333-42.666667 60.501333 28.437333 105.408 42.666667 134.741334 42.666667 29.312 0 59.242667-7.104 89.813333-21.333333v213.333333zM811.413333 106.666667c58.858667 0 107.712 43.157333 112 98.901333l13.632 199.573333c1.066667 7.104 1.621333 14.293333 1.621334 21.525334 0 82.474667-70.378667 149.333333-157.184 149.333333-56.085333 0-105.28-27.882667-133.12-69.866667l-1.621334-2.538666-1.642666 2.56c-26.922667 40.597333-73.877333 68.032-127.701334 69.76L512 576c-56.064 0-105.28-27.882667-133.12-69.866667l-1.621333-2.538666-1.621334 2.56c-26.922667 40.597333-73.898667 68.032-127.701333 69.76l-5.418667 0.085333C155.733333 576 85.333333 509.141333 85.333333 426.666667c0-7.424 0.576-14.784 1.514667-20.48l13.738667-200.597334C104.874667 149.824 153.728 106.666667 212.586667 106.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/gukefapiao.svg b/src/assets/icons/gukefapiao.svg
new file mode 100644
index 0000000..341b686
--- /dev/null
+++ b/src/assets/icons/gukefapiao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M298.986667 512c65.450667 0 118.506667 54.208 118.506666 121.088 0 52.138667-32.277333 96.597333-77.525333 113.642667 32.448 2.709333 64.917333 8.746667 97.365333 17.984 44.16 12.586667 74.666667 53.674667 74.666667 100.48v25.045333c0 26.752-21.226667 48.426667-47.402667 48.426667H132.736C106.56 938.666667 85.333333 916.992 85.333333 890.24v-25.024c0-46.826667 30.506667-87.893333 74.666667-100.48 32.64-9.322667 65.258667-15.36 97.877333-18.090667C212.693333 729.6 180.48 685.226667 180.48 633.088 180.48 566.186667 233.536 512 298.986667 512zM810.666667 106.666667a85.333333 85.333333 0 0 1 85.333333 85.333333v725.333333a42.666667 42.666667 0 0 1-42.56-39.466666L853.333333 874.666667a42.666667 42.666667 0 0 0-85.226666-3.2L768 874.666667a42.666667 42.666667 0 0 1-85.226667 3.2L682.666667 874.666667a42.666667 42.666667 0 0 0-85.226667-3.2L597.333333 874.666667a42.666667 42.666667 0 0 1-42.666666 42.666666l-3.349334-0.128 0.917334-3.029333c1.194667-4.330667 1.962667-8.832 2.282666-13.482667L554.666667 896v-33.066667c0-61.866667-38.144-116.16-93.312-132.8a641.877333 641.877333 0 0 0-29.013334-8A160 160 0 0 0 213.333333 496.917333V192a85.333333 85.333333 0 0 1 85.333334-85.333333h512z m-53.333334 469.333333h-192a32 32 0 0 0-3.072 63.850667L565.333333 640h192a32 32 0 0 0 0-64z m0-234.666667h-405.333333a32 32 0 0 0-3.072 63.850667L352 405.333333h405.333333a32 32 0 0 0 0-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/haibaosheji.svg b/src/assets/icons/haibaosheji.svg
new file mode 100644
index 0000000..f875157
--- /dev/null
+++ b/src/assets/icons/haibaosheji.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M661.333333 128a64 64 0 0 1 64 64v640a64 64 0 0 1-64 64H362.666667a64 64 0 0 1-64-64V192a64 64 0 0 1 64-64h298.666666z m-448 106.666667a42.666667 42.666667 0 0 1 42.666667 42.666666v512a42.666667 42.666667 0 0 1-42.666667 42.666667H128V234.666667h85.333333z m682.666667 0v597.333333h-85.333333a42.666667 42.666667 0 0 1-42.666667-42.666667V277.333333a42.666667 42.666667 0 0 1 42.666667-42.666666h85.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/heshoujilu.svg b/src/assets/icons/heshoujilu.svg
new file mode 100644
index 0000000..cd25273
--- /dev/null
+++ b/src/assets/icons/heshoujilu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M693.333333 106.666667A32 32 0 0 1 725.333333 138.666667V149.333333h96a117.333333 117.333333 0 0 1 117.248 112.618667L938.666667 266.666667v512a117.333333 117.333333 0 0 1-112.618667 117.248L821.333333 896h-618.666666a117.333333 117.333333 0 0 1-117.248-112.618667L85.333333 778.666667v-512a117.333333 117.333333 0 0 1 112.618667-117.248L202.666667 149.333333H298.666667v-10.666666a32 32 0 0 1 64 0V149.333333h298.666666v-10.666666A32 32 0 0 1 693.333333 106.666667zM298.666667 213.333333H202.666667a53.333333 53.333333 0 0 0-53.226667 49.834667L149.333333 266.666667v512a53.333333 53.333333 0 0 0 49.834667 53.226666L202.666667 832h618.666666a53.333333 53.333333 0 0 0 53.226667-49.834667L874.666667 778.666667v-512a53.333333 53.333333 0 0 0-49.834667-53.226667L821.333333 213.333333H725.333333v10.666667a32 32 0 0 1-64 0V213.333333H362.666667v10.666667a32 32 0 0 1-64 0V213.333333z m138.666666 405.333334a32 32 0 0 1 0 64h-149.333333a32 32 0 0 1 0-64h149.333333z m277.333334-213.333334a32 32 0 0 1 0 64h-426.666667a32 32 0 0 1 0-64h426.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/heshoujilu1.svg b/src/assets/icons/heshoujilu1.svg
new file mode 100644
index 0000000..f8d1bd4
--- /dev/null
+++ b/src/assets/icons/heshoujilu1.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M693.333333 106.666667A32 32 0 0 1 725.333333 138.666667V170.666667h74.666667a117.333333 117.333333 0 0 1 117.248 112.618666L917.333333 288v448a117.333333 117.333333 0 0 1-112.618666 117.248L800 853.333333h-576a117.333333 117.333333 0 0 1-117.248-112.618666L106.666667 736v-448a117.333333 117.333333 0 0 1 112.618666-117.248L224 170.666667H298.666667V138.666667a32 32 0 0 1 64 0V170.666667h298.666666V138.666667A32 32 0 0 1 693.333333 106.666667zM451.776 350.122667a32 32 0 0 0-44.074667 0l-0.832 0.789333a29.952 29.952 0 0 0 0 43.456l40.085334 38.08h-32.213334a30.72 30.72 0 0 0 0 61.44h66.282667v40.96h-44.736a30.72 30.72 0 1 0 0 61.461333h44.736v49.92a32 32 0 0 0 32 32h0.704a32 32 0 0 0 32-32l-0.021333-49.92h44.757333a30.72 30.72 0 0 0 0-61.44l-44.757333-0.021333v-40.96h66.325333a30.72 30.72 0 0 0 0-61.44h-37.034667l40.106667-38.08 2.112-2.218667a29.973333 29.973333 0 0 0-2.133333-41.237333l-0.810667-0.789333-2.389333-2.048a32 32 0 0 0-41.685334 2.048l-59.221333 56.234666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/hexiao_order.svg b/src/assets/icons/hexiao_order.svg
new file mode 100644
index 0000000..f1c4034
--- /dev/null
+++ b/src/assets/icons/hexiao_order.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M688 312v-48c0-4.4-3.6-8-8-8H296c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h384c4.4 0 8-3.6 8-8zM296 400c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h184c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H296zM672 516c-119.3 0-216 96.7-216 216s96.7 216 216 216 216-96.7 216-216-96.7-216-216-216z m107.5 323.5C750.8 868.2 712.6 884 672 884s-78.8-15.8-107.5-44.5C535.8 810.8 520 772.6 520 732s15.8-78.8 44.5-107.5C593.2 595.8 631.4 580 672 580s78.8 15.8 107.5 44.5C808.2 653.2 824 691.4 824 732s-15.8 78.8-44.5 107.5z"  /><path d="M761 656h-44.3c-2.6 0-5 1.2-6.5 3.3l-63.5 87.8-23.1-31.9c-1.5-2.1-3.9-3.3-6.5-3.3H573c-6.5 0-10.3 7.4-6.5 12.7l73.8 102.1c3.2 4.4 9.7 4.4 12.9 0l114.2-158c3.9-5.3 0.1-12.7-6.4-12.7z"  /><path d="M440 852H208V148h560v344c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8V108c0-17.7-14.3-32-32-32H168c-17.7 0-32 14.3-32 32v784c0 17.7 14.3 32 32 32h272c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/hide-2.svg b/src/assets/icons/hide-2.svg
new file mode 100644
index 0000000..8c74146
--- /dev/null
+++ b/src/assets/icons/hide-2.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="1663309724004" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="117083" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M904.758613 172.088889L228.975502 847.872a34.133333 34.133333 0 0 1-48.298666 0 34.133333 34.133333 0 0 1 0-48.241778l675.783111-675.84a34.133333 34.133333 0 0 1 48.298666 0 34.133333 34.133333 0 0 1 0 48.298667z" p-id="117084"></path><path d="M512.054613 234.040889a494.933333 494.933333 0 0 0-299.918222 130.161778 823.352889 823.352889 0 0 0-132.949333 140.856889 886.272 886.272 0 0 0 130.389333 140.288A491.349333 491.349333 0 0 0 512.054613 780.174222a494.193778 494.193778 0 0 0 302.990223-139.605333 994.133333 994.133333 0 0 0 124.359111-131.811556 1035.377778 1035.377778 0 0 0-133.916445-141.596444A461.653333 461.653333 0 0 0 512.054613 234.040889m0-68.266667c282.737778 0 508.757333 339.854222 512 341.333334s-229.205333 341.333333-512 341.333333-507.847111-321.479111-512-341.333333 229.432889-341.333333 512-341.333334z" p-id="117085"></path><path d="M511.997724 677.774222a170.666667 170.666667 0 0 1-170.666666-170.666666 170.666667 170.666667 0 0 1 170.666666-170.666667 170.666667 170.666667 0 0 1 170.666667 170.666667 170.666667 170.666667 0 0 1-170.666667 170.666666z m0-273.066666a102.4 102.4 0 0 0-102.4 102.4 102.4 102.4 0 0 0 102.4 102.4 102.4 102.4 0 0 0 102.4-102.4 102.4 102.4 0 0 0-102.4-102.456889z" p-id="117086"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/hide.svg b/src/assets/icons/hide.svg
new file mode 100644
index 0000000..5cbbabd
--- /dev/null
+++ b/src/assets/icons/hide.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512.1 384c-69.7 0.5-126.6 57.4-127.1 127.1a128.3 128.3 0 0 0 7.6 44.4 4 4 0 0 0 6.6 1.4l49-49a3.7 3.7 0 0 0 1.2-2.4 63.9 63.9 0 0 1 57.1-57.1 3.7 3.7 0 0 0 2.4-1.2l49-49a4 4 0 0 0-1.4-6.6 128.3 128.3 0 0 0-44.4-7.6zM249.5 701.8a4 4 0 0 0 5.2-0.4l45.9-45.8a4 4 0 0 0-0.6-6.1q-17.1-12.2-34.4-26c-48.7-39.2-88.3-81.7-113.7-111.5 25.4-29.8 65-72.3 113.7-111.5 39.7-31.9 79.4-57 118.1-74.4 44.2-20 87.4-30.1 128.3-30.1 37.9 0 77.8 8.7 118.7 25.9a4 4 0 0 0 4.4-0.9l48.3-48.3a4 4 0 0 0-1-6.4C629.8 240.8 572.3 224 512 224c-222.2 0-407 228.3-444.8 278.4a15.9 15.9 0 0 0 0 19.2c21.2 28 88.3 111.8 182.3 180.2z m707.3-199.4c-21.4-28.3-89.7-113.5-185.1-182.2l133.5-133.5a4 4 0 0 0 0-5.6l-34-34a4 4 0 0 0-5.6 0L551.7 461 448.5 564.2l-32 31.9-78.1 78.2-52.4 52.4-138.9 138.9a4 4 0 0 0 0 5.6l34 34a4 4 0 0 0 5.6 0l149.9-150c54 26.9 113.2 44.8 175.4 44.8 222.2 0 406.9-228.3 444.8-278.4a15.9 15.9 0 0 0 0-19.2zM576.9 515a64.2 64.2 0 0 1-60.9 60.9z m181.5 108.5c-39.7 31.9-79.4 57-118.1 74.4-44.2 20-87.4 30.1-128.3 30.1-38.7 0-79.4-9.1-121.2-26.9l71.5-71.5a127.8 127.8 0 0 0 52.2 10.4c69.2-0.8 125.7-57.3 126.5-126.5a127.8 127.8 0 0 0-10.4-52.2l89.5-89.5q19 13.2 38.3 28.7c48.7 39.2 88.3 81.7 113.7 111.5-25.4 29.8-65 72.3-113.7 111.5z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/hongbao.svg b/src/assets/icons/hongbao.svg
new file mode 100644
index 0000000..9d331b5
--- /dev/null
+++ b/src/assets/icons/hongbao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M853.333333 338.944V853.333333a85.333333 85.333333 0 0 1-85.333333 85.333334H256a85.333333 85.333333 0 0 1-85.333333-85.333334V338.965333a510.229333 510.229333 0 0 0 257.216 123.498667 85.312 85.312 0 0 0 168.192 0 510.165333 510.165333 0 0 0 257.28-123.52zM768 85.333333a85.333333 85.333333 0 0 1 85.333333 85.333334l0.021334 108.778666a468.437333 468.437333 0 0 1-260.842667 140.330667 85.354667 85.354667 0 0 0-161.088 0 468.373333 468.373333 0 0 1-260.778667-140.330667L170.666667 170.666667a85.333333 85.333333 0 0 1 85.333333-85.333334h512z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/huiche.svg b/src/assets/icons/huiche.svg
new file mode 100644
index 0000000..5022718
--- /dev/null
+++ b/src/assets/icons/huiche.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M691.797333 347.136c-12.16 12.373333-12.16 32.426667 0 44.821333 12.16 12.373333 31.893333 12.373333 44.053334 0l151.04-115.584c12.16-12.373333 12.16-32.448 0-44.842666l-151.04-115.584a30.784 30.784 0 0 0-44.053334 0c-12.16 12.373333-12.16 32.448 0 44.842666l85.290667 61.589334H458.666667C276.053333 222.4 128 368.426667 128 548.544c0 177.92 144.426667 322.538667 323.925333 326.08L458.666667 874.666667h213.333333c17.664 0 32-14.122667 32-31.573334 0-16.384-12.693333-29.866667-28.928-31.402666l-3.072-0.149334h-213.333333c-147.285333 0-266.666667-117.76-266.666667-263.018666 0-143.082667 115.84-259.477333 260.096-262.933334l6.570667-0.064 318.442666-0.021333-85.333333 61.632z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/huiyuanyingxiao.svg b/src/assets/icons/huiyuanyingxiao.svg
new file mode 100644
index 0000000..ae06769
--- /dev/null
+++ b/src/assets/icons/huiyuanyingxiao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M664.32 149.333333a142.229333 142.229333 0 0 1 123.349333 71.402667L911.786667 436.906667a71.104 71.104 0 0 1-10.986667 85.290666l-337.066667 342.570667a71.104 71.104 0 0 1-102.4-1.024L122.581333 505.386667a71.104 71.104 0 0 1-9.130666-85.717334l122.389333-201.813333A142.229333 142.229333 0 0 1 357.418667 149.333333H664.32z m34.090667 295.232a32 32 0 0 0-45.248 0l-143.317334 143.296-143.296-143.296a32 32 0 1 0-45.248 45.248l165.930667 165.930667a32 32 0 0 0 45.248 0l165.930667-165.930667a32 32 0 0 0 0-45.248z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/huodongbaoming.svg b/src/assets/icons/huodongbaoming.svg
new file mode 100644
index 0000000..0c60672
--- /dev/null
+++ b/src/assets/icons/huodongbaoming.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M693.333333 128A32 32 0 0 1 725.333333 160V192h74.666667a117.333333 117.333333 0 0 1 117.248 112.618667L917.333333 309.333333v448a117.333333 117.333333 0 0 1-117.333333 117.333334h-576A117.333333 117.333333 0 0 1 106.666667 757.333333v-448A117.333333 117.333333 0 0 1 224 192H298.666667V160a32 32 0 0 1 64 0V192h298.666666V160A32 32 0 0 1 693.333333 128z m-362.666666 490.666667h-64a32 32 0 0 0 0 64h64a32 32 0 0 0 0-64z m213.333333 0h-64a32 32 0 0 0 0 64h64a32 32 0 0 0 0-64z m213.333333 0h-64a32 32 0 0 0 0 64h64a32 32 0 0 0 0-64z m-426.666666-192h-64a32 32 0 0 0 0 64h64a32 32 0 0 0 0-64z m213.333333 0h-64a32 32 0 0 0 0 64h64a32 32 0 0 0 0-64z m213.333333 0h-64a32 32 0 0 0 0 64h64a32 32 0 0 0 0-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/huodongguanli.svg b/src/assets/icons/huodongguanli.svg
new file mode 100644
index 0000000..def7109
--- /dev/null
+++ b/src/assets/icons/huodongguanli.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M777.6 536.384c19.690667 0 37.973333 9.770667 48.896 25.856l2.218667 3.541333 77.162666 133.184c9.813333 17.002667 10.496 37.653333 1.962667 55.125334l-1.962667 3.690666-77.162666 133.184a59.050667 59.050667 0 0 1-46.933334 29.269334l-4.181333 0.149333h-154.304a59.093333 59.093333 0 0 1-48.896-25.856l-2.218667-3.562667-77.162666-133.184a58.645333 58.645333 0 0 1-1.962667-55.125333l1.962667-3.690667 77.162666-133.184a59.050667 59.050667 0 0 1 46.912-29.248l4.202667-0.149333h154.304zM480 448v168.725333l-43.541333 75.242667a72.64 72.64 0 0 0 0 72.832l43.541333 75.221333V896H234.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V448h330.666667z m220.437333 216.384a64 64 0 1 0 0 128 64 64 0 0 0 0-128zM874.666667 448v88.938667l-5.717334-9.856A73.066667 73.066667 0 0 0 805.696 490.666667H595.2c-19.413333 0-37.717333 7.68-51.2 20.885333L544 448H874.666667zM283.818667 134.848l2.816 2.005333L422.186667 241.066667A106.581333 106.581333 0 0 1 512 192c37.696 0 70.826667 19.562667 89.813333 49.088l135.552-104.234667c19.306667-14.848 46.506667-10.581333 60.736 9.557334 1.984 2.773333 3.626667 5.802667 4.949334 9.002666L853.333333 277.333333h42.666667a42.666667 42.666667 0 0 1 42.666667 42.666667v42.666667a42.666667 42.666667 0 0 1-42.666667 42.666666H128a42.666667 42.666667 0 0 1-42.666667-42.666666v-42.666667a42.666667 42.666667 0 0 1 42.666667-42.666667h42.666667l50.282666-121.92c1.301333-3.2 2.965333-6.208 4.949334-9.002666 13.546667-19.178667 38.869333-23.978667 57.92-11.562667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/huodongzhongxin.svg b/src/assets/icons/huodongzhongxin.svg
new file mode 100644
index 0000000..f22bb26
--- /dev/null
+++ b/src/assets/icons/huodongzhongxin.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M874.666667 448v362.666667a85.333333 85.333333 0 0 1-85.333334 85.333333H544V448H874.666667z m-394.666667 0v448H234.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V448h330.666667zM283.818667 134.848l2.816 2.005333L422.186667 241.066667A106.581333 106.581333 0 0 1 512 192c37.696 0 70.826667 19.562667 89.813333 49.088l135.552-104.234667c19.306667-14.848 46.506667-10.581333 60.736 9.557334 1.984 2.773333 3.626667 5.802667 4.949334 9.002666L853.333333 277.333333h42.666667a42.666667 42.666667 0 0 1 42.666667 42.666667v42.666667a42.666667 42.666667 0 0 1-42.666667 42.666666H128a42.666667 42.666667 0 0 1-42.666667-42.666666v-42.666667a42.666667 42.666667 0 0 1 42.666667-42.666667h42.666667l50.282666-121.92c1.301333-3.2 2.965333-6.208 4.949334-9.002666 13.546667-19.178667 38.869333-23.978667 57.92-11.562667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/huojian.svg b/src/assets/icons/huojian.svg
new file mode 100644
index 0000000..f439dd8
--- /dev/null
+++ b/src/assets/icons/huojian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M361.365333 670.997333c49.578667 50.389333 55.317333 104.554667 0.362667 160.405334-34.048 34.581333-89.173333 55.36-165.034667 64.256-3.925333 0.469333-7.893333 0.448-11.84-0.021334-26.666667-3.242667-46.144-26.944-44.864-54.016l0.277334-3.541333 1.088-8.96c9.301333-72.32 29.44-125.269333 62.144-158.506667 54.954667-55.829333 108.266667-49.984 157.866666 0.384zM318.4 714.666667c-27.52-27.968-42.773333-29.653333-71.744-0.213334-18.730667 19.029333-32.874667 52.16-41.344 99.498667l-1.344 8.021333-1.557333 10.496 2.496-0.32c49.834667-7.36 85.504-20.629333 107.242666-38.698666l3.477334-3.072 2.944-2.837334c28.992-29.44 27.349333-44.906667-0.170667-72.874666z m514.133333-567.594667a72.042667 72.042667 0 0 1 44.394667 44.864c33.429333 97.664 22.805333 196.608-31.082667 294.698667-22.208 40.405333-50.624 78.656-85.205333 114.730666l-9.578667 9.792-9.066666 8.874667-0.256 2.752c-6.293333 58.752-50.858667 136.448-132.970667 236.906667l-7.125333 8.682666-13.12 15.68c-14.848 17.621333-42.496 12.714667-51.157334-8.106666l-1.024-2.794667-45.909333-146.517333-4.16-2.88a728.938667 728.938667 0 0 1-73.557333-59.989334l-11.413334-10.88-11.178666-11.093333a736.405333 736.405333 0 0 1-88.746667-109.568l-2.538667-3.946667L149.333333 479.936c-21.034667-6.826667-27.818667-32.832-14.464-49.173333l1.770667-2.005334 1.92-1.792c122.965333-107.434667 213.696-160.704 278.677333-156.266666l4.181334 0.362666 2.432 0.298667 5.482666-5.546667c29.482667-29.312 60.352-54.250667 92.629334-74.752l10.794666-6.677333 9.92-5.802667c90.069333-51.072 181.504-63.637333 272.896-36.906666l8.576 2.602666 8.384 2.794667z m-13.866666 63.232a10.304 10.304 0 0 0-3.690667-3.84l-1.536-0.725333-7.68-2.56c-77.461333-24.725333-154.56-15.146667-233.216 29.461333-40.938667 23.232-79.786667 54.549333-116.544 94.08a30.037333 30.037333 0 0 1-29.653333 8.661333l-5.098667-1.642666c-31.573333-9.28-96.362667 21.397333-188.864 95.018666l-11.690667 9.386667 106.709334 34.56c4.842667 1.557333 9.173333 4.309333 12.672 7.978667l2.005333 2.304 1.770667 2.496a677.376 677.376 0 0 0 89.237333 112.64 666.581333 666.581333 0 0 0 100.032 83.413333c4.928 3.349333 8.768 8.085333 11.093333 13.589333l1.024 2.816 32.213334 102.677334 6.186666-7.872c62.890667-80.874667 95.296-141.781333 97.813334-179.498667l0.149333-3.456v-2.986667a31.04 31.04 0 0 1 9.856-23.68c42.837333-39.68 76.522667-81.941333 101.184-126.826666 44.181333-80.426667 53.738667-158.592 29.333333-236.48l-2.56-7.786667-0.746666-1.706667zM690.773333 333.226667c45.909333 45.930667 46.08 120.213333 0.341334 165.930666-45.717333 45.738667-120 45.568-165.930667-0.341333-45.909333-45.930667-46.08-120.213333-0.341333-165.930667 45.717333-45.738667 120-45.568 165.930666 0.341334z m-45.162666 45.162666a53.333333 53.333333 0 0 0-75.434667-0.170666 53.333333 53.333333 0 0 0 0.170667 75.434666 53.333333 53.333333 0 0 0 75.434666 0.170667 53.333333 53.333333 0 0 0-0.170666-75.434667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/huojian_mian.svg b/src/assets/icons/huojian_mian.svg
new file mode 100644
index 0000000..812d3be
--- /dev/null
+++ b/src/assets/icons/huojian_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M361.365333 670.997333c49.578667 50.389333 55.317333 104.554667 0.362667 160.405334-34.048 34.581333-89.173333 55.36-165.034667 64.256-3.925333 0.469333-7.893333 0.448-11.84-0.021334-26.666667-3.242667-46.144-26.944-44.864-54.016l0.277334-3.541333 1.088-8.96c9.301333-72.32 29.44-125.269333 62.144-158.506667 54.954667-55.829333 108.266667-49.984 157.866666 0.384zM815.573333 141.653333l8.576 2.624 8.384 2.794667a72.042667 72.042667 0 0 1 44.394667 44.864c33.429333 97.664 22.805333 196.608-31.082667 294.698667-22.208 40.405333-50.624 78.656-85.205333 114.730666l-9.578667 9.792-9.066666 8.874667-0.256 2.752c-6.293333 58.752-50.858667 136.448-132.970667 236.906667l-7.125333 8.682666-13.12 15.68c-14.848 17.621333-42.496 12.714667-51.157334-8.106666l-1.024-2.794667-45.909333-146.517333-4.16-2.88a728.938667 728.938667 0 0 1-73.557333-59.989334l-11.413334-10.88-11.178666-11.093333a736.405333 736.405333 0 0 1-88.746667-109.568l-2.538667-3.946667L149.333333 479.936c-21.034667-6.826667-27.818667-32.832-14.464-49.173333l1.770667-2.005334 1.92-1.792c122.965333-107.434667 213.696-160.704 278.677333-156.266666l4.181334 0.362666 2.432 0.298667 5.482666-5.546667c29.482667-29.312 60.352-54.250667 92.629334-74.752l10.794666-6.677333 9.92-5.802667c90.069333-51.072 181.504-63.637333 272.896-36.906666z m-275.605333 206.314667c-37.397333 37.418667-37.269333 98.197333 0.298667 135.765333 37.568 37.568 98.346667 37.696 135.765333 0.298667 37.397333-37.418667 37.269333-98.197333-0.298667-135.765333-37.568-37.568-98.346667-37.696-135.765333-0.298667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/huolala.svg b/src/assets/icons/huolala.svg
new file mode 100644
index 0000000..a42ade7
--- /dev/null
+++ b/src/assets/icons/huolala.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M725.333333 128a170.666667 170.666667 0 0 1 170.666667 170.666667v426.666666a170.666667 170.666667 0 0 1-170.666667 170.666667H298.666667a170.666667 170.666667 0 0 1-170.666667-170.666667V298.666667a170.666667 170.666667 0 0 1 170.666667-170.666667h426.666666z m-366.613333 149.845333s-16.725333-5.546667-21.653333 20.138667c-1.92 9.962667-4.565333 28.309333-7.082667 47.061333l-1.258667 9.386667c-2.048 15.530667-3.925333 30.442667-5.12 40.106667l-0.832 6.826666-0.32 2.56-0.170666 1.514667H277.333333v70.08l32.853334 5.76s-2.496 27.797333-2.496 51.946667v225.045333s0.981333 9.728 11.818666 9.728h37.12s10.624-0.576 10.624-9.92v-11.008h289.514667v11.008c0 9.344 10.602667 9.92 10.602667 9.92h37.141333a11.157333 11.157333 0 0 0 11.797333-9.728V533.226667c0-24.149333-2.517333-51.968-2.517333-51.968L746.666667 475.52h-0.042667v-70.058667h-44.906667l-0.213333-1.514666-0.512-4.266667-0.64-5.12a5114.24 5114.24 0 0 0-5.12-40.106667l-1.237333-9.386666c-2.538667-18.773333-5.184-37.12-7.082667-47.061334-4.949333-25.706667-21.674667-20.138667-21.674667-20.138666z m219.264 408.789334v39.296h-129.152v-39.296h129.152z m19.690667-103.168v18.218666h-172.458667v-18.218666h172.458667z m-207.146667-38.4c7.210667 0 7.189333 7.253333 7.189333 7.253333v35.904c0 7.744-8.277333 7.744-8.277333 7.744h-50.752c-9.685333 0-9.685333-7.893333-9.685333-7.893333v-35.477334c0-7.573333 9.685333-7.146667 9.685333-7.146666h1.386667c7.616-0.085333 44.053333-0.362667 50.474666-0.362667z m300.48 0c7.168 0 7.168 7.253333 7.168 7.253333v35.904c0 7.744-8.256 7.744-8.256 7.744h-50.773333c-9.706667 0-9.706667-7.893333-9.706667-7.893333v-35.477334c0-7.573333 9.706667-7.146667 9.706667-7.146666h1.386666c7.594667-0.085333 44.032-0.362667 50.474667-0.362667z m-93.333333 7.253333v18.218667h-172.458667v-18.218667h172.458667zM667.306667 296.533333l18.56 160.384H337.856l9.28-160.405333H667.306667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/iOSfanhui.svg b/src/assets/icons/iOSfanhui.svg
new file mode 100644
index 0000000..8aeefbb
--- /dev/null
+++ b/src/assets/icons/iOSfanhui.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M652.949333 865.706667c11.690667 11.946667 30.613333 11.946667 42.282667 0a31.146667 31.146667 0 0 0 0-43.306667l-295.765333-302.933333a10.666667 10.666667 0 0 1 0-14.933334l295.765333-302.933333a31.146667 31.146667 0 0 0 0-43.306667 29.397333 29.397333 0 0 0-42.282667 0L328.768 490.346667a31.146667 31.146667 0 0 0 0 43.306666L652.949333 865.706667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jia.svg b/src/assets/icons/jia.svg
new file mode 100644
index 0000000..18fbd45
--- /dev/null
+++ b/src/assets/icons/jia.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m0 128a32 32 0 0 1 32 32v170.645334l170.666667 0.021333a32 32 0 0 1 0 64l-170.688-0.021333 0.021333 170.688a32 32 0 0 1-64 0l-0.021333-170.688-170.645334 0.021333a32 32 0 0 1 0-64l170.666667-0.021333V309.333333A32 32 0 0 1 512 277.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jia_mian.svg b/src/assets/icons/jia_mian.svg
new file mode 100644
index 0000000..5899c91
--- /dev/null
+++ b/src/assets/icons/jia_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 192a32 32 0 0 0-32 32v170.645334l-170.666667 0.021333a32 32 0 0 0 0 64l170.645334-0.021333 0.021333 170.688a32 32 0 0 0 64 0l-0.021333-170.688 170.688 0.021333a32 32 0 0 0 0-64l-170.666667-0.021333V309.333333A32 32 0 0 0 512 277.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jian.svg b/src/assets/icons/jian.svg
new file mode 100644
index 0000000..295037f
--- /dev/null
+++ b/src/assets/icons/jian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m202.666667 330.666667a32 32 0 0 1 0 64h-405.333334a32 32 0 0 1 0-64h405.333334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jian_mian.svg b/src/assets/icons/jian_mian.svg
new file mode 100644
index 0000000..e9dfa91
--- /dev/null
+++ b/src/assets/icons/jian_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m202.666667 394.666667h-405.333334a32 32 0 0 0 0 64h405.333334a32 32 0 0 0 0-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jianpan.svg b/src/assets/icons/jianpan.svg
new file mode 100644
index 0000000..5a7dcb9
--- /dev/null
+++ b/src/assets/icons/jianpan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m160 490.666667a32 32 0 0 1 0 64h-320a32 32 0 0 1 0-64h320zM298.666667 490.666667a21.333333 21.333333 0 0 1 21.333333 21.333333v21.333333a21.333333 21.333333 0 0 1-21.333333 21.333334h-21.333334a21.333333 21.333333 0 0 1-21.333333-21.333334v-21.333333a21.333333 21.333333 0 0 1 21.333333-21.333333h21.333334z m149.333333 0a21.333333 21.333333 0 0 1 21.333333 21.333333v21.333333a21.333333 21.333333 0 0 1-21.333333 21.333334h-21.333333a21.333333 21.333333 0 0 1-21.333334-21.333334v-21.333333a21.333333 21.333333 0 0 1 21.333334-21.333333h21.333333z m149.333333 0a21.333333 21.333333 0 0 1 21.333334 21.333333v21.333333a21.333333 21.333333 0 0 1-21.333334 21.333334h-21.333333a21.333333 21.333333 0 0 1-21.333333-21.333334v-21.333333a21.333333 21.333333 0 0 1 21.333333-21.333333h21.333333z m149.333334 0a21.333333 21.333333 0 0 1 21.333333 21.333333v21.333333a21.333333 21.333333 0 0 1-21.333333 21.333334h-21.333334a21.333333 21.333333 0 0 1-21.333333-21.333334v-21.333333a21.333333 21.333333 0 0 1 21.333333-21.333333h21.333334z m-448-149.333334a21.333333 21.333333 0 0 1 21.333333 21.333334v21.333333a21.333333 21.333333 0 0 1-21.333333 21.333333h-21.333334a21.333333 21.333333 0 0 1-21.333333-21.333333v-21.333333a21.333333 21.333333 0 0 1 21.333333-21.333334h21.333334z m149.333333 0a21.333333 21.333333 0 0 1 21.333333 21.333334v21.333333a21.333333 21.333333 0 0 1-21.333333 21.333333h-21.333333a21.333333 21.333333 0 0 1-21.333334-21.333333v-21.333333a21.333333 21.333333 0 0 1 21.333334-21.333334h21.333333z m149.333333 0a21.333333 21.333333 0 0 1 21.333334 21.333334v21.333333a21.333333 21.333333 0 0 1-21.333334 21.333333h-21.333333a21.333333 21.333333 0 0 1-21.333333-21.333333v-21.333333a21.333333 21.333333 0 0 1 21.333333-21.333334h21.333333z m149.333334 0a21.333333 21.333333 0 0 1 21.333333 21.333334v21.333333a21.333333 21.333333 0 0 1-21.333333 21.333333h-21.333334a21.333333 21.333333 0 0 1-21.333333-21.333333v-21.333333a21.333333 21.333333 0 0 1 21.333333-21.333334h21.333334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jianpanshanchu.svg b/src/assets/icons/jianpanshanchu.svg
new file mode 100644
index 0000000..a5a5de1
--- /dev/null
+++ b/src/assets/icons/jianpanshanchu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M820.522667 234.666667C885.76 234.666667 938.666667 289.28 938.666667 356.693333v310.613334c0 67.413333-52.906667 122.026667-118.144 122.026666H336.170667c-36.672 0-71.253333-17.578667-93.610667-47.573333l-146.069333-195.925333a56.917333 56.917333 0 0 1 0-67.669334l146.069333-195.925333c22.357333-29.994667 56.96-47.573333 93.610667-47.573333z m0.149333 66.56H333.909333c-16.746667 0-32.554667 7.978667-42.773333 21.632L149.333333 511.978667l141.802667 189.162666c9.429333 12.586667 23.616 20.373333 38.933333 21.482667l3.84 0.149333H820.693333c29.824 0 53.994667-24.832 53.994667-55.466666V356.693333c0-30.634667-24.170667-55.466667-53.994667-55.466666z m-125.653333 91.776a30.72 30.72 0 0 1 0 43.456l-75.562667 75.52 75.541333 75.562666a30.72 30.72 0 1 1-43.456 43.456l-75.52-75.562666-75.562666 75.562666a30.72 30.72 0 1 1-43.456-43.456L532.565333 512l-75.562666-75.52a30.72 30.72 0 1 1 43.456-43.456L576 468.522667l75.52-75.52a30.72 30.72 0 0 1 43.456 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jianshao.svg b/src/assets/icons/jianshao.svg
new file mode 100644
index 0000000..0a4d919
--- /dev/null
+++ b/src/assets/icons/jianshao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M170.666667 480m32 0l618.666666 0q32 0 32 32l0 0q0 32-32 32l-618.666666 0q-32 0-32-32l0 0q0-32 32-32Z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jiaopeiwangputong.svg b/src/assets/icons/jiaopeiwangputong.svg
new file mode 100644
index 0000000..ec73071
--- /dev/null
+++ b/src/assets/icons/jiaopeiwangputong.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M298.666667 106.666667v174.229333a10.666667 10.666667 0 0 0 13.909333 10.154667l1.770667-0.746667 38.272-20.416a21.333333 21.333333 0 0 1 17.685333-1.088l2.410667 1.088 38.272 20.416a10.666667 10.666667 0 0 0 15.509333-7.488l0.170667-1.92V106.666667h384a42.666667 42.666667 0 0 1 42.666666 42.666666v512H320a106.666667 106.666667 0 0 0-4.629333 213.226667L320 874.666667h533.333333a42.666667 42.666667 0 0 1-42.666666 42.666666H256a85.333333 85.333333 0 0 1-85.333333-85.333333V192a85.333333 85.333333 0 0 1 85.333333-85.333333h42.666667z m554.666666 597.333333v128H320a64 64 0 0 1 0-128h533.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jiaoyi.svg b/src/assets/icons/jiaoyi.svg
new file mode 100644
index 0000000..1396bac
--- /dev/null
+++ b/src/assets/icons/jiaoyi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M725.333333 106.666667a170.666667 170.666667 0 0 1 170.666667 170.666666v469.333334a170.666667 170.666667 0 0 1-170.666667 170.666666H298.666667a170.666667 170.666667 0 0 1-170.666667-170.666666V277.333333a170.666667 170.666667 0 0 1 170.666667-170.666666h426.666666z m-29.333333 445.973333H328.064l-3.349333 0.170667c-23.893333 2.496-35.072 31.658667-17.365334 49.002666l117.696 115.114667 2.773334 2.389333c11.52 8.768 28.16 7.936 38.698666-2.453333l2.432-2.709333a28.373333 28.373333 0 0 0-2.496-37.973334l-67.413333-65.984h296.96l3.413333-0.192A28.992 28.992 0 0 0 725.333333 581.418667c0-15.893333-13.141333-28.8-29.333333-28.8z m-99.797333-247.957333a29.738667 29.738667 0 0 0-38.72 2.453333l-2.432 2.709333a28.373333 28.373333 0 0 0 2.496 37.973334l67.413333 65.984h-296.96l-3.413333 0.192A28.992 28.992 0 0 0 298.666667 442.581333c0 15.893333 13.141333 28.8 29.333333 28.8h367.936l3.349333-0.192c23.893333-2.496 35.072-31.658667 17.365334-49.002666l-117.696-115.114667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jiedan.svg b/src/assets/icons/jiedan.svg
new file mode 100644
index 0000000..fcbe7a1
--- /dev/null
+++ b/src/assets/icons/jiedan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M725.333333 512c117.824 0 213.333333 95.509333 213.333334 213.333333s-95.509333 213.333333-213.333334 213.333334-213.333333-95.509333-213.333333-213.333334 95.509333-213.333333 213.333333-213.333333z m42.666667-405.333333a85.333333 85.333333 0 0 1 85.333333 85.333333l0.021334 311.594667A254.826667 254.826667 0 0 0 725.333333 469.333333c-141.376 0-256 114.624-256 256 0 76.458667 33.514667 145.109333 86.677334 192H256a85.333333 85.333333 0 0 1-85.333333-85.333333V192a85.333333 85.333333 0 0 1 85.333333-85.333333h512z m54.208 538.709333l-2.24 1.92-117.184 112.789333a17.344 17.344 0 0 1-22.208 1.536l-1.92-1.621333-47.957333-46.762667a26.410667 26.410667 0 0 0-36.48 0c-9.386667 9.088-10.026667 23.466667-1.877334 33.28l1.877334 2.005334 78.229333 76.16a26.453333 26.453333 0 0 0 34.218667 1.941333l2.261333-1.92 147.52-142.08a24.384 24.384 0 0 0 0-35.306667 26.453333 26.453333 0 0 0-34.24-1.941333zM650.666667 298.666667h-320a32 32 0 0 0-3.072 63.850666L330.666667 362.666667h320a32 32 0 0 0 0-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jiekuan.svg b/src/assets/icons/jiekuan.svg
new file mode 100644
index 0000000..4b7377f
--- /dev/null
+++ b/src/assets/icons/jiekuan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M938.666667 426.666667v320a85.333333 85.333333 0 0 1-85.333334 85.333333H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V426.666667h853.333334z m-181.333334 97.450666a10.666667 10.666667 0 0 0-10.666666 10.666667v41.813333c-113.813333 6.826667-170.709333 70.613333-170.666667 191.402667 13.653333-65.877333 70.549333-101.248 170.666667-106.112v40.661333a10.666667 10.666667 0 0 0 17.493333 8.213334l90.837333-75.712a21.333333 21.333333 0 0 0 0-32.768l-90.837333-75.712a10.666667 10.666667 0 0 0-6.826667-2.453334zM853.333333 192a85.333333 85.333333 0 0 1 85.333334 85.333333v85.333334H85.333333v-85.333334a85.333333 85.333333 0 0 1 85.333334-85.333333h682.666666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jingshi.svg b/src/assets/icons/jingshi.svg
new file mode 100644
index 0000000..3cecfc7
--- /dev/null
+++ b/src/assets/icons/jingshi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m0 512a42.666667 42.666667 0 1 1 0 85.333334 42.666667 42.666667 0 0 1 0-85.333334z m0-362.666666a32 32 0 0 1 32 32v256a32 32 0 0 1-64 0v-256A32 32 0 0 1 512 298.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jingshi_mian.svg b/src/assets/icons/jingshi_mian.svg
new file mode 100644
index 0000000..fe636ee
--- /dev/null
+++ b/src/assets/icons/jingshi_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 576a42.666667 42.666667 0 1 0 0 85.333334 42.666667 42.666667 0 0 0 0-85.333334z m0-362.666666a32 32 0 0 0-32 32v256a32 32 0 0 0 64 0v-256A32 32 0 0 0 512 298.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jingshi_mian1.svg b/src/assets/icons/jingshi_mian1.svg
new file mode 100644
index 0000000..fe636ee
--- /dev/null
+++ b/src/assets/icons/jingshi_mian1.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 576a42.666667 42.666667 0 1 0 0 85.333334 42.666667 42.666667 0 0 0 0-85.333334z m0-362.666666a32 32 0 0 0-32 32v256a32 32 0 0 0 64 0v-256A32 32 0 0 0 512 298.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jingyin.svg b/src/assets/icons/jingyin.svg
new file mode 100644
index 0000000..753f254
--- /dev/null
+++ b/src/assets/icons/jingyin.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M467.626667 199.253333a116.330667 116.330667 0 0 1 165.461333 12.906667A119.68 119.68 0 0 1 661.333333 289.472V734.506667C661.333333 800.149333 608.810667 853.333333 544 853.333333a116.48 116.48 0 0 1-76.373333-28.586666l-148.8-129.152H224c-63.210667 0-114.773333-50.624-117.248-114.026667L106.666667 576.789333v-129.578666c0-65.621333 52.522667-118.805333 117.333333-118.805334h94.805333z m116.864 55.061334a52.885333 52.885333 0 0 0-75.2-5.845334l-166.784 144.746667H224c-29.44 0-53.333333 24.170667-53.333333 53.973333v129.6c0 29.824 23.893333 54.016 53.333333 54.016h118.506667l166.784 144.725334c9.664 8.384 21.973333 13.013333 34.709333 13.013333 29.44 0 53.333333-24.192 53.333333-54.016V289.493333a54.4 54.4 0 0 0-12.842666-35.157333z m345.472 159.722666a29.696 29.696 0 0 1 0 41.984L873.984 512l55.978667 55.957333a29.696 29.696 0 1 1-41.984 41.984L832 554.026667l-55.957333 55.957333a29.696 29.696 0 1 1-41.984-41.984l55.957333-55.957333-55.957333-56a29.696 29.696 0 1 1 41.984-41.984l55.957333 55.978666 56-55.978666a29.696 29.696 0 0 1 41.984 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jingyin_mian.svg b/src/assets/icons/jingyin_mian.svg
new file mode 100644
index 0000000..ce56e68
--- /dev/null
+++ b/src/assets/icons/jingyin_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M467.626667 199.253333a116.330667 116.330667 0 0 1 165.461333 12.906667A119.68 119.68 0 0 1 661.333333 289.472V734.506667C661.333333 800.149333 608.810667 853.333333 544 853.333333a116.48 116.48 0 0 1-76.373333-28.586666l-148.8-129.152H224c-63.210667 0-114.773333-50.624-117.248-114.026667L106.666667 576.789333v-129.578666c0-65.621333 52.522667-118.805333 117.333333-118.805334h94.805333z m462.336 214.784a29.696 29.696 0 0 1 0 41.984L873.984 512l55.978667 55.957333a29.696 29.696 0 1 1-41.984 41.984L832 554.026667l-55.957333 55.957333a29.696 29.696 0 1 1-41.984-41.984l55.957333-55.957333-55.957333-56a29.696 29.696 0 1 1 41.984-41.984l55.957333 55.978666 56-55.978666a29.696 29.696 0 0 1 41.984 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jingying.svg b/src/assets/icons/jingying.svg
new file mode 100644
index 0000000..5630813
--- /dev/null
+++ b/src/assets/icons/jingying.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M736 853.333333a32 32 0 0 1 0 64h-448a32 32 0 0 1 0-64h448z m106.666667-746.666666A96 96 0 0 1 938.666667 202.666667v469.333333a96 96 0 0 1-96 96h-661.333334A96 96 0 0 1 85.333333 672v-469.333333A96 96 0 0 1 181.333333 106.666667z m0 64h-661.333334A32 32 0 0 0 149.333333 202.666667v469.333333A32 32 0 0 0 181.333333 704h661.333334a32 32 0 0 0 32-32v-469.333333A32 32 0 0 0 842.666667 170.666667z m-84.053334 179.968a31.786667 31.786667 0 0 1 2.24 42.666666l-2.197333 2.410667-149.888 149.589333c-11.754667 11.733333-30.378667 12.437333-42.965333 2.133334l-2.410667-2.197334-126.464-126.848-126.293333 126.037334a32.106667 32.106667 0 0 1-42.794667 2.24l-2.453333-2.197334a31.786667 31.786667 0 0 1-2.24-42.645333l2.197333-2.410667 149.013333-148.714666a32.106667 32.106667 0 0 1 42.944-2.133334l2.432 2.197334 126.442667 126.826666 127.168-126.890666a32.085333 32.085333 0 0 1 45.269333-0.064z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jingying_mian.svg b/src/assets/icons/jingying_mian.svg
new file mode 100644
index 0000000..4e7ca35
--- /dev/null
+++ b/src/assets/icons/jingying_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M736 853.333333a32 32 0 0 1 0 64h-448a32 32 0 0 1 0-64h448z m106.666667-746.666666A96 96 0 0 1 938.666667 202.666667v469.333333a96 96 0 0 1-96 96h-661.333334A96 96 0 0 1 85.333333 672v-469.333333A96 96 0 0 1 181.333333 106.666667z m-84.053334 243.968a32.085333 32.085333 0 0 0-45.269333 0.064l-127.168 126.890666-126.442667-126.826666-2.432-2.197334a32.106667 32.106667 0 0 0-42.944 2.133334l-149.013333 148.693333-2.197333 2.432a31.786667 31.786667 0 0 0 2.24 42.666667l2.453333 2.176c12.586667 10.197333 31.104 9.429333 42.816-2.24l126.272-126.037334 126.464 126.848 2.410667 2.197334c12.586667 10.304 31.210667 9.6 42.965333-2.133334l149.888-149.589333 2.197333-2.432a31.786667 31.786667 0 0 0-2.24-42.645333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jingyinggonglve.svg b/src/assets/icons/jingyinggonglve.svg
new file mode 100644
index 0000000..0cd3755
--- /dev/null
+++ b/src/assets/icons/jingyinggonglve.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M618.666667 259.562667a10.666667 10.666667 0 0 0 15.68 9.386666l38.272-20.394666a21.333333 21.333333 0 0 1 20.096 0l38.272 20.416a10.666667 10.666667 0 0 0 15.68-9.408V106.666667h42.666666a85.333333 85.333333 0 0 1 85.333334 85.333333v640a85.333333 85.333333 0 0 1-85.333334 85.333333H234.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V192a85.333333 85.333333 0 0 1 85.333334-85.333333h384zM277.333333 106.666667h42.666667v810.666666h-42.666667V106.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jingzhunyingxiao.svg b/src/assets/icons/jingzhunyingxiao.svg
new file mode 100644
index 0000000..781b0bb
--- /dev/null
+++ b/src/assets/icons/jingzhunyingxiao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 106.666667c60.010667 0 116.970667 13.034667 168.213333 36.437333L615.893333 204.181333a63.232 63.232 0 0 0-16.533333 60.48l1.173333 4.010667 9.685334 30.144A233.792 233.792 0 0 0 512 277.333333c-129.6 0-234.666667 105.066667-234.666667 234.666667s105.066667 234.666667 234.666667 234.666667 234.666667-105.066667 234.666667-234.666667c0-28.8-5.184-56.405333-14.698667-81.92l54.528 15.466667c21.525333 7.189333 41.813333-7.573333 58.282667-23.552l2.709333-2.688 45.226667-46.784A404.544 404.544 0 0 1 917.333333 512c0 223.850667-181.482667 405.333333-405.333333 405.333333S106.666667 735.850667 106.666667 512 288.149333 106.666667 512 106.666667z m0 234.666666c27.306667 0 53.098667 6.4 75.989333 17.813334l-104.597333 109.781333c-18.517333 18.517333-12.714667 60.650667 10.709333 82.88 22.485333 21.333333 69.717333 19.285333 89.834667 2.688l2.368-2.133333 89.770667-87.509334A170.666667 170.666667 0 1 1 512 341.333333zM800.554667 112.746667a20.757333 20.757333 0 0 1 5.013333 8.128l29.653333 89.28 89.216 29.610666a20.757333 20.757333 0 0 1 8.149334 34.346667l-120 120.021333a41.493333 41.493333 0 0 1-42.496 10.026667l-63.616-21.290667-141.354667 141.354667a31.125333 31.125333 0 1 1-44.010667-44.010667l141.056-141.056-21.12-64a41.493333 41.493333 0 0 1 10.090667-42.325333l120.085333-120.106667a20.757333 20.757333 0 0 1 29.333334 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jinhuo.svg b/src/assets/icons/jinhuo.svg
new file mode 100644
index 0000000..c5d9214
--- /dev/null
+++ b/src/assets/icons/jinhuo.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M896 384v426.666667a85.333333 85.333333 0 0 1-85.333333 85.333333H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333333V384h768zM490.666667 128v213.333333H128l103.146667-171.904A85.333333 85.333333 0 0 1 304.32 128H490.666667z m229.013333 0a85.333333 85.333333 0 0 1 73.173333 41.429333L896 341.333333H533.333333V128z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/kaitongwaimai.svg b/src/assets/icons/kaitongwaimai.svg
new file mode 100644
index 0000000..a6daad9
--- /dev/null
+++ b/src/assets/icons/kaitongwaimai.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M405.333333 704a106.666667 106.666667 0 0 1 0 213.333333h-170.666666a106.666667 106.666667 0 0 1 0-213.333333h170.666666z m114.901334-597.226667h-13.866667l13.909333 0.106667c182.357333 3.754667 339.754667 129.024 384.725334 306.133333H542.293333a127.658667 127.658667 0 0 0-90.538666 37.205334 128.213333 128.213333 0 0 0-37.717334 90.453333 122.453333 122.453333 0 0 0 91.413334 118.250667L917.333333 773.76v0.938667a121.386667 121.386667 0 0 1-47.317333 96.213333 120.874667 120.874667 0 0 1-104.96 20.992l-212.373333-56.768a149.333333 149.333333 0 0 0-142.208-173.717333L405.333333 661.333333h-170.666666a148.650667 148.650667 0 0 0-86.293334 27.456 138.624 138.624 0 0 1-12.288-23.701333A404.266667 404.266667 0 0 1 106.666667 512.341333 405.781333 405.781333 0 0 1 228.266667 222.357333a404.053333 404.053333 0 0 1 291.989333-115.562666zM405.333333 746.666667a64 64 0 1 0 0 128 64 64 0 0 0 0-128z m509.098667-282.752c1.92 16.128 2.901333 32.490667 2.901333 49.066666v207.786667l-398.613333-111.210667a71.509333 71.509333 0 0 1-53.333333-69.056 76.970667 76.970667 0 0 1 76.906666-76.586666h372.138667z m-387.968 52.928a29.077333 29.077333 0 0 0 28.970667 50.410666 29.141333 29.141333 0 0 0 0-50.474666 28.949333 28.949333 0 0 0-28.970667 0.064z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/kanjia.svg b/src/assets/icons/kanjia.svg
new file mode 100644
index 0000000..9f6840b
--- /dev/null
+++ b/src/assets/icons/kanjia.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M761.2 639.7c-10.6 0-21.1-4-29.2-12.1-16.1-16.1-16.1-42.3 0-58.4l97.5-97.5c5.6-5.6 7.1-13.9 7.3-19.9l8.6-242.5c0.1-3.9-2.8-11.2-9.5-17.9-6.7-6.7-14.7-9.5-17.9-9.5l-242.5 8.6c-6 0.2-14.2 1.7-19.9 7.3l-102 102.1c-16.1 16.1-42.3 16.1-58.4 0s-16.1-42.3 0-58.4l102.1-102.1c19.2-19.2 46-30.4 75.3-31.4l242.5-8.6c27.9-1 56.9 11.2 79.2 33.6 22.4 22.4 34.6 51.2 33.6 79.3l-8.6 242.5c-1.1 29.4-12.2 56.1-31.4 75.3l-97.5 97.5c-8.1 8.1-18.7 12.1-29.2 12.1zM444.4 925.3c-40.6 0-84.7-18.5-120.4-54.3L156.4 703.4C93.9 640.9 84 552.8 133.8 502.9l88.3-88.3c16.1-16.1 42.3-16.1 58.4 0s16.1 42.3 0 58.4l-88.3 88.3c-14.4 14.4-7.8 53.3 22.6 83.7l167.6 167.6c30.4 30.4 69.3 37 83.7 22.6l83.7-83.7c16.1-16.1 42.3-16.1 58.4 0s16.1 42.3 0 58.4l-83.7 83.7c-21.4 21.3-49.8 31.7-80.1 31.7z"  /><path d="M705.8 326.3m-45.8 0a45.8 45.8 0 1 0 91.6 0 45.8 45.8 0 1 0-91.6 0Z"  /><path d="M829.9 885.7c-10.6 0-21.1-4-29.2-12.1l-642-642c-16.1-16.1-16.1-42.3 0-58.4s42.3-16.1 58.4 0l642 642c16.1 16.1 16.1 42.3 0 58.4-8.1 8.1-18.6 12.1-29.2 12.1z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/kefu.svg b/src/assets/icons/kefu.svg
new file mode 100644
index 0000000..f32cacd
--- /dev/null
+++ b/src/assets/icons/kefu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M511.914667 106.666667c202.325333 0 369.088 165.376 383.445333 375.850666l0.469333 8.746667c0.085333 2.901333 0.128 8.533333 0.149334 17.066667l0.021333 9.472v20.16l-0.064 23.04 0.064 2.965333v83.136c0 2.282667-0.064 4.522667-0.213333 6.762667 0.149333 1.194667 0.213333 2.410667 0.213333 3.626666 0 112.448-84.906667 205.034667-194.026667 216.96C689.130667 899.733333 660.48 917.333333 627.2 917.333333h-23.424c-45.269333 0-81.984-32.576-81.984-72.746666v-20.8c0-40.170667 36.714667-72.746667 81.984-72.746667H627.2c40.192 0 73.6 25.642667 80.64 59.52a155.605333 155.605333 0 0 0 95.189333-60.074667 103.850667 103.850667 0 0 1-114.602666-103.36v-83.157333a103.850667 103.850667 0 0 1 142.997333-96.256c-20.48-169.28-156.8-298.666667-319.509333-298.666667-170.026667 0-305.92 127.082667-320.362667 299.093334a103.850667 103.850667 0 0 1 144.021333 95.829333v83.136a103.850667 103.850667 0 0 1-103.786666 103.936A103.850667 103.850667 0 0 1 128 647.104v-83.136-1.066667l0.085333-72.277333C132.138667 272.853333 300.16 106.666667 511.914667 106.666667z m124.629333 706.730666h-42.090667a10.389333 10.389333 0 0 0-10.389333 10.389334v20.8c0 5.738667 4.650667 10.389333 10.389333 10.389333h42.090667a10.389333 10.389333 0 0 0 10.368-10.389333v-20.8a10.389333 10.389333 0 0 0-10.368-10.389334z m-404.757333-290.986666a41.536 41.536 0 0 0-41.514667 41.557333l0.064-1.877333-0.085333 32.938666v52.074667c0 21.930667 16.96 39.893333 38.442666 41.472l3.093334 0.106667a41.536 41.536 0 0 0 41.514666-41.578667v-83.136a41.536 41.536 0 0 0-41.514666-41.578667z m560.426666 0a41.536 41.536 0 0 0-41.514666 41.557333v83.136c0 22.976 18.581333 41.6 41.514666 41.6a41.536 41.536 0 0 0 41.514667-41.6v-48.832a31.573333 31.573333 0 0 1-0.170667-3.242667l0.021334-34.624a41.536 41.536 0 0 0-41.365334-38.016z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/kejian.svg b/src/assets/icons/kejian.svg
new file mode 100644
index 0000000..8b89874
--- /dev/null
+++ b/src/assets/icons/kejian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512.042667 213.333333c148.992 0 283.733333 78.186667 403.2 231.317334 31.253333 40.021333 31.253333 94.698667-0.106667 134.869333l-6.826667 8.64C790.570667 735.466667 658.133333 810.666667 512.042667 810.666667 363.008 810.666667 228.266667 732.437333 108.736 579.264c-31.189333-40-31.232-94.592 0.042667-134.762667l6.805333-8.64C233.045333 288.533333 365.546667 213.333333 512.042667 213.333333z m0 61.802667c-123.904 0-238.378667 64.96-344.32 197.845333l-6.613334 8.341334a49.344 49.344 0 0 0 0.064 61.205333c108.16 138.645333 224.810667 206.336 350.869334 206.336 123.52 0 237.952-64.96 344.192-197.888l6.613333-8.341333a49.344 49.344 0 0 0 0-61.226667c-108.16-138.602667-224.768-206.293333-350.805333-206.293333zM512 384a128 128 0 1 1 0 256 128 128 0 0 1 0-256z m0 59.093333a68.906667 68.906667 0 1 0 0 137.813334 68.906667 68.906667 0 0 0 0-137.813334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/kejian_mian.svg b/src/assets/icons/kejian_mian.svg
new file mode 100644
index 0000000..62223b4
--- /dev/null
+++ b/src/assets/icons/kejian_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512.042667 213.333333c148.992 0 283.733333 78.186667 403.2 231.317334 31.253333 40.021333 31.253333 94.698667-0.106667 134.869333l-6.826667 8.64C790.570667 735.466667 658.133333 810.666667 512.042667 810.666667 363.008 810.666667 228.266667 732.437333 108.736 579.264c-31.189333-40-31.232-94.592 0.042667-134.762667l6.805333-8.64C233.045333 288.533333 365.546667 213.333333 512.042667 213.333333zM512 384a128 128 0 1 0 0 256 128 128 0 0 0 0-256z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/keziyuyue.svg b/src/assets/icons/keziyuyue.svg
new file mode 100644
index 0000000..0d2f1f9
--- /dev/null
+++ b/src/assets/icons/keziyuyue.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M490.666667 576c14.08 0 28.16 0.341333 42.24 1.002667a244.906667 244.906667 0 0 0-30.698667 63.082666A821.546667 821.546667 0 0 0 490.666667 640c-77.333333 0-154.752 10.816-232.405334 32.490667a119.829333 119.829333 0 0 0-87.466666 110.229333L170.666667 787.904V832a21.333333 21.333333 0 0 0 18.837333 21.184L192 853.333333h341.589333a246.698667 246.698667 0 0 0 64.149334 64.021334L192 917.333333a85.333333 85.333333 0 0 1-85.333333-85.333333v-44.096a183.829333 183.829333 0 0 1 134.4-177.066667C324.266667 587.648 407.466667 576 490.666667 576z m245.333333-64a202.666667 202.666667 0 1 1 0 405.333333 202.666667 202.666667 0 0 1 0-405.333333z m0 64a138.666667 138.666667 0 1 0 0 277.333333 138.666667 138.666667 0 0 0 0-277.333333z m0 21.333333a21.333333 21.333333 0 0 1 21.333333 21.333334v91.626666l57.472 57.472a21.333333 21.333333 0 0 1 1.770667 28.16l-1.770667 2.005334a21.333333 21.333333 0 0 1-28.16 1.770666l-2.005333-1.770666-51.477333-51.456A21.333333 21.333333 0 0 1 714.666667 725.333333v-106.666666a21.333333 21.333333 0 0 1 21.333333-21.333334zM490.666667 106.666667c117.824 0 213.333333 95.509333 213.333333 213.333333s-95.509333 213.333333-213.333333 213.333333-213.333333-95.509333-213.333334-213.333333S372.842667 106.666667 490.666667 106.666667z m0 64a149.333333 149.333333 0 1 0 0 298.666666 149.333333 149.333333 0 0 0 0-298.666666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/kezizhongxin.svg b/src/assets/icons/kezizhongxin.svg
new file mode 100644
index 0000000..7fbcc6c
--- /dev/null
+++ b/src/assets/icons/kezizhongxin.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M444.629333 149.333333c99.221333 0 179.648 94.549333 179.648 211.2 0 83.84-41.557333 156.288-101.802666 190.4-1.216 6.698667-1.002667 13.482667 0.64 20.309334 6.229333 26.090667 27.968 43.413333 65.194666 51.946666l59.925334 19.072c9.984 3.093333 19.968 6.08 29.952 8.853334l11.264 3.2 10.858666 3.306666c62.229333 19.626667 103.616 46.08 103.616 114.965334C803.456 826.410667 770.197333 853.333333 704.128 853.333333H185.130667c-64.853333 0-98.133333-26.922667-99.797334-80.746666 0-66.922667 39.061333-93.802667 98.346667-113.28l10.666667-3.349334 11.050666-3.242666 5.674667-1.6c28.970667-8.064 57.941333-17.856 86.912-26.986667 39.722667-11.349333 62.421333-28.906667 68.117333-52.650667 1.642667-6.848 1.770667-13.76 0.426667-20.736-60.096-34.133333-101.546667-106.474667-101.546667-190.208 0-116.650667 80.426667-211.2 179.648-211.2z m202.112 23.466667c80.618667 0 145.962667 75.648 145.962667 168.96 0 67.072-33.770667 125.013333-82.688 152.298667-1.024 5.354667-0.853333 10.794667 0.490667 16.256 8.277333 34.069333 48.896 40.298667 59.029333 43.456l33.493333 10.56c11.157333 3.477333 22.314667 6.826667 33.493334 9.898666l10.752 3.029334 10.325333 3.157333c48.810667 15.616 81.066667 37.013333 81.066667 90.986667-0.384 43.072-27.413333 64.597333-81.088 64.597333h-9.536c-4.992-38.613333-19.690667-65.834667-44.117334-81.706667a374.570667 374.570667 0 0 0-58.154666-30.698666l-11.861334-4.906667a643.072 643.072 0 0 0-6.186666-2.432l-12.842667-4.864-13.653333-4.906667-14.506667-5.013333-32-10.602667-70.762667-22.741333 4.864-3.797333c48.426667-39.381333 84.970667-104.917333 84.970667-195.050667l0.106667-8.341333c-0.106667-94.272-26.965333-138.730667-64.64-181.76 12.501333-4.032 23.893333-6.378667 37.482666-6.378667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/koubei.svg b/src/assets/icons/koubei.svg
new file mode 100644
index 0000000..a744077
--- /dev/null
+++ b/src/assets/icons/koubei.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M793.6 128a102.4 102.4 0 0 1 102.4 102.4v563.2a102.4 102.4 0 0 1-102.4 102.4H230.4A102.4 102.4 0 0 1 128 793.6V230.4A102.4 102.4 0 0 1 230.4 128h563.2z m-76.864 179.2H307.904A52.885333 52.885333 0 0 0 256 360.682667v103.616a276.757333 276.757333 0 0 0 41.450667 146.496l4.650666 7.253333a252.266667 252.266667 0 0 0 112.042667 94.421333v32a20.48 20.48 0 0 0 18.048 22.634667l1.578667 0.128c5.482667 0.512 10.666667 0.682667 15.978666 0.746667l8.064 0.021333a317.397333 317.397333 0 0 0 206.421334-79.018667l6.250666-5.674666A295.850667 295.850667 0 0 0 768 463.530667v-102.848a51.989333 51.989333 0 0 0-50.474667-53.461334l-0.768-0.021333z m-361.429333 111.04c14.506667 0 26.666667 10.517333 29.013333 24.533333l0.341333 2.837334c0.768 17.194667 4.416 34.090667 10.773334 50.048l2.901333 6.762666a139.797333 139.797333 0 0 0 83.52 76.522667l5.653333 1.770667a137.770667 137.770667 0 0 0 41.6 1.066666l6.869334-1.066666a108.864 108.864 0 0 0 78.144-51.541334l2.709333-4.757333a29.312 29.312 0 0 1 36.117333-12.202667l2.624 1.216c6.272 3.349333 11.029333 8.896 13.44 15.509334l0.853334 2.901333c2.026667 8.384 0.384 17.216-4.522667 24.32h-0.064a167.082667 167.082667 0 0 1-115.733333 83.157333l-6.165334 1.002667a170.24 170.24 0 0 1-23.296 2.645333l-7.808 0.170667a177.962667 177.962667 0 0 1-38.976-4.096l-2.133333-0.256a199.893333 199.893333 0 0 1-124.053333-106.090667l-2.709334-5.973333a220.16 220.16 0 0 1-17.92-69.76l-0.64-9.045333a30.293333 30.293333 0 0 1 26.645334-29.461334l2.816-0.213333z m312.32-1.28a36.245333 36.245333 0 0 1 37.376 35.072v1.28a35.84 35.84 0 0 1-35.050667 36.053333h-0.064a36.245333 36.245333 0 1 1-2.261333-72.426666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/kuaijiehuifu.svg b/src/assets/icons/kuaijiehuifu.svg
new file mode 100644
index 0000000..72aa5c5
--- /dev/null
+++ b/src/assets/icons/kuaijiehuifu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m-202.666667 469.333334a32 32 0 1 1 0 64 32 32 0 0 1 0-64z m405.333334 0a32 32 0 0 1 0 64h-277.333334a32 32 0 0 1 0-64h277.333334z m-405.333334-149.333334a32 32 0 1 1 0 64 32 32 0 0 1 0-64z m405.333334 0a32 32 0 0 1 0 64h-277.333334a32 32 0 0 1 0-64h277.333334z m-405.333334-149.333333a32 32 0 1 1 0 64 32 32 0 0 1 0-64z m405.333334 0a32 32 0 0 1 0 64h-277.333334a32 32 0 0 1 0-64h277.333334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/ladu_mian.svg b/src/assets/icons/ladu_mian.svg
new file mode 100644
index 0000000..a40816c
--- /dev/null
+++ b/src/assets/icons/ladu_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M671.829333 676.053333c-53.610667-78.933333-97.685333-174.741333-144.789333-292.053333l-21.930667-55.061333c-37.845333-93.653333-71.573333-155.797333-167.936-129.024l-21.504-48.917334-4.8-10.837333c-4.842667-10.922667-27.712-16.106667-43.050666-8.661333-15.36 7.466667-30.08 25.386667-25.024 37.461333l26.816 63.744c-75.818667 43.306667-69.888 98.538667-12.8 208.064l14.869333 28.074667c58.453333 109.546667 130.816 234.794667 260.096 328.512 51.072 37.034667 110.165333 65.386667 177.28 85.056l14.506667 4.074666a52.16 52.16 0 0 0 63.957333-36.458666c4.693333-17.216 0.170667-35.626667-11.989333-48.746667l-16.917334-18.453333c-38.144-42.133333-67.072-77.717333-86.784-106.752z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/lanyadingwei.svg b/src/assets/icons/lanyadingwei.svg
new file mode 100644
index 0000000..205653f
--- /dev/null
+++ b/src/assets/icons/lanyadingwei.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c200.298667 0 362.666667 191.018667 362.666667 426.666667s-162.368 426.666667-362.666667 426.666667S149.333333 747.648 149.333333 512 311.701333 85.333333 512 85.333333z m23.722667 217.066667a25.194667 25.194667 0 0 0-25.408-0.576 24.106667 24.106667 0 0 0-12.522667 21.674667l0.042667 141.781333-96.64-66.816-1.045334-0.704a24.618667 24.618667 0 0 0-33.130666 7.146667l-0.64 1.066666c-6.954667 11.306667-3.882667 25.92 7.04 33.642667l106.645333 73.941333-106.901333 76.117334-1.002667 0.746666a25.088 25.088 0 0 0-4.970667 34.005334l0.725334 1.024a24.64 24.64 0 0 0 33.514666 5.034666l96.533334-68.437333v139.626667c0.170667 8.874667 5.333333 16.938667 13.397333 20.992 8.085333 4.053333 17.770667 3.456 25.237333-1.578667l135.082667-94.229333 0.981333-0.746667c6.336-4.949333 9.92-12.522667 9.728-20.458667a25.194667 25.194667 0 0 0-10.773333-19.925333l-104.917333-72.704 105.472-74.88 1.002666-0.704a25.173333 25.173333 0 0 0 9.472-20.394667 25.258667 25.258667 0 0 0-10.688-19.84l-135.36-94.208z m11.754666 257.642667l66.773334 46.592-66.773334 46.4v-92.992z m0-189.205334l67.370667 47.424-67.370667 47.829334v-95.253334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/list-2.svg b/src/assets/icons/list-2.svg
new file mode 100644
index 0000000..1f471f3
--- /dev/null
+++ b/src/assets/icons/list-2.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M313.26 811.73h646.72v-99.49H313.26v99.49z m0-298.48h646.72v-99.49H313.26v99.49z m0-397.98v99.49h646.72v-99.49H313.26zM64.53 811.73h149.24v-99.49H64.53v99.49z m0-298.48h149.24v-99.49H64.53v99.49z m0-298.49h149.24v-99.49H64.53v99.49z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/mendiandongtai.svg b/src/assets/icons/mendiandongtai.svg
new file mode 100644
index 0000000..7a7b415
--- /dev/null
+++ b/src/assets/icons/mendiandongtai.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M343.402667 701.098667l135.04 20.586666 56.597333 98.005334a53.333333 53.333333 0 1 1-92.373333 53.333333l-99.264-171.946667z m549.312-481.237334a85.333333 85.333333 0 0 1 3.285333 23.466667V664.32a85.333333 85.333333 0 0 1-114.154667 80.32C698.325333 714.645333 622.592 693.973333 554.666667 682.666667a13093.546667 13093.546667 0 0 0-234.624-36.330667v-398.506667A19907.733333 19907.733333 0 0 1 554.666667 213.333333c65.706667-9.130667 143.189333-26.453333 232.533333-52.032a85.333333 85.333333 0 0 1 105.514667 58.56zM256 257.578667v379.392l-54.784-7.893334A85.333333 85.333333 0 0 1 128 544.597333v-194.133333a85.333333 85.333333 0 0 1 72.32-84.330667c19.157333-2.944 37.717333-5.802667 55.68-8.533333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/mishiyuding.svg b/src/assets/icons/mishiyuding.svg
new file mode 100644
index 0000000..b856afa
--- /dev/null
+++ b/src/assets/icons/mishiyuding.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M224 938.666667A96 96 0 0 1 128 842.666667V469.333333c0-212.074667 171.925333-384 384-384s384 171.925333 384 384v373.333334a96 96 0 0 1-96 96zM512 149.333333C335.274667 149.333333 192 292.608 192 469.333333v373.333334a32 32 0 0 0 32 32H320V522.666667a117.333333 117.333333 0 0 1 112.618667-117.248L437.333333 405.333333h149.333334a117.333333 117.333333 0 0 1 117.333333 117.333334V874.666667h96a32 32 0 0 0 31.850667-28.928L832 842.666667V469.333333c0-176.725333-143.274667-320-320-320z m74.666667 320h-149.333334a53.333333 53.333333 0 0 0-53.333333 53.333334V874.666667h256V522.666667a53.333333 53.333333 0 0 0-49.834667-53.226667L586.666667 469.333333zM512 618.666667a42.666667 42.666667 0 0 1 21.354667 79.616L533.333333 746.666667a21.333333 21.333333 0 0 1-42.666666 0v-48.384A42.666667 42.666667 0 0 1 512 618.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/mishiyuding1.svg b/src/assets/icons/mishiyuding1.svg
new file mode 100644
index 0000000..7ac9101
--- /dev/null
+++ b/src/assets/icons/mishiyuding1.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c212.074667 0 384 171.925333 384 384v373.333334a96 96 0 0 1-96 96H704V522.666667a117.333333 117.333333 0 0 0-117.333333-117.333334h-149.333334a117.333333 117.333333 0 0 0-117.333333 117.333334V938.666667h-96A96 96 0 0 1 128 842.666667V469.333333c0-212.074667 171.925333-384 384-384z m74.666667 384l3.498666 0.128C617.984 471.552 640 498.346667 640 531.093333V938.666667H384V531.093333C384 496.981333 407.893333 469.333333 437.333333 469.333333h149.333334zM512 618.666667a42.666667 42.666667 0 0 0-21.333333 79.616V746.666667a21.333333 21.333333 0 0 0 42.666666 0l0.021334-48.384A42.666667 42.666667 0 0 0 512 618.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/notice_buyer.svg b/src/assets/icons/notice_buyer.svg
new file mode 100644
index 0000000..bab1997
--- /dev/null
+++ b/src/assets/icons/notice_buyer.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M573 421c-23.1 0-41 17.9-41 40s17.9 40 41 40c21.1 0 39-17.9 39-40s-17.9-40-39-40zM293 421c-23.1 0-41 17.9-41 40s17.9 40 41 40c21.1 0 39-17.9 39-40s-17.9-40-39-40z"  /><path d="M894 345c-48.1-66-115.3-110.1-189-130v0.1c-17.1-19-36.4-36.5-58-52.1-163.7-119-393.5-82.7-513 81-96.3 133-92.2 311.9 6 439l0.8 132.6c0 3.2 0.5 6.4 1.5 9.4 5.3 16.9 23.3 26.2 40.1 20.9L309 806c33.5 11.9 68.1 18.7 102.5 20.6l-0.5 0.4c89.1 64.9 205.9 84.4 313 49l127.1 41.4c3.2 1 6.5 1.6 9.9 1.6 17.7 0 32-14.3 32-32V753c88.1-119.6 90.4-284.9 1-408zM323 735l-12-5-99 31-1-104-8-9c-84.6-103.2-90.2-251.9-11-361 96.4-132.2 281.2-161.4 413-66 132.2 96.1 161.5 280.6 66 412-80.1 109.9-223.5 150.5-348 102z m505-17l-8 10 1 104-98-33-12 5c-56 20.8-115.7 22.5-171 7l-0.2-0.1C613.7 788.2 680.7 742.2 729 676c76.4-105.3 88.8-237.6 44.4-350.4l0.6 0.4c23 16.5 44.1 37.1 62 62 72.6 99.6 68.5 235.2-8 330z"  /><path d="M433 421c-23.1 0-41 17.9-41 40s17.9 40 41 40c21.1 0 39-17.9 39-40s-17.9-40-39-40z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/paiduiquhao.svg b/src/assets/icons/paiduiquhao.svg
new file mode 100644
index 0000000..fb7abc9
--- /dev/null
+++ b/src/assets/icons/paiduiquhao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M768 384v490.666667a42.666667 42.666667 0 0 1-42.666667 42.666666H298.666667a42.666667 42.666667 0 0 1-42.666667-42.666666V384h512z m-345.152 128c-36.949333 0-66.666667 18.645333-75.797333 51.669333-3.306667 10.88-5.546667 25.728-5.717334 83.029334v6.293333c0 59.050667 2.282667 73.408 5.717334 84.288 9.514667 33.024 38.848 52.053333 75.797333 52.053333 36.586667 0 65.92-18.645333 75.818667-52.053333 2.944-10.453333 4.8-24.192 4.949333-77.909333v-6.378667c0-62.528-1.92-78.08-4.949333-89.322667-9.898667-33.024-39.253333-51.669333-75.818667-51.669333zM661.333333 515.882667h-41.152L570.666667 551.253333v48.938667l44.949333-31.850667v217.130667H661.333333V515.882667zM422.848 555.52c15.637333 0 28.970667 8.170667 32 23.317333 1.770667 6.784 2.858667 18.176 3.029333 61.994667v23.658667c-0.170667 41.130667-1.28 50.901333-3.413333 58.048-4.181333 15.146667-16 22.528-31.616 22.528-16.362667 0-29.333333-7.381333-32.362667-22.528-1.536-7.765333-3.434667-18.645333-3.434666-69.525334 0-53.973333 1.130667-66.794667 3.413333-74.176 4.202667-15.146667 16-23.317333 32.384-23.317333zM853.333333 128a85.333333 85.333333 0 0 1 85.333334 85.333333v298.666667a85.333333 85.333333 0 0 1-85.333334 85.333333h-42.666666v-192h10.666666a32 32 0 0 0 0-64h-618.666666a32 32 0 0 0-3.072 63.850667L202.666667 405.333333h10.666666v192H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V213.333333a85.333333 85.333333 0 0 1 85.333334-85.333333h682.666666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/paimai.svg b/src/assets/icons/paimai.svg
new file mode 100644
index 0000000..0139a69
--- /dev/null
+++ b/src/assets/icons/paimai.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M501.333333 874.666667a32 32 0 0 1 0 64h-320a32 32 0 0 1 0-64h320zM134.250667 605.034667l282.325333 165.269333c15.573333 9.130667 20.928 29.354667 11.946667 45.162667a32.362667 32.362667 0 0 1-44.544 12.096L101.632 662.293333a33.301333 33.301333 0 0 1-11.925333-45.162666 32.362667 32.362667 0 0 1 44.544-12.096z m278.165333-422.4l225.877333 132.224a44.416 44.416 0 0 1 15.893334 60.202666L578.133333 508.650667l338.773334 198.314666a44.416 44.416 0 0 1 15.936 60.202667 43.136 43.136 0 0 1-59.392 16.149333L534.656 584.96l-76.074667 133.589333a43.136 43.136 0 0 1-59.370666 16.128L173.333333 602.474667a44.416 44.416 0 0 1-15.893333-60.202667l195.605333-343.509333a43.136 43.136 0 0 1 59.370667-16.128z m15.232-92.864l282.346667 165.269333c15.573333 9.130667 20.906667 29.354667 11.925333 45.162667a32.362667 32.362667 0 0 1-44.544 12.096L395.050667 147.029333a33.301333 33.301333 0 0 1-11.946667-45.162666 32.362667 32.362667 0 0 1 44.544-12.096z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/pingjia.svg b/src/assets/icons/pingjia.svg
new file mode 100644
index 0000000..9b39672
--- /dev/null
+++ b/src/assets/icons/pingjia.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M701.041778 455.111111a56.888889 56.888889 0 0 1 56.888889 56.888889 56.888889 56.888889 0 0 1-56.888889 56.888889 56.888889 56.888889 0 0 1-56.888889-56.888889 56.888889 56.888889 0 0 1 56.888889-56.888889z"  /><path d="M359.708444 455.111111a56.888889 56.888889 0 0 1 56.888889 56.888889 56.888889 56.888889 0 0 1-56.888889 56.888889 56.888889 56.888889 0 0 1-56.888888-56.888889 56.888889 56.888889 0 0 1 56.888888-56.888889z"  /><path d="M530.375111 910.165333H134.314667l-2.218667-36.352V512a398.222222 398.222222 0 1 1 398.222222 398.222222z m-329.955555-68.266666h329.955555a329.955556 329.955556 0 1 0-329.955555-329.955556z"  /><path d="M530.375111 455.111111a56.888889 56.888889 0 0 1 56.888889 56.888889 56.888889 56.888889 0 0 1-56.888889 56.888889 56.888889 56.888889 0 0 1-56.888889-56.888889 56.888889 56.888889 0 0 1 56.888889-56.888889z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/pingtaifapiao.svg b/src/assets/icons/pingtaifapiao.svg
new file mode 100644
index 0000000..b6b3315
--- /dev/null
+++ b/src/assets/icons/pingtaifapiao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M768 384v533.333333a42.666667 42.666667 0 0 1-42.56-39.466666L725.333333 874.666667a42.666667 42.666667 0 0 0-85.226666-3.2L640 874.666667a42.666667 42.666667 0 0 1-85.226667 3.2L554.666667 874.666667a42.666667 42.666667 0 0 0-85.226667-3.2L469.333333 874.666667a42.666667 42.666667 0 0 1-85.226666 3.2L384 874.666667a42.666667 42.666667 0 0 0-85.226667-3.2L298.666667 874.666667a42.666667 42.666667 0 0 1-39.466667 42.56L256 917.333333V384h512z m-106.666667 277.333333H362.666667a21.333333 21.333333 0 0 0-2.496 42.517334L362.666667 704h298.666666a21.333333 21.333333 0 0 0 0-42.666667z m192-533.333333a85.333333 85.333333 0 0 1 85.333334 85.333333v256a85.333333 85.333333 0 0 1-85.333334 85.333334h-42.666666v-170.666667h10.666666a32 32 0 0 0 0-64h-618.666666a32 32 0 0 0-3.072 63.850667L202.666667 384h10.666666v170.666667H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333334V213.333333a85.333333 85.333333 0 0 1 85.333334-85.333333h682.666666z m-192 384H362.666667a21.333333 21.333333 0 0 0-2.496 42.517333L362.666667 554.666667h298.666666a21.333333 21.333333 0 0 0 0-42.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/pinpai.svg b/src/assets/icons/pinpai.svg
new file mode 100644
index 0000000..f4b129c
--- /dev/null
+++ b/src/assets/icons/pinpai.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M531.626667 915.228444a66.616889 66.616889 0 0 1-51.598223-24.462222L120.092444 484.181333a66.503111 66.503111 0 0 1-4.835555-74.296889l130.844444-269.027555a66.673778 66.673778 0 0 1 56.888889-32.142222h456.362667a66.787556 66.787556 0 0 1 57.173333 32.312889l1.308445 2.503111 130.844444 266.524444a66.673778 66.673778 0 0 1-5.688889 74.296889l-1.194666 1.479111-358.741334 404.935111a66.787556 66.787556 0 0 1-51.655111 24.462222z m-359.253334-472.177777l359.253334 405.731555 1.194666-1.479111 358.115556-404.252444-1.365333-2.503111-129.877334-264.988445H303.616z"  /><path d="M531.626667 668.16a53.930667 53.930667 0 0 1-41.472-20.195556L270.165333 400.156444l49.948445-44.316444 211.512889 238.933333 211.740444-238.933333 49.948445 44.316444-220.216889 247.808a53.930667 53.930667 0 0 1-41.472 20.195556z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qianbao.svg b/src/assets/icons/qianbao.svg
new file mode 100644
index 0000000..f384250
--- /dev/null
+++ b/src/assets/icons/qianbao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M701.64898 117.446531l2.194285 3.552653L778.741551 250.77551H815.020408a114.938776 114.938776 0 0 1 114.855184 110.320327L929.959184 365.714286v355.265306a114.938776 114.938776 0 0 1-110.320327 114.855184L815.020408 835.918367h-606.040816a114.938776 114.938776 0 0 1-114.855184-110.320326L94.040816 720.979592v-355.265306a114.938776 114.938776 0 0 1 110.320327-114.855184L208.979592 250.77551h123.109877l271.67347-156.839183a73.289143 73.289143 0 0 1 97.886041 23.531102zM815.020408 313.469388h-606.040816a52.244898 52.244898 0 0 0-52.140408 48.817632L156.734694 365.714286v355.265306a52.244898 52.244898 0 0 0 48.817633 52.140408L208.979592 773.22449h606.040816a52.244898 52.244898 0 0 0 52.140408-48.817633L867.265306 720.979592V668.734694h-177.632653a114.938776 114.938776 0 0 1-114.855184-110.320327L574.693878 553.795918a114.938776 114.938776 0 0 1 114.938775-114.938775H867.265306v-73.142857a52.244898 52.244898 0 0 0-52.244898-52.244898z m52.244898 188.081632h-177.632653a52.244898 52.244898 0 0 0-52.140408 48.817633L637.387755 553.795918a52.244898 52.244898 0 0 0 52.244898 52.244898H867.265306v-104.489796z m-156.734694 20.89796a31.346939 31.346939 0 1 1 0 62.693877 31.346939 31.346939 0 0 1 0-62.693877zM636.969796 147.706776l-1.734531 0.794122L458.041469 250.77551H706.35102l-56.821551-98.429388a10.490776 10.490776 0 0 0-12.580571-4.639346z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qianbao_mian.svg b/src/assets/icons/qianbao_mian.svg
new file mode 100644
index 0000000..897f029
--- /dev/null
+++ b/src/assets/icons/qianbao_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M256 319.402667V320h576a117.162667 117.162667 0 0 1 106.581333 112.021333l0.085334 4.714667V512h-25.92l-2.986667-0.426667-3.093333-0.170666h-213.333334l-4.714666 0.106666a117.333333 117.333333 0 0 0-112.512 112.384l-0.106667 4.842667 0.085333 4.714667a117.333333 117.333333 0 0 0 112.426667 112.533333l4.821333 0.085333H874.666667V746.666667h64v52.736a117.333333 117.333333 0 0 1-112.618667 117.248l-4.714667 0.085333h-618.666666a117.333333 117.333333 0 0 1-117.248-112.618667L85.333333 799.424v-362.666667a117.333333 117.333333 0 0 1 112.618667-117.248l4.714667-0.106666H256z m682.666667 256v106.666666H693.333333l-3.498666-0.106666a53.333333 53.333333 0 0 1-49.706667-49.706667L640 628.736l0.106667-3.498667 0.341333-3.456a53.333333 53.333333 0 0 1 49.386667-46.250666l3.498666-0.128H938.666667z m-224 21.333333a32 32 0 1 0 0 64 32 32 0 0 0 0-64z m-9.066667-413.418667l2.24 3.626667 52.16 90.368h-73.898667l-33.706666-58.368a10.709333 10.709333 0 0 0-12.842667-4.757333l-1.749333 0.810666-107.968 62.314667h-128.597334l204.416-117.994667a74.816 74.816 0 0 1 99.946667 24zM512 213.333333h192v64h-192v-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qiehuan.svg b/src/assets/icons/qiehuan.svg
new file mode 100644
index 0000000..37e0a94
--- /dev/null
+++ b/src/assets/icons/qiehuan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M885.824 597.333333c17.408 0 31.509333 14.336 31.509333 32 0 16.64-12.501333 30.293333-28.458666 31.850667L184.533333 661.333333l135.317334 137.365334c11.52 11.712 12.266667 30.250667 2.176 42.816l-2.154667 2.432a31.146667 31.146667 0 0 1-42.154667 2.218666l-2.410666-2.197333-153.258667-155.584a53.930667 53.930667 0 0 1 0-75.413333 52.16 52.16 0 0 1 32.96-15.466667L159.168 597.333333h726.656zM745.6 177.834667l2.389333 2.197333 153.898667 155.584a53.76 53.76 0 0 1 0 75.413333 52.458667 52.458667 0 0 1-33.088 15.466667l-4.181333 0.170667-729.386667-0.149334c-17.450667 0-28.565333-14.314667-28.565333-32C106.666667 377.877333 119.36 362.666667 135.253333 362.666667h703.893334l-135.872-137.365334a32.277333 32.277333 0 0 1-2.176-42.816l2.154666-2.432a31.36 31.36 0 0 1 42.346667-2.218666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qingchu.svg b/src/assets/icons/qingchu.svg
new file mode 100644
index 0000000..dc898ac
--- /dev/null
+++ b/src/assets/icons/qingchu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m182.997333 179.669334a30.72 30.72 0 0 1 0 43.456l-139.52 139.52 139.52 139.562666a30.72 30.72 0 1 1-43.456 43.456l-139.52-139.562666-139.562666 139.562666a30.72 30.72 0 1 1-43.456-43.456L468.565333 512l-139.562666-139.52a30.72 30.72 0 1 1 43.456-43.456L512 468.522667l139.52-139.52a30.72 30.72 0 0 1 43.456 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qingchu_mian.svg b/src/assets/icons/qingchu_mian.svg
new file mode 100644
index 0000000..94ecaa2
--- /dev/null
+++ b/src/assets/icons/qingchu_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m182.997333 243.669334a30.72 30.72 0 0 0-43.456 0l-139.52 139.52-139.562666-139.52a30.72 30.72 0 1 0-43.456 43.456l139.562666 139.52-139.562666 139.562666a30.72 30.72 0 1 0 43.456 43.456L512 555.434667l139.52 139.562666a30.72 30.72 0 1 0 43.456-43.456L555.477333 512l139.52-139.52a30.72 30.72 0 0 0 0-43.456z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qishoupeisong.svg b/src/assets/icons/qishoupeisong.svg
new file mode 100644
index 0000000..9adc068
--- /dev/null
+++ b/src/assets/icons/qishoupeisong.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M506.389333 106.773333l13.888 0.106667c182.357333 3.754667 339.754667 129.024 384.725334 306.133333H542.293333a127.658667 127.658667 0 0 0-90.538666 37.205334 128.213333 128.213333 0 0 0-37.717334 90.453333 122.453333 122.453333 0 0 0 91.413334 118.250667L917.333333 773.76v-52.970667l-398.613333-111.232a71.509333 71.509333 0 0 1-53.333333-69.056 76.970667 76.970667 0 0 1 76.906666-76.586666h372.138667c1.92 16.128 2.901333 32.490667 2.901333 49.066666v261.717334a121.386667 121.386667 0 0 1-47.317333 96.213333 120.874667 120.874667 0 0 1-104.96 20.992L230.826667 749.098667c-43.008-11.52-78.08-42.666667-94.72-84.010667A404.266667 404.266667 0 0 1 106.666667 512.341333 405.781333 405.781333 0 0 1 228.266667 222.357333a404.053333 404.053333 0 0 1 291.989333-115.562666h-13.866667z m49.045334 410.005334A28.949333 28.949333 0 0 0 512 542.016c0 10.368 5.504 19.946667 14.464 25.173333a28.949333 28.949333 0 0 0 43.52-25.173333c0-10.432-5.546667-20.053333-14.549333-25.237333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qiyedingcan.svg b/src/assets/icons/qiyedingcan.svg
new file mode 100644
index 0000000..147c9e2
--- /dev/null
+++ b/src/assets/icons/qiyedingcan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M565.888 174.784c5.824 12.8 9.194667 26.56 9.941333 40.533333l0.170667 6.016v105.258667l253.013333 137.024 2.624 1.216a113.941333 113.941333 0 0 1 64.256 97.152l0.106667 4.992v236.330667l-0.085333 4.586666c-2.389333 59.306667-50.752 106.944-110.933334 109.354667L780.16 917.333333 576 917.312V917.333333H245.333333c-63.210667 0-114.773333-48.853333-117.248-110.037333L128 802.688V313.962667c0-43.626667 25.322667-83.306667 65.024-102.613334l4.650667-2.133333 213.333333-92.650667c59.221333-25.706667 128.554667 0.362667 154.88 58.218667zM576 397.589333v222.890667c3.349333-1.173333 6.933333-1.813333 10.666667-1.813333h128a32 32 0 0 1 0 64h-128c-3.733333 0-7.317333-0.64-10.666667-1.813334v174.272h204.181333l3.456-0.085333c26.325333-1.706667 47.36-22.4 49.066667-48.32l0.128-3.413333V566.976l-0.149333-3.818667a51.797333 51.797333 0 0 0-27.626667-41.856l-3.498667-1.685333-2.389333-1.173333L576 397.589333z m-135.616-223.786666l-3.370667 1.344-213.333333 92.224a51.946667 51.946667 0 0 0-31.530667 43.584L192 314.773333v486.698667c0 27.498667 22.016 50.005333 49.834667 51.754667L245.333333 853.333333H512V222.549333c0-4.352-0.554667-8.682667-1.664-12.885333l-1.28-4.138667-1.642667-4.053333c-11.477333-25.066667-40.896-36.949333-67.029333-27.648zM416 618.666667a32 32 0 0 1 0 64h-128a32 32 0 0 1 0-64h128z m0-170.666667a32 32 0 0 1 0 64h-128a32 32 0 0 1 0-64h128z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qiyedingcan1.svg b/src/assets/icons/qiyedingcan1.svg
new file mode 100644
index 0000000..a3c3277
--- /dev/null
+++ b/src/assets/icons/qiyedingcan1.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M576 917.333333h42.666667V349.696l210.346666 113.92 2.624 1.216a113.941333 113.941333 0 0 1 64.256 97.152l0.106667 4.992v236.330667l-0.085333 4.586666c-2.389333 59.306667-50.752 106.944-110.933334 109.354667L780.16 917.333333 576 917.312V917.333333H245.333333c-63.210667 0-114.773333-48.853333-117.248-110.037333L128 802.688V313.962667c0-43.626667 25.322667-83.306667 65.024-102.613334l4.650667-2.133333 213.333333-92.650667c59.221333-25.706667 128.554667 0.362667 154.88 58.218667 5.824 12.8 9.194667 26.56 9.941333 40.533333l0.170667 6.016V917.333333z m-160-298.666666h-128a32 32 0 0 0-3.072 63.850666L288 682.666667h128a32 32 0 0 0 0-64z m362.666667 0H682.666667v64h96a32 32 0 0 0 0-64z m-362.666667-170.666667h-128a32 32 0 0 0-3.072 63.850667L288 512h128a32 32 0 0 0 0-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/quanbu.svg b/src/assets/icons/quanbu.svg
new file mode 100644
index 0000000..db088f5
--- /dev/null
+++ b/src/assets/icons/quanbu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M421.333333 542.229333a60.437333 60.437333 0 0 1 60.437334 60.437334v211.562666A60.437333 60.437333 0 0 1 421.333333 874.666667H209.770667A60.437333 60.437333 0 0 1 149.333333 814.229333V602.666667a60.437333 60.437333 0 0 1 60.437334-60.437334h211.562666z m392.896 0A60.437333 60.437333 0 0 1 874.666667 602.666667v211.562666A60.437333 60.437333 0 0 1 814.229333 874.666667H602.666667a60.437333 60.437333 0 0 1-60.437334-60.437334V602.666667a60.437333 60.437333 0 0 1 60.437334-60.437334h211.562666zM421.333333 149.333333a60.437333 60.437333 0 0 1 60.437334 60.437334v211.562666a60.437333 60.437333 0 0 1-60.437334 60.437334H209.770667A60.437333 60.437333 0 0 1 149.333333 421.333333V209.770667A60.437333 60.437333 0 0 1 209.770667 149.333333h211.562666z m287.104 0a166.229333 166.229333 0 1 1 0 332.437334 166.229333 166.229333 0 0 1 0-332.437334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/quanping.svg b/src/assets/icons/quanping.svg
new file mode 100644
index 0000000..0a5cfbe
--- /dev/null
+++ b/src/assets/icons/quanping.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M395.733333 583.189333a32.042667 32.042667 0 0 1 42.88 47.509334L237.333333 832H394.666667l3.072 0.149333A32 32 0 0 1 394.666667 896h-234.666667l-3.072-0.149333A32 32 0 0 1 128 864v-234.666667l0.149333-3.072A32 32 0 0 1 160 597.333333l3.072 0.149334A32 32 0 0 1 192 629.333333v157.333334l201.301333-201.28z m189.653334 2.197334c11.733333-11.733333 30.293333-12.458667 42.88-2.197334l2.432 2.197334L832 786.666667V629.333333l0.149333-3.072a32 32 0 0 1 28.778667-28.8L864 597.333333l3.072 0.149334a32 32 0 0 1 28.8 28.778666L896 629.333333v234.666667l-0.149333 3.072a32 32 0 0 1-28.778667 28.8L864 896h-234.666667l-3.072-0.149333a32 32 0 0 1 0-63.701334L629.333333 832h157.333334l-201.28-201.301333-2.197334-2.432a32.042667 32.042667 0 0 1 2.197334-42.88zM394.666667 128a32 32 0 0 1 3.072 63.850667L394.666667 192h-157.333334l201.28 201.301333a32.042667 32.042667 0 0 1-42.88 47.509334l-2.432-2.197334L192 237.333333V394.666667a32 32 0 0 1-28.928 31.850666L160 426.666667a32 32 0 0 1-31.850667-28.928L128 394.666667v-234.666667a32 32 0 0 1 28.928-31.850667L160 128h234.666667z m469.333333 0l3.072 0.149333a32 32 0 0 1 28.8 28.778667L896 160v234.666667l-0.149333 3.072a32 32 0 0 1-28.778667 28.8L864 426.666667l-3.072-0.149334a32 32 0 0 1-28.8-28.778666L832 394.666667v-157.333334l-201.301333 201.28-2.432 2.197334a32.042667 32.042667 0 0 1-45.077334-45.077334l2.197334-2.432L786.666667 192H629.333333l-3.072-0.149333a32 32 0 0 1 0-63.701334L629.333333 128h234.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qudao.svg b/src/assets/icons/qudao.svg
new file mode 100644
index 0000000..e0fbf39
--- /dev/null
+++ b/src/assets/icons/qudao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M289.5 613.5a128 128 0 1 0 0 181 127.5 127.5 0 0 0 0-181z m-50.9 130.1a56 56 0 0 1-79.2 0 56.1 56.1 0 0 1 0-79.2 56 56 0 0 1 79.2 0 56.1 56.1 0 0 1 0 79.2zM515 338a128 128 0 1 0-90.5-37.5A127.5 127.5 0 0 0 515 338z m-39.6-167.6a56 56 0 0 1 79.2 0 56.1 56.1 0 0 1 0 79.2 56 56 0 0 1-79.2 0 56.1 56.1 0 0 1 0-79.2z m439.1 456.1a128 128 0 1 0 0 181 127.5 127.5 0 0 0 0-181z m-50.9 130.1a56 56 0 0 1-79.2 0 56.1 56.1 0 0 1 0-79.2 56 56 0 0 1 79.2 0 56.1 56.1 0 0 1 0 79.2zM136.2 514.2a201.1 201.1 0 0 1 63.3-10.2h1.8a4 4 0 0 0 3.9-3.3 311.5 311.5 0 0 1 86.2-163.3 314.5 314.5 0 0 1 42.1-35.4 3.9 3.9 0 0 0 1.3-5 200.9 200.9 0 0 1-18.3-62.9 4.1 4.1 0 0 0-6.1-3c-96.6 59.7-164.7 161-179.4 278.8a3.9 3.9 0 0 0 5.2 4.3z m573.4 366.5a198.2 198.2 0 0 1-26.5-22.3 208.3 208.3 0 0 1-20.1-23.3 3.8 3.8 0 0 0-5.1-1.2c-8 4.2-16.1 8.1-24.5 11.6a313 313 0 0 1-242.8 0 287.6 287.6 0 0 1-31.5-15.5 4.1 4.1 0 0 0-5.1 1 177.3 177.3 0 0 1-13.1 14.4 195.7 195.7 0 0 1-36.5 28.9 4 4 0 0 0 0 6.8 384.5 384.5 0 0 0 405 6.4 4.1 4.1 0 0 0 0.2-6.8z m-14.3-575.2a314 314 0 0 1 104.2 131.1 306.2 306.2 0 0 1 21.4 77.3 3.7 3.7 0 0 0 3.6 3.1 199.7 199.7 0 0 1 65.3 10.9 3.6 3.6 0 0 0 4.7-3.7c-10.6-121.5-77.7-226.7-174.9-289.3a3.6 3.6 0 0 0-5.5 2.6 200.7 200.7 0 0 1-19.8 63.4 3.6 3.6 0 0 0 1 4.6z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/qudao_xiaochengxu.svg b/src/assets/icons/qudao_xiaochengxu.svg
new file mode 100644
index 0000000..54af407
--- /dev/null
+++ b/src/assets/icons/qudao_xiaochengxu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 967.68c251.668 0 455.68-204.012 455.68-455.68S763.668 56.32 512 56.32 56.32 260.332 56.32 512 260.332 967.68 512 967.68z m0-71.68c-212.07 0-384-171.93-384-384s171.93-384 384-384 384 171.93 384 384-171.93 384-384 384z"  /><path d="M544.297 405.279a77.599 77.599 0 1 1 77.599 77.578 30.72 30.72 0 0 0 0 61.44c76.78 0 139.028-62.249 139.028-139.029S698.675 266.24 621.896 266.24s-139.039 62.249-139.039 139.028a30.72 30.72 0 0 0 61.44 0z m-61.44 213.217a77.588 77.588 0 0 1-155.177 0 77.588 77.588 0 0 1 77.588-77.599 30.72 30.72 0 0 0 0-61.44c-76.769 0-139.028 62.239-139.028 139.039 0 76.78 62.249 139.028 139.028 139.028 76.79 0 139.029-62.248 139.029-139.028a30.72 30.72 0 0 0-61.44 0z"  /><path d="M482.857 402.156V619.93h61.44V402.156z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/rencaizhaopin.svg b/src/assets/icons/rencaizhaopin.svg
new file mode 100644
index 0000000..6113e53
--- /dev/null
+++ b/src/assets/icons/rencaizhaopin.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 554.666667c83.2 0 166.4 11.626667 249.6 34.858666a183.829333 183.829333 0 0 1 134.4 177.066667V810.666667a85.333333 85.333333 0 0 1-85.333333 85.333333H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333333v-44.096a183.829333 183.829333 0 0 1 134.4-177.066667C345.6 566.314667 428.8 554.666667 512 554.666667z m-0.064 42.666666c-20.245333 0-30.698667 7.104-31.36 21.333334L450.133333 776.704a21.333333 21.333333 0 0 0 5.674667 18.944l40.938667 42.026667a21.333333 21.333333 0 0 0 30.549333 0l40.96-42.026667a21.333333 21.333333 0 0 0 5.653333-18.944L543.402667 618.666667c-0.725333-14.229333-11.221333-21.333333-31.466667-21.333334zM512 106.666667c117.824 0 213.333333 95.509333 213.333333 213.333333s-95.509333 213.333333-213.333333 213.333333-213.333333-95.509333-213.333333-213.333333S394.176 106.666667 512 106.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/rili.svg b/src/assets/icons/rili.svg
new file mode 100644
index 0000000..5d751bf
--- /dev/null
+++ b/src/assets/icons/rili.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M693.333333 128A32 32 0 0 1 725.333333 160V192h74.666667a117.333333 117.333333 0 0 1 117.248 112.618667L917.333333 309.333333v448a117.333333 117.333333 0 0 1-117.333333 117.333334h-576A117.333333 117.333333 0 0 1 106.666667 757.333333v-448A117.333333 117.333333 0 0 1 224 192H298.666667V160a32 32 0 0 1 64 0V192h298.666666V160A32 32 0 0 1 693.333333 128zM298.666667 256h-74.666667A53.333333 53.333333 0 0 0 170.666667 309.333333v448a53.333333 53.333333 0 0 0 53.333333 53.333334h576a53.333333 53.333333 0 0 0 53.333333-53.333334v-448a53.333333 53.333333 0 0 0-53.333333-53.333333H725.333333v10.666667a32 32 0 0 1-64 0V256H362.666667v10.666667a32 32 0 0 1-64 0V256z m32 362.666667a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64h64z m213.333333 0a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64h64z m213.333333 0a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64h64z m-426.666666-192a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64h64z m213.333333 0a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64h64z m213.333333 0a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64h64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/rili2.svg b/src/assets/icons/rili2.svg
new file mode 100644
index 0000000..ba2d55d
--- /dev/null
+++ b/src/assets/icons/rili2.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M693.333333 128A32 32 0 0 1 725.333333 160V192h74.666667a117.333333 117.333333 0 0 1 117.248 112.618667L917.333333 309.333333v448a117.333333 117.333333 0 0 1-112.618666 117.248L800 874.666667h-576a117.333333 117.333333 0 0 1-117.248-112.618667L106.666667 757.333333v-448a117.333333 117.333333 0 0 1 112.618666-117.248L224 192H298.666667V160a32 32 0 0 1 64 0V192h298.666666V160A32 32 0 0 1 693.333333 128zM853.333333 426.666667H170.666667v330.666666a53.333333 53.333333 0 0 0 49.834666 53.226667L224 810.666667h576a53.333333 53.333333 0 0 0 53.226667-49.834667L853.333333 757.333333V426.666667z m-554.666666-170.666667h-74.666667a53.333333 53.333333 0 0 0-53.226667 49.834667L170.666667 309.333333V362.666667h682.666666v-53.333334a53.333333 53.333333 0 0 0-49.834666-53.226666L800 256H725.333333v10.666667a32 32 0 0 1-64 0V256H362.666667v10.666667a32 32 0 0 1-64 0V256z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/rizhi.svg b/src/assets/icons/rizhi.svg
new file mode 100644
index 0000000..bfdf2b0
--- /dev/null
+++ b/src/assets/icons/rizhi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M693.333333 128A32 32 0 0 1 725.333333 160V192h74.666667a117.333333 117.333333 0 0 1 117.248 112.618667L917.333333 309.333333v448a117.333333 117.333333 0 0 1-112.618666 117.248L800 874.666667h-576a117.333333 117.333333 0 0 1-117.248-112.618667L106.666667 757.333333v-448a117.333333 117.333333 0 0 1 112.618666-117.248L224 192H298.666667V160a32 32 0 0 1 64 0V192h298.666666V160A32 32 0 0 1 693.333333 128zM853.333333 426.666667H170.666667v330.666666a53.333333 53.333333 0 0 0 49.834666 53.226667L224 810.666667h576a53.333333 53.333333 0 0 0 53.226667-49.834667L853.333333 757.333333V426.666667z m-138.666666 234.666666a32 32 0 0 1 0 64h-426.666667a32 32 0 0 1 0-64h426.666667z m-277.333334-149.333333a32 32 0 0 1 0 64h-149.333333a32 32 0 0 1 0-64h149.333333zM298.666667 256h-74.666667a53.333333 53.333333 0 0 0-53.226667 49.834667L170.666667 309.333333V362.666667h682.666666v-53.333334a53.333333 53.333333 0 0 0-49.834666-53.226666L800 256H725.333333v10.666667a32 32 0 0 1-64 0V256H362.666667v10.666667a32 32 0 0 1-64 0V256z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/saoma.svg b/src/assets/icons/saoma.svg
new file mode 100644
index 0000000..260981d
--- /dev/null
+++ b/src/assets/icons/saoma.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M160 640a32 32 0 0 1 31.850667 28.928L192 672v118.848l0.128 3.221333a41.152 41.152 0 0 0 37.632 37.802667l3.392 0.128H352l3.072 0.149333a32 32 0 0 1 0 63.701334L352 896h-118.848l-4.565333-0.106667a105.152 105.152 0 0 1-100.48-100.352L128 790.848V672l0.149333-3.072A32 32 0 0 1 160 640z m704 0a32 32 0 0 1 31.850667 28.928L896 672v118.848a105.152 105.152 0 0 1-100.586667 105.045333l-4.565333 0.106667H672a32 32 0 0 1-3.072-63.850667L672 832h118.848a41.152 41.152 0 0 0 41.024-37.930667l0.128-3.2V672a32 32 0 0 1 32-32z m0-160a32 32 0 0 1 0 64h-704a32 32 0 0 1 0-64h704zM352 128a32 32 0 0 1 3.072 63.850667L352 192h-118.848a41.152 41.152 0 0 0-41.024 37.930667l-0.128 3.2V352a32 32 0 0 1-63.850667 3.072L128 352v-118.848a105.152 105.152 0 0 1 100.586667-105.045333L233.152 128H352z m438.848 0l4.565333 0.106667a105.152 105.152 0 0 1 100.48 100.352l0.106667 4.693333V352l-0.149333 3.072a32 32 0 0 1-63.701334 0L832 352v-118.848l-0.128-3.221333a41.152 41.152 0 0 0-37.632-37.802667L790.848 192H672l-3.072-0.149333a32 32 0 0 1 0-63.701334L672 128h118.848z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/set_pay.svg b/src/assets/icons/set_pay.svg
new file mode 100644
index 0000000..639bb8e
--- /dev/null
+++ b/src/assets/icons/set_pay.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M552 593.8a44 44 0 1 0 44-44 44 44 0 0 0-44 44z m368-140h-88v-140a40 40 0 0 0-40-40H569.2l-82.9-143.6a40.2 40.2 0 0 0-54.7-14.7L150.8 277.7a39.9 39.9 0 0 0-22.8 36.1v560a40 40 0 0 0 40 40h624a40 40 0 0 0 40-40v-140h88a40 40 0 0 0 40-40v-200a40 40 0 0 0-40-40zM439.9 193.9l46.2 79.9H301.5zM760 841.8H200v-496h560v108H588a140 140 0 0 0 0 280h172z m136-172H588a76 76 0 0 1 0-152h308z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/set_peisong.svg b/src/assets/icons/set_peisong.svg
new file mode 100644
index 0000000..a87ca69
--- /dev/null
+++ b/src/assets/icons/set_peisong.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M744 251.1a40.1 40.1 0 0 0-31.3-15.1H640v-68a40 40 0 0 0-40-40H104a40 40 0 0 0-40 40v560a40 40 0 0 0 40 40h88a128 128 0 0 0 256 0h188a128 128 0 0 0 256 0h28a40 40 0 0 0 40-40V536.5a39.9 39.9 0 0 0-8.7-24.9zM697.3 308l95.5 120H640V308zM320 824a56 56 0 1 1 56-56 56 56 0 0 1-56 56z m248-128H425.8a127.9 127.9 0 0 0-211.6 0H136V200h432v496z m-120.1 67.6z m-0.3-5.5z m-0.4-4.4c0-0.3-0.1-0.6-0.1-1s0.1 0.7 0.1 1z m-0.7-5.3z m-0.7-4.3a2.9 2.9 0 0 1-0.2-0.9 2.9 2.9 0 0 0 0.2 0.9z m-1.1-5.2a0.1 0.1 0 0 0-0.1-0.1 0.1 0.1 0 0 1 0.1 0.1z m-1.1-4.2c-0.1-0.3-0.1-0.5-0.2-0.8s0.1 0.5 0.2 0.8z m-1.4-5a0.1 0.1 0 0 0-0.1-0.1 0.1 0.1 0 0 1 0.1 0.1z m-1.4-4.1a2.5 2.5 0 0 1-0.2-0.7 2.5 2.5 0 0 0 0.2 0.7z m-1.8-4.8z m-1.7-4.1l-0.2-0.5z m-4.1-8.5c-0.1-0.1-0.1-0.3-0.2-0.4s0.1 0.3 0.2 0.4z m-4.7-8.1l-0.2-0.3z m-236.4 63.5z m0.3-5.5z m0.4-4.4c0-0.3 0.1-0.6 0.1-1s-0.1 0.7-0.1 1z m0.7-5.3z m0.7-4.3a2.9 2.9 0 0 0 0.2-0.9 2.9 2.9 0 0 1-0.2 0.9z m1.1-5.2a0.1 0.1 0 0 1 0.1-0.1 0.1 0.1 0 0 0-0.1 0.1z m1.1-4.2c0.1-0.3 0.1-0.5 0.2-0.8s-0.1 0.5-0.2 0.8z m1.4-5a0.1 0.1 0 0 1 0.1-0.1 0.1 0.1 0 0 0-0.1 0.1z m1.4-4.1a2.5 2.5 0 0 0 0.2-0.7 2.5 2.5 0 0 1-0.2 0.7z m1.8-4.8z m1.7-4.1l0.2-0.5z m4.1-8.5c0.1-0.1 0.1-0.3 0.2-0.4s-0.1 0.3-0.2 0.4z m4.7-8.1l0.2-0.3zM764 824a56 56 0 1 1 56-56 56 56 0 0 1-56 56z m0-184a127.7 127.7 0 0 0-105.8 56H640V492h203.7l44.3 55.7V696h-18.2A127.7 127.7 0 0 0 764 640z m-123.6 94.7c0.1-0.3 0.1-0.5 0.2-0.8s-0.1 0.5-0.2 0.8z m1.4-5a0.1 0.1 0 0 1 0.1-0.1 0.1 0.1 0 0 0-0.1 0.1z m1.4-4.1a2.5 2.5 0 0 0 0.2-0.7 2.5 2.5 0 0 1-0.2 0.7z m1.8-4.8z m1.7-4.1l0.2-0.5z m4.1-8.5c0.1-0.1 0.1-0.3 0.2-0.4s-0.1 0.3-0.2 0.4z m4.7-8.1l0.2-0.3z m232.1 34.6c-0.1-0.3-0.1-0.5-0.2-0.8s0.1 0.5 0.2 0.8z m-1.4-5a0.1 0.1 0 0 0-0.1-0.1 0.1 0.1 0 0 1 0.1 0.1z m-1.4-4.1a2.5 2.5 0 0 1-0.2-0.7 2.5 2.5 0 0 0 0.2 0.7z m-1.8-4.8z m-1.7-4.1l-0.2-0.5z m-4.1-8.5c-0.1-0.1-0.1-0.3-0.2-0.4s0.1 0.3 0.2 0.4z m-4.7-8.1l-0.2-0.3z m19.4 62.4z m-3.3-23.7a0.1 0.1 0 0 1 0.1 0.1 0.1 0.1 0 0 0-0.1-0.1z m1 4.4a2.9 2.9 0 0 0 0.2 0.9 2.9 2.9 0 0 1-0.2-0.9z m0.9 5.1z m0.6 4.4c0 0.4 0.1 0.7 0.1 1s-0.1-0.6-0.1-1z m0.5 5.3z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/set_user.svg b/src/assets/icons/set_user.svg
new file mode 100644
index 0000000..800baf5
--- /dev/null
+++ b/src/assets/icons/set_user.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M947.6 575.6l-74.3-74.4a42.9 42.9 0 0 0-30.5-12.3 49.4 49.4 0 0 0-34.8 14.7l-279 279a50.1 50.1 0 0 0-13.8 25.5L488 942a16 16 0 0 0 15.6 19.2 12.4 12.4 0 0 0 3.3-0.4l133.9-27.1a50.9 50.9 0 0 0 25.4-13.8l279.1-279.1c18.6-18.6 19.7-47.9 2.3-65.2zM623.8 871.8l-58.7 11.9 11.9-58.6 184.2-184.2 46.8 46.7zM847.6 648l-46.8-46.7 41-41 46.8 46.7zM512 604c144.7 0 262-117.3 262-262S656.7 80 512 80 250 197.3 250 342a261.7 261.7 0 0 0 117.4 218.5c-140 57.4-239.3 195.4-239.3 355.5v25.5a4 4 0 0 0 4 4h64a4 4 0 0 0 4-4V916a307.1 307.1 0 0 1 24.6-120.9 315.1 315.1 0 0 1 166.4-166.5A307.9 307.9 0 0 1 512 604zM377.6 476.4A190.2 190.2 0 1 1 512 532a189.1 189.1 0 0 1-134.4-55.6z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/set_weihu.svg b/src/assets/icons/set_weihu.svg
new file mode 100644
index 0000000..e6765f1
--- /dev/null
+++ b/src/assets/icons/set_weihu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M860 760H296.3a88 88 0 1 0 0 72H860a4 4 0 0 0 4-4v-64a4 4 0 0 0-4-4zM216 316a87.8 87.8 0 0 0 80.3-52H860a4 4 0 0 0 4-4v-64a4 4 0 0 0-4-4H296.3A88 88 0 1 0 216 316z m592 108a87.8 87.8 0 0 0-80.3 52H164a4 4 0 0 0-4 4v64a4 4 0 0 0 4 4h563.7A88 88 0 1 0 808 424z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shanchu.svg b/src/assets/icons/shanchu.svg
new file mode 100644
index 0000000..9655138
--- /dev/null
+++ b/src/assets/icons/shanchu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 106.666667a106.666667 106.666667 0 0 1 106.581333 102.378666L618.666667 213.333333h245.333333a32 32 0 0 1 0 64H789.333333v522.666667a117.333333 117.333333 0 0 1-112.618666 117.248L672 917.333333h-341.333333a117.333333 117.333333 0 0 1-117.248-112.618666L213.333333 800V277.333333H160a32 32 0 0 1 0-64H405.333333a106.666667 106.666667 0 0 1 106.666667-106.666666z m213.333333 170.666666H277.333333v522.666667a53.333333 53.333333 0 0 0 49.834667 53.226667L330.666667 853.333333h341.333333a53.333333 53.333333 0 0 0 53.226667-49.834666L725.333333 800V277.333333z m-309.333333 149.333334a32 32 0 0 1 32 32v234.666666a32 32 0 0 1-64 0v-234.666666a32 32 0 0 1 32-32z m170.666667 0a32 32 0 0 1 32 32v234.666666a32 32 0 0 1-64 0v-234.666666a32 32 0 0 1 32-32zM512 164.842667c-25.706667 0-46.72 20.010667-48.384 45.312l-0.106667 3.178666h96.981334A48.490667 48.490667 0 0 0 512 164.842667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shanchu_mian.svg b/src/assets/icons/shanchu_mian.svg
new file mode 100644
index 0000000..17ffa4e
--- /dev/null
+++ b/src/assets/icons/shanchu_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 106.666667a106.666667 106.666667 0 0 1 106.581333 102.378666L618.666667 213.333333h245.333333a32 32 0 0 1 0 64H789.333333v522.666667a117.333333 117.333333 0 0 1-112.618666 117.248L672 917.333333h-341.333333a117.333333 117.333333 0 0 1-117.248-112.618666L213.333333 800V277.333333H160a32 32 0 0 1 0-64H405.333333a106.666667 106.666667 0 0 1 106.666667-106.666666z m-96 320a32 32 0 0 0-32 32v234.666666a32 32 0 0 0 64 0v-234.666666a32 32 0 0 0-32-32z m170.666667 0a32 32 0 0 0-32 32v234.666666a32 32 0 0 0 64 0v-234.666666a32 32 0 0 0-32-32z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shangchuan.svg b/src/assets/icons/shangchuan.svg
new file mode 100644
index 0000000..f2d1a01
--- /dev/null
+++ b/src/assets/icons/shangchuan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M864 704a32 32 0 0 1 31.850667 28.928L896 736v21.333333a117.333333 117.333333 0 0 1-112.618667 117.248L778.666667 874.666667h-533.333334a117.333333 117.333333 0 0 1-117.248-112.618667L128 757.333333v-21.333333a32 32 0 0 1 63.850667-3.072L192 736v21.333333a53.333333 53.333333 0 0 0 49.834667 53.226667L245.333333 810.666667h533.333334a53.333333 53.333333 0 0 0 53.226666-49.834667L832 757.333333v-21.333333a32 32 0 0 1 32-32zM512 149.333333c4.16 0 8.128 0.789333 11.776 2.24l0.32 0.106667c3.861333 1.514667 7.488 3.797333 10.624 6.826667L779.946667 394.88c12.544 12.16 12.544 31.893333 0 44.053333a32.853333 32.853333 0 0 1-45.44 0L544 255.424V714.666667a32 32 0 0 1-64 0V255.424l-190.464 183.509333a32.853333 32.853333 0 0 1-45.44 0 30.485333 30.485333 0 0 1 0-44.053333L489.258667 158.506667c3.157333-3.029333 6.805333-5.333333 10.688-6.848A32.213333 32.213333 0 0 1 512 149.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shangchuanzhaopian.svg b/src/assets/icons/shangchuanzhaopian.svg
new file mode 100644
index 0000000..5e90e91
--- /dev/null
+++ b/src/assets/icons/shangchuanzhaopian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M618.666667 170.666667a32 32 0 0 1 3.072 63.850666L618.666667 234.666667H202.666667a53.333333 53.333333 0 0 0-53.226667 49.834666L149.333333 288.021333v448c0 8.533333 2.005333 16.64 5.589334 23.808l174.442666-174.442666a32 32 0 0 1 42.837334-2.197334l2.432 2.197334 85.312 85.333333 169.450666-150.613333a32 32 0 0 1 40.170667-1.92l2.474667 2.005333 2.304 2.304 199.936 219.946667 0.277333-3.2 0.106667-3.221334V490.666667l0.149333-3.072a32 32 0 0 1 63.701333 0L938.666667 490.666667v245.333333a117.333333 117.333333 0 0 1-112.618667 117.248l-4.714667 0.106667h-618.666666a117.333333 117.333333 0 0 1-117.248-112.64L85.333333 736.042667v-448a117.333333 117.333333 0 0 1 112.618667-117.248l4.714667-0.085334L618.666667 170.666667z m29.610666 418.282666l-142.997333 127.104 61.354667 61.333334c3.477333 3.498667 5.994667 7.594667 7.552 11.968H821.333333c2.88 0 5.717333-0.234667 8.490667-0.682667l-181.546667-199.722667zM352 653.269333L215.893333 789.333333h272.192L352 653.226667zM341.333333 298.666667a106.666667 106.666667 0 1 1 0 213.333333 106.666667 106.666667 0 0 1 0-213.333333zM789.333333 170.666667a32 32 0 0 1 32 32v85.312l85.333334 0.021333a32 32 0 0 1 0 64l-85.354667-0.021333 0.021333 85.354666a32 32 0 0 1-64 0l-0.021333-85.354666-85.312 0.021333a32 32 0 0 1 0-64l85.333333-0.021333V202.666667A32 32 0 0 1 789.333333 170.666667z m-448 192a42.666667 42.666667 0 1 0 0 85.333333 42.666667 42.666667 0 0 0 0-85.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shangpinguanli.svg b/src/assets/icons/shangpinguanli.svg
new file mode 100644
index 0000000..c15f1a1
--- /dev/null
+++ b/src/assets/icons/shangpinguanli.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M853.333333 576a85.333333 85.333333 0 0 1 85.333334 85.333333v106.666667a85.333333 85.333333 0 0 1-85.333334 85.333333H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333v-106.666667a85.333333 85.333333 0 0 1 85.333334-85.333333h682.666666z m-288 106.666667h-106.666666a32 32 0 0 0-3.072 63.850666L458.666667 746.666667h106.666666a32 32 0 0 0 0-64zM853.333333 256a85.333333 85.333333 0 0 1 85.333334 85.333333v106.666667a85.333333 85.333333 0 0 1-85.333334 85.333333H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333v-106.666667a85.333333 85.333333 0 0 1 85.333334-85.333333h682.666666z m-288 106.666667h-106.666666a32 32 0 0 0-3.072 63.850666L458.666667 426.666667h106.666666a32 32 0 0 0 0-64z m167.317334-234.666667a85.333333 85.333333 0 0 1 60.352 25.002667L853.333333 213.333333H170.666667l60.330666-60.330666A85.333333 85.333333 0 0 1 291.349333 128h441.301334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shangpinzhushou.svg b/src/assets/icons/shangpinzhushou.svg
new file mode 100644
index 0000000..9972561
--- /dev/null
+++ b/src/assets/icons/shangpinzhushou.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M640 213.333333a42.666667 42.666667 0 0 0-39.466667-42.56L597.333333 170.666667h-170.666666a42.666667 42.666667 0 0 0-42.56 39.466666L384 213.333333v21.333334h-64v-21.333334a106.666667 106.666667 0 0 1 102.037333-106.56L426.666667 106.666667h170.666666a106.666667 106.666667 0 0 1 106.56 102.037333L704 213.333333v21.333334h149.333333a85.333333 85.333333 0 0 1 85.333334 85.333333v469.333333a85.333333 85.333333 0 0 1-85.333334 85.333334H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333334V320a85.333333 85.333333 0 0 1 85.333334-85.333333h469.333333v-21.333334z m213.333333 170.666667H170.666667a21.333333 21.333333 0 0 0-2.496 42.517333L170.666667 426.666667h256v21.333333a42.666667 42.666667 0 0 0 39.466666 42.56L469.333333 490.666667h85.333334a42.666667 42.666667 0 0 0 42.56-39.466667L597.333333 448v-21.333333h256a21.333333 21.333333 0 0 0 2.496-42.517334L853.333333 384z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shangpuyuding.svg b/src/assets/icons/shangpuyuding.svg
new file mode 100644
index 0000000..4250f00
--- /dev/null
+++ b/src/assets/icons/shangpuyuding.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 234.666667l320 170.666666v405.333334a85.333333 85.333333 0 0 1-85.333333 85.333333H277.333333a85.333333 85.333333 0 0 1-85.333333-85.333333V405.333333l320-170.666666z m0 149.333333a32 32 0 0 0-32 32v213.333333A32 32 0 0 0 512 661.333333h192a32 32 0 0 0 0-64h-160.021333l0.021333-181.333333a32 32 0 0 0-28.928-31.850667z m12.16-253.76l3.285333 1.493333 372.458667 209.408c16.021333 8.234667 22.101333 27.477333 13.568 42.944-8.021333 14.570667-26.133333 20.629333-41.6 14.421334l-2.858667-1.301334-356.992-201.450666-356.992 201.365333a33.557333 33.557333 0 0 1-42.837333-10.389333l-1.642667-2.645334a31.146667 31.146667 0 0 1 10.773334-41.386666l2.709333-1.578667 372.48-209.365333a33.898667 33.898667 0 0 1 27.648-1.493334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shebeiguanli.svg b/src/assets/icons/shebeiguanli.svg
new file mode 100644
index 0000000..1ca4ef0
--- /dev/null
+++ b/src/assets/icons/shebeiguanli.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M853.333333 170.666667a85.333333 85.333333 0 0 1 85.333334 85.333333v208.32a63.744 63.744 0 0 0-37.781334-16.128L896 448h-128a64 64 0 0 0-63.893333 60.245333L704 512v256h-128v42.666667h74.666667a32 32 0 0 1 0 64h-277.333334a32 32 0 0 1 0-64H448v-42.666667H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V256a85.333333 85.333333 0 0 1 85.333334-85.333333h682.666666z m21.333334 320a42.666667 42.666667 0 0 1 42.666666 42.666666v298.666667a42.666667 42.666667 0 0 1-42.666666 42.666667h-85.333334a42.666667 42.666667 0 0 1-42.666666-42.666667V533.333333a42.666667 42.666667 0 0 1 42.666666-42.666666h85.333334z m-21.333334 277.333333h-42.666666a21.333333 21.333333 0 0 0-2.496 42.517333L810.666667 810.666667h42.666666a21.333333 21.333333 0 0 0 0-42.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shengfuwangputong.svg b/src/assets/icons/shengfuwangputong.svg
new file mode 100644
index 0000000..467b687
--- /dev/null
+++ b/src/assets/icons/shengfuwangputong.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c145.984 0 265.642667 112.810667 276.522667 256H906.666667a32 32 0 0 1 0 64H896l-54.656 437.248A85.333333 85.333333 0 0 1 756.650667 917.333333H267.349333a85.333333 85.333333 0 0 1-84.672-74.752L128 405.333333h-10.666667a32 32 0 0 1 0-64h118.144C246.357333 198.144 366.016 85.333333 512 85.333333z m-96 469.333334a32 32 0 0 0-32 32v149.333333a32 32 0 0 0 64 0v-149.333333a32 32 0 0 0-32-32z m192 0a32 32 0 0 0-32 32v149.333333a32 32 0 0 0 64 0v-149.333333a32 32 0 0 0-32-32zM512 146.965333c-111.936 0-203.946667 85.248-214.656 194.368h429.312C715.946667 232.213333 623.936 146.986667 512 146.986667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shengyin.svg b/src/assets/icons/shengyin.svg
new file mode 100644
index 0000000..9b1d63b
--- /dev/null
+++ b/src/assets/icons/shengyin.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M467.626667 199.253333a116.330667 116.330667 0 0 1 165.461333 12.906667A119.68 119.68 0 0 1 661.333333 289.472V734.506667C661.333333 800.149333 608.810667 853.333333 544 853.333333a116.48 116.48 0 0 1-76.373333-28.586666l-148.8-129.152H224c-63.210667 0-114.773333-50.624-117.248-114.026667L106.666667 576.789333v-129.578666c0-65.621333 52.522667-118.805333 117.333333-118.805334h94.805333z m335.274666 43.712C873.813333 304.832 917.333333 405.205333 917.333333 512c0 108.437333-42.944 207.936-114.709333 269.269333-14.890667 12.736-36.586667 10.090667-48.448-5.909333-11.861333-16-9.386667-39.317333 5.504-52.053333 54.997333-47.018667 88.682667-125.013333 88.682667-211.306667 0-84.693333-34.346667-163.882667-88.96-211.541333-14.784-12.906667-17.024-36.224-5.013334-52.117334 12.010667-15.872 33.728-18.282667 48.512-5.376z m-218.410666 11.349334a52.885333 52.885333 0 0 0-75.2-5.845334l-166.784 144.746667H224c-29.44 0-53.333333 24.170667-53.333333 53.973333v129.6c0 29.824 23.893333 54.016 53.333333 54.016h118.506667l166.784 144.725334c9.664 8.384 21.973333 13.013333 34.709333 13.013333 29.44 0 53.333333-24.192 53.333333-54.016V289.493333a54.4 54.4 0 0 0-12.842666-35.157333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shengyin_mian.svg b/src/assets/icons/shengyin_mian.svg
new file mode 100644
index 0000000..00c76a7
--- /dev/null
+++ b/src/assets/icons/shengyin_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M467.626667 199.253333a116.330667 116.330667 0 0 1 165.461333 12.906667A119.68 119.68 0 0 1 661.333333 289.472V734.506667C661.333333 800.149333 608.810667 853.333333 544 853.333333a116.48 116.48 0 0 1-76.373333-28.586666l-148.8-129.152H224c-63.210667 0-114.773333-50.624-117.248-114.026667L106.666667 576.789333v-129.578666c0-65.621333 52.522667-118.805333 117.333333-118.805334h94.805333z m335.274666 43.712C873.813333 304.832 917.333333 405.205333 917.333333 512c0 108.437333-42.944 207.936-114.709333 269.269333-14.890667 12.736-36.586667 10.090667-48.448-5.909333-11.861333-16-9.386667-39.317333 5.504-52.053333 54.997333-47.018667 88.682667-125.013333 88.682667-211.306667 0-84.693333-34.346667-163.882667-88.96-211.541333-14.784-12.906667-17.024-36.224-5.013334-52.117334 12.010667-15.872 33.728-18.282667 48.512-5.376z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shezhi.svg b/src/assets/icons/shezhi.svg
new file mode 100644
index 0000000..785b60f
--- /dev/null
+++ b/src/assets/icons/shezhi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M666.325333 128a118.101333 118.101333 0 0 1 102.208 58.816l154.325334 266.368a117.290667 117.290667 0 0 1 0 117.632l-154.325334 266.368A118.101333 118.101333 0 0 1 666.325333 896H357.674667a118.101333 118.101333 0 0 1-102.208-58.816L101.12 570.816a117.290667 117.290667 0 0 1 0-117.632l154.325333-266.368A118.101333 118.101333 0 0 1 357.674667 128z m0 64.170667H357.674667c-19.157333 0-36.864 10.176-46.464 26.730666L156.906667 485.269333c-9.6 16.533333-9.6 36.906667 0 53.461334l154.304 266.368a53.696 53.696 0 0 0 46.464 26.730666h308.650666c19.157333 0 36.864-10.176 46.464-26.730666l154.304-266.368c9.6-16.533333 9.6-36.906667 0-53.461334L712.789333 218.88a53.696 53.696 0 0 0-46.464-26.730667zM512 362.666667a149.333333 149.333333 0 1 1 0 298.666666 149.333333 149.333333 0 0 1 0-298.666666z m0 64a85.333333 85.333333 0 1 0 0 170.666666 85.333333 85.333333 0 0 0 0-170.666666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shezhi_mian.svg b/src/assets/icons/shezhi_mian.svg
new file mode 100644
index 0000000..0bdc106
--- /dev/null
+++ b/src/assets/icons/shezhi_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M666.325333 128a118.101333 118.101333 0 0 1 102.208 58.816l154.325334 266.368a117.290667 117.290667 0 0 1 0 117.632l-154.325334 266.368A118.101333 118.101333 0 0 1 666.325333 896H357.674667a118.101333 118.101333 0 0 1-102.208-58.816L101.12 570.816a117.290667 117.290667 0 0 1 0-117.632l154.325333-266.368A118.101333 118.101333 0 0 1 357.674667 128zM512 362.666667a149.333333 149.333333 0 1 0 0 298.666666 149.333333 149.333333 0 0 0 0-298.666666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shichang.svg b/src/assets/icons/shichang.svg
new file mode 100644
index 0000000..d5d5d88
--- /dev/null
+++ b/src/assets/icons/shichang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 106.666667c87.978667 0 161.130667 64.469333 176 149.376 58.218667 1.066667 106.453333 45.888 112.832 104.32l0.426667 4.906666 30.464 426.666667c4.394667 64.64-43.712 120.661333-107.456 125.12l-3.968 0.213333-3.989334 0.064H307.669333C243.797333 917.333333 192 864.810667 192 800l0.064-4.053333 0.213333-4.010667 30.464-426.666667c4.053333-59.904 51.968-106.752 110.613334-109.162666l2.624-0.064 1.045333-5.397334C353.984 168.426667 425.877333 106.666667 512 106.666667z m173.866667 213.333333h-347.733334c-26.474667 0-48.64 19.925333-52.096 46.208l-0.362666 3.456-30.549334 428.501333-0.021333 1.834667c0 28.266667 21.696 51.413333 49.109333 53.226667l3.456 0.106666h408.64l3.626667-0.128c27.818667-1.941333 49.066667-25.493333 48.96-53.376l-0.128-3.498666-30.464-426.666667C736.426667 341.717333 713.493333 320 685.866667 320zM437.333333 405.333333a32 32 0 1 1 0 64 32 32 0 0 1 0-64z m149.333334 0a32 32 0 1 1 0 64 32 32 0 0 1 0-64zM512 170.666667c-52.949333 0-97.6 36.096-111.317333 85.333333h222.634666C609.6 206.784 564.949333 170.666667 512 170.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shichang_mian.svg b/src/assets/icons/shichang_mian.svg
new file mode 100644
index 0000000..083b301
--- /dev/null
+++ b/src/assets/icons/shichang_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 106.666667c87.978667 0 161.130667 64.469333 176 149.376 58.218667 1.066667 106.453333 45.888 112.832 104.32l0.426667 4.906666 30.464 426.666667c4.394667 64.64-43.712 120.661333-107.456 125.12l-3.968 0.213333-3.989334 0.064H307.669333C243.797333 917.333333 192 864.810667 192 800l0.064-4.053333 0.213333-4.010667 30.464-426.666667c4.053333-59.904 51.968-106.752 110.613334-109.162666l2.624-0.064 1.045333-5.397334C353.984 168.426667 425.877333 106.666667 512 106.666667z m-74.666667 298.666666a32 32 0 1 0 0 64 32 32 0 0 0 0-64z m149.333334 0a32 32 0 1 0 0 64 32 32 0 0 0 0-64zM512 170.666667c-52.949333 0-97.6 36.096-111.317333 85.333333h222.634666C609.6 206.784 564.949333 170.666667 512 170.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shijian.svg b/src/assets/icons/shijian.svg
new file mode 100644
index 0000000..9ad8b2e
--- /dev/null
+++ b/src/assets/icons/shijian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m0 394.666667a32 32 0 0 1-32-32V256a32 32 0 0 1 64 0l-0.021333 224H746.666667a32 32 0 0 1 0 64H512z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shijian_mian.svg b/src/assets/icons/shijian_mian.svg
new file mode 100644
index 0000000..6c00d41
--- /dev/null
+++ b/src/assets/icons/shijian_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m234.666667 458.666667a32 32 0 0 0 0-64h-202.688L544 256a32 32 0 0 0-28.928-31.850667L512 224a32 32 0 0 0-32 32v256a32 32 0 0 0 32 32z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shoudan.svg b/src/assets/icons/shoudan.svg
new file mode 100644
index 0000000..9967dd8
--- /dev/null
+++ b/src/assets/icons/shoudan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M706.986667 106.666667a85.333333 85.333333 0 0 1 85.333333 85.333333l-0.021333 355.626667h59.562666a42.666667 42.666667 0 0 1 29.461334 11.84l2.56 2.624a42.666667 42.666667 0 0 1-1.173334 57.685333l-2.645333 2.56-311.658667 274.56a85.333333 85.333333 0 0 1-109.312 2.944l-3.498666-2.944-311.658667-274.56a42.666667 42.666667 0 0 1 25.024-74.581333l3.2-0.128h59.52V192a85.333333 85.333333 0 0 1 85.333333-85.333333h389.973334z m-96.490667 215.786666a32 32 0 0 0-41.685333 2.069334l-59.221334 56.234666-59.178666-56.234666a32 32 0 0 0-44.074667 0l-0.853333 0.789333a29.952 29.952 0 0 0 0 43.456l40.106666 38.08h-32.234666a30.72 30.72 0 0 0 0 61.44h66.304v40.96h-44.757334a30.72 30.72 0 0 0 0 61.44h44.736v49.941333a32 32 0 0 0 32 32h0.704a32 32 0 0 0 32-32v-49.92h44.757334a30.72 30.72 0 0 0 0-61.44l-44.778667-0.021333 0.021333-40.96h66.304a30.72 30.72 0 1 0 0-61.44h-37.034666l40.106666-38.08 2.133334-2.218667a29.973333 29.973333 0 0 0-2.133334-41.237333l-0.832-0.789333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shouqi.svg b/src/assets/icons/shouqi.svg
new file mode 100644
index 0000000..e8386f1
--- /dev/null
+++ b/src/assets/icons/shouqi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M158.293333 652.949333a29.397333 29.397333 0 0 0 0 42.282667 31.146667 31.146667 0 0 0 43.306667 0l302.933333-295.765333a10.666667 10.666667 0 0 1 14.933334 0l302.933333 295.765333a31.146667 31.146667 0 0 0 43.306667 0c11.946667-11.669333 11.946667-30.592 0-42.282667L533.653333 328.768a31.146667 31.146667 0 0 0-43.306666 0L158.293333 652.949333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shouqi_mian.svg b/src/assets/icons/shouqi_mian.svg
new file mode 100644
index 0000000..b022d4c
--- /dev/null
+++ b/src/assets/icons/shouqi_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M465.472 347.946667L183.317333 646.656A21.333333 21.333333 0 0 0 198.826667 682.666667h626.346666a21.333333 21.333333 0 0 0 15.509334-35.989334L558.528 347.946667a64 64 0 0 0-93.056 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shouye.svg b/src/assets/icons/shouye.svg
new file mode 100644
index 0000000..288b24f
--- /dev/null
+++ b/src/assets/icons/shouye.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M437.482667 134.784a112.810667 112.810667 0 0 1 149.034666 0l256.021334 205.717333A94.613333 94.613333 0 0 1 874.666667 411.648v390.613333C874.666667 865.813333 823.722667 917.333333 760.896 917.333333H263.104C200.277333 917.333333 149.333333 865.813333 149.333333 802.261333v-390.613333c0-27.306667 11.733333-53.269333 32.128-71.146667z m108.373333 47.424a51.285333 51.285333 0 0 0-67.733333 0l-256.021334 205.717333c-6.805333 5.973333-10.709333 14.613333-10.709333 23.722667v390.613333c0 28.885333 23.146667 52.309333 51.712 52.309334h497.792c28.565333 0 51.712-23.424 51.712-52.309334v-390.613333c0-9.109333-3.904-17.749333-10.709333-23.722667zM608 640a32 32 0 0 1 0 64h-192a32 32 0 0 1 0-64h192z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shouye_mian.svg b/src/assets/icons/shouye_mian.svg
new file mode 100644
index 0000000..d180e9b
--- /dev/null
+++ b/src/assets/icons/shouye_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M437.482667 134.784a112.810667 112.810667 0 0 1 149.034666 0l256.021334 205.717333A94.613333 94.613333 0 0 1 874.666667 411.648v390.613333C874.666667 865.813333 823.722667 917.333333 760.896 917.333333H263.104C200.277333 917.333333 149.333333 865.813333 149.333333 802.261333v-390.613333c0-27.306667 11.733333-53.269333 32.128-71.146667zM608 640h-192a32 32 0 0 0 0 64h192a32 32 0 0 0 0-64z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shouyiren.svg b/src/assets/icons/shouyiren.svg
new file mode 100644
index 0000000..3b409d2
--- /dev/null
+++ b/src/assets/icons/shouyiren.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M631.936 584.042667c43.242667 5.802667 86.464 14.741333 129.685333 26.816a183.829333 183.829333 0 0 1 134.378667 177.066666V832a85.333333 85.333333 0 0 1-85.333333 85.333333H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333333v-44.096a183.829333 183.829333 0 0 1 134.4-177.066667 958.506667 958.506667 0 0 1 111.146667-24.106666l18.538666-2.688 89.749334 89.792c7.893333 7.893333 18.112 12.032 28.437333 12.458666h3.456l3.434667-0.277333a42.474667 42.474667 0 0 0 25.002666-12.181333l89.770667-89.792z m22.336 68.16l-66.837333 66.88a106.666667 106.666667 0 0 1-147.008 3.669333l-3.84-3.669333-66.88-66.88-3.648 0.64c-23.04 4.032-46.08 9.024-69.162667 14.997333l-17.28 4.650667a119.829333 119.829333 0 0 0-87.509333 110.229333L192 787.904V832a21.333333 21.333333 0 0 0 18.837333 21.184L213.333333 853.333333h597.333334a21.333333 21.333333 0 0 0 21.184-18.837333L832 832v-44.096a119.829333 119.829333 0 0 0-87.594667-115.413333 900.629333 900.629333 0 0 0-86.442666-19.669334l-3.690667-0.618666zM512 128c117.824 0 213.333333 95.509333 213.333333 213.333333 0 115.84-92.309333 210.090667-207.36 213.248L512 554.666667c-117.824 0-213.333333-95.509333-213.333333-213.333334 0-115.84 92.309333-210.090667 207.36-213.248L512 128z m0 64a149.333333 149.333333 0 1 0 0 298.666667 149.333333 149.333333 0 0 0 0-298.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/show.svg b/src/assets/icons/show.svg
new file mode 100644
index 0000000..2fdf9b9
--- /dev/null
+++ b/src/assets/icons/show.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M956.8 502.4C918.9 452.3 734.2 224 512 224S105.1 452.3 67.2 502.4a15.9 15.9 0 0 0 0 19.2C105.1 571.7 289.8 800 512 800s406.9-228.3 444.8-278.4a15.9 15.9 0 0 0 0-19.2zM758.4 623.5c-39.7 31.9-79.4 57-118.1 74.4-44.2 20-87.4 30.1-128.3 30.1s-84.1-10.1-128.3-30.1c-38.7-17.4-78.4-42.5-118.1-74.4-48.7-39.2-88.3-81.7-113.7-111.5 25.4-29.8 65-72.3 113.7-111.5 39.7-31.9 79.4-57 118.1-74.4 44.2-20 87.4-30.1 128.3-30.1s84.1 10.1 128.3 30.1c38.7 17.4 78.4 42.5 118.1 74.4 48.7 39.2 88.3 81.7 113.7 111.5-25.4 29.8-65 72.3-113.7 111.5zM513 384a128 128 0 1 0 128 128 128 128 0 0 0-128-128z m0 192a64 64 0 1 1 64-64 64.1 64.1 0 0 1-64 64z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shuangjiantouxiangyou.svg b/src/assets/icons/shuangjiantouxiangyou.svg
new file mode 100644
index 0000000..56c0e61
--- /dev/null
+++ b/src/assets/icons/shuangjiantouxiangyou.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M563.050667 865.706667c-11.690667 11.946667-30.613333 11.946667-42.282667 0a31.146667 31.146667 0 0 1 0-43.306667l295.765333-302.933333a10.666667 10.666667 0 0 0 0-14.933334L520.768 201.6a31.146667 31.146667 0 0 1 0-43.306667 29.397333 29.397333 0 0 1 42.282667 0l324.181333 332.053334a31.146667 31.146667 0 0 1 0 43.306666L563.050667 865.706667z"  /><path d="M179.050667 865.706667c-11.690667 11.946667-30.613333 11.946667-42.282667 0a31.146667 31.146667 0 0 1 0-43.306667l295.765333-302.933333a10.666667 10.666667 0 0 0 0-14.933334L136.768 201.6a31.146667 31.146667 0 0 1 0-43.306667 29.397333 29.397333 0 0 1 42.282667 0l324.181333 332.053334a31.146667 31.146667 0 0 1 0 43.306666L179.050667 865.706667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shuangjiantouxiangzuo.svg b/src/assets/icons/shuangjiantouxiangzuo.svg
new file mode 100644
index 0000000..1a90a69
--- /dev/null
+++ b/src/assets/icons/shuangjiantouxiangzuo.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M460.949333 865.706667c11.690667 11.946667 30.613333 11.946667 42.282667 0a31.146667 31.146667 0 0 0 0-43.306667L207.466667 519.466667a10.666667 10.666667 0 0 1 0-14.933334l295.765333-302.933333a31.146667 31.146667 0 0 0 0-43.306667 29.397333 29.397333 0 0 0-42.282667 0L136.768 490.346667a31.146667 31.146667 0 0 0 0 43.306666L460.949333 865.706667z"  /><path d="M844.949333 865.706667c11.690667 11.946667 30.613333 11.946667 42.282667 0a31.146667 31.146667 0 0 0 0-43.306667l-295.765333-302.933333a10.666667 10.666667 0 0 1 0-14.933334l295.765333-302.933333a31.146667 31.146667 0 0 0 0-43.306667 29.397333 29.397333 0 0 0-42.282667 0L520.768 490.346667a31.146667 31.146667 0 0 0 0 43.306666L844.949333 865.706667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shuaxin.svg b/src/assets/icons/shuaxin.svg
new file mode 100644
index 0000000..a4686b3
--- /dev/null
+++ b/src/assets/icons/shuaxin.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M882.688 395.690667l42.133333-11.306667a10.986667 10.986667 0 0 1 13.056 14.762667l-36.864 92.096a32.96 32.96 0 0 1-50.986666 13.696l-77.824-61.290667a11.050667 11.050667 0 0 1 3.946666-19.306667l46.336-12.458666c-49.706667-161.664-223.552-256.533333-392.746666-212.608-172.16 44.693333-274.325333 216.170667-228.181334 382.997333 46.122667 166.826667 223.082667 265.813333 395.221334 221.12 16.661333-4.330667 33.792 5.248 38.250666 21.397333 4.48 16.149333-5.418667 32.746667-22.08 37.077334C407.466667 915.2 196.266667 797.056 141.226667 597.930667 86.165333 398.826667 208.106667 194.154667 413.568 140.8c202.346667-52.522667 410.24 61.269333 469.12 254.890667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shuju.svg b/src/assets/icons/shuju.svg
new file mode 100644
index 0000000..8418b76
--- /dev/null
+++ b/src/assets/icons/shuju.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M583.2 64a4.1 4.1 0 0 0-4.2 4.1V444a4 4 0 0 0 4 4h375.8a4.2 4.2 0 0 0 4.2-4.2C960.8 235 792 66.2 583.2 64zM643 384V134.4a310.4 310.4 0 0 1 62.1 19.4 320.7 320.7 0 0 1 168.1 168.1 312.5 312.5 0 0 1 19.4 62.1z m310 128h-64a4 4 0 0 0-4 4c-1.1 103.2-43.5 199.9-119.5 270.9A375.7 375.7 0 0 1 505.7 888c-98.1-0.9-190.3-39-260.2-107.8A376.2 376.2 0 0 1 133.2 525c-3.5-105.3 35.9-204.8 109.9-278.9A373.4 373.4 0 0 1 505 136a4 4 0 0 0 4-4V68a4 4 0 0 0-4-4 448.3 448.3 0 1 0 452 452 4 4 0 0 0-4-4z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shuju2.svg b/src/assets/icons/shuju2.svg
new file mode 100644
index 0000000..bea4c25
--- /dev/null
+++ b/src/assets/icons/shuju2.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M746.666667 128a170.666667 170.666667 0 0 1 170.666666 170.666667v426.666666a170.666667 170.666667 0 0 1-170.666666 170.666667H277.333333a170.666667 170.666667 0 0 1-170.666666-170.666667V298.666667a170.666667 170.666667 0 0 1 170.666666-170.666667h469.333334zM320 426.666667a32 32 0 0 0-32 32v277.333333a32 32 0 0 0 64 0v-277.333333A32 32 0 0 0 320 426.666667z m384 85.333333a32 32 0 0 0-32 32v192a32 32 0 0 0 64 0v-192A32 32 0 0 0 704 512z m-192-256a32 32 0 0 0-32 32v448a32 32 0 0 0 64 0v-448A32 32 0 0 0 512 256z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shuju_liuliang.svg b/src/assets/icons/shuju_liuliang.svg
new file mode 100644
index 0000000..21b048b
--- /dev/null
+++ b/src/assets/icons/shuju_liuliang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M309.8 595.7a4.1 4.1 0 0 0 5.7-0.3l86.9-96.9a4 4 0 0 1 5.8-0.2L520.4 611a16.2 16.2 0 0 0 22.7 0l221.7-222.6a3.9 3.9 0 0 0 0-5.6l-39.6-39.6a4.2 4.2 0 0 0-5.7 0L534.6 528.8a4 4 0 0 1-5.7 0L405.8 405.2a4.1 4.1 0 0 0-5.9 0.1L267.8 552.7a4 4 0 0 0 0.4 5.6zM732 688H292a4 4 0 0 0-4 4v56a4 4 0 0 0 4 4h440a4 4 0 0 0 4-4v-56a4 4 0 0 0-4-4z m124-560H168a40 40 0 0 0-40 40v688a40 40 0 0 0 40 40h688a40 40 0 0 0 40-40V168a40 40 0 0 0-40-40z m-32 696H200V200h624z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/shuju_mian.svg b/src/assets/icons/shuju_mian.svg
new file mode 100644
index 0000000..5da2d78
--- /dev/null
+++ b/src/assets/icons/shuju_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M490.666667 170.666667a21.333333 21.333333 0 0 1 21.333333 21.333333v298.794667c0 23.488 19.093333 42.538667 42.538667 42.538666H853.333333a21.333333 21.333333 0 0 1 21.333334 21.333334c0 212.074667-171.925333 384-384 384S106.666667 766.741333 106.666667 554.666667 278.592 170.666667 490.666667 170.666667z m103.296-42.666667C772.565333 128 917.333333 272.768 917.333333 451.370667a17.962667 17.962667 0 0 1-18.005333 17.962666H618.666667a42.666667 42.666667 0 0 1-42.666667-42.666666V145.962667c0-9.92 8.042667-17.962667 17.962667-17.962667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/sort.svg b/src/assets/icons/sort.svg
new file mode 100644
index 0000000..1e760a8
--- /dev/null
+++ b/src/assets/icons/sort.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M435.825778 486.684444H284.273778a186.595556 186.595556 0 1 1 186.652444-186.595555v185.685333zM284.273778 181.703111a118.385778 118.385778 0 0 0 0 236.714667h118.328889v-118.328889A118.499556 118.499556 0 0 0 284.444444 181.987556z"  /><path d="M284.444444 910.165333A186.595556 186.595556 0 0 1 284.444444 537.031111h185.514667l0.967111 34.986667v151.552A186.88 186.88 0 0 1 284.444444 910.165333z m0-304.924444a118.328889 118.328889 0 1 0 118.328889 118.328889v-118.328889z"  /><path d="M707.697778 486.684444H522.069333l-0.967111-35.043555V300.088889a186.652444 186.652444 0 1 1 186.595556 186.595555z m-118.272-68.266666h118.272a118.385778 118.385778 0 1 0-118.272-118.328889z"  /><path d="M707.754667 910.165333a186.88 186.88 0 0 1-186.652445-186.595555V537.884444l35.100445-0.853333h151.552a186.595556 186.595556 0 0 1 0 373.134222z m-118.328889-304.924444v118.328889a118.272 118.272 0 1 0 118.328889-118.328889z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/sousuo.svg b/src/assets/icons/sousuo.svg
new file mode 100644
index 0000000..2387e0a
--- /dev/null
+++ b/src/assets/icons/sousuo.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M428.309333 149.333333c154.048 0 278.954667 124.885333 278.954667 278.954667a277.76 277.76 0 0 1-60.245333 173.184l175.68 175.722667a32 32 0 0 1 2.197333 42.816l-2.197333 2.432-0.256 0.256a32 32 0 0 1-45.248 0l-175.722667-175.68a277.781333 277.781333 0 0 1-173.162667 60.224C274.24 707.242667 149.333333 582.357333 149.333333 428.288S274.24 149.333333 428.309333 149.333333z m0 64.384c-118.528 0-214.613333 96.064-214.613333 214.570667s96.085333 214.592 214.613333 214.592c57.749333 0 110.165333-22.826667 148.736-59.925333 0.768-1.066667 1.664-2.069333 2.602667-3.029334l0.277333-0.256c0.981333-0.981333 1.984-1.877333 3.050667-2.688a213.674667 213.674667 0 0 0 59.904-148.693333c0-118.506667-96.064-214.570667-214.570667-214.570667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/sucai.svg b/src/assets/icons/sucai.svg
new file mode 100644
index 0000000..23499f8
--- /dev/null
+++ b/src/assets/icons/sucai.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M821.610667 302.293333l-199.658667 116.053334a218.730667 218.730667 0 0 1-219.904 0l-199.68-116.053334a21.333333 21.333333 0 0 1 0-36.885333L469.12 110.293333a85.333333 85.333333 0 0 1 85.802667 0l266.709333 155.114667a21.333333 21.333333 0 0 1 0 36.906667zM191.786667 764.224l266.922666 155.733333a21.333333 21.333333 0 0 0 32.085334-18.432V668.672c0-79.402667-41.941333-152.682667-109.930667-192.426667l-199.338667-116.202666a21.333333 21.333333 0 0 0-32.064 18.410666v312.064a85.333333 85.333333 0 0 0 42.325334 73.706667zM533.333333 668.714667V901.546667a21.333333 21.333333 0 0 0 32.085334 18.410666l266.922666-155.733333A85.333333 85.333333 0 0 0 874.666667 690.474667V378.453333a21.333333 21.333333 0 0 0-32.085334-18.410666l-199.296 116.288c-68.096 39.68-109.952 113.066667-109.952 192.362666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/temp-open.svg b/src/assets/icons/temp-open.svg
new file mode 100644
index 0000000..54f3e08
--- /dev/null
+++ b/src/assets/icons/temp-open.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M853.333333 725.034667v64H170.666667v-64h682.666666z m-149.333333-309.333334l149.333333 106.666667-149.333333 106.666667v-213.333334z m-85.333333 74.666667v64H170.666667v-64h448zM853.333333 256v64H170.666667v-64h682.666666z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/temp.svg b/src/assets/icons/temp.svg
new file mode 100644
index 0000000..3cbd08c
--- /dev/null
+++ b/src/assets/icons/temp.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M853.333333 714.666667v64H170.666667v-64h682.666666zM320 405.333333v213.333334l-149.333333-106.666667 149.333333-106.666667z m533.333333 85.333334v64H405.333333v-64h448z m0-234.666667v64H170.666667v-64h682.666666z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tianjia.svg b/src/assets/icons/tianjia.svg
new file mode 100644
index 0000000..b06fe16
--- /dev/null
+++ b/src/assets/icons/tianjia.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 170.666667a32 32 0 0 1 32 32v277.312l277.333333 0.021333a32 32 0 0 1 0 64l-277.354666-0.021333L544 821.333333a32 32 0 0 1-64 0l-0.021333-277.354666L202.666667 544a32 32 0 0 1 0-64l277.333333-0.021333V202.666667A32 32 0 0 1 512 170.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tishi.svg b/src/assets/icons/tishi.svg
new file mode 100644
index 0000000..e14e118
--- /dev/null
+++ b/src/assets/icons/tishi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m0 256a32 32 0 0 1 32 32V661.333333H576a32 32 0 0 1 0 64h-128a32 32 0 0 1 0-64h32v-192H448a32 32 0 0 1 0-64h64z m0-128a42.666667 42.666667 0 1 1 0 85.333334 42.666667 42.666667 0 0 1 0-85.333334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tishi_mian.svg b/src/assets/icons/tishi_mian.svg
new file mode 100644
index 0000000..04334ea
--- /dev/null
+++ b/src/assets/icons/tishi_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 320h-64a32 32 0 0 0 0 64h32v192H448a32 32 0 0 0 0 64h128a32 32 0 0 0 0-64h-32V437.333333A32 32 0 0 0 512 405.333333z m0-128a42.666667 42.666667 0 1 0 0 85.333334 42.666667 42.666667 0 0 0 0-85.333334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tongxunlu_mian.svg b/src/assets/icons/tongxunlu_mian.svg
new file mode 100644
index 0000000..b7c06ab
--- /dev/null
+++ b/src/assets/icons/tongxunlu_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M768 106.666667a85.333333 85.333333 0 0 1 85.333333 85.333333v640a85.333333 85.333333 0 0 1-85.333333 85.333333H256a85.333333 85.333333 0 0 1-85.333333-85.333333v-106.666667h53.333333a32 32 0 0 0 31.850667-28.928L256 693.333333a32 32 0 0 0-28.928-31.850666L224 661.333333H170.666667v-106.666666h53.333333a32 32 0 0 0 31.850667-28.928L256 522.666667a32 32 0 0 0-28.928-31.850667L224 490.666667H170.666667v-106.666667h53.333333a32 32 0 0 0 31.850667-28.928L256 352a32 32 0 0 0-28.928-31.850667L224 320H170.666667V192a85.333333 85.333333 0 0 1 85.333333-85.333333h512zM554.666667 551.296c-36.970667 0-73.962667 5.205333-110.933334 15.594667a82.154667 82.154667 0 0 0-59.733333 79.210666v19.733334c0 21.077333 16.981333 38.165333 37.930667 38.165333h265.472c20.949333 0 37.930667-17.088 37.930666-38.186667v-19.712a82.154667 82.154667 0 0 0-59.733333-79.210666 408.298667 408.298667 0 0 0-110.933333-15.573334zM554.666667 341.333333c-52.373333 0-94.805333 42.730667-94.805334 95.445334 0 52.693333 42.453333 95.424 94.805334 95.424 52.373333 0 94.805333-42.730667 94.805333-95.424C649.472 384.064 607.018667 341.333333 554.666667 341.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tongzhi.svg b/src/assets/icons/tongzhi.svg
new file mode 100644
index 0000000..a227028
--- /dev/null
+++ b/src/assets/icons/tongzhi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c58.901333 0 106.666667 49.322667 106.666667 110.165334 0 5.610667-0.426667 11.178667-1.216 16.64 114.133333 45.44 195.050667 162.496 195.050666 299.136v119.296l2.325334 0.853333a92.8 92.8 0 0 1 59.733333 82.197333l0.106667 4.352c0 51.2-41.749333 92.693333-93.248 92.693334h-141.802667c-5.013333 71.594667-60.245333 128-127.616 128-67.370667 0-122.602667-56.405333-127.616-128H242.56C191.082667 810.666667 149.333333 769.173333 149.333333 717.973333a92.736 92.736 0 0 1 59.84-86.570666l2.346667-0.832v-119.616l0.064-6.762667c2.730667-133.76 82.901333-247.424 195.008-292.010667A108.266667 108.266667 0 0 1 405.333333 195.498667C405.333333 134.656 453.098667 85.333333 512 85.333333z m68.224 725.333334h-136.448c4.778667 36.202667 33.493333 64 68.224 64 34.709333 0 63.445333-27.797333 68.224-64zM512 253.824c-129.088 0-235.392 111.445333-238.250667 251.328l-0.064 6.144v144.917333c0 17.066667-13.930667 30.890667-31.104 30.890667l-2.986666 0.149333a30.976 30.976 0 0 0-28.096 30.741334c0 17.066667 13.930667 30.890667 31.082666 30.890666H781.44c17.152 0 31.082667-13.824 31.082667-30.890666 0-17.066667-13.930667-30.890667-31.082667-30.890667l-2.986667-0.149333a30.976 30.976 0 0 1-28.117333-30.741334v-144.917333c0-142.698667-107.221333-257.493333-238.314667-257.493333z m0-95.04c-19.2 0-34.88 15.744-35.541333 35.434667a288.021333 288.021333 0 0 1 71.04 0l0.064 1.28c0-20.266667-15.936-36.693333-35.562667-36.693334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tongzhi_mian.svg b/src/assets/icons/tongzhi_mian.svg
new file mode 100644
index 0000000..876676f
--- /dev/null
+++ b/src/assets/icons/tongzhi_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 106.666667c58.901333 0 106.666667 49.322667 106.666667 110.165333 0 5.610667-0.426667 11.178667-1.216 16.64 114.133333 45.44 195.050667 162.496 195.050666 299.136v119.296l2.325334 0.853333a92.8 92.8 0 0 1 59.733333 82.197334l0.106667 4.352c0 51.2-41.749333 92.693333-93.248 92.693333h-141.802667c-5.013333 71.594667-60.245333 128-127.616 128-67.370667 0-122.602667-56.405333-127.616-128H242.56C191.082667 832 149.333333 790.506667 149.333333 739.306667a92.736 92.736 0 0 1 59.84-86.570667l2.346667-0.832v-119.616l0.064-6.762667c2.730667-133.76 82.901333-247.424 195.008-292.010666a108.266667 108.266667 0 0 1-1.258667-16.682667C405.333333 155.989333 453.098667 106.666667 512 106.666667z m0 73.429333c-19.2 0-34.88 15.744-35.541333 35.434667a288.021333 288.021333 0 0 1 71.04 0l0.064 1.28c0-20.266667-15.936-36.693333-35.562667-36.693334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tuichuquanping.svg b/src/assets/icons/tuichuquanping.svg
new file mode 100644
index 0000000..3832030
--- /dev/null
+++ b/src/assets/icons/tuichuquanping.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M394.666667 597.333333l3.072 0.149334A32 32 0 0 1 426.666667 629.333333v234.666667l-0.149334 3.072A32 32 0 0 1 394.666667 896l-3.072-0.149333A32 32 0 0 1 362.666667 864V661.333333H160l-3.072-0.149333A32 32 0 0 1 160 597.333333h234.666667z m469.333333 0l3.072 0.149334a32 32 0 0 1 0 63.701333L864 661.333333H661.333333v202.666667l-0.149333 3.072a32 32 0 0 1-28.778667 28.8L629.333333 896a32 32 0 0 1-31.850666-28.928L597.333333 864v-234.666667l0.149334-3.072a32 32 0 0 1 28.778666-28.8L629.333333 597.333333h234.666667z m-469.333333-469.333333a32 32 0 0 1 31.850666 28.928L426.666667 160v234.666667a32 32 0 0 1-28.928 31.850666L394.666667 426.666667h-234.666667a32 32 0 0 1-3.072-63.850667L160 362.666667H362.666667V160a32 32 0 0 1 28.928-31.850667L394.666667 128z m234.666666 0l3.072 0.149333a32 32 0 0 1 28.8 28.778667L661.333333 160V362.666667h202.666667l3.072 0.149333a32 32 0 0 1 0 63.701333L864 426.666667h-234.666667l-3.072-0.149334a32 32 0 0 1-28.8-28.778666L597.333333 394.666667v-234.666667l0.149334-3.072A32 32 0 0 1 629.333333 128z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tuiguang.svg b/src/assets/icons/tuiguang.svg
new file mode 100644
index 0000000..7d5bb2d
--- /dev/null
+++ b/src/assets/icons/tuiguang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M822.848 152.234667c19.52-5.632 40.533333-2.986667 58.026667 7.253333a73.216 73.216 0 0 1 28.266666 96.896l-2.026666 3.648-323.562667 546.752a94.570667 94.570667 0 0 1-19.925333 23.701333 95.424 95.424 0 0 1-130.709334-6.4l-3.285333-3.605333-29.141333-33.664-38.314667 35.946667a74.112 74.112 0 0 1-46.016 19.882666l-4.693333 0.149334c-39.466667 0-71.68-30.72-73.813334-69.418667l-0.106666-4.032v-99.157333c0-34.773333 15.786667-67.626667 42.773333-89.472l4.352-3.370667L616.469333 333.653333a31.786667 31.786667 0 0 1 44.288 6.613334 31.36 31.36 0 0 1-4.266666 42.090666l-2.389334 1.92-331.797333 243.712a52.394667 52.394667 0 0 0-21.269333 38.378667l-0.128 3.818667v99.157333a10.517333 10.517333 0 0 0 16.213333 8.853333l1.578667-1.216 62.442666-58.581333a31.808 31.808 0 0 1 43.584 0.106667l2.176 2.261333 50.773334 58.666667a31.786667 31.786667 0 0 0 49.365333-1.706667l1.92-2.88 323.562667-546.730667a10.453333 10.453333 0 0 0-10.346667-15.744l-1.706667 0.341334-647.573333 186.517333a31.445333 31.445333 0 0 0-17.237333 48.170667l2.090666 2.666666 44.266667 50.837334a31.36 31.36 0 0 1-3.221333 44.394666c-12.394667 10.666667-30.762667 10.069333-42.453334-0.853333l-2.218666-2.346667-44.266667-50.816a94.272 94.272 0 0 1-19.413333-35.52c-14.165333-48.64 12.757333-99.413333 60.416-115.626666l4.394666-1.365334 647.594667-186.538666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tuiguang_mian.svg b/src/assets/icons/tuiguang_mian.svg
new file mode 100644
index 0000000..005323a
--- /dev/null
+++ b/src/assets/icons/tuiguang_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M880.896 180.8a73.216 73.216 0 0 1 28.245333 96.917333l-2.026666 3.648-323.562667 546.752a94.570667 94.570667 0 0 1-19.925333 23.701334 95.424 95.424 0 0 1-130.709334-6.4l-3.285333-3.605334-29.141333-33.664-38.314667 35.946667a74.112 74.112 0 0 1-46.016 19.882667l-4.693333 0.149333c-39.466667 0-71.68-30.72-73.813334-69.418667l-0.106666-4.032v-97.642666l312.746666-253.717334a10.666667 10.666667 0 0 0-11.562666-17.770666l-337.493334 172.416-31.936-35.904-0.064-0.213334-39.381333-45.226666a94.272 94.272 0 0 1-19.413333-35.52c-14.165333-48.64 12.757333-99.413333 60.416-115.626667l4.394666-1.365333 647.594667-186.538667c19.52-5.632 40.533333-2.986667 58.026667 7.253333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tupian.svg b/src/assets/icons/tupian.svg
new file mode 100644
index 0000000..64b511d
--- /dev/null
+++ b/src/assets/icons/tupian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M938.666667 553.92V768c0 64.8-52.533333 117.333333-117.333334 117.333333H202.666667c-64.8 0-117.333333-52.533333-117.333334-117.333333V256c0-64.8 52.533333-117.333333 117.333334-117.333333h618.666666c64.8 0 117.333333 52.533333 117.333334 117.333333v297.92z m-64-74.624V256a53.333333 53.333333 0 0 0-53.333334-53.333333H202.666667a53.333333 53.333333 0 0 0-53.333334 53.333333v344.48A290.090667 290.090667 0 0 1 192 597.333333a286.88 286.88 0 0 1 183.296 65.845334C427.029333 528.384 556.906667 437.333333 704 437.333333c65.706667 0 126.997333 16.778667 170.666667 41.962667z m0 82.24c-5.333333-8.32-21.130667-21.653333-43.648-32.917333C796.768 511.488 753.045333 501.333333 704 501.333333c-121.770667 0-229.130667 76.266667-270.432 188.693334-2.730667 7.445333-7.402667 20.32-13.994667 38.581333-7.68 21.301333-34.453333 28.106667-51.370666 13.056-16.437333-14.634667-28.554667-25.066667-36.138667-31.146667A222.890667 222.890667 0 0 0 192 661.333333c-14.464 0-28.725333 1.365333-42.666667 4.053334V768a53.333333 53.333333 0 0 0 53.333334 53.333333h618.666666a53.333333 53.333333 0 0 0 53.333334-53.333333V561.525333zM320 480a96 96 0 1 1 0-192 96 96 0 0 1 0 192z m0-64a32 32 0 1 0 0-64 32 32 0 0 0 0 64z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/tupian_mian.svg b/src/assets/icons/tupian_mian.svg
new file mode 100644
index 0000000..0875efd
--- /dev/null
+++ b/src/assets/icons/tupian_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M352 653.248L552.085333 853.333333H202.666667a117.034667 117.034667 0 0 1-42.730667-8.021333L352 653.226667z m296.277333-64.32l230.528 249.386667A116.8 116.8 0 0 1 821.333333 853.333333h-178.752l-137.301333-137.301333 142.997333-127.104zM821.333333 170.666667a117.333333 117.333333 0 0 1 117.333334 117.333333v448c0 20.650667-5.333333 40.064-14.72 56.917333L674.346667 522.453333l-2.304-2.282666-2.474667-2.026667a32 32 0 0 0-40.170667 1.92l-169.450666 150.613333-85.333334-85.333333-2.410666-2.197333a32 32 0 0 0-42.837334 2.197333L108.586667 806.144A116.821333 116.821333 0 0 1 85.333333 736v-448A117.333333 117.333333 0 0 1 202.666667 170.666667zM341.333333 298.666667a106.666667 106.666667 0 1 0 0 213.333333 106.666667 106.666667 0 0 0 0-213.333333z m0 64a42.666667 42.666667 0 1 1 0 85.333333 42.666667 42.666667 0 0 1 0-85.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/user_biaoqian.svg b/src/assets/icons/user_biaoqian.svg
new file mode 100644
index 0000000..206fff6
--- /dev/null
+++ b/src/assets/icons/user_biaoqian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M956.1 320H739.9a4 4 0 0 0-3.9 3.9v56.2a4 4 0 0 0 3.9 3.9h216.2a4 4 0 0 0 3.9-3.9v-56.2a4 4 0 0 0-3.9-3.9zM676 256h280a4 4 0 0 0 4-4v-56a4 4 0 0 0-4-4H676a4 4 0 0 0-4 4v56a4 4 0 0 0 4 4z m280 192H676a4 4 0 0 0-4 4v56a4 4 0 0 0 4 4h280a4 4 0 0 0 4-4v-56a4 4 0 0 0-4-4z m-408.4 57.6A209.6 209.6 0 0 0 626 342c0-116-94-210-210-210s-210 94-210 210a209.3 209.3 0 0 0 78.2 163.7C155.4 558.1 64 684.9 64 831.9V888a4 4 0 0 0 4 4h64a4 4 0 0 0 4-4v-56.1a276.2 276.2 0 0 1 22-108.5 283.5 283.5 0 0 1 60.3-89.2 279.3 279.3 0 0 1 89.2-60.2 273.8 273.8 0 0 1 104.9-22h7.2a273.8 273.8 0 0 1 104.9 22 279.3 279.3 0 0 1 89.2 60.2 283.5 283.5 0 0 1 60.3 89.2 276.2 276.2 0 0 1 22 108.5V888a4 4 0 0 0 4 4h64a4 4 0 0 0 4-4v-56.1c0-147.1-91.5-273.9-220.4-326.3z m-34-66a137 137 0 0 1-93.6 40.3h-8a137.9 137.9 0 1 1 101.6-40.3z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/user_gaikuang.svg b/src/assets/icons/user_gaikuang.svg
new file mode 100644
index 0000000..b4ae10e
--- /dev/null
+++ b/src/assets/icons/user_gaikuang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M892 824H200V132a4 4 0 0 0-4-4h-64a4 4 0 0 0-4 4v760a4 4 0 0 0 4 4h760a4 4 0 0 0 4-4v-64a4 4 0 0 0-4-4z m-616-72h64a4 4 0 0 0 4-4V636a4 4 0 0 0-4-4h-64a4 4 0 0 0-4 4v112a4 4 0 0 0 4 4z m160-240a4 4 0 0 0-4 4v232a4 4 0 0 0 4 4h64a4 4 0 0 0 4-4V516a4 4 0 0 0-4-4z m160 80a4 4 0 0 0-4 4v152a4 4 0 0 0 4 4h64a4 4 0 0 0 4-4V596a4 4 0 0 0-4-4z m160-160a4 4 0 0 0-4 4v312a4 4 0 0 0 4 4h64a4 4 0 0 0 4-4V436a4 4 0 0 0-4-4z m-427.4 52a4 4 0 0 0 5.6-0.2l135.5-146.5 130.5 121.6a40.1 40.1 0 0 0 57-2.5l139.2-153.9 37.1 28.3a4.2 4.2 0 0 0 6.8-2.9l16.3-156.6a4.2 4.2 0 0 0-5.7-4.4l-146.7 57.2a4.2 4.2 0 0 0-1 7.3l42.1 32.1L626 395.4 495.7 274.1a39.9 39.9 0 0 0-56.6 2.1L287.2 440.3a4.1 4.1 0 0 0 0.2 5.7z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/user_guanli.svg b/src/assets/icons/user_guanli.svg
new file mode 100644
index 0000000..e00fd79
--- /dev/null
+++ b/src/assets/icons/user_guanli.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M511 604c144.7 0 262-117.3 262-262S655.7 80 511 80 249 197.3 249 342c0 91.2 46.6 171.5 117.4 218.5C226.3 617.9 127 755.9 127 916v25.5a4 4 0 0 0 4 4h64a3.9 3.9 0 0 0 4-4V916a307.1 307.1 0 0 1 24.6-120.9 315.8 315.8 0 0 1 166.5-166.5A307.1 307.1 0 0 1 511 604zM376.6 476.4A190.2 190.2 0 1 1 511 532a189.1 189.1 0 0 1-134.4-55.6zM892 864H644a4 4 0 0 0-4 4v56a4 4 0 0 0 4 4h248a4 4 0 0 0 4-4v-56a4 4 0 0 0-4-4z m-356-32a64 64 0 1 0 64 64 64.1 64.1 0 0 0-64-64z m0 80a16 16 0 1 1 16-16 16 16 0 0 1-16 16z m356-240H644a4 4 0 0 0-4 4v56a4 4 0 0 0 4 4h248a4 4 0 0 0 4-4v-56a4 4 0 0 0-4-4z m-356-32a64 64 0 1 0 64 64 64.1 64.1 0 0 0-64-64z m0 80a16 16 0 1 1 16-16 16 16 0 0 1-16 16z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/wangpudiandan.svg b/src/assets/icons/wangpudiandan.svg
new file mode 100644
index 0000000..77cc413
--- /dev/null
+++ b/src/assets/icons/wangpudiandan.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 234.666667l320 170.666666v405.333334a85.333333 85.333333 0 0 1-85.333333 85.333333H277.333333a85.333333 85.333333 0 0 1-85.333333-85.333333V405.333333l320-170.666666z m161.173333 244.245333a32.256 32.256 0 0 0-45.866666 0l-149.077334 151.957333-0.341333 0.341334a21.333333 21.333333 0 0 1-30.165333-0.405334l-51.029334-52.416a32.256 32.256 0 0 0-45.866666 0 32.853333 32.853333 0 0 0 0 46.208l89.194666 91.157334a32.256 32.256 0 0 0 45.866667 0l187.285333-190.656a32.853333 32.853333 0 0 0 0-46.186667zM524.16 130.24l3.285333 1.493333 372.458667 209.408c16.021333 8.234667 22.101333 27.477333 13.568 42.944-8.021333 14.570667-26.133333 20.629333-41.6 14.421334l-2.858667-1.301334-356.992-201.450666-356.992 201.365333a33.557333 33.557333 0 0 1-42.837333-10.389333l-1.642667-2.645334a31.146667 31.146667 0 0 1 10.773334-41.386666l2.709333-1.578667 372.48-209.365333a33.898667 33.898667 0 0 1 27.648-1.493334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/weixin.svg b/src/assets/icons/weixin.svg
new file mode 100644
index 0000000..f043f12
--- /dev/null
+++ b/src/assets/icons/weixin.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M408.064 149.333333c115.989333 0 217.088 59.946667 267.434667 148.117334C813.098667 322.645333 917.333333 433.493333 917.333333 567.317333c0 72.746667-31.061333 140.8-84.864 191.509334l-2.090666 1.877333 13.610666 49.792c7.125333 26.112-7.744 52.906667-33.493333 61.461333l-3.264 0.981334a52.842667 52.842667 0 0 1-39.424-5.098667l-65.130667-36.906667-5.76 1.578667c-22.869333 5.824-46.528 9.173333-70.613333 9.898667l-10.368 0.170666c-115.989333 0-217.088-59.946667-267.456-148.138666a228.48 228.48 0 0 1-7.168-1.365334l-9.770667-2.176-7.466666-1.941333-65.066667 36.864a52.650667 52.650667 0 0 1-66.944-12.778667l-2.133333-2.922666-1.898667-2.965334a50.133333 50.133333 0 0 1-6.101333-34.730666l0.917333-3.925334 13.162667-48.32-1.642667-1.450666c-51.733333-47.466667-83.221333-110.784-87.253333-179.136l-0.341334-7.616L106.666667 424.597333C106.666667 272 242.133333 149.333333 408.064 149.333333z m207.872 203.904c-132.565333 0-239.04 96.426667-239.04 214.08 0 117.674667 106.474667 214.08 239.04 214.08 27.946667 0 55.210667-4.266667 80.938667-12.586666l13.226666-4.266667 67.157334 38.016-17.301334-63.36 15.573334-12.522667c50.346667-40.469333 79.445333-97.877333 79.445333-159.36 0-117.674667-106.496-214.08-239.04-214.08z m-207.872-142.72c-132.544 0-239.04 96.405333-239.04 214.08 0 60.16 27.882667 116.416 76.202667 156.693334l5.44 4.394666 15.914666 12.501334-17.024 62.357333 66.773334-37.802667 4.629333 1.450667a253.824 253.824 0 0 1-6.421333-56.874667c0-146.496 124.864-265.429333 281.685333-274.688-43.626667-49.92-111.530667-82.133333-188.16-82.133333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/weixin_mian.svg b/src/assets/icons/weixin_mian.svg
new file mode 100644
index 0000000..5c4e92e
--- /dev/null
+++ b/src/assets/icons/weixin_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M615.936 374.570667c132.544 0 239.04 96.426667 239.04 214.08 0 61.482667-29.12 118.890667-79.466667 159.36l-15.573333 12.501333 17.322667 63.36-67.136-37.973333-13.248 4.266666c-25.728 8.277333-52.970667 12.586667-80.938667 12.586667-132.565333 0-239.04-96.426667-239.04-214.101333s106.474667-214.08 239.04-214.08zM408.064 170.666667c115.989333 0 217.088 59.946667 267.434667 148.117333a328.96 328.96 0 0 0-59.562667-5.397333c-165.930667 0-301.397333 122.666667-301.397333 275.264 0 45.930667 12.266667 89.152 33.941333 127.146666a228.48 228.48 0 0 1-7.168-1.386666l-9.770667-2.176-7.466666-1.941334-65.066667 36.864a52.650667 52.650667 0 0 1-66.944-12.778666l-2.133333-2.922667-1.898667-2.965333a50.133333 50.133333 0 0 1-6.101333-34.730667l0.917333-3.925333 13.162667-48.32-1.642667-1.450667c-51.733333-47.466667-83.221333-110.784-87.253333-179.136l-0.341334-7.616L106.666667 445.930667C106.666667 293.333333 242.133333 170.666667 408.064 170.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/wode.svg b/src/assets/icons/wode.svg
new file mode 100644
index 0000000..4cc5c10
--- /dev/null
+++ b/src/assets/icons/wode.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 576c83.2 0 166.4 11.626667 249.6 34.858667a183.829333 183.829333 0 0 1 134.4 177.066666V832a85.333333 85.333333 0 0 1-85.333333 85.333333H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333333v-44.096a183.829333 183.829333 0 0 1 134.4-177.066667C345.6 587.648 428.8 576 512 576z m0 64c-77.333333 0-154.752 10.816-232.405333 32.490667a119.829333 119.829333 0 0 0-87.466667 110.229333L192 787.904V832a21.333333 21.333333 0 0 0 18.837333 21.184L213.333333 853.333333h597.333334a21.333333 21.333333 0 0 0 21.184-18.837333L832 832v-44.096a119.829333 119.829333 0 0 0-87.594667-115.413333C666.752 650.816 589.312 640 512 640z m0-533.333333c117.824 0 213.333333 95.509333 213.333333 213.333333s-95.509333 213.333333-213.333333 213.333333-213.333333-95.509333-213.333333-213.333333S394.176 106.666667 512 106.666667z m0 64a149.333333 149.333333 0 1 0 0 298.666666 149.333333 149.333333 0 0 0 0-298.666666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/wode_mian.svg b/src/assets/icons/wode_mian.svg
new file mode 100644
index 0000000..ea9ebfb
--- /dev/null
+++ b/src/assets/icons/wode_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 576c83.2 0 166.4 11.626667 249.6 34.858667a183.829333 183.829333 0 0 1 134.4 177.066666V832a85.333333 85.333333 0 0 1-85.333333 85.333333H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333333v-44.096a183.829333 183.829333 0 0 1 134.4-177.066667C345.6 587.648 428.8 576 512 576z m0-469.333333c117.824 0 213.333333 95.509333 213.333333 213.333333s-95.509333 213.333333-213.333333 213.333333-213.333333-95.509333-213.333333-213.333333S394.176 106.666667 512 106.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/xiangji.svg b/src/assets/icons/xiangji.svg
new file mode 100644
index 0000000..a9f7b5f
--- /dev/null
+++ b/src/assets/icons/xiangji.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M589.162667 170.666667a117.333333 117.333333 0 0 1 111.317333 80.234666l3.925333 11.84a21.333333 21.333333 0 0 0 20.266667 14.592H800a117.333333 117.333333 0 0 1 117.248 112.618667L917.333333 394.666667v341.333333a117.333333 117.333333 0 0 1-117.333333 117.333333h-576A117.333333 117.333333 0 0 1 106.666667 736v-341.333333a117.333333 117.333333 0 0 1 117.333333-117.333334h75.328a21.333333 21.333333 0 0 0 20.245333-14.592l3.946667-11.84a117.333333 117.333333 0 0 1 106.282667-80.128L434.837333 170.666667z m0 64h-154.325334a53.333333 53.333333 0 0 0-50.602666 36.48l-13.674667 41.024A42.666667 42.666667 0 0 1 330.090667 341.333333H224A53.333333 53.333333 0 0 0 170.666667 394.666667v341.333333a53.333333 53.333333 0 0 0 53.333333 53.333333h576a53.333333 53.333333 0 0 0 53.333333-53.333333v-341.333333a53.333333 53.333333 0 0 0-53.333333-53.333334h-106.112a42.666667 42.666667 0 0 1-40.469333-29.184l-13.653334-41.024A53.333333 53.333333 0 0 0 589.162667 234.666667zM512 405.333333a149.333333 149.333333 0 1 1 0 298.666667 149.333333 149.333333 0 0 1 0-298.666667z m0 64a85.333333 85.333333 0 1 0 0 170.666667 85.333333 85.333333 0 0 0 0-170.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/xiaoxi.svg b/src/assets/icons/xiaoxi.svg
new file mode 100644
index 0000000..cf220c8
--- /dev/null
+++ b/src/assets/icons/xiaoxi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667c-7.146667 0-14.250667-0.170667-21.333333-0.533334V938.666667H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333334V533.333333h0.533334A433.749333 433.749333 0 0 1 85.333333 512C85.333333 276.352 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512c0 6.08 0.149333 12.16 0.426667 18.197333 0.149333 2.538667 0.128 5.034667-0.042667 7.509334l-0.384 3.84V853.333333a21.333333 21.333333 0 0 0 18.837334 21.184L170.666667 874.666667h311.722666a65.706667 65.706667 0 0 1 7.616-0.512l3.84 0.064c6.016 0.298667 12.074667 0.448 18.154667 0.448 200.298667 0 362.666667-162.368 362.666667-362.666667 0-197.973333-158.656-358.933333-355.776-362.602667L512 149.333333z m-192 341.333334a42.666667 42.666667 0 1 1 0 85.333333 42.666667 42.666667 0 0 1 0-85.333333z m192 0a42.666667 42.666667 0 1 1 0 85.333333 42.666667 42.666667 0 0 1 0-85.333333z m192 0a42.666667 42.666667 0 1 1 0 85.333333 42.666667 42.666667 0 0 1 0-85.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/xiazai.svg b/src/assets/icons/xiazai.svg
new file mode 100644
index 0000000..c741576
--- /dev/null
+++ b/src/assets/icons/xiazai.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M864 704a32 32 0 0 1 31.850667 28.928L896 736v21.333333a117.333333 117.333333 0 0 1-112.618667 117.248L778.666667 874.666667h-533.333334a117.333333 117.333333 0 0 1-117.248-112.618667L128 757.333333v-21.333333a32 32 0 0 1 63.850667-3.072L192 736v21.333333a53.333333 53.333333 0 0 0 49.834667 53.226667L245.333333 810.666667h533.333334a53.333333 53.333333 0 0 0 53.226666-49.834667L832 757.333333v-21.333333a32 32 0 0 1 32-32zM512 149.333333a32 32 0 0 1 32 32v459.242667l190.464-183.509333a32.853333 32.853333 0 0 1 45.44 0c12.586667 12.16 12.586667 31.872 0 44.053333L534.741333 737.493333c-3.157333 3.029333-6.805333 5.333333-10.688 6.848a32.213333 32.213333 0 0 1-23.808 0.085334l-0.32-0.106667a32.128 32.128 0 0 1-10.624-6.826667L244.053333 501.12a30.485333 30.485333 0 0 1 0-44.053333 32.853333 32.853333 0 0 1 45.44 0l190.485334 183.509333V181.333333A32 32 0 0 1 512 149.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/xitongquanxian.svg b/src/assets/icons/xitongquanxian.svg
new file mode 100644
index 0000000..b34ac74
--- /dev/null
+++ b/src/assets/icons/xitongquanxian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M486.570667 97.216a33.130667 33.130667 0 0 1 51.264 0.512c34.709333 43.328 152.064 98.261333 307.776 117.034667 16.576 2.005333 29.056 16 29.056 32.64v372.629333a167.04 167.04 0 0 1-20.096 79.402667C761.813333 871.146667 633.770667 938.666667 511.530667 938.666667l-6.528-0.106667c-118.954667-3.413333-244.586667-70.741333-335.573334-239.125333a167.808 167.808 0 0 1-19.925333-71.914667L149.333333 620.032V247.402667c0-16.64 12.48-30.634667 29.056-32.64 152.426667-18.368 269.077333-72.277333 305.237334-114.005334z m25.408 67.178667l-1.792 1.450666c-52.693333 41.813333-163.456 91.882667-290.389334 109.802667l-4.416 0.597333v342.976l0.149334 5.866667c0.746667 15.104 4.864 29.866667 12.074666 43.221333 80.96 149.845333 188.714667 201.962667 278.826667 204.544l5.568 0.085334c92.522667 0 201.92-51.989333 284.373333-204.629334a101.546667 101.546667 0 0 0 12.224-48.277333V276.245333l-16.277333-2.325333c-120.938667-18.048-227.904-67.690667-278.954667-108.416l-1.386666-1.109333zM512 341.333333a74.666667 74.666667 0 0 1 32.021333 142.144L544 597.333333h21.333333a32 32 0 0 1 0 64h-21.333333v32a32 32 0 0 1-64 0v-209.856A74.666667 74.666667 0 0 1 512 341.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/yingxiao_qipao.svg b/src/assets/icons/yingxiao_qipao.svg
new file mode 100644
index 0000000..238ddf2
--- /dev/null
+++ b/src/assets/icons/yingxiao_qipao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64z m265.9 713.9a377.2 377.2 0 0 1-119.6 80.6 377.5 377.5 0 0 1-292.6 0 377.1 377.1 0 0 1-200.2-200.2 377.5 377.5 0 0 1 0-292.6 377.1 377.1 0 0 1 200.2-200.2 377.5 377.5 0 0 1 292.6 0 377.1 377.1 0 0 1 200.2 200.2 377.5 377.5 0 0 1 0 292.6 377.2 377.2 0 0 1-80.6 119.6zM312 454a58 58 0 1 0 58 58 58 58 0 0 0-58-58z m200 0a58 58 0 1 0 58 58 58 58 0 0 0-58-58z m200 0a58 58 0 1 0 58 58 58 58 0 0 0-58-58z" /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/yingyezizhi.svg b/src/assets/icons/yingyezizhi.svg
new file mode 100644
index 0000000..23ae5be
--- /dev/null
+++ b/src/assets/icons/yingyezizhi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M821.333333 170.666667a117.333333 117.333333 0 0 1 117.333334 117.333333v448a117.333333 117.333333 0 0 1-117.333334 117.333333h-618.666666A117.333333 117.333333 0 0 1 85.333333 736v-448A117.333333 117.333333 0 0 1 202.666667 170.666667z m0 64h-618.666666A53.333333 53.333333 0 0 0 149.333333 288v448A53.333333 53.333333 0 0 0 202.666667 789.333333h618.666666a53.333333 53.333333 0 0 0 53.333334-53.333333v-448a53.333333 53.333333 0 0 0-53.333334-53.333333z m-469.333333 64a160 160 0 0 1 128 256v99.413333c0 21.12-13.738667 39.893333-34.24 47.36l-3.690667 1.194667-68.48 19.669333a78.357333 78.357333 0 0 1-38.442666 1.194667l-4.714667-1.194667-68.501333-19.669333c-21.269333-6.101333-36.202667-24.042667-37.781334-44.864l-0.149333-3.690667V554.666667l-2.261333-3.072A160 160 0 0 1 352 298.666667z m64 306.688a159.466667 159.466667 0 0 1-64 13.312 159.466667 159.466667 0 0 1-64-13.312v41.173333l60.928 17.493333c1.322667 0.384 2.730667 0.512 4.117333 0.384l2.026667-0.384 60.928-17.493333v-41.173333zM757.333333 554.666667a32 32 0 0 1 0 64h-149.333333a32 32 0 0 1 0-64h149.333333z m-405.333333-192a96 96 0 1 0 0 192 96 96 0 0 0 0-192z m405.333333 42.666666a32 32 0 0 1 0 64h-149.333333a32 32 0 0 1 0-64h149.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/yinhangka.svg b/src/assets/icons/yinhangka.svg
new file mode 100644
index 0000000..20c1fdc
--- /dev/null
+++ b/src/assets/icons/yinhangka.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M821.333333 192a117.333333 117.333333 0 0 1 117.333334 117.333333v405.333334a117.333333 117.333333 0 0 1-117.333334 117.333333h-618.666666A117.333333 117.333333 0 0 1 85.333333 714.666667v-405.333334A117.333333 117.333333 0 0 1 202.666667 192zM874.666667 426.666667H149.333333v288A53.333333 53.333333 0 0 0 202.666667 768h618.666666a53.333333 53.333333 0 0 0 53.333334-53.333333V426.666667z m-96 64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64h64z m42.666666-234.666667h-618.666666A53.333333 53.333333 0 0 0 149.333333 309.333333V362.666667h725.333334v-53.333334a53.333333 53.333333 0 0 0-53.333334-53.333333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/yiwen.svg b/src/assets/icons/yiwen.svg
new file mode 100644
index 0000000..ef07f2e
--- /dev/null
+++ b/src/assets/icons/yiwen.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m0 533.333334a42.666667 42.666667 0 1 1 0 85.333333 42.666667 42.666667 0 0 1 0-85.333333z m0-426.666667c88.362667 0 160 67.861333 160 151.573333 0 75.029333-43.157333 135.189333-125.248 178.688l-2.752 1.408v22.016c0 15.765333-12.693333 28.714667-28.928 30.165334L512 640c-16.64 0-30.293333-12.032-31.850667-27.392l-0.149333-2.922667v-40.426666c0-11.584 6.976-22.186667 17.984-27.242667 75.136-34.688 110.016-78.762667 110.016-134.442667 0-50.218667-42.986667-90.944-96-90.944s-96 40.725333-96 90.944c0 16.746667-14.336 30.314667-32 30.314667s-32-13.568-32-30.293333C352 323.84 423.637333 256 512 256z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/youhui.svg b/src/assets/icons/youhui.svg
new file mode 100644
index 0000000..4358e1c
--- /dev/null
+++ b/src/assets/icons/youhui.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M532.053333 138.069333c43.861333-43.861333 117.312-41.493333 164.074667 5.290667l184.768 184.746667c46.762667 46.784 49.130667 120.234667 5.290667 164.096L568.234667 810.154667a108.16 108.16 0 0 1-70.677334 31.210666l-196.8 11.2c-63.637333 3.626667-121.514667-45.333333-129.237333-109.354666a116.266667 116.266667 0 0 1-0.64-20.992l11.904-195.84a108.117333 108.117333 0 0 1 31.189333-70.229334z m120.768 48.597334c-21.248-21.269333-54.634667-22.336-74.581333-2.410667l-318.08 318.08c-8.405333 8.426667-13.44 19.712-14.165333 31.914667l-11.904 195.84c-0.213333 3.178667-0.106667 6.357333 0.277333 9.557333 3.52 29.098667 29.824 51.349333 58.752 49.706667l196.8-11.221334a49.152 49.152 0 0 0 32.128-14.186666l317.952-317.952c19.925333-19.925333 18.837333-53.333333-2.410667-74.581334z m-205.568 300.970666a93.802667 93.802667 0 0 1 93.696 93.888 93.802667 93.802667 0 0 1-93.696 93.909334 93.802667 93.802667 0 0 1-93.696-93.909334 93.802667 93.802667 0 0 1 93.696-93.888z m0 62.592c-17.237333 0-31.232 14.016-31.232 31.296s13.994667 31.317333 31.232 31.317334c17.237333 0 31.232-14.016 31.232-31.317334 0-17.28-13.994667-31.296-31.232-31.296z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/youjian.svg b/src/assets/icons/youjian.svg
new file mode 100644
index 0000000..1304c01
--- /dev/null
+++ b/src/assets/icons/youjian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M821.333333 170.666667a117.333333 117.333333 0 0 1 117.333334 117.333333v448a117.333333 117.333333 0 0 1-117.333334 117.333333h-618.666666A117.333333 117.333333 0 0 1 85.333333 736v-448A117.333333 117.333333 0 0 1 202.666667 170.666667z m52.842667 110.058666L576 571.072a91.093333 91.093333 0 0 1-124.373333 3.370667l-3.669334-3.370667-298.154666-290.346667A53.802667 53.802667 0 0 0 149.333333 288v448A53.333333 53.333333 0 0 0 202.666667 789.333333h618.666666a53.333333 53.333333 0 0 0 53.333334-53.333333v-448c0-2.474667-0.170667-4.906667-0.490667-7.274667zM821.333333 234.666667h-618.666666c-2.922667 0-5.76 0.213333-8.554667 0.682666l296.533333 288.789334c11.2 10.901333 28.245333 11.626667 40.213334 2.197333l2.474666-2.197333 296.554667-288.789334A53.717333 53.717333 0 0 0 821.333333 234.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/youjiantou.svg b/src/assets/icons/youjiantou.svg
new file mode 100644
index 0000000..5c59926
--- /dev/null
+++ b/src/assets/icons/youjiantou.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M371.050667 865.706667c-11.690667 11.946667-30.613333 11.946667-42.282667 0a31.146667 31.146667 0 0 1 0-43.306667l295.765333-302.933333a10.666667 10.666667 0 0 0 0-14.933334L328.768 201.6a31.146667 31.146667 0 0 1 0-43.306667 29.397333 29.397333 0 0 1 42.282667 0l324.181333 332.053334a31.146667 31.146667 0 0 1 0 43.306666L371.050667 865.706667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/yulibao.svg b/src/assets/icons/yulibao.svg
new file mode 100644
index 0000000..b785c04
--- /dev/null
+++ b/src/assets/icons/yulibao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M347.392 116.693333C275.2 140.032 196.693333 209.152 148.266667 288.426667a427.605333 427.605333 0 0 0 19.754666 476.053333c102.698667 140.053333 276.074667 202.24 446.122667 162.325333 11.242667-2.645333 17.408-9.045333 23.744-18.474666 55.978667-83.413333 33.066667-198.442667-51.114667-253.546667-34.773333-22.762667-73.6-31.893333-114.304-34.176-39.296-2.197333-78.592-3.925333-116.224-17.194667-59.669333-21.056-85.802667-59.84-81.941333-123.221333 3.52-57.664 29.866667-106.858667 58.517333-155.093333 4.672-7.829333 12.992-14.208 7.509334-25.813334-28.16-59.648-25.386667-119.082667 7.04-182.570666m526.08 619.797333c138.602667-225.728 46.634667-511.04-184.682667-616.533333-32.362667-14.762667-145.813333-48.938667-271.36-28.010667-19.114667 3.2-30.144 13.866667-39.232 29.76-52.928 92.586667-14.954667 212.266667 81.877333 256.810667 35.498667 16.341333 73.216 21.866667 111.786667 22.826666 38.656 0.981333 76.373333 6.421333 111.978667 22.528 47.658667 21.589333 72.32 67.669333 65.813333 119.808-6.848 54.848-29.056 103.552-58.133333 149.333334-8.682667 13.696-9.088 24.597333-3.946667 39.957333 9.92 29.610667 17.002667 60.8 12.202667 92.245333-4.117333 26.922667-10.837333 53.653333-24.106667 78.997334 78.677333-35.541333 145.408-84.117333 189.973333-159.445334 2.624-2.752 5.888-5.12 7.829334-8.277333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/yuyin.svg b/src/assets/icons/yuyin.svg
new file mode 100644
index 0000000..1ac06af
--- /dev/null
+++ b/src/assets/icons/yuyin.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333c235.648 0 426.666667 191.018667 426.666667 426.666667s-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333z m0 64C311.701333 149.333333 149.333333 311.701333 149.333333 512s162.368 362.666667 362.666667 362.666667 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333z m191.232 321.237334c16.192 4.864 25.557333 22.570667 20.928 39.552-27.648 101.632-89.173333 159.914667-180.138667 170.709333L544 757.333333a32 32 0 0 1-64 0v-76.501333c-90.965333-10.794667-152.512-69.077333-180.16-170.709333-4.608-16.981333 4.757333-34.688 20.928-39.552 16.213333-4.842667 33.066667 4.992 37.696 21.973333C381.845333 578.56 430.997333 618.666667 512 618.666667c81.024 0 130.154667-40.106667 153.557333-126.122667 4.629333-16.981333 21.504-26.816 37.674667-21.973333zM512 234.666667c57.386667 0 104.213333 46.933333 106.581333 105.770666l0.085334 4.650667v120.490667C618.666667 526.549333 570.901333 576 512 576c-57.386667 0-104.213333-46.933333-106.581333-105.770667L405.333333 465.578667v-120.490667C405.333333 284.117333 453.098667 234.666667 512 234.666667z m0 60.245333c-25.664 0-46.677333 20.629333-48.362667 46.741333l-0.128 3.434667v120.490667c0 27.712 21.717333 50.176 48.490667 50.176 25.664 0 46.677333-20.629333 48.362667-46.741334l0.128-3.434666v-120.490667c0-27.712-21.717333-50.176-48.490667-50.176z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/yuyueguanli.svg b/src/assets/icons/yuyueguanli.svg
new file mode 100644
index 0000000..080255d
--- /dev/null
+++ b/src/assets/icons/yuyueguanli.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M693.333333 106.666667A32 32 0 0 1 725.333333 138.666667V170.666667h74.666667a117.333333 117.333333 0 0 1 117.248 112.618666L917.333333 288v448a117.333333 117.333333 0 0 1-112.618666 117.248L800 853.333333h-576a117.333333 117.333333 0 0 1-117.248-112.618666L106.666667 736v-448a117.333333 117.333333 0 0 1 112.618666-117.248L224 170.666667H298.666667V138.666667a32 32 0 0 1 64 0V170.666667h298.666666V138.666667A32 32 0 0 1 693.333333 106.666667z m-20.16 286.912a32.256 32.256 0 0 0-45.866666 0l-149.077334 151.957333-0.341333 0.341333a21.333333 21.333333 0 0 1-30.165333-0.405333l-51.029334-52.416a32.256 32.256 0 0 0-45.866666 0 32.853333 32.853333 0 0 0 0 46.208l89.194666 91.157333a32.256 32.256 0 0 0 45.866667 0l187.285333-190.656a32.853333 32.853333 0 0 0 0-46.186666z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/yuyueguanlishezhi.svg b/src/assets/icons/yuyueguanlishezhi.svg
new file mode 100644
index 0000000..eac7549
--- /dev/null
+++ b/src/assets/icons/yuyueguanlishezhi.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M815.253333 573.866667c17.493333 0 33.749333 8.789333 43.456 23.274666l1.984 3.2 68.565334 119.850667c8.704 15.210667 9.322667 33.706667 1.877333 49.386667l-1.877333 3.562666-68.565334 119.850667a52.416 52.416 0 0 1-41.706666 26.346667l-3.733334 0.128h-137.173333c-17.493333 0-33.749333-8.789333-43.456-23.274667l-1.984-3.2-68.565333-119.850667a53.354667 53.354667 0 0 1-1.877334-49.386666l1.877334-3.562667 68.565333-119.850667a52.416 52.416 0 0 1 41.706667-26.346666l3.733333-0.128h137.173333zM693.333333 106.666667A32 32 0 0 1 725.333333 138.666667V170.666667h74.666667a117.333333 117.333333 0 0 1 117.248 112.618666L917.333333 288v280.128l-11.882666-20.352a68.949333 68.949333 0 0 0-59.605334-34.048h-198.357333a68.949333 68.949333 0 0 0-59.605333 34.048l-89.984 154.176a67.456 67.456 0 0 0 0 68.096L546.496 853.333333H224a117.333333 117.333333 0 0 1-117.248-112.618666L106.666667 736v-448a117.333333 117.333333 0 0 1 112.618666-117.248L224 170.666667H298.666667V138.666667a32 32 0 0 1 64 0V170.666667h298.666666V138.666667A32 32 0 0 1 693.333333 106.666667zM746.666667 689.770667c-31.808 0-57.6 25.472-57.6 56.896 0 31.424 25.792 56.896 57.6 56.896s57.6-25.472 57.6-56.896c0-31.424-25.792-56.896-57.6-56.896z m-116.906667-298.453334l-2.453333 2.261334-149.077334 151.957333-0.341333 0.341333a21.333333 21.333333 0 0 1-28.16 1.408l-2.005333-1.813333-51.029334-52.416a32.256 32.256 0 0 0-45.866666 0 32.853333 32.853333 0 0 0-2.218667 43.733333l2.218667 2.474667 89.194666 91.157333c11.882667 11.968 30.656 12.714667 43.392 2.261334l2.474667-2.261334 187.285333-190.656a32.853333 32.853333 0 0 0 0-46.186666 32.256 32.256 0 0 0-43.392-2.261334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zhankai.svg b/src/assets/icons/zhankai.svg
new file mode 100644
index 0000000..aef4e53
--- /dev/null
+++ b/src/assets/icons/zhankai.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M158.293333 371.050667a29.397333 29.397333 0 0 1 0-42.282667 31.146667 31.146667 0 0 1 43.306667 0l302.933333 295.765333a10.666667 10.666667 0 0 0 14.933334 0l302.933333-295.765333a31.146667 31.146667 0 0 1 43.306667 0c11.946667 11.669333 11.946667 30.592 0 42.282667L533.653333 695.232a31.146667 31.146667 0 0 1-43.306666 0L158.293333 371.050667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zhankai_mian.svg b/src/assets/icons/zhankai_mian.svg
new file mode 100644
index 0000000..187e3e9
--- /dev/null
+++ b/src/assets/icons/zhankai_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M558.528 676.053333l282.154667-298.730666A21.333333 21.333333 0 0 0 825.173333 341.333333H198.826667a21.333333 21.333333 0 0 0-15.509334 35.989334L465.472 676.053333a64 64 0 0 0 93.056 0z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zhibo.svg b/src/assets/icons/zhibo.svg
new file mode 100644
index 0000000..d329b49
--- /dev/null
+++ b/src/assets/icons/zhibo.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M650.048 135.424a33.066667 33.066667 0 0 1 44.266667 49.045333L644.053333 234.666667H778.666667a117.333333 117.333333 0 0 1 117.248 112.618666L896 352v384a117.333333 117.333333 0 0 1-117.333333 117.333333h-533.333334A117.333333 117.333333 0 0 1 128 736v-384a117.333333 117.333333 0 0 1 117.333333-117.333333h113.237334l-50.218667-50.197334a33.066667 33.066667 0 0 1 44.266667-49.066666l2.517333 2.282666L452.096 234.666667h98.453333l96.981334-96.981334zM778.666667 298.666667h-533.333334A53.333333 53.333333 0 0 0 192 352v384a53.333333 53.333333 0 0 0 53.333333 53.333333h533.333334a53.333333 53.333333 0 0 0 53.333333-53.333333v-384a53.333333 53.333333 0 0 0-53.333333-53.333333z m-352.064 138.709333c0-26.026667 29.44-41.152 50.602666-26.026667l149.333334 106.624a31.978667 31.978667 0 0 1 0 52.053334l-149.333334 106.624c-21.184 15.125333-50.602667 0-50.602666-26.026667z m64.021333 62.144v88.96l62.293333-44.48-62.293333-44.48z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zhibo_mian.svg b/src/assets/icons/zhibo_mian.svg
new file mode 100644
index 0000000..443e2cb
--- /dev/null
+++ b/src/assets/icons/zhibo_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M650.048 135.424a33.066667 33.066667 0 0 1 44.266667 49.045333L644.053333 234.666667H778.666667a117.333333 117.333333 0 0 1 117.248 112.618666L896 352v384a117.333333 117.333333 0 0 1-117.333333 117.333333h-533.333334A117.333333 117.333333 0 0 1 128 736v-384a117.333333 117.333333 0 0 1 117.333333-117.333333h113.237334l-50.218667-50.197334a33.066667 33.066667 0 0 1 44.266667-49.066666l2.517333 2.282666L452.096 234.666667h98.453333l96.981334-96.981334zM426.602667 437.376v213.248c0 26.026667 29.44 41.152 50.602666 26.026667l149.333334-106.624a31.978667 31.978667 0 0 0 0-52.053334l-149.333334-106.624c-21.184-15.125333-50.602667 0-50.602666 26.026667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zhuangxiu.svg b/src/assets/icons/zhuangxiu.svg
new file mode 100644
index 0000000..c692c45
--- /dev/null
+++ b/src/assets/icons/zhuangxiu.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M469.568 127.530667c28.16-28.16 74.154667-27.776 102.762667 0.853333l2.986666 3.157333 2.816 3.370667 251.093334 318.293333c34.986667 44.373333 32.896 106.773333-4.224 147.477334l-3.584 3.733333-42.986667 42.986667 110.997333 110.976c34.56 34.581333 37.077333 88.938667 7.189334 125.376l-3.093334 3.584-3.029333 3.157333c-35.050667 35.072-91.648 35.712-128.597333 2.282667l-3.498667-3.349334-111.018667-110.976-42.944 42.965334c-38.186667 38.186667-98.005333 43.370667-143.04 13.696l-4.330666-2.986667-3.84-2.901333L134.912 578.133333c-31.765333-25.045333-37.610667-70.762667-13.077333-102.122666l2.752-3.306667 2.944-3.136L469.568 127.530667z m300.586667 350.570666l-292.053334 292.053334 13.205334 10.410666c19.882667 15.68 47.744 14.976 66.261333-1.237333l2.453333-2.304 86.656-86.656 155.392 155.392a31.146667 31.146667 0 0 0 44.032 0.341333c11.306667-11.306667 11.882667-29.333333 1.813334-41.642666l-2.154667-2.389334-155.413333-155.370666 86.677333-86.677334c17.493333-17.493333 19.754667-45.013333 5.866667-65.536l-2.325334-3.2-10.410666-13.184z m-449.408-112.96l-55.744 55.765334 72.021333 54.250666c13.034667 9.813333 16.256 27.84 7.893333 41.472l-1.706666 2.496c-9.813333 13.013333-27.84 16.256-41.472 7.893334l-2.496-1.706667-79.061334-59.584-48.661333 48.682667-0.405333 0.469333a10.389333 10.389333 0 0 0 0.490666 13.312l1.386667 1.28 255.466667 201.536 302.528-302.528-201.514667-255.488-0.832-0.938667a10.432 10.432 0 0 0-13.226667-1.322666l-1.450666 1.194666-48.256 48.277334 59.584 79.04a31.402667 31.402667 0 0 1-50.133334 37.802666l-54.272-72.021333-55.744 55.722667 81.408 81.408a31.402667 31.402667 0 0 1-44.416 44.373333l-81.386666-81.386667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zhuangxiu_mian.svg b/src/assets/icons/zhuangxiu_mian.svg
new file mode 100644
index 0000000..53e8deb
--- /dev/null
+++ b/src/assets/icons/zhuangxiu_mian.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M814.058667 433.984l15.168 19.242667c34.986667 44.352 32.896 106.752-4.224 147.456l-3.584 3.733333-42.986667 42.986667 110.997333 110.976c34.56 34.581333 37.077333 88.938667 7.189334 125.376l-3.093334 3.584-3.029333 3.157333c-35.050667 35.072-91.648 35.712-128.597333 2.282667l-3.498667-3.349334-111.018667-110.976-42.944 42.965334c-38.186667 38.186667-98.005333 43.370667-143.04 13.696l-4.330666-2.986667-3.84-2.901333-19.242667-15.168 380.074667-380.074667zM572.330667 128.362667l2.986666 3.2 2.816 3.349333L774.186667 383.36 383.402667 774.144 134.912 578.133333c-31.765333-25.045333-37.610667-70.762667-13.077333-102.122666l2.752-3.306667 2.944-3.136 43.221333-43.221333 100.736 59.52 1.728 0.853333a10.666667 10.666667 0 0 0 11.946667-16.789333l-71.253334-86.741334 57.728-57.728 101.674667 66.026667 1.706667 0.896a10.666667 10.666667 0 0 0 13.013333-15.701333l-66.346667-101.269334 52.117334-52.117333 72.042666 68.117333 1.493334 1.194667a10.666667 10.666667 0 0 0 15.317333-13.845333l-49.173333-95.146667 56.106666-56.085333c28.138667-28.16 74.133333-27.776 102.741334 0.853333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zhuoweiguanli.svg b/src/assets/icons/zhuoweiguanli.svg
new file mode 100644
index 0000000..ee9d0cc
--- /dev/null
+++ b/src/assets/icons/zhuoweiguanli.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M519.04 575.978667H512h5.781333l4.501334-0.064h3.776l6.186666-0.128c89.92-1.664 173.12-14.528 234.922667-35.626667 21.973333-7.530667 39.978667-15.658667 53.845333-23.744 30.208-14.293333 55.594667-30.677333 74.965334-48.618667L896 490.666667l0.021333 45.162666-0.042666 0.021334L896 885.333333a32 32 0 0 1-64 0V582.528c-21.717333 10.688-46.976 20.053333-75.093333 27.925333l-10.24 2.730667V800a32 32 0 0 1-64 0v-173.312l-5.205334 0.917333-18.730666 2.773334-15.317334 2.005333-23.488 2.56-24.085333 2.048-16.341333 1.066667-8.256 0.448-16.682667 0.725333c-8.405333 0.298667-16.853333 0.512-25.386667 0.64L512 640l-17.152-0.128c-8.533333-0.128-17.002667-0.341333-25.386667-0.64l-20.842666-0.938667-20.48-1.301333-24.064-2.048-23.488-2.56-15.317334-1.984-15.018666-2.218667-8.938667-1.472L341.333333 800a32 32 0 0 1-64 0v-186.816l-10.24-2.730667c-28.138667-7.893333-53.397333-17.237333-75.114666-27.946666L192 864a32 32 0 0 1-64 0l-0.021333-328.170667L128 490.666667v-22.890667c19.370667 17.962667 44.778667 34.346667 75.029333 48.64 13.845333 8.085333 31.829333 16.213333 53.802667 23.722667 61.824 21.12 145.066667 33.984 234.986667 35.669333l6.08 0.085333 2.56 0.042667 5.76 0.042667H512l10.133333-0.064-3.093333 0.064zM512 106.666667c235.648 0 426.666667 95.509333 426.666667 213.333333s-191.018667 213.333333-426.666667 213.333333S85.333333 437.824 85.333333 320 276.352 106.666667 512 106.666667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zichanzhuanrang.svg b/src/assets/icons/zichanzhuanrang.svg
new file mode 100644
index 0000000..8a8d546
--- /dev/null
+++ b/src/assets/icons/zichanzhuanrang.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 234.666667l320 170.666666v405.333334a85.333333 85.333333 0 0 1-85.333333 85.333333H277.333333a85.333333 85.333333 0 0 1-85.333333-85.333333V405.333333l320-170.666666z m149.376 384h-298.666667l-2.432 0.128c-17.365333 1.856-25.514667 23.466667-12.629333 36.309333l85.610667 85.333333 2.005333 1.770667a21.333333 21.333333 0 0 0 28.16-1.813333l1.770667-2.005334a21.333333 21.333333 0 0 0-1.813334-28.16L414.336 661.333333h247.04l2.496-0.149333A21.333333 21.333333 0 0 0 661.376 618.666667z m-72.597333-166.208a21.333333 21.333333 0 0 0-28.16 1.813333l-1.770667 2.005333a21.333333 21.333333 0 0 0 1.813333 28.16L609.706667 533.333333H362.666667l-2.496 0.149334A21.333333 21.333333 0 0 0 362.666667 576h298.666666l2.432-0.128c17.365333-1.856 25.514667-23.466667 12.629334-36.309333l-85.610667-85.333334z m-64.64-322.218667l3.306666 1.493333 372.458667 209.408c16.021333 8.234667 22.101333 27.477333 13.568 42.944-8.021333 14.570667-26.133333 20.629333-41.6 14.421334l-2.858667-1.301334-356.992-201.450666-356.992 201.365333a33.557333 33.557333 0 0 1-42.837333-10.389333l-1.642667-2.645334a31.146667 31.146667 0 0 1 10.773334-41.386666l2.709333-1.578667 372.48-209.365333a33.898667 33.898667 0 0 1 27.648-1.493334z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zuliao.svg b/src/assets/icons/zuliao.svg
new file mode 100644
index 0000000..e210df3
--- /dev/null
+++ b/src/assets/icons/zuliao.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M296.704 517.546667v-3.584l0.32-4.394667 0.704-6.549333 0.938667-6.186667 0.853333-4.736 1.066667-5.12 1.28-5.546667 1.536-5.952 1.834666-6.293333 2.133334-6.613333 2.453333-6.954667 2.816-7.210667 1.536-3.733333 3.370667-7.594667c21.461333-46.421333 64.96-105.173333 153.130666-153.258666 97.472-53.141333 170.176-12.416 220.117334 43.52l6.122666 7.061333c2.005333 2.389333 3.968 4.778667 5.888 7.189333l5.653334 7.274667 2.730666 3.669333 5.312 7.338667 5.056 7.36 4.842667 7.338667 4.608 7.253333 4.373333 7.168 4.138667 7.04 5.802667 10.218667 5.269333 9.728 9.024 17.557333 8 16.170667c9.365333 18.965333 25.130667 34.688 42.88 50.538666l21.952 19.285334c27.946667 24.725333 56.405333 52.736 70.528 95.36 27.285333 82.410667 14.101333 150.912-26.112 191.872l-9.984 10.069333-6.656 6.485333-7.168 6.613334-5.034667 4.458666-5.269333 4.416-5.461333 4.330667-5.674667 4.224-5.888 4.053333c-43.946667 29.184-104.448 42.624-177.706667-31.978666-36.864-37.546667-45.866667-63.658667-49.813333-86.144l-1.066667-6.634667-1.728-12.821333-0.96-6.272c-2.837333-16.661333-8.234667-33.002667-27.904-53.056-23.189333-23.616-36.394667-27.029333-52.416-25.408l-4.650666 0.576-18.474667 3.050666-6.186667 0.853334-3.264 0.362666-6.954666 0.576c-16.96 1.045333-38.954667-0.192-69.76-8.149333-62.208-16.106667-88.64-50.304-99.882667-76.373333l-2.048-5.098667a110.976 110.976 0 0 1-0.874667-2.453333l-1.514666-4.672-1.194667-4.352-1.28-5.781334-0.597333-3.328-0.682667-5.973333a52.544 52.544 0 0 1-0.064-0.768z m-165.888-106.730667c32.405333-32.981333 85.12-32.789333 117.76 0.469333 32.64 33.237333 32.832 86.933333 0.426667 119.893334-32.362667 33.002667-85.077333 32.789333-117.717334-0.426667-32.64-33.28-32.853333-86.954667-0.469333-119.936z m365.013333-270.506667a41.088 41.088 0 0 1 58.858667 0.213334c16.32 16.64 16.426667 43.477333 0.213333 59.968a41.088 41.088 0 0 1-58.88-0.213334 42.965333 42.965333 0 0 1-0.213333-59.968zM365.013333 190.997333a51.968 51.968 0 0 1 36.650667-37.333333c17.941333-4.821333 37.12 0.469333 50.325333 13.909333 20.394667 20.778667 20.522667 54.336 0.277334 74.965334a51.370667 51.370667 0 0 1-73.6-0.298667 53.973333 53.973333 0 0 1-13.653334-51.242667z m-124.608 66.794667a61.653333 61.653333 0 0 1 88.32 0.362667c24.469333 24.917333 24.618667 65.194667 0.32 89.941333a61.653333 61.653333 0 0 1-88.298666-0.362667c-24.469333-24.917333-24.64-65.194667-0.341334-89.941333z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/icons/zuliaoyuding.svg b/src/assets/icons/zuliaoyuding.svg
new file mode 100644
index 0000000..69a9d99
--- /dev/null
+++ b/src/assets/icons/zuliaoyuding.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 class="icon" width="32px" height="32.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M444.096 264.597333c99.733333-58.069333 199.381333-27.306667 259.477333 54.976 14.72 20.16 25.984 38.229333 38.698667 61.226667l21.056 38.613333 8.32 14.72 5.098667 8.64 4.992 8.128 5.12 8.021334 5.546666 8.32 6.122667 8.96c5.312 7.658667 10.88 15.210667 16.853333 22.826666l2.069334 2.56 7.978666 9.493334 33.024 38.485333 15.146667 17.898667 12.864 15.530666 8.192 10.24 4.48 5.909334 3.562667 4.949333 1.386666 2.090667c4.8 7.466667 8.832 14.848 12.16 22.314666 39.530667 88.789333 24.810667 194.773333-28.586666 252.885334-63.616 69.226667-200.085333 83.2-276.544 0-35.84-39.018667-51.541333-70.976-57.685334-108.394667l-0.896-5.141333c-4.928-26.688-12.586667-41.493333-31.253333-53.653334-9.770667-6.357333-28.266667-11.413333-55.445333-15.296l-4.544-0.64-9.856-1.258666-35.584-4.138667-8.853334-1.216-7.530666-1.216a175.146667 175.146667 0 0 1-3.413334-0.64l-6.208-1.408-2.922666-0.768c-62.570667-17.28-101.632-53.824-120.64-100.906667l-2.282667-6.122666-3.221333-10.325334-1.557334-6.186666-1.557333-7.637334-0.810667-5.290666-0.853333-8.405334v-8.490666l0.405333-5.973334 0.853334-8.170666 1.066666-7.509334 0.981334-5.76 1.216-6.250666 1.472-6.677334 1.749333-7.125333 2.048-7.530667 2.389333-7.893333 2.773334-8.234667 3.413333-9.386666 4.949333-12.074667c29.376-67.84 82.624-129.216 164.778667-177.066667z m203.989333 88.298667c-41.813333-54.336-104.96-72.469333-172.309333-32.96-70.165333 41.194667-114.069333 92.16-137.728 147.242667l-3.157333 7.637333-3.626667 9.770667-2.133333 6.464-1.856 6.186666-1.578667 5.824-1.344 5.461334-1.109333 5.098666-0.896 4.672-0.704 4.053334-0.768 5.333333-0.597334 5.610667-0.213333 2.517333-0.064 1.834667 0.341333 3.477333 0.277334 1.984 0.896 4.565333 0.810666 3.242667 1.578667 5.226667 1.792 4.821333c11.050667 27.648 34.368 49.6 77.013333 61.504l3.626667 0.853333 4.650667 0.896 5.802666 0.896 7.125334 0.96 39.936 4.736 10.24 1.386667c36.202667 5.226667 62.101333 12.373333 82.218666 25.557333 39.509333 25.92 54.613333 58.645333 62.4 106.517334l0.768 4.266666c4.416 22.464 14.506667 41.770667 40.042667 69.76 48.512 53.205333 142.293333 43.52 181.973333 0 34.688-38.037333 45.333333-115.328 16.64-180.352a101.696 101.696 0 0 0-7.317333-13.397333 84.458667 84.458667 0 0 0-3.370667-4.821333l-5.077333-6.570667-6.464-8.021333-15.829333-19.008-45.269334-53.290667-7.850666-9.536-1.792-2.282667a574.762667 574.762667 0 0 1-19.264-26.325333l-6.805334-10.005333-6.122666-9.258667-5.674667-8.938667-5.482667-9.002666-5.546666-9.472-5.845334-10.346667-6.4-11.626667-18.517333-34.261333a485.610667 485.610667 0 0 0-34.24-54.613333zM194.410667 381.589333c25.088 25.088 25.258667 65.6 0.341333 90.496-24.896 24.917333-65.408 24.746667-90.496-0.341333-25.088-25.088-25.258667-65.6-0.341333-90.496 24.896-24.917333 65.408-24.746667 90.496 0.341333z m88.490666-173.824a53.333333 53.333333 0 0 1 0.298667 75.434667 53.333333 53.333333 0 0 1-75.434667-0.298667 53.333333 53.333333 0 0 1-0.298666-75.434666 53.333333 53.333333 0 0 1 75.434666 0.298666z m131.157334-88.490666a42.666667 42.666667 0 0 1 0.213333 60.352 42.666667 42.666667 0 0 1-60.330667-0.234667 42.88 42.88 0 0 1-11.2-41.258667c3.882667-14.72 15.36-26.176 30.058667-30.058666a42.88 42.88 0 0 1 41.258667 11.2z m131.157333-24.490667a32 32 0 0 1 0.170667 45.269333 32 32 0 0 1-45.269334-0.170666 32 32 0 0 1-0.170666-45.269334 32 32 0 0 1 45.269333 0.170667z"  /></svg>
\ No newline at end of file
diff --git a/src/assets/images/blue1.png b/src/assets/images/blue1.png
new file mode 100644
index 0000000..64519fd
Binary files /dev/null and b/src/assets/images/blue1.png differ
diff --git a/src/assets/images/blue2.png b/src/assets/images/blue2.png
new file mode 100644
index 0000000..55ab1b5
Binary files /dev/null and b/src/assets/images/blue2.png differ
diff --git a/src/assets/images/blue3.png b/src/assets/images/blue3.png
new file mode 100644
index 0000000..23b7ad3
Binary files /dev/null and b/src/assets/images/blue3.png differ
diff --git a/src/assets/images/green1.png b/src/assets/images/green1.png
new file mode 100644
index 0000000..bbf7b7d
Binary files /dev/null and b/src/assets/images/green1.png differ
diff --git a/src/assets/images/green2.png b/src/assets/images/green2.png
new file mode 100644
index 0000000..5dbbbe6
Binary files /dev/null and b/src/assets/images/green2.png differ
diff --git a/src/assets/images/green3.png b/src/assets/images/green3.png
new file mode 100644
index 0000000..baba2bd
Binary files /dev/null and b/src/assets/images/green3.png differ
diff --git a/src/assets/images/icon_folder.png b/src/assets/images/icon_folder.png
new file mode 100644
index 0000000..99b800f
Binary files /dev/null and b/src/assets/images/icon_folder.png differ
diff --git a/src/assets/images/no_perms.png b/src/assets/images/no_perms.png
new file mode 100644
index 0000000..c37c89b
Binary files /dev/null and b/src/assets/images/no_perms.png differ
diff --git a/src/assets/images/pink1.png b/src/assets/images/pink1.png
new file mode 100644
index 0000000..a3af218
Binary files /dev/null and b/src/assets/images/pink1.png differ
diff --git a/src/assets/images/pink2.png b/src/assets/images/pink2.png
new file mode 100644
index 0000000..de9dbe7
Binary files /dev/null and b/src/assets/images/pink2.png differ
diff --git a/src/assets/images/pink3.png b/src/assets/images/pink3.png
new file mode 100644
index 0000000..28d8cc6
Binary files /dev/null and b/src/assets/images/pink3.png differ
diff --git a/src/assets/images/purple1.png b/src/assets/images/purple1.png
new file mode 100644
index 0000000..bf0946a
Binary files /dev/null and b/src/assets/images/purple1.png differ
diff --git a/src/assets/images/purple2.png b/src/assets/images/purple2.png
new file mode 100644
index 0000000..05c9cef
Binary files /dev/null and b/src/assets/images/purple2.png differ
diff --git a/src/assets/images/purple3.png b/src/assets/images/purple3.png
new file mode 100644
index 0000000..a280049
Binary files /dev/null and b/src/assets/images/purple3.png differ
diff --git a/src/assets/images/red1.png b/src/assets/images/red1.png
new file mode 100644
index 0000000..e9932cb
Binary files /dev/null and b/src/assets/images/red1.png differ
diff --git a/src/assets/images/red2.png b/src/assets/images/red2.png
new file mode 100644
index 0000000..5a10e43
Binary files /dev/null and b/src/assets/images/red2.png differ
diff --git a/src/assets/images/red3.png b/src/assets/images/red3.png
new file mode 100644
index 0000000..e106b7b
Binary files /dev/null and b/src/assets/images/red3.png differ
diff --git a/src/assets/images/theme_black.png b/src/assets/images/theme_black.png
new file mode 100644
index 0000000..417b4d4
Binary files /dev/null and b/src/assets/images/theme_black.png differ
diff --git a/src/assets/images/theme_white.png b/src/assets/images/theme_white.png
new file mode 100644
index 0000000..52714ba
Binary files /dev/null and b/src/assets/images/theme_white.png differ
diff --git a/src/assets/images/yellow1.png b/src/assets/images/yellow1.png
new file mode 100644
index 0000000..7e4d86b
Binary files /dev/null and b/src/assets/images/yellow1.png differ
diff --git a/src/assets/images/yellow2.png b/src/assets/images/yellow2.png
new file mode 100644
index 0000000..49a0c57
Binary files /dev/null and b/src/assets/images/yellow2.png differ
diff --git a/src/assets/images/yellow3.png b/src/assets/images/yellow3.png
new file mode 100644
index 0000000..e435d84
Binary files /dev/null and b/src/assets/images/yellow3.png differ
diff --git a/src/components/app-link/index.vue b/src/components/app-link/index.vue
new file mode 100644
index 0000000..e7fe926
--- /dev/null
+++ b/src/components/app-link/index.vue
@@ -0,0 +1,38 @@
+<template>
+    <component :is="type" v-bind="linkProps">
+        <slot />
+    </component>
+</template>
+
+<script lang="ts" setup>
+/**
+ * @description 兼容第三方页面的跳转
+ */
+import { isExternal } from '@/utils/validate'
+interface Props {
+    to: string | Record<string, string>
+    replace?: boolean
+}
+const props = defineProps<Props>()
+
+const isExternalLink = computed(() => {
+    return typeof props.to !== 'object' && isExternal(props.to)
+})
+
+const type = computed(() => {
+    if (isExternalLink.value) {
+        return 'a'
+    }
+    return 'router-link'
+})
+
+const linkProps = computed(() => {
+    if (isExternalLink.value) {
+        return {
+            href: props.to,
+            target: '_blank'
+        }
+    }
+    return props
+})
+</script>
diff --git a/src/components/color-picker/index.vue b/src/components/color-picker/index.vue
new file mode 100644
index 0000000..ed86ef4
--- /dev/null
+++ b/src/components/color-picker/index.vue
@@ -0,0 +1,32 @@
+<template>
+    <div class="color-select flex flex-1">
+        <el-color-picker v-model="color" :predefine="predefineColors"></el-color-picker>
+        <el-input v-model="color" class="mx-[10px] flex-1" type="text" readonly></el-input>
+        <el-button type="text" @click="reset">重置</el-button>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { useVModel } from '@vueuse/core'
+const props = defineProps({
+    modelValue: {
+        type: String,
+        default: ''
+    },
+    resetColor: {
+        type: String,
+        default: ''
+    }
+})
+
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: number): void
+}>()
+
+const color = useVModel(props, 'modelValue', emit)
+const predefineColors = ['#FF2C3C', '#f7971e', '#fa444d', '#e0a356', '#2f80ed', '#2ec840']
+
+const reset = () => {
+    color.value = props.resetColor
+}
+</script>
\ No newline at end of file
diff --git a/src/components/daterange-picker/index.vue b/src/components/daterange-picker/index.vue
new file mode 100644
index 0000000..5ad8f04
--- /dev/null
+++ b/src/components/daterange-picker/index.vue
@@ -0,0 +1,43 @@
+<template>
+    <el-date-picker
+        v-model="content"
+        type="datetimerange"
+        range-separator="-"
+        start-placeholder="开始时间"
+        end-placeholder="结束时间"
+        value-format="YYYY-MM-DD HH:mm:ss"
+        clearable
+    ></el-date-picker>
+</template>
+
+<script lang="ts" setup>
+import { withDefaults, computed } from 'vue'
+
+/* Props S */
+const props = withDefaults(
+    defineProps<{
+        startTime?: string
+        endTime?: string
+    }>(),
+    {
+        startTime: '',
+        endTime: ''
+    }
+)
+const emit = defineEmits(['update:startTime', 'update:endTime'])
+
+const content = computed<any>({
+    get: () => {
+        return [props.startTime, props.endTime]
+    },
+    set: (value: Event | any) => {
+        if (value === null) {
+            emit('update:startTime', '')
+            emit('update:endTime', '')
+        } else {
+            emit('update:startTime', value[0])
+            emit('update:endTime', value[1])
+        }
+    }
+})
+</script>
diff --git a/src/components/del-wrap/index.vue b/src/components/del-wrap/index.vue
new file mode 100644
index 0000000..787f3e2
--- /dev/null
+++ b/src/components/del-wrap/index.vue
@@ -0,0 +1,51 @@
+<template>
+    <div class="del-wrap">
+        <slot></slot>
+        <div v-if="showClose" class="icon-close" @click.stop="handleClose">
+            <icon :size="12" name="el-icon-CloseBold" />
+        </div>
+    </div>
+</template>
+
+<script lang="ts">
+export default defineComponent({
+    props: {
+        showClose: {
+            type: Boolean,
+            default: true
+        }
+    },
+    emits: ['close'],
+    setup(props, { emit }) {
+        const handleClose = () => {
+            emit('close')
+        }
+        return {
+            handleClose
+        }
+    }
+})
+</script>
+
+<style scoped lang="scss">
+.del-wrap {
+    position: relative;
+    &:hover > .icon-close {
+        display: flex;
+    }
+    .icon-close {
+        display: none;
+        position: absolute;
+        top: -8px;
+        right: -8px;
+        width: 16px;
+        height: 16px;
+        background-color: rgba(0, 0, 0, 0.3);
+        justify-content: center;
+        align-items: center;
+        border-radius: 50%;
+        color: #fff;
+        cursor: pointer;
+    }
+}
+</style>
diff --git a/src/components/dict-value/index.vue b/src/components/dict-value/index.vue
new file mode 100644
index 0000000..7d34aec
--- /dev/null
+++ b/src/components/dict-value/index.vue
@@ -0,0 +1,35 @@
+<template>
+    <div>
+        <template v-for="(item, index) in getOptions" :key="index">
+            <span>{{ index != 0 ? '、' : '' }}{{ item[config.label] }}</span>
+        </template>
+    </div>
+</template>
+<script lang="ts" setup>
+const props = withDefaults(
+    defineProps<{
+        options: any[]
+        value: any
+        config: Record<string, string>
+    }>(),
+    {
+        options: () => [],
+        config: () => ({
+            label: 'name',
+            value: 'value'
+        })
+    }
+)
+
+const values = computed(() => {
+    if (props.value !== null && typeof props.value !== 'undefined') {
+        return Array.isArray(props.value) ? props.value : String(props.value).split(',')
+    } else {
+        return []
+    }
+})
+
+const getOptions = computed(() => {
+    return props.options.filter((item) => values.value.includes(item[props.config.value]))
+})
+</script>
diff --git a/src/components/editor/index.vue b/src/components/editor/index.vue
new file mode 100644
index 0000000..3a7b6c5
--- /dev/null
+++ b/src/components/editor/index.vue
@@ -0,0 +1,143 @@
+<template>
+    <div class="border border-br flex flex-col" :style="styles">
+        <toolbar
+            class="border-b border-br"
+            :editor="editorRef"
+            :defaultConfig="toolbarConfig"
+            :mode="mode"
+        />
+        <w-editor
+            class="flex-1 overflow-hidden"
+            v-model="valueHtml"
+            :defaultConfig="editorConfig"
+            :mode="mode"
+            @onCreated="handleCreated"
+        />
+        <material-picker
+            ref="materialPickerRef"
+            :type="fileType"
+            :limit="-1"
+            hidden-upload
+            @change="selectChange"
+        />
+    </div>
+</template>
+<script setup lang="ts">
+import '@wangeditor/editor/dist/css/style.css' // 引入 css
+import { Editor as WEditor, Toolbar } from '@wangeditor/editor-for-vue'
+import type { IEditorConfig, IToolbarConfig } from '@wangeditor/editor'
+import MaterialPicker from '@/components/material/picker.vue'
+import { addUnit } from '@/utils/util'
+import type { CSSProperties } from 'vue'
+
+const props = withDefaults(
+    defineProps<{
+        modelValue?: string
+        mode?: 'default' | 'simple'
+        height?: string | number
+        width?: string | number
+        toolbarConfig?: Partial<IToolbarConfig>
+    }>(),
+    {
+        modelValue: '',
+        mode: 'default',
+        height: '100%',
+        width: 'auto',
+        toolbarConfig: () => ({})
+    }
+)
+
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: string): void
+}>()
+
+// 编辑器实例，必须用 shallowRef
+const editorRef = shallowRef()
+const materialPickerRef = shallowRef<InstanceType<typeof MaterialPicker>>()
+const fileType = ref('')
+
+let insertFn: any
+
+const editorConfig: Partial<IEditorConfig> = {
+    MENU_CONF: {
+        uploadImage: {
+            customBrowseAndUpload(insert: any) {
+                fileType.value = 'image'
+                materialPickerRef.value?.showPopup(-1)
+                insertFn = insert
+            }
+        },
+        uploadVideo: {
+            customBrowseAndUpload(insert: any) {
+                fileType.value = 'video'
+                materialPickerRef.value?.showPopup(-1)
+                insertFn = insert
+            }
+        }
+    }
+}
+
+const styles = computed<CSSProperties>(() => ({
+    height: addUnit(props.height),
+    width: addUnit(props.width)
+}))
+const valueHtml = computed({
+    get() {
+        return props.modelValue
+    },
+    set(value) {
+        emit('update:modelValue', value)
+    }
+})
+
+const selectChange = (fileUrl: string[]) => {
+    fileUrl.forEach((url) => {
+        insertFn(url)
+    })
+}
+
+// 组件销毁时，也及时销毁编辑器
+onBeforeUnmount(() => {
+    const editor = editorRef.value
+    if (editor == null) return
+    editor.destroy()
+})
+
+const handleCreated = (editor: any) => {
+    editorRef.value = editor // 记录 editor 实例，重要！
+}
+</script>
+
+<style lang="scss">
+.w-e-full-screen-container {
+    z-index: 999;
+}
+.w-e-text-container [data-slate-editor] ul {
+    list-style: disc;
+}
+.w-e-text-container [data-slate-editor] ol {
+    list-style: decimal;
+}
+h1 {
+    font-size: 2em;
+}
+h2 {
+    font-size: 1.5em;
+}
+h3 {
+    font-size: 1.17em;
+}
+h4 {
+    font-size: 1em;
+}
+h5 {
+    font-size: 0.83em;
+}
+h1,
+h2,
+h3,
+h4,
+h5 {
+    font-weight: bold;
+}
+</style>
diff --git a/src/components/export-data/index.vue b/src/components/export-data/index.vue
new file mode 100644
index 0000000..b687c9d
--- /dev/null
+++ b/src/components/export-data/index.vue
@@ -0,0 +1,149 @@
+<template>
+    <div class="export-data">
+        <popup
+            ref="popupRef"
+            title="导出设置"
+            width="500px"
+            confirm-button-text="确认导出"
+            @confirm="handleConfirm"
+            :async="true"
+            @open="getData"
+        >
+            <template #trigger>
+                <el-button>导出</el-button>
+            </template>
+            <div>
+                <el-form ref="formRef" :model="formData" label-width="120px" :rules="formRules">
+                    <el-form-item label="数据量：">
+                        预计导出{{ exportData.count }}条数据， 共{{ exportData.sum_page }}页，每页{{
+                            exportData.page_size
+                        }}条数据
+                    </el-form-item>
+                    <el-form-item label="导出限制：">
+                        每次导出最大允许{{ exportData.max_page }}页，共{{
+                            exportData.all_max_size
+                        }}条数据
+                    </el-form-item>
+                    <el-form-item prop="page_type" label="导出范围：" required>
+                        <el-radio-group v-model="formData.page_type">
+                            <el-radio :label="0">全部导出</el-radio>
+                            <el-radio :label="1">分页导出</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
+                    <el-form-item label="分页范围：" v-if="formData.page_type == 1">
+                        <div class="flex">
+                            <el-form-item prop="page_start">
+                                <el-input
+                                    style="width: 140px"
+                                    v-model.number="formData.page_start"
+                                    placeholder=""
+                                ></el-input>
+                            </el-form-item>
+                            <span class="flex-none ml-2 mr-2">页，至</span>
+                            <el-form-item prop="page_end">
+                                <el-input
+                                    style="width: 140px"
+                                    v-model.number="formData.page_end"
+                                    placeholder=""
+                                ></el-input>
+                            </el-form-item>
+                        </div>
+                    </el-form-item>
+                    <el-form-item label="导出文件名称：" prop="file_name">
+                        <el-input
+                            v-model="formData.file_name"
+                            placeholder="请输入导出文件名称"
+                        ></el-input>
+                    </el-form-item>
+                </el-form>
+            </div>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import feedback from '@/utils/feedback'
+import Popup from '@/components/popup/index.vue'
+import type { FormInstance } from 'element-plus'
+const formRef = shallowRef<FormInstance>()
+const props = defineProps({
+    params: {
+        type: Object,
+        default: () => ({})
+    },
+    pageSize: {
+        type: Number,
+        default: 25
+    },
+    fetchFun: {
+        type: Function,
+        required: true
+    }
+})
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const formData = reactive({
+    page_type: 0,
+    page_start: 1,
+    page_end: 200,
+    file_name: ''
+})
+
+const formRules = {
+    page_start: [
+        { required: true, message: '请输入起始页码' },
+        { type: 'number', message: '页码必须是整数' },
+        {
+            validator: (rule: any, value: any, callback: any) => {
+                if (value <= 0) return callback(new Error('页码必须大于0'))
+                callback()
+            }
+        }
+    ],
+    page_end: [
+        { required: true, message: '请输入结束页码' },
+        { type: 'number', message: '页码必须是整数' },
+        {
+            validator: (rule: any, value: any, callback: any) => {
+                if (value <= 0) return callback(new Error('页码必须大于0'))
+                callback()
+            }
+        }
+    ]
+}
+
+const exportData = reactive({
+    count: 0,
+    sum_page: 0,
+    page_size: 0,
+    max_page: 0,
+    all_max_size: 0
+})
+
+const getData = async () => {
+    const res = await props.fetchFun({
+        ...props.params,
+        page_size: props.pageSize,
+        export: 1
+    })
+    Object.assign(exportData, res)
+    formData.file_name = res.file_name
+    formData.page_end = res.page_end
+    formData.page_start = res.page_start
+}
+const handleConfirm = async () => {
+    await formRef.value?.validate()
+    feedback.loading('正在导出中...')
+    try {
+        await props.fetchFun({
+            ...props.params,
+            ...formData,
+            page_size: props.pageSize,
+            export: 2
+        })
+        popupRef.value?.close()
+        feedback.closeLoading()
+    } catch (error) {
+        feedback.closeLoading()
+    }
+}
+getData()
+</script>
diff --git a/src/components/footer-btns/index.vue b/src/components/footer-btns/index.vue
new file mode 100644
index 0000000..eb5aea2
--- /dev/null
+++ b/src/components/footer-btns/index.vue
@@ -0,0 +1,30 @@
+<template>
+    <div class="footer-btns">
+        <div class="footer-btns__content" :style="fixed ? 'position: fixed' : ''">
+            <slot></slot>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+defineProps({
+    fixed: {
+        type: Boolean,
+        default: true
+    }
+})
+</script>
+
+<style scoped lang="scss">
+.footer-btns {
+    height: 60px;
+    &__content {
+        bottom: 0;
+        height: 60px;
+        right: 0;
+        left: 0;
+        z-index: 99;
+        @apply flex justify-center items-center shadow bg-body;
+    }
+}
+</style>
diff --git a/src/components/icon/index.ts b/src/components/icon/index.ts
new file mode 100644
index 0000000..831fcad
--- /dev/null
+++ b/src/components/icon/index.ts
@@ -0,0 +1,19 @@
+import * as ElementPlusIcons from '@element-plus/icons-vue'
+//@ts-ignore
+import localIconsName from 'virtual:svg-icons-names'
+
+export const LOCAL_ICON_PREFIX = 'local-icon-'
+export const EL_ICON_PREFIX = 'el-icon-'
+
+const elIconsName: string[] = []
+
+for (const [, component] of Object.entries(ElementPlusIcons)) {
+    elIconsName.push(`${EL_ICON_PREFIX}${component.name}`)
+}
+
+export function getElementPlusIconNames() {
+    return elIconsName
+}
+export function getLocalIconNames() {
+    return localIconsName
+}
diff --git a/src/components/icon/index.vue b/src/components/icon/index.vue
new file mode 100644
index 0000000..98dff2a
--- /dev/null
+++ b/src/components/icon/index.vue
@@ -0,0 +1,48 @@
+<script lang="ts">
+import { createVNode } from 'vue'
+import { ElIcon } from 'element-plus'
+import { EL_ICON_PREFIX, LOCAL_ICON_PREFIX } from './index'
+import svgIcon from './svg-icon.vue'
+export default defineComponent({
+    name: 'Icon',
+    props: {
+        name: {
+            type: String,
+            required: true
+        },
+        size: {
+            type: [String, Number],
+            default: '14px'
+        },
+        color: {
+            type: String,
+            default: 'inherit'
+        }
+    },
+    setup(props) {
+        if (props.name.indexOf(EL_ICON_PREFIX) === 0) {
+            // el-icon
+            return () =>
+                createVNode(
+                    ElIcon,
+                    {
+                        size: props.size,
+                        color: props.color
+                    },
+                    () => [createVNode(resolveComponent(props.name.replace(EL_ICON_PREFIX, '')))]
+                )
+        }
+        if (props.name.indexOf(LOCAL_ICON_PREFIX) === 0) {
+            // 本地icon
+            return () =>
+                h(
+                    'i',
+                    {
+                        class: ['local-icon']
+                    },
+                    createVNode(svgIcon, { ...props })
+                )
+        }
+    }
+})
+</script>
diff --git a/src/components/icon/picker.vue b/src/components/icon/picker.vue
new file mode 100644
index 0000000..27fc8cd
--- /dev/null
+++ b/src/components/icon/picker.vue
@@ -0,0 +1,185 @@
+<template>
+    <div class="icon-select">
+        <el-popover
+            trigger="contextmenu"
+            v-model:visible="state.popoverVisible"
+            :width="state.popoverWidth"
+        >
+            <div
+                @mouseover.stop="state.mouseoverSelect = true"
+                @mouseout.stop="state.mouseoverSelect = false"
+            >
+                <div>
+                    <div class="flex justify-between">
+                        <div class="mb-3">请选择图标</div>
+                        <div>
+                            <span
+                                v-for="(item, index) in iconTabsMap"
+                                :key="index"
+                                class="cursor-pointer text-sm ml-2"
+                                :class="{
+                                    'text-primary': index == tabIndex
+                                }"
+                                @click="tabIndex = index"
+                            >
+                                {{ item.name }}
+                            </span>
+                        </div>
+                    </div>
+
+                    <div class="h-[280px]">
+                        <el-scrollbar>
+                            <div class="flex flex-wrap">
+                                <div v-for="item in iconNamesFliter" :key="item" class="m-1">
+                                    <el-button @click="handleSelect(item)">
+                                        <icon :name="item" :size="18" />
+                                    </el-button>
+                                </div>
+                            </div>
+                        </el-scrollbar>
+                    </div>
+                </div>
+            </div>
+            <template #reference>
+                <el-input
+                    ref="inputRef"
+                    v-model.trim="state.inputValue"
+                    placeholder="搜索图标"
+                    :autofocus="false"
+                    :disabled="disabled"
+                    @focus="handleFocus"
+                    @blur="handleBlur"
+                    clearable
+                >
+                    <template #prepend>
+                        <div class="flex items-center" v-if="modelValue">
+                            <el-tooltip class="flex-1 w-20" :content="modelValue" placement="top">
+                                <icon
+                                    class="mr-1"
+                                    :key="modelValue"
+                                    :name="modelValue"
+                                    :size="16"
+                                />
+                            </el-tooltip>
+                        </div>
+
+                        <template v-else>无</template>
+                    </template>
+                    <template #append>
+                        <el-button>
+                            <icon name="el-icon-Close" :size="18" @click="handleClear" />
+                        </el-button>
+                    </template>
+                </el-input>
+            </template>
+        </el-popover>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { computed, nextTick, onMounted, reactive, shallowRef, watch } from 'vue'
+import { useEventListener } from '@vueuse/core'
+import { ElInput } from 'element-plus'
+import { getElementPlusIconNames, getLocalIconNames } from './index'
+interface Props {
+    modelValue: string
+    disabled?: boolean
+}
+withDefaults(defineProps<Props>(), {
+    modelValue: '',
+    disabled: false
+})
+
+const emits = defineEmits<{
+    (e: 'update:modelValue', value: string): void
+    (e: 'change', value: string): void
+}>()
+
+const tabIndex = ref(0)
+const iconTabsMap = [
+    {
+        name: 'element图标',
+        icons: getElementPlusIconNames()
+    },
+    {
+        name: '本地图标',
+        icons: getLocalIconNames()
+    }
+]
+
+const inputRef = shallowRef<InstanceType<typeof ElInput>>()
+
+const state = reactive({
+    inputValue: '',
+    popoverVisible: false,
+    popoverWidth: 0,
+    mouseoverSelect: false,
+    inputFocus: false
+})
+
+// input 框聚焦
+const handleFocus = () => {
+    state.inputFocus = state.popoverVisible = true
+}
+
+// input 框失去焦点
+const handleBlur = () => {
+    state.inputFocus = false
+    state.popoverVisible = state.mouseoverSelect
+}
+
+// 选中图标
+const handleSelect = (icon: string) => {
+    state.mouseoverSelect = state.popoverVisible = false
+    emits('update:modelValue', icon)
+    emits('change', icon)
+}
+//取消选中
+const handleClear = () => {
+    emits('update:modelValue', '')
+    emits('change', '')
+}
+
+//根据输入框内容塞选
+const iconNamesFliter = computed(() => {
+    const iconNames = iconTabsMap[tabIndex.value]?.icons ?? []
+    if (!state.inputValue) {
+        return iconNames
+    }
+    const inputValue = state.inputValue.toLowerCase()
+    return iconNames.filter((icon: string) => {
+        if (icon.toLowerCase().indexOf(inputValue) !== -1) {
+            return icon
+        }
+    })
+})
+
+// 获取 input 的宽度
+const getInputWidth = () => {
+    nextTick(() => {
+        const inputWidth = inputRef.value?.$el.offsetWidth
+        state.popoverWidth = inputWidth < 300 ? 300 : inputWidth
+    })
+}
+
+//监听body点击事件
+useEventListener(document.body, 'click', () => {
+    state.popoverVisible = state.inputFocus || state.mouseoverSelect ? true : false
+})
+
+watch(
+    () => state.popoverVisible,
+    async (value) => {
+        await nextTick()
+        if (value) {
+            inputRef.value?.focus()
+        } else {
+            inputRef.value?.blur()
+        }
+    }
+)
+
+onMounted(() => {
+    getInputWidth()
+})
+</script>
diff --git a/src/components/icon/svg-icon.vue b/src/components/icon/svg-icon.vue
new file mode 100644
index 0000000..10c6919
--- /dev/null
+++ b/src/components/icon/svg-icon.vue
@@ -0,0 +1,38 @@
+<template>
+    <svg aria-hidden="true" :style="styles">
+        <use :xlink:href="symbolId" fill="currentColor" />
+    </svg>
+</template>
+
+<script lang="ts">
+import { addUnit } from '@/utils/util'
+import type { CSSProperties } from 'vue'
+
+export default defineComponent({
+    props: {
+        name: {
+            type: String,
+            required: true
+        },
+        size: {
+            type: [Number, String],
+            default: 16
+        },
+        color: {
+            type: String,
+            default: 'inherit'
+        }
+    },
+    setup(props) {
+        const symbolId = computed(() => `#${props.name}`)
+        const styles = computed<CSSProperties>(() => {
+            return {
+                width: addUnit(props.size),
+                height: addUnit(props.size),
+                color: props.color
+            }
+        })
+        return { symbolId, styles }
+    }
+})
+</script>
diff --git a/src/components/image-contain/index.vue b/src/components/image-contain/index.vue
new file mode 100644
index 0000000..e0285b9
--- /dev/null
+++ b/src/components/image-contain/index.vue
@@ -0,0 +1,42 @@
+<template>
+    <el-image :style="styles" v-bind="props"> </el-image>
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue'
+import type { CSSProperties } from 'vue'
+import { addUnit } from '@/utils/util'
+import { imageProps } from 'element-plus'
+const props = defineProps({
+    width: {
+        type: [String, Number],
+        default: 'auto'
+    },
+    height: {
+        type: [String, Number],
+        default: 'auto'
+    },
+    radius: {
+        type: [String, Number],
+        default: 0
+    },
+    ...imageProps
+})
+
+const styles = computed<CSSProperties>(() => {
+    return {
+        width: addUnit(props.width),
+        height: addUnit(props.height),
+        borderRadius: addUnit(props.radius)
+    }
+})
+</script>
+
+<style lang="scss" scoped>
+.el-image {
+    display: block;
+    .el-image__error {
+        @apply text-xs;
+    }
+}
+</style>
diff --git a/src/components/link/article-list.vue b/src/components/link/article-list.vue
new file mode 100644
index 0000000..e52f201
--- /dev/null
+++ b/src/components/link/article-list.vue
@@ -0,0 +1,149 @@
+<template>
+    <div class="article-list">
+        <el-form ref="formRef" :model="queryParams" :inline="true">
+            <el-form-item label="文章名称">
+                <el-input
+                    class="w-[280px]"
+                    v-model="queryParams.name"
+                    placeholder="请输入"
+                    clearable
+                    @keyup.enter="resetPage"
+                >
+                </el-input>
+                <el-button
+                    type="primary"
+                    class="ml-4"
+                    :icon="Search"
+                    @click="resetPage"
+                />
+            </el-form-item>
+        </el-form>
+
+        <!-- 表格 -->
+        <el-table
+            size="large"
+            v-loading="pager.loading"
+            :data="pager.lists"
+            height="360px"
+            @row-click="handleSelectItem"
+        >
+            <el-table-column label="选择" min-width="50">
+                <template #default="{ row }">
+                    <div class="flex row-center">
+                        <el-checkbox
+                            :model-value="getSelectItem(row.id)"
+                            size="large"
+                            @change="handleSelectItem(row)"
+                        ></el-checkbox>
+                    </div>
+                </template>
+            </el-table-column>
+            <el-table-column label="文章名称" min-width="180">
+                <template #default="{ row }">
+                    <div class="flex items-center">
+                        <el-image
+                            fit="cover"
+                            :src="row.image"
+                            class="flex-none w-[58px] h-[58px]"
+                        />
+                        <div class="ml-4 overflow-hidden">
+                            <el-tooltip effect="dark" :content="row.title" placement="top">
+                                <div class="text-base line-clamp-2">
+                                    {{ row.title }}
+                                </div>
+                            </el-tooltip>
+                        </div>
+                    </div>
+                </template>
+            </el-table-column>
+            <el-table-column label="创建时间" prop="create_time" min-width="140" />
+        </el-table>
+
+        <div class="flex justify-end mt-4">
+            <pagination v-model="pager" @change="getLists" />
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import type { PropType } from "vue";
+import { LinkTypeEnum } from ".";
+import { usePaging } from "@/hooks/usePaging";
+import { articleLists } from "@/api/article";
+import { Search } from "@element-plus/icons-vue";
+
+//TODO TODO
+const props = defineProps({
+    modelValue: {
+        type: Object as PropType<any>,
+        default: () => ({}),
+    },
+});
+const emit = defineEmits<{
+    (event: "update:modelValue", value: any): void;
+}>();
+
+const selectData = ref<any>({
+    path: '/pages/news_detail/news_detail',
+    name: '',
+    query: {},
+    type: LinkTypeEnum.ARTICLE_LIST,
+});
+
+const queryParams = reactive<any>({
+    name: "",
+    is_show: 1
+});
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: articleLists,
+    params: queryParams,
+});
+
+const getSelectItem = (id: number) => {
+    return id == Number(selectData.value.id);
+};
+/**
+ * @description 选择
+ */
+const handleSelectItem = (event: any) => {
+    selectData.value = {
+        id: event.id,
+        name: event.title,
+        path: '/pages/news_detail/news_detail',
+        query: {
+            id: event.id
+        },
+        type: LinkTypeEnum.ARTICLE_LIST,
+    };
+
+    emit("update:modelValue", selectData.value);
+};
+watch(
+    () => props.modelValue,
+    (value) => {
+        if (value.type != LinkTypeEnum.ARTICLE_LIST) {
+            return (selectData.value = {
+                id: "",
+                name: "",
+                path: '/pages/news_detail/news_detail',
+                type: LinkTypeEnum.SHOP_PAGES,
+            });
+        }
+        selectData.value = value;
+    },
+    {
+        immediate: true,
+    }
+);
+
+getLists();
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-input-group__append) {
+    .el-button {
+        margin: 0 0;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/components/link/custom-link.vue b/src/components/link/custom-link.vue
new file mode 100644
index 0000000..990cb95
--- /dev/null
+++ b/src/components/link/custom-link.vue
@@ -0,0 +1,42 @@
+<template>
+    <div class="custom-link h-[428px] mt-[30px]">
+        <div class="flex flex-wrap items-center">
+            自定义链接
+            <div class="ml-4 flex-1 min-w-[100px]">
+                <el-input
+                    :model-value="modelValue.query?.url"
+                    placeholder="请输入链接地址"
+                    @input="handleInput"
+                />
+            </div>
+        </div>
+        <div class="form-tips">
+            请填写完整的带有“https://”或“http://”的链接地址，链接的域名必须在微信公众平台设置业务域名
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import { LinkTypeEnum, type Link } from '.'
+
+defineProps({
+    modelValue: {
+        type: Object as PropType<Link>,
+        default: () => ({})
+    }
+})
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: Link): void
+}>()
+
+const handleInput = (value: string) => {
+    emit('update:modelValue', {
+        path: '/pages/webview/webview',
+        query: {
+            url: value
+        },
+        type: LinkTypeEnum.CUSTOM_LINK
+    })
+}
+</script>
diff --git a/src/components/link/index.ts b/src/components/link/index.ts
new file mode 100644
index 0000000..616b9b8
--- /dev/null
+++ b/src/components/link/index.ts
@@ -0,0 +1,18 @@
+export enum MenuTypeEnum {
+    'SHOP_PAGES' = 'shop',
+    'APPTOOL' = 'application_tool',
+    'OTHER_LINK' = 'other_link'
+}
+
+export enum LinkTypeEnum {
+    'SHOP_PAGES' = 'shop',
+    'ARTICLE_LIST' = 'article',
+    'CUSTOM_LINK' = 'custom'
+}
+
+export interface Link {
+    path: string
+    name?: string
+    type: string
+    query?: Record<string, any>
+}
diff --git a/src/components/link/index.vue b/src/components/link/index.vue
new file mode 100644
index 0000000..41b8ec4
--- /dev/null
+++ b/src/components/link/index.vue
@@ -0,0 +1,145 @@
+<template>
+    <div class="link flex">
+        <el-menu
+            :default-active="activeMenu"
+            class="w-[160px] min-h-[350px] link-menu"
+            :default-openeds="[MenuTypeEnum.SHOP_PAGES, MenuTypeEnum.APPTOOL, MenuTypeEnum.OTHER_LINK]"
+            @select="handleSelect"
+        >
+            <el-sub-menu
+                v-for="(item, index) in menus"
+                :index="item.type"
+                :key="index"
+            >
+                <template #title>
+                    <span>{{ item.name }}</span>
+                </template>
+                <el-menu-item
+                    v-for="(sitem, sindex) in item.children"
+                    :index="sitem.type"
+                    :key="sindex"
+                    style="min-width: 160px"
+                >
+                    <span>{{ sitem.name }}</span>
+                </el-menu-item>
+            </el-sub-menu>
+        </el-menu>
+        <div class="flex-1 pl-4">
+            <shop-pages v-model="activeLink" v-if="LinkTypeEnum.SHOP_PAGES == activeMenu"/>
+            <article-list v-model="activeLink" v-if="LinkTypeEnum.ARTICLE_LIST == activeMenu"/>
+            <custom-link v-model="activeLink" v-if="LinkTypeEnum.CUSTOM_LINK == activeMenu"/>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import type {PropType} from 'vue'
+import {LinkTypeEnum, MenuTypeEnum, type Link} from '.'
+import ShopPages from './shop-pages.vue'
+import CustomLink from './custom-link.vue'
+import ArticleList from './article-list.vue'
+
+const props = defineProps({
+    modelValue: {
+        type: Object as PropType<Link>,
+        required: true
+    }
+})
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: any): void
+}>()
+
+const menus = ref([
+    {
+        name: '商城页面',
+        type: MenuTypeEnum.SHOP_PAGES,
+        children: [
+            {
+                name: '基础页面',
+                type: LinkTypeEnum.SHOP_PAGES,
+                link: {}
+            }
+        ]
+    },
+    {
+        name: '应用工具',
+        type: MenuTypeEnum.APPTOOL,
+        children: [
+            {
+                name: '文章资讯',
+                type: LinkTypeEnum.ARTICLE_LIST,
+                link: {}
+            }
+        ]
+    },
+    {
+        name: '其他',
+        type: MenuTypeEnum.OTHER_LINK,
+        children: [
+            {
+                name: "自定义链接",
+                type: LinkTypeEnum.CUSTOM_LINK,
+                link: {},
+            },
+        ],
+    }
+])
+
+const activeLink = computed({
+    get() {
+        let linkStoreage: any = {};
+        menus.value.forEach((item) => {
+            const res = item.children.find((citem) => citem.type == activeMenu.value);
+            if (res) linkStoreage = res;
+        });
+        return linkStoreage.link;
+    },
+    set(value) {
+        menus.value.forEach((item) => {
+            item.children.forEach((citem) => {
+                if (citem.type == activeMenu.value) {
+                    citem.link = value;
+                }
+            });
+        });
+    },
+});
+
+const activeMenu = ref<string>(LinkTypeEnum.SHOP_PAGES)
+
+const handleSelect = (index: string) => {
+    activeMenu.value = index
+}
+
+watch(activeLink, (value) => {
+    if (!value.type) return
+    emit('update:modelValue', value)
+}, {deep: true})
+
+watch(
+    () => props.modelValue,
+    (value) => {
+        activeMenu.value = value.type
+        activeLink.value = value
+    },
+    {
+        immediate: true
+    }
+)
+</script>
+
+<style lang="scss" scoped>
+.link-menu {
+    --el-menu-item-height: 40px;
+
+    :deep(.el-menu-item) {
+        border-color: transparent;
+
+        &.is-active {
+            border-right-width: 2px;
+            border-color: var(--el-color-primary);
+            background-color: var(--el-color-primary-light-9);
+        }
+    }
+}
+</style>
diff --git a/src/components/link/picker.vue b/src/components/link/picker.vue
new file mode 100644
index 0000000..91b53f8
--- /dev/null
+++ b/src/components/link/picker.vue
@@ -0,0 +1,87 @@
+<template>
+    <div class="link-picker flex-1" @click="!disabled && popupRef?.open()">
+        <el-input :model-value="getLink" placeholder="请选择链接" readonly :disabled="disabled">
+            <template #suffix>
+                <icon v-if="!modelValue?.path" name="el-icon-ArrowRight" />
+                <icon
+                    v-else
+                    name="el-icon-Close"
+                    @click.stop="!disabled && emit('update:modelValue', {})"
+                />
+            </template>
+        </el-input>
+        <popup ref="popupRef" width="900px" title="链接选择" @confirm="handleConfirm">
+            <link-content v-model="activeLink" />
+        </popup>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { LinkTypeEnum, type Link } from '.'
+import LinkContent from './index.vue'
+import Popup from '@/components/popup/index.vue'
+const props = defineProps({
+    modelValue: {
+        type: Object
+    },
+    disabled: {
+        type: Boolean,
+        default: false
+    }
+})
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: any): void
+}>()
+
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const activeLink = ref<Link>({ path: '', type: LinkTypeEnum.SHOP_PAGES })
+const handleConfirm = () => {
+    emit('update:modelValue', activeLink.value)
+}
+
+const getLink = computed(() => {
+    console.log(props.modelValue)
+    switch (props.modelValue?.type) {
+        case LinkTypeEnum.SHOP_PAGES:
+            return props.modelValue.name
+        case LinkTypeEnum.ARTICLE_LIST:
+            return props.modelValue.name;
+        case LinkTypeEnum.CUSTOM_LINK:
+            return props.modelValue.query?.url
+        default:
+            return props.modelValue?.name
+    }
+})
+watch(
+    () => props.modelValue,
+    (value) => {
+        if (value?.type) {
+            activeLink.value = value as Link
+        }
+    },
+    {
+        immediate: true
+    }
+)
+</script>
+
+<style scoped lang="scss">
+.link-picker {
+    :deep(.el-input) {
+        &.is-disabled {
+            .el-input__inner {
+                cursor: not-allowed;
+            }
+            .el-input__suffix {
+                cursor: not-allowed;
+            }
+        }
+        .el-input__inner {
+            cursor: pointer;
+        }
+        .el-input__suffix {
+            cursor: pointer;
+        }
+    }
+}
+</style>
diff --git a/src/components/link/shop-pages.vue b/src/components/link/shop-pages.vue
new file mode 100644
index 0000000..009c390
--- /dev/null
+++ b/src/components/link/shop-pages.vue
@@ -0,0 +1,109 @@
+<template>
+    <div class="shop-pages h-[458px]">
+        <div class="link-list flex flex-wrap">
+            <div
+                class="link-item border border-br px-5 py-[5px] rounded-[3px] cursor-pointer mr-[10px] mb-[10px]"
+                v-for="(item, index) in linkList"
+                :class="{
+                    'border-primary text-primary':
+                        modelValue.path == item.path && modelValue.name == item.name
+                }"
+                :key="index"
+                @click="handleSelect(item)"
+            >
+                {{ item.name }}
+            </div>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import { LinkTypeEnum, type Link } from '.'
+
+defineProps({
+    modelValue: {
+        type: Object as PropType<Link>,
+        default: () => ({})
+    }
+})
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: Link): void
+}>()
+
+const linkList = ref([
+    {
+        path: '/pages/index/index',
+        name: '商城首页',
+        type: LinkTypeEnum.SHOP_PAGES,
+        canTab: true
+    },
+    {
+        path: '/pages/news/news',
+        name: '文章资讯',
+        type: LinkTypeEnum.SHOP_PAGES,
+        canTab: true
+    },
+    {
+        path: '/pages/user/user',
+        name: '个人中心',
+        type: LinkTypeEnum.SHOP_PAGES,
+        canTab: true
+    },
+    {
+        path: '/pages/collection/collection',
+        name: '我的收藏',
+        type: LinkTypeEnum.SHOP_PAGES
+    },
+    {
+        path: '/pages/customer_service/customer_service',
+        name: '联系客服',
+        type: LinkTypeEnum.SHOP_PAGES
+    },
+    {
+        path: '/pages/user_set/user_set',
+        name: '个人设置',
+        type: LinkTypeEnum.SHOP_PAGES
+    },
+    {
+        path: '/pages/as_us/as_us',
+        name: '关于我们',
+        type: LinkTypeEnum.SHOP_PAGES
+    },
+    {
+        path: '/pages/user_data/user_data',
+        name: '个人资料',
+        type: LinkTypeEnum.SHOP_PAGES
+    },
+    {
+        path: '/pages/agreement/agreement',
+        name: '隐私政策',
+        query: {
+            type: 'privacy'
+        },
+        type: LinkTypeEnum.SHOP_PAGES
+    },
+    {
+        path: '/pages/agreement/agreement',
+        name: '服务协议',
+        query: {
+            type: 'service'
+        },
+        type: LinkTypeEnum.SHOP_PAGES
+    },
+    {
+        path: '/pages/search/search',
+        name: '搜索',
+        type: LinkTypeEnum.SHOP_PAGES
+    },
+    {
+        path: '/packages/pages/user_wallet/user_wallet',
+        name: '我的钱包',
+        type: LinkTypeEnum.SHOP_PAGES
+    }
+])
+
+const handleSelect = (value: Link) => {
+    emit('update:modelValue', value)
+}
+</script>
diff --git a/src/components/material/file.vue b/src/components/material/file.vue
new file mode 100644
index 0000000..5169d3f
--- /dev/null
+++ b/src/components/material/file.vue
@@ -0,0 +1,70 @@
+<template>
+    <div>
+        <div class="file-item relative" :style="{ height: height || fileSize, width: width || fileSize }">
+            <el-image class="image" v-if="type == 'image'" fit="contain" :src="uri"></el-image>
+            <video class="video" v-else-if="type == 'video'" :src="uri"></video>
+            <el-image
+                class="image"
+                v-else
+                src="https://img95.699pic.com/element/40103/3946.png_860.png"
+            ></el-image>
+            <div
+                v-if="type == 'video'"
+                class="absolute left-1/2 top-1/2 translate-x-[-50%] translate-y-[-50%] rounded-full w-5 h-5 flex justify-center items-center bg-[rgba(0,0,0,0.3)]"
+            >
+                <icon name="el-icon-CaretRight" :size="18" color="#fff" />
+            </div>
+            <slot></slot>
+        </div>
+    </div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+export default defineComponent({
+    props: {
+        // 图片地址
+        uri: {
+            type: String
+        },
+        // 图片尺寸
+        fileSize: {
+            type: String,
+            default: '100px'
+        },
+        // 选择器尺寸-宽度（不传则是使用size
+        width: {
+            type: String,
+            default: ''
+        },
+        // 选择器尺寸-高度（不传则是使用size
+        height: {
+            type: String,
+            default: ''
+        },
+        // 文件类型
+        type: {
+            type: String,
+            default: 'image'
+        }
+    },
+    emits: ['close']
+})
+</script>
+
+<style scoped lang="scss">
+.file-item {
+    box-sizing: border-box;
+    position: relative;
+    border-radius: 4px;
+    overflow: hidden;
+    @apply bg-br-extra-light border border-br-extra-light;
+    .image,
+    .video {
+        display: block;
+        box-sizing: border-box;
+        width: 100%;
+        height: 100%;
+    }
+}
+</style>
diff --git a/src/components/material/hook.ts b/src/components/material/hook.ts
new file mode 100644
index 0000000..fa4be57
--- /dev/null
+++ b/src/components/material/hook.ts
@@ -0,0 +1,224 @@
+import {
+    fileCateAdd,
+    fileCateDelete,
+    fileCateEdit,
+    fileCateLists,
+    fileDelete,
+    fileList,
+    fileMove,
+    fileRename
+} from '@/api/file'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import { ElMessage, ElTree, type CheckboxValueType } from 'element-plus'
+import { shallowRef, type Ref } from 'vue'
+
+// 左侧分组的钩子函数
+export function useCate(type: number) {
+    const treeRef = shallowRef<InstanceType<typeof ElTree>>()
+    // 分组列表
+    const cateLists = ref<any[]>([])
+
+    // 选中的分组id
+    const cateId = ref<number | string>('')
+
+    // 获取分组列表
+    const getCateLists = async () => {
+        const data = await fileCateLists({
+            page_type: 0,
+            type
+        })
+        const item: any[] = [
+            {
+                name: '全部',
+                id: ''
+            },
+            {
+                name: '未分组',
+                id: 0
+            }
+        ]
+        cateLists.value = data.lists
+        cateLists.value.unshift(...item)
+        setTimeout(() => {
+            treeRef.value?.setCurrentKey(cateId.value)
+        }, 0)
+    }
+
+    // 添加分组
+    const handleAddCate = async (value: string) => {
+        await fileCateAdd({
+            type,
+            name: value,
+            pid: 0
+        })
+        getCateLists()
+    }
+
+    const handleAddChildCate = async (value: string, pid: number) => {
+        await fileCateAdd({
+            type,
+            name: value,
+            pid: pid
+        })
+        getCateLists()
+    }
+
+    // 编辑分组
+    const handleEditCate = async (value: string, id: number) => {
+        await fileCateEdit({
+            id,
+            name: value
+        })
+        getCateLists()
+    }
+
+    // 删除分组
+    const handleDeleteCate = async (id: number, children?: number) => {
+        if (children) {
+            await feedback.confirm('删除文件夹将会永久删除文件夹及其所有内容。您确定要继续吗？')
+        } else {
+            await feedback.confirm('确定要删除？')
+        }
+        await fileCateDelete({ id })
+        cateId.value = ''
+        getCateLists()
+    }
+
+    //选中分类
+    const handleCatSelect = (item: any) => {
+        cateId.value = item.id
+    }
+
+    return {
+        treeRef,
+        cateId,
+        cateLists,
+        handleAddCate,
+        handleAddChildCate,
+        handleEditCate,
+        handleDeleteCate,
+        getCateLists,
+        handleCatSelect
+    }
+}
+
+// 处理文件的钩子函数
+export function useFile(
+    cateId: Ref<string | number>,
+    type: Ref<number>,
+    limit: Ref<number>,
+    size: number
+) {
+    const tableRef = shallowRef()
+    const listShowType = ref('normal')
+    const moveId = ref(0)
+    const select = ref<any[]>([])
+    const isCheckAll = ref(false)
+    const isIndeterminate = ref(false)
+    const fileParams = reactive({
+        name: '',
+        type: type,
+        cid: cateId,
+        source: ''
+    })
+    const { pager, getLists, resetPage } = usePaging({
+        fetchFun: fileList,
+        params: fileParams,
+        firstLoading: true,
+        size
+    })
+
+    const getFileList = () => {
+        getLists()
+    }
+    const refresh = () => {
+        resetPage()
+    }
+
+    const isSelect = (id: number) => {
+        return !!select.value.find((item: any) => item.id == id)
+    }
+
+    const batchFileDelete = async (id?: number[]) => {
+        await feedback.confirm(
+            '确认删除后，本地或云存储文件也将同步删除，如文件已被使用，请谨慎操作！'
+        )
+        const ids = id ? id : select.value.map((item: any) => item.id)
+        await fileDelete({ ids })
+        getFileList()
+        clearSelect()
+    }
+
+    const batchFileMove = async () => {
+        const ids = select.value.map((item: any) => item.id)
+        await fileMove({ ids, cid: moveId.value })
+        moveId.value = 0
+        getFileList()
+        clearSelect()
+    }
+
+    const selectFile = (item: any) => {
+        const index = select.value.findIndex((items: any) => items.id == item.id)
+        if (index != -1) {
+            select.value.splice(index, 1)
+            return
+        }
+        if (select.value.length == limit.value) {
+            if (limit.value == 1) {
+                select.value = []
+                select.value.push(item)
+                return
+            }
+            ElMessage.warning('已达到选择上限')
+            return
+        }
+        select.value.push(item)
+    }
+
+    const clearSelect = () => {
+        select.value = []
+    }
+
+    const cancelSelete = (id: number) => {
+        select.value = select.value.filter((item: any) => item.id != id)
+    }
+
+    const selectAll = (value: CheckboxValueType) => {
+        isIndeterminate.value = false
+        tableRef.value?.toggleAllSelection()
+        if (value) {
+            select.value = [...pager.lists]
+            return
+        }
+        clearSelect()
+    }
+
+    const handleFileRename = async (name: string, id: number) => {
+        await fileRename({
+            id,
+            name
+        })
+        getFileList()
+    }
+    return {
+        listShowType,
+        tableRef,
+        moveId,
+        pager,
+        fileParams,
+        select,
+        isCheckAll,
+        isIndeterminate,
+        getFileList,
+        refresh,
+        batchFileDelete,
+        batchFileMove,
+        selectFile,
+        isSelect,
+        clearSelect,
+        cancelSelete,
+        selectAll,
+        handleFileRename
+    }
+}
diff --git a/src/components/material/index.vue b/src/components/material/index.vue
new file mode 100644
index 0000000..da01eae
--- /dev/null
+++ b/src/components/material/index.vue
@@ -0,0 +1,655 @@
+<template>
+    <div class="material" v-loading="pager.loading">
+        <div class="material__left">
+            <div class="flex-1 min-h-0">
+                <el-scrollbar>
+                    <div class="material-left__content pt-4 p-b-4">
+                        <el-tree
+                            ref="treeRef"
+                            node-key="id"
+                            :data="cateLists"
+                            empty-text="''"
+                            :highlight-current="true"
+                            :expand-on-click-node="false"
+                            :current-node-key="cateId"
+                            @node-click="handleCatSelect"
+                        >
+                            <template v-slot="{ data }">
+                                <div class="flex flex-1 items-center min-w-0 pr-4">
+                                    <img
+                                        class="w-[20px] h-[16px] mr-3"
+                                        src="@/assets/images/icon_folder.png"
+                                    />
+                                    <span class="flex-1 truncate mr-2">
+                                        <overflow-tooltip :content="data.name" />
+                                    </span>
+                                    <el-dropdown v-if="data.id > 0" :hide-on-click="false">
+                                        <span class="muted m-r-10">···</span>
+                                        <template #dropdown>
+                                            <el-dropdown-menu>
+                                                <popover-input
+                                                    @confirm="handleEditCate($event, data.id)"
+                                                    size="default"
+                                                    :value="data.name"
+                                                    width="400px"
+                                                    :limit="20"
+                                                    show-limit
+                                                    teleported
+                                                >
+                                                    <div>
+                                                        <el-dropdown-item>
+                                                            命名分组
+                                                        </el-dropdown-item>
+                                                    </div>
+                                                </popover-input>
+                                                <popover-input
+                                                    @confirm="handleAddChildCate($event, data.id)"
+                                                    size="default"
+                                                    width="400px"
+                                                    :limit="20"
+                                                    show-limit
+                                                    teleported
+                                                >
+                                                    <div>
+                                                        <el-dropdown-item>
+                                                            添加分组
+                                                        </el-dropdown-item>
+                                                    </div>
+                                                </popover-input>
+                                                <div @click="handleDeleteCate(data.id, data?.children?.length)">
+                                                    <el-dropdown-item>删除分组</el-dropdown-item>
+                                                </div>
+                                            </el-dropdown-menu>
+                                        </template>
+                                    </el-dropdown>
+                                </div>
+                            </template>
+                        </el-tree>
+                    </div>
+                </el-scrollbar>
+            </div>
+
+            <div class="flex justify-center p-2 border-t border-br">
+                <popover-input
+                    @confirm="handleAddCate"
+                    size="default"
+                    width="400px"
+                    :limit="20"
+                    show-limit
+                    teleported
+                >
+                    <el-button> 添加分组 </el-button>
+                </popover-input>
+            </div>
+        </div>
+        <div class="material__center flex flex-col">
+            <div class="operate-btn flex">
+                <div class="flex-1 flex">
+                    <upload
+                        v-if="type == 'image'"
+                        class="mr-3"
+                        :data="{ cid: cateId }"
+                        :type="type"
+                        :show-progress="true"
+                        @change="refresh"
+                    >
+                        <el-button type="primary">本地上传</el-button>
+                    </upload>
+                    <upload
+                        v-if="type == 'video'"
+                        class="mr-3"
+                        :data="{ cid: cateId }"
+                        :type="type"
+                        :show-progress="true"
+                        @allSuccess="refresh"
+                    >
+                        <el-button type="primary">本地上传</el-button>
+                    </upload>
+                    <upload
+                        v-if="type == 'file'"
+                        class="mr-3"
+                        :data="{ cid: cateId }"
+                        :type="type"
+                        :show-progress="true"
+                        @allSuccess="refresh"
+                    >
+                        <el-button type="primary">本地上传</el-button>
+                    </upload>
+                    <el-button
+                        v-if="mode == 'page'"
+                        :disabled="!select.length"
+                        @click.stop="batchFileDelete()"
+                    >
+                        删除
+                    </el-button>
+
+                    <popup
+                        v-if="mode == 'page'"
+                        class="ml-3"
+                        @confirm="batchFileMove"
+                        :disabled="!select.length"
+                        title="移动文件"
+                    >
+                        <template #trigger>
+                            <el-button :disabled="!select.length">移动</el-button>
+                        </template>
+
+                        <div>
+                            <span class="mr-5">移动文件至</span>
+                            <el-select v-model="moveId" placeholder="请选择">
+                                <template v-for="item in cateLists" :key="item.id">
+                                    <el-option
+                                        v-if="item.id !== ''"
+                                        :label="item.name"
+                                        :value="item.id"
+                                    ></el-option>
+                                </template>
+                            </el-select>
+                        </div>
+                    </popup>
+                </div>
+                <el-select
+                    v-model="fileParams.source"
+                    placeholder="请选择文件来源"
+                    clearable
+                    style="margin-right: 20px"
+                    class="w-50"
+                >
+                    <el-option
+                        v-for="item in options"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value"
+                    />
+                </el-select>
+                <el-input
+                    class="w-60"
+                    placeholder="请输入名称"
+                    v-model="fileParams.name"
+                    @keyup.enter="refresh"
+                >
+                    <template #append>
+                        <el-button @click="refresh">
+                            <template #icon>
+                                <icon name="el-icon-Search" />
+                            </template>
+                        </el-button>
+                    </template>
+                </el-input>
+
+                <div class="flex items-center ml-2">
+                    <el-tooltip content="列表视图" placement="top">
+                        <div
+                            class="list-icon"
+                            :class="{
+                                select: listShowType == 'table'
+                            }"
+                            @click="listShowType = 'table'"
+                        >
+                            <icon name="local-icon-list-2" :size="18" />
+                        </div>
+                    </el-tooltip>
+                    <el-tooltip content="平铺视图" placement="top">
+                        <div
+                            class="list-icon"
+                            :class="{
+                                select: listShowType == 'normal'
+                            }"
+                            @click="listShowType = 'normal'"
+                        >
+                            <icon name="el-icon-Menu" :size="18" />
+                        </div>
+                    </el-tooltip>
+                </div>
+            </div>
+            <div class="mt-3" v-if="mode == 'page'">
+                <el-checkbox
+                    :disabled="!pager.lists.length"
+                    v-model="isCheckAll"
+                    @change="selectAll"
+                    :indeterminate="isIndeterminate"
+                >
+                    当页全选
+                </el-checkbox>
+            </div>
+            <div class="material-center__content flex flex-col flex-1 mb-1 min-h-0">
+                <el-scrollbar v-if="pager.lists.length" v-show="listShowType == 'normal'">
+                    <ul class="file-list flex flex-wrap mt-4">
+                        <li
+                            class="file-item-wrap"
+                            v-for="item in pager.lists"
+                            :key="item.id"
+                            :style="{ width: fileSize }"
+                        >
+                            <del-wrap @close="batchFileDelete([item.id])">
+                                <file-item
+                                    :uri="item.url"
+                                    :file-size="fileSize"
+                                    :type="type"
+                                    @click="selectFile(item)"
+                                >
+                                    <div class="item-selected" v-if="isSelect(item.id)">
+                                        <icon :size="24" name="el-icon-Check" color="#fff" />
+                                    </div>
+                                </file-item>
+                            </del-wrap>
+
+                            <overflow-tooltip class="mt-1" :content="item.name" />
+                            <div class="operation-btns flex items-center">
+                                <popover-input
+                                    @confirm="handleFileRename($event, item.id)"
+                                    size="default"
+                                    :value="item.name"
+                                    width="400px"
+                                    :limit="50"
+                                    show-limit
+                                    teleported
+                                >
+                                    <el-button type="primary" link> 重命名 </el-button>
+                                </popover-input>
+
+                                <el-button
+                                    v-if="item.type === 10 || item.type === 20"
+                                    type="primary"
+                                    link
+                                    @click="handlePreview(item.url)"
+                                >
+                                    查看
+                                </el-button>
+
+                                <el-button
+                                    v-if="item.type === 10 || item.type === 20"
+                                    type="primary"
+                                    link
+                                    @click="textCopy(item.url)"
+                                    style="margin-left: 1px"
+                                    >地址</el-button
+                                >
+                                <el-link
+                                    v-else
+                                    type="primary"
+                                    :underline="false"
+                                    style="margin-left: 25px"
+                                    :href="item.url"
+                                    >下载</el-link
+                                >
+                            </div>
+                        </li>
+                    </ul>
+                </el-scrollbar>
+
+                <el-table
+                    ref="tableRef"
+                    class="mt-4"
+                    v-show="listShowType == 'table'"
+                    :data="pager.lists"
+                    width="100%"
+                    height="100%"
+                    size="large"
+                    @row-click="selectFile"
+                >
+                    <el-table-column width="55">
+                        <template #default="{ row }">
+                            <el-checkbox :modelValue="isSelect(row.id)" @change="selectFile(row)" />
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="图片" width="100">
+                        <template #default="{ row }">
+                            <file-item :uri="row.url" file-size="50px" :type="type"></file-item>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="名称" min-width="100" show-overflow-tooltip>
+                        <template #default="{ row }">
+                            <el-link @click.stop="handlePreview(row.url)" :underline="false">
+                                {{ row.name }}
+                            </el-link>
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="create_time" label="上传时间" min-width="100" />
+                    <el-table-column label="操作" width="150" fixed="right">
+                        <template #default="{ row }">
+                            <div class="inline-block">
+                                <popover-input
+                                    @confirm="handleFileRename($event, row.id)"
+                                    size="default"
+                                    :value="row.name"
+                                    width="400px"
+                                    :limit="50"
+                                    show-limit
+                                    teleported
+                                >
+                                    <el-button type="primary" link> 重命名 </el-button>
+                                </popover-input>
+                            </div>
+                            <div class="inline-block">
+                                <el-button type="primary" link @click.stop="handlePreview(row.url)">
+                                    查看
+                                </el-button>
+                            </div>
+                            <div class="inline-block">
+                                <el-button
+                                    type="primary"
+                                    link
+                                    @click.stop="batchFileDelete([row.id])"
+                                >
+                                    删除
+                                </el-button>
+                            </div>
+                        </template>
+                    </el-table-column>
+                </el-table>
+
+                <div
+                    class="flex flex-1 justify-center items-center"
+                    v-if="!pager.loading && !pager.lists.length"
+                >
+                    暂无数据~
+                </div>
+            </div>
+            <div class="material-center__footer flex justify-between items-center mt-2">
+                <div class="flex">
+                    <template v-if="mode == 'page'">
+                        <span class="mr-3">
+                            <el-checkbox
+                                :disabled="!pager.lists.length"
+                                v-model="isCheckAll"
+                                @change="selectAll"
+                                :indeterminate="isIndeterminate"
+                            >
+                                当页全选
+                            </el-checkbox>
+                        </span>
+                        <el-button :disabled="!select.length" @click="batchFileDelete()">
+                            删除
+                        </el-button>
+                        <popup
+                            class="ml-3 inline"
+                            @confirm="batchFileMove"
+                            :disabled="!select.length"
+                            title="移动文件"
+                        >
+                            <template #trigger>
+                                <el-button :disabled="!select.length">移动</el-button>
+                            </template>
+
+                            <div>
+                                <span class="mr-5">移动文件至</span>
+                                <el-select v-model="moveId" placeholder="请选择">
+                                    <template v-for="item in cateLists" :key="item.id">
+                                        <el-option
+                                            v-if="item.id !== ''"
+                                            :label="item.name"
+                                            :value="item.id"
+                                        ></el-option>
+                                    </template>
+                                </el-select>
+                            </div>
+                        </popup>
+                    </template>
+                </div>
+                <pagination
+                    v-model="pager"
+                    @change="getFileList"
+                    layout="total, prev, pager, next, jumper"
+                />
+            </div>
+        </div>
+        <div class="material__right" v-if="mode == 'picker'">
+            <div class="flex justify-between p-2 flex-wrap">
+                <div class="sm flex items-center">
+                    已选择 {{ select.length }}
+                    <span v-if="limit">/{{ limit }}</span>
+                </div>
+                <el-button type="primary" link @click="clearSelect">清空</el-button>
+            </div>
+            <div class="flex-1 min-h-0">
+                <el-scrollbar class="ls-scrollbar">
+                    <ul class="select-lists flex flex-col p-t-3">
+                        <li class="mb-4" v-for="item in select" :key="item.id">
+                            <div class="select-item">
+                                <del-wrap @close="cancelSelete(item.id)">
+                                    <file-item
+                                        :uri="item.url"
+                                        file-size="100px"
+                                        :type="type"
+                                    ></file-item>
+                                </del-wrap>
+                            </div>
+                        </li>
+                    </ul>
+                </el-scrollbar>
+            </div>
+        </div>
+        <preview v-model="showPreview" :url="previewUrl" :type="type" />
+        <input ref="textCopys" id="textCopys" value="" style="opacity: 0; position: absolute" />
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { useCate, useFile } from './hook'
+import FileItem from './file.vue'
+import Preview from './preview.vue'
+import type { Ref } from 'vue'
+import { ElMessage } from 'element-plus'
+const props = defineProps({
+    fileSize: {
+        type: String,
+        default: '100px'
+    },
+    limit: {
+        type: Number,
+        default: 1
+    },
+    type: {
+        type: String,
+        default: 'image'
+    },
+    mode: {
+        type: String,
+        default: 'picker'
+    },
+    pageSize: {
+        type: Number,
+        default: 15
+    }
+})
+const emit = defineEmits(['change'])
+const { limit } = toRefs(props)
+const typeValue = computed<number>(() => {
+    switch (props.type) {
+        case 'image':
+            return 10
+        case 'video':
+            return 20
+        case 'file':
+            return 30
+        default:
+            return 0
+    }
+})
+const options = [
+    {
+        value: '0',
+        label: '后台上传'
+    },
+    {
+        value: '1',
+        label: '前端上传'
+    }
+]
+
+const visible: Ref<boolean> = inject('visible')!
+const previewUrl = ref('')
+const showPreview = ref(false)
+const {
+    treeRef,
+    cateId,
+    cateLists,
+    handleAddCate,
+    handleAddChildCate,
+    handleEditCate,
+    handleDeleteCate,
+    getCateLists,
+    handleCatSelect
+} = useCate(typeValue.value)
+
+const {
+    tableRef,
+    listShowType,
+    moveId,
+    pager,
+    fileParams,
+    select,
+    isCheckAll,
+    isIndeterminate,
+    getFileList,
+    refresh,
+    batchFileDelete,
+    batchFileMove,
+    selectFile,
+    isSelect,
+    clearSelect,
+    cancelSelete,
+    selectAll,
+    handleFileRename
+} = useFile(cateId, typeValue, limit, props.pageSize)
+
+const getData = async () => {
+    await getCateLists()
+    treeRef.value?.setCurrentKey(cateId.value)
+    getFileList()
+}
+
+const handlePreview = (url: string) => {
+    previewUrl.value = url
+    showPreview.value = true
+}
+watch(
+    visible,
+    async (val: boolean) => {
+        if (val) {
+            getData()
+        }
+    },
+    {
+        immediate: true
+    }
+)
+watch(cateId, () => {
+    fileParams.name = ''
+    refresh()
+})
+
+watch(
+    select,
+    (val: any[]) => {
+        emit('change', val)
+        if (val.length == pager.lists.length && val.length !== 0) {
+            isIndeterminate.value = false
+            isCheckAll.value = true
+            return
+        }
+        if (val.length > 0) {
+            isIndeterminate.value = true
+        } else {
+            isCheckAll.value = false
+            isIndeterminate.value = false
+        }
+    },
+    {
+        deep: true
+    }
+)
+
+onMounted(() => {
+    props.mode == 'page' && getData()
+})
+
+defineExpose({
+    clearSelect
+})
+
+const textCopys = ref()
+const textCopy = (uri: string) => {
+    const text = uri // 复制文本内容
+    const input = textCopys.value
+    input.value = text // 修改input的内容
+    input.select() // 选中文本
+    document.execCommand('copy') // 浏览器复制
+    ElMessage({
+        message: '地址复制成功',
+        type: 'success'
+    })
+}
+</script>
+
+<style scoped lang="scss">
+.material {
+    @apply h-full min-h-0 flex flex-1;
+    &__left {
+        @apply border-r border-br flex flex-col w-[200px];
+        :deep(.el-tree-node__content) {
+            height: 36px;
+            .el-tree-node__label {
+                display: flex;
+                flex: 1;
+                min-width: 0;
+            }
+        }
+    }
+    &__center {
+        flex: 1;
+        min-width: 0;
+        min-height: 0;
+        padding: 16px 16px 0;
+        .list-icon {
+            border-radius: 3px;
+            display: flex;
+            padding: 5px;
+            cursor: pointer;
+            &.select {
+                @apply text-primary bg-primary-light-8;
+            }
+        }
+        .file-list {
+            .file-item-wrap {
+                margin-right: 16px;
+                line-height: 1.3;
+                cursor: pointer;
+                .item-selected {
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    position: absolute;
+                    top: 0;
+                    left: 0;
+                    width: 100%;
+                    height: 100%;
+                    border-radius: 4px;
+                    background-color: rgba(0, 0, 0, 0.5);
+                    box-sizing: border-box;
+                }
+                .operation-btns {
+                    height: 28px;
+                    visibility: hidden;
+                }
+                &:hover .operation-btns {
+                    visibility: visible;
+                }
+            }
+        }
+    }
+    &__right {
+        @apply border-l border-br flex flex-col;
+        width: 130px;
+        .select-lists {
+            padding: 10px;
+
+            .select-item {
+                width: 100px;
+                height: 100px;
+            }
+        }
+    }
+}
+</style>
diff --git a/src/components/material/picker.vue b/src/components/material/picker.vue
new file mode 100644
index 0000000..5b43cfc
--- /dev/null
+++ b/src/components/material/picker.vue
@@ -0,0 +1,315 @@
+<template>
+    <div class="material-select">
+        <popup
+            ref="popupRef"
+            width="830px"
+            custom-class="body-padding"
+            :title="`选择${tipsText}`"
+            @confirm="handleConfirm"
+            @close="handleClose"
+        >
+            <template v-if="!hiddenUpload" #trigger>
+                <div class="material-select__trigger clearfix" @click.stop>
+                    <draggable class="draggable" v-model="fileList" animation="300" item-key="id">
+                        <template v-slot:item="{ element, index }">
+                            <div
+                                class="material-preview"
+                                :class="{
+                                    'is-disabled': disabled,
+                                    'is-one': limit == 1
+                                }"
+                                @click="showPopup(index)"
+                            >
+                                <del-wrap @close="deleteImg(index)">
+                                    <file-item
+                                        :uri="excludeDomain ? getImageUrl(element) : element"
+                                        :file-size="size"
+                                        :width="width"
+                                        :height="height"
+                                        :type="type"
+                                    ></file-item>
+                                </del-wrap>
+                                <div class="operation-btns text-xs text-center">
+                                    <span>修改</span>
+                                    |
+                                    <span @click.stop="handlePreview(element)">查看</span>
+                                </div>
+                            </div>
+                        </template>
+                    </draggable>
+                    <div
+                        class="material-upload"
+                        @click="showPopup(-1)"
+                        v-show="showUpload"
+                        :class="{
+                            'is-disabled': disabled,
+                            'is-one': limit == 1,
+                            [uploadClass]: true
+                        }"
+                    >
+                        <slot name="upload">
+                            <div
+                                class="upload-btn"
+                                :style="{
+                                    width: width || size,
+                                    height: height || size
+                                }"
+                            >
+                                <icon :size="25" name="el-icon-Plus" />
+                                <span>添加</span>
+                            </div>
+                        </slot>
+                    </div>
+                </div>
+            </template>
+            <el-scrollbar>
+                <div class="material-wrap">
+                    <material
+                        ref="materialRef"
+                        :type="type"
+                        :file-size="fileSize"
+                        :limit="meterialLimit"
+                        @change="selectChange"
+                    />
+                </div>
+            </el-scrollbar>
+        </popup>
+        <preview v-model="showPreview" :url="previewUrl" :type="type" />
+    </div>
+</template>
+
+<script lang="ts">
+import Draggable from 'vuedraggable'
+import Popup from '@/components/popup/index.vue'
+import FileItem from './file.vue'
+import Material from './index.vue'
+import Preview from './preview.vue'
+import useAppStore from '@/stores/modules/app'
+import { useThrottleFn } from '@vueuse/core'
+export default defineComponent({
+    components: {
+        Popup,
+        Draggable,
+        FileItem,
+        Material,
+        Preview
+    },
+    props: {
+        modelValue: {
+            type: [String, Array],
+            default: () => []
+        },
+        // 文件类型
+        type: {
+            type: String,
+            default: 'image'
+        },
+        // 选择器尺寸
+        size: {
+            type: String,
+            default: '100px'
+        },
+        // 选择器尺寸-宽度（不传则是使用size
+        width: {
+            type: String,
+            default: ''
+        },
+        // 选择器尺寸-高度（不传则是使用size
+        height: {
+            type: String,
+            default: ''
+        },
+        // 文件尺寸
+        fileSize: {
+            type: String,
+            default: '100px'
+        },
+        // 选择数量限制
+        limit: {
+            type: Number,
+            default: 1
+        },
+        // 禁用选择
+        disabled: {
+            type: Boolean,
+            default: false
+        },
+        // 隐藏上传框*(目前在富文本中使用到)
+        hiddenUpload: {
+            type: Boolean,
+            default: false
+        },
+        uploadClass: {
+            type: String,
+            default: ''
+        },
+        //选择的url排出域名
+        excludeDomain: {
+            type: Boolean,
+            default: false
+        }
+    },
+
+    emits: ['change', 'update:modelValue'],
+    setup(props, { emit }) {
+        const popupRef = ref<InstanceType<typeof Popup>>()
+        const materialRef = ref<InstanceType<typeof Material>>()
+        const previewUrl = ref('')
+        const showPreview = ref(false)
+        const fileList = ref<any[]>([])
+        const select = ref<any[]>([])
+        const isAdd = ref(true)
+        const currentIndex = ref(-1)
+        const { disabled, limit, modelValue } = toRefs(props)
+        const { getImageUrl } = useAppStore()
+        const tipsText = computed(() => {
+            switch (props.type) {
+                case 'image':
+                    return '图片'
+                case 'video':
+                    return '视频'
+                default:
+                    return ''
+            }
+        })
+
+        const showUpload = computed(() => {
+            return props.limit - fileList.value.length > 0
+        })
+        const meterialLimit: any = computed(() => {
+            if (!isAdd.value) {
+                return 1
+            }
+            if (limit.value == -1) return null
+            return limit.value - fileList.value.length
+        })
+        const handleConfirm = useThrottleFn(
+            () => {
+                const selectUri = select.value.map((item) =>
+                    props.excludeDomain ? item.uri : item.url
+                )
+                if (!isAdd.value) {
+                    fileList.value.splice(currentIndex.value, 1, selectUri.shift())
+                } else {
+                    fileList.value = [...fileList.value, ...selectUri]
+                }
+                handleChange()
+            },
+            1000,
+            false
+        )
+        const showPopup = (index: number) => {
+            if (disabled.value) return
+            if (index >= 0) {
+                isAdd.value = false
+                currentIndex.value = index
+            } else {
+                isAdd.value = true
+            }
+            popupRef.value?.open()
+        }
+
+        const selectChange = (val: any[]) => {
+            select.value = val
+        }
+        const handleChange = () => {
+            const valueImg = limit.value != 1 ? fileList.value : fileList.value[0] || ''
+            emit('update:modelValue', valueImg)
+            emit('change', valueImg)
+            handleClose()
+        }
+
+        const deleteImg = (index: number) => {
+            fileList.value.splice(index, 1)
+            handleChange()
+        }
+
+        const handlePreview = (url: string) => {
+            previewUrl.value = url
+            showPreview.value = true
+        }
+
+        const handleClose = () => {
+            nextTick(() => {
+                if (props.hiddenUpload) fileList.value = []
+                materialRef.value?.clearSelect()
+            })
+        }
+
+        watch(
+            modelValue,
+            (val: any[] | string) => {
+                fileList.value = Array.isArray(val) ? val : val == '' ? [] : [val]
+            },
+            {
+                immediate: true
+            }
+        )
+        provide('limit', props.limit)
+        provide('hiddenUpload', props.hiddenUpload)
+        return {
+            popupRef,
+            materialRef,
+            fileList,
+            tipsText,
+            handleConfirm,
+            meterialLimit,
+            showUpload,
+            showPopup,
+            selectChange,
+            deleteImg,
+            previewUrl,
+            showPreview,
+            handlePreview,
+            handleClose,
+            getImageUrl
+        }
+    }
+})
+</script>
+
+<style scoped lang="scss">
+.material-select {
+    .material-upload,
+    .material-preview {
+        position: relative;
+        border-radius: 4px;
+        cursor: pointer;
+        margin-right: 8px;
+        margin-bottom: 8px;
+        box-sizing: border-box;
+        float: left;
+        &.is-disabled {
+            cursor: not-allowed;
+        }
+        &.is-one {
+            margin-bottom: 0;
+        }
+        &:hover {
+            .operation-btns {
+                display: block;
+            }
+        }
+        .operation-btns {
+            display: none;
+            position: absolute;
+            bottom: 0;
+            border-radius: 4px;
+            width: 100%;
+            line-height: 2;
+            color: #fff;
+            background-color: rgba(0, 0, 0, 0.3);
+        }
+    }
+    .material-upload {
+        :deep(.upload-btn) {
+            @apply text-tx-secondary box-border rounded border-br border-dashed border flex flex-col justify-center items-center;
+        }
+    }
+}
+.material-wrap {
+    min-width: 720px;
+    height: 430px;
+    @apply border-t border-b border-br;
+}
+</style>
diff --git a/src/components/material/preview.vue b/src/components/material/preview.vue
new file mode 100644
index 0000000..6accaa0
--- /dev/null
+++ b/src/components/material/preview.vue
@@ -0,0 +1,72 @@
+<template>
+    <div v-show="modelValue">
+        <div v-if="type == 'image'">
+            <el-image-viewer
+                v-if="previewLists.length"
+                :url-list="previewLists"
+                hide-on-click-modal
+                @close="handleClose"
+            />
+        </div>
+        <div v-if="type == 'video'">
+            <el-dialog v-model="visible" width="740px" title="视频预览" :before-close="handleClose">
+                <video-player ref="playerRef" :src="url" width="100%" height="450px" />
+            </el-dialog>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+const props = defineProps({
+    modelValue: {
+        type: Boolean,
+        default: false
+    },
+    url: {
+        type: String,
+        default: ''
+    },
+    type: {
+        type: String,
+        default: 'image'
+    }
+})
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: boolean): void
+}>()
+
+const playerRef = shallowRef()
+
+const visible = computed({
+    get() {
+        return props.modelValue
+    },
+
+    set(value) {
+        emit('update:modelValue', value)
+    }
+})
+
+const handleClose = () => {
+    emit('update:modelValue', false)
+}
+
+const previewLists = ref<any[]>([])
+
+watch(
+    () => props.modelValue,
+    (value) => {
+        if (value) {
+            nextTick(() => {
+                previewLists.value = [props.url]
+                playerRef.value?.play()
+            })
+        } else {
+            nextTick(() => {
+                previewLists.value = []
+                playerRef.value?.pause()
+            })
+        }
+    }
+)
+</script>
diff --git a/src/components/overflow-tooltip/index.vue b/src/components/overflow-tooltip/index.vue
new file mode 100644
index 0000000..57734db
--- /dev/null
+++ b/src/components/overflow-tooltip/index.vue
@@ -0,0 +1,47 @@
+<template>
+    <div>
+        <el-tooltip v-bind="props" :disabled="disabled">
+            <div
+                ref="textRef"
+                class="overflow-text truncate"
+                :style="{ textOverflow: overfloType }"
+            >
+                {{ content }}
+            </div>
+        </el-tooltip>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { useEventListener } from '@vueuse/core'
+import { useTooltipContentProps, type Placement } from 'element-plus'
+import type { PropType } from 'vue'
+
+const props = defineProps({
+    ...useTooltipContentProps,
+    teleported: {
+        type: Boolean,
+        default: false
+    },
+    placement: {
+        type: String as PropType<Placement>,
+        default: 'top'
+    },
+    overfloType: {
+        type: String as PropType<'ellipsis' | 'unset' | 'clip'>,
+        default: 'ellipsis'
+    }
+})
+const textRef = shallowRef<HTMLElement>()
+const disabled = ref(false)
+
+useEventListener(textRef, 'mouseenter', () => {
+    if (textRef.value?.scrollWidth! > textRef.value?.offsetWidth!) {
+        disabled.value = false
+    } else {
+        disabled.value = true
+    }
+})
+</script>
+
+<style></style>
diff --git a/src/components/pagination/index.vue b/src/components/pagination/index.vue
new file mode 100644
index 0000000..020d304
--- /dev/null
+++ b/src/components/pagination/index.vue
@@ -0,0 +1,50 @@
+<template>
+    <div class="pagination">
+        <el-pagination
+            v-bind="props"
+            :pager-count="5"
+            v-model:currentPage="pager.page"
+            v-model:pageSize="pager.size"
+            :page-sizes="pageSizes"
+            :layout="layout"
+            :total="pager.count"
+            :hide-on-single-page="false"
+            @size-change="sizeChange"
+            @current-change="pageChange"
+        ></el-pagination>
+    </div>
+</template>
+
+<script lang="ts" setup>
+interface Props {
+    modelValue?: Record<string, any>
+    pageSizes?: number[]
+    layout?: string
+}
+const props = withDefaults(defineProps<Props>(), {
+    modelValue: () => ({}),
+    pageSizes: () => [15, 20, 30, 40],
+    layout: 'total, sizes, prev, pager, next, jumper'
+})
+
+const emit = defineEmits<{
+    (event: 'change'): void
+    (event: 'update:modelValue', value: any): void
+}>()
+
+const pager = computed({
+    get() {
+        return props.modelValue
+    },
+    set(value) {
+        emit('update:modelValue', value)
+    }
+})
+const sizeChange = () => {
+    pager.value.page = 1
+    emit('change')
+}
+const pageChange = () => {
+    emit('change')
+}
+</script>
diff --git a/src/components/popover-input/index.vue b/src/components/popover-input/index.vue
new file mode 100644
index 0000000..88ba84a
--- /dev/null
+++ b/src/components/popover-input/index.vue
@@ -0,0 +1,130 @@
+<template>
+    <div @mouseenter="inPopover = true" @mouseleave="inPopover = false">
+        <el-popover
+            placement="top"
+            v-model:visible="visible"
+            :width="width"
+            trigger="contextmenu"
+            class="popover-input"
+            :teleported="teleported"
+            :persistent="false"
+            popper-class="!p-0"
+        >
+            <div class="flex p-3" @click.stop="">
+                <div class="popover-input__input mr-[10px] flex-1">
+                    <el-select
+                        class="flex-1"
+                        :size="size"
+                        v-if="type == 'select'"
+                        v-model="inputValue"
+                        :teleported="teleported"
+                    >
+                        <el-option
+                            v-for="item in options"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value"
+                        ></el-option>
+                    </el-select>
+                    <el-input
+                        v-else
+                        v-model.trim="inputValue"
+                        :maxlength="limit"
+                        :show-word-limit="showLimit"
+                        :type="type"
+                        :size="size"
+                        clearable
+                        :placeholder="placeholder"
+                    />
+                </div>
+                <div class="popover-input__btns flex-none">
+                    <el-button link @click="close">取消</el-button>
+                    <el-button type="primary" :size="size" @click="handleConfirm">确定</el-button>
+                </div>
+            </div>
+            <template #reference>
+                <div class="inline" @click.stop="handleOpen">
+                    <slot></slot>
+                </div>
+            </template>
+        </el-popover>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { useEventListener } from '@vueuse/core'
+import type { PropType } from 'vue'
+
+const props = defineProps({
+    value: {
+        type: String
+    },
+    type: {
+        type: String,
+        default: 'text'
+    },
+    width: {
+        type: [Number, String],
+        default: '300px'
+    },
+    placeholder: String,
+    disabled: {
+        type: Boolean,
+        default: false
+    },
+    options: {
+        type: Array as PropType<any[]>,
+        default: () => []
+    },
+    size: {
+        type: String as PropType<'default' | 'small' | 'large'>,
+        default: 'default'
+    },
+    limit: {
+        type: Number,
+        default: 200
+    },
+    showLimit: {
+        type: Boolean,
+        default: false
+    },
+    teleported: {
+        type: Boolean,
+        default: true
+    }
+})
+const emit = defineEmits(['confirm'])
+const visible = ref(false)
+const inPopover = ref(false)
+const inputValue = ref()
+const handleConfirm = () => {
+    close()
+    emit('confirm', inputValue.value)
+}
+const handleOpen = () => {
+    if (props.disabled) {
+        return
+    }
+    visible.value = true
+}
+const close = () => {
+    visible.value = false
+}
+
+watch(
+    () => props.value,
+    (value) => {
+        inputValue.value = value
+    },
+    {
+        immediate: true
+    }
+)
+
+useEventListener(document.documentElement, 'click', () => {
+    if (inPopover.value) return
+    close()
+})
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/components/popup/index.vue b/src/components/popup/index.vue
new file mode 100644
index 0000000..726f89f
--- /dev/null
+++ b/src/components/popup/index.vue
@@ -0,0 +1,132 @@
+<template>
+    <div class="dialog">
+        <div class="dialog__trigger" @click="open">
+            <!-- 触发弹窗 -->
+            <slot name="trigger"></slot>
+        </div>
+        <el-dialog
+            v-model="visible"
+            :custom-class="customClass"
+            :center="center"
+            :append-to-body="true"
+            :width="width"
+            :close-on-click-modal="clickModalClose"
+            @closed="close"
+        >
+            <!-- 弹窗内容 -->
+            <template v-if="title" #header>{{ title }}</template>
+
+            <!-- 自定义内容 -->
+            <slot>{{ content }}</slot>
+            <!-- 底部弹窗页脚 -->
+            <template #footer>
+                <div class="dialog-footer">
+                    <el-button v-if="cancelButtonText" @click="handleEvent('cancel')">
+                        {{ cancelButtonText }}
+                    </el-button>
+                    <el-button
+                        v-if="confirmButtonText"
+                        type="primary"
+                        @click="handleEvent('confirm')"
+                    >
+                        {{ confirmButtonText }}
+                    </el-button>
+                </div>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script lang="ts">
+export default defineComponent({
+    props: {
+        title: {
+            // 弹窗标题
+            type: String,
+            default: ''
+        },
+        content: {
+            // 弹窗内容
+            type: String,
+            default: ''
+        },
+        confirmButtonText: {
+            // 确认按钮内容
+            type: [String, Boolean],
+            default: '确定'
+        },
+        cancelButtonText: {
+            // 取消按钮内容
+            type: [String, Boolean],
+            default: '取消'
+        },
+        width: {
+            // 弹窗的宽度
+            type: String,
+            default: '400px'
+        },
+        disabled: {
+            // 是否禁用
+            type: Boolean,
+            default: false
+        },
+        async: {
+            // 是否开启异步关闭
+            type: Boolean,
+            default: false
+        },
+        clickModalClose: {
+            // 点击遮罩层关闭对话窗口
+            type: Boolean,
+            default: false
+        },
+        center: {
+            // 是否居中布局
+            type: Boolean,
+            default: false
+        },
+        customClass: {
+            type: String,
+            default: ''
+        }
+    },
+    emits: ['confirm', 'cancel', 'close', 'open'],
+    setup(props, { emit }) {
+        const visible = ref(false)
+
+        const handleEvent = (type: 'confirm' | 'cancel') => {
+            emit(type)
+            if (!props.async || type === 'cancel') {
+                close()
+            }
+        }
+
+        const close = () => {
+            visible.value = false
+            nextTick(() => {
+                emit('close')
+            })
+        }
+        const open = () => {
+            if (props.disabled) {
+                return
+            }
+            emit('open')
+            visible.value = true
+        }
+        provide('visible', visible)
+        return {
+            visible,
+            handleEvent,
+            close,
+            open
+        }
+    }
+})
+</script>
+
+<style scoped lang="scss">
+.dialog-body {
+    white-space: pre-line;
+}
+</style>
diff --git a/src/components/upload/index.vue b/src/components/upload/index.vue
new file mode 100644
index 0000000..6f2846e
--- /dev/null
+++ b/src/components/upload/index.vue
@@ -0,0 +1,158 @@
+<template>
+    <div class="upload">
+        <el-upload
+            v-model:file-list="fileList"
+            ref="uploadRefs"
+            :action="action"
+            :multiple="multiple"
+            :limit="limit"
+            :show-file-list="false"
+            :headers="headers"
+            :data="data"
+            :on-progress="handleProgress"
+            :on-success="handleSuccess"
+            :on-exceed="handleExceed"
+            :on-error="handleError"
+            :accept="getAccept"
+        >
+            <slot />
+        </el-upload>
+        <el-dialog
+            v-if="showProgress && fileList.length"
+            v-model="visible"
+            title="上传进度"
+            :close-on-click-modal="false"
+            width="500px"
+            :modal="false"
+            @close="handleClose"
+        >
+            <div class="file-list p-4">
+                <template v-for="(item, index) in fileList" :key="index">
+                    <div class="mb-5">
+                        <div>{{ item.name }}</div>
+                        <div class="flex-1">
+                            <el-progress :percentage="parseInt(item.percentage)" />
+                        </div>
+                    </div>
+                </template>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, ref, shallowRef } from 'vue'
+import useUserStore from '@/stores/modules/user'
+import config from '@/config'
+import feedback from '@/utils/feedback'
+import type { ElUpload } from 'element-plus'
+import { RequestCodeEnum } from '@/enums/requestEnums'
+export default defineComponent({
+    components: {},
+    props: {
+        // 上传文件类型
+        type: {
+            type: String,
+            default: 'image'
+        },
+        // 是否支持多选
+        multiple: {
+            type: Boolean,
+            default: true
+        },
+        // 多选时最多选择几条
+        limit: {
+            type: Number,
+            default: 10
+        },
+        // 上传时的额外参数
+        data: {
+            type: Object,
+            default: () => ({})
+        },
+        // 是否显示上传进度
+        showProgress: {
+            type: Boolean,
+            default: false
+        }
+    },
+    emits: ['change', 'error', 'success', 'allSuccess'],
+    setup(props, { emit }) {
+        const userStore = useUserStore()
+        const uploadRefs = shallowRef<InstanceType<typeof ElUpload>>()
+        const action = ref(`${config.baseUrl}${config.urlPrefix}/upload/${props.type}`)
+        const headers = computed(() => ({
+            token: userStore.token,
+            version: config.version
+        }))
+        const visible = ref(false)
+        const fileList = ref<any[]>([])
+
+        const handleProgress = (event: any, file: any, fileLists: any[]) => {
+            visible.value = true
+        }
+        let uploadLen = 0
+        const handleSuccess = (response: any, file: any, fileLists: any[]) => {
+            uploadLen++
+            if (uploadLen == fileList.value.length) {
+                uploadLen = 0
+                fileList.value = []
+                emit('allSuccess')
+            }
+            emit('change', file)
+            if (response.code == RequestCodeEnum.SUCCESS) {
+                emit('success', response)
+            }
+            if (response.code == RequestCodeEnum.FAIL && response.msg) {
+                feedback.msgError(response.msg)
+            }
+        }
+        const handleError = (event: any, file: any) => {
+            uploadLen++
+            if (uploadLen == fileList.value.length) {
+                uploadLen = 0
+                fileList.value = []
+                emit('allSuccess')
+            }
+            feedback.msgError(`${file.name}文件上传失败`)
+            uploadRefs.value?.abort(file)
+            visible.value = false
+            emit('change', file)
+            emit('error', file)
+        }
+        const handleExceed = () => {
+            feedback.msgError(`超出上传上限${props.limit}，请重新上传`)
+        }
+        const handleClose = () => {
+            fileList.value = []
+            visible.value = false
+        }
+
+        const getAccept = computed(() => {
+            switch (props.type) {
+                case 'image':
+                    return '.jpg,.png,.gif,.jpeg,.ico'
+                case 'video':
+                    return '.wmv,.avi,.mpg,.mpeg,.3gp,.mov,.mp4,.flv,.rmvb,.mkv'
+                default:
+                    return '*'
+            }
+        })
+        return {
+            uploadRefs,
+            action,
+            headers,
+            visible,
+            fileList,
+            getAccept,
+            handleProgress,
+            handleSuccess,
+            handleError,
+            handleExceed,
+            handleClose
+        }
+    }
+})
+</script>
+
+<style lang="scss"></style>
diff --git a/src/components/video-player/index.vue b/src/components/video-player/index.vue
new file mode 100644
index 0000000..8a49f31
--- /dev/null
+++ b/src/components/video-player/index.vue
@@ -0,0 +1,72 @@
+<template>
+    <div>
+        <video-play
+            ref="playerRef"
+            v-bind="options"
+            :src="src"
+            @play="onPlay"
+            @pause="onPause"
+            @timeupdate="onTimeupdate"
+            @canplay="onCanplay"
+        />
+    </div>
+</template>
+
+<script setup lang="ts">
+import { reactive, shallowRef } from 'vue'
+import 'vue3-video-play/dist/style.css'
+import VideoPlay from 'vue3-video-play'
+const props = defineProps({
+    src: {
+        type: String,
+        required: true
+    },
+    width: String,
+    height: String,
+    poster: String
+})
+
+const playerRef = shallowRef()
+const options = reactive({
+    color: 'var(--el-color-primary)', //主题色
+    muted: false, //静音
+    webFullScreen: false,
+    speedRate: ['0.75', '1.0', '1.25', '1.5', '2.0'], //播放倍速
+    autoPlay: true, //自动播放
+    loop: false, //循环播放
+    mirror: false, //镜像画面
+    ligthOff: false, //关灯模式
+    volume: 0.3, //默认音量大小
+    control: true, //是否显示控制器
+    title: '', //视频名称
+    poster: '', //封面
+    ...props
+})
+
+const play = () => {
+    playerRef.value.play()
+}
+
+const pause = () => {
+    playerRef.value.pause()
+}
+
+const onPlay = (event: any) => {
+    console.log(event, '播放')
+}
+const onPause = (event: any) => {
+    console.log(event, '暂停')
+}
+
+const onTimeupdate = (event: any) => {
+    console.log(event, '时间更新')
+}
+const onCanplay = (event: any) => {
+    console.log(event, '可以播放')
+}
+
+defineExpose({
+    play,
+    pause
+})
+</script>
diff --git a/src/config/index.ts b/src/config/index.ts
new file mode 100644
index 0000000..8c33a20
--- /dev/null
+++ b/src/config/index.ts
@@ -0,0 +1,10 @@
+const config = {
+    terminal: 1, //终端
+    title: '后台管理系统', //网站默认标题
+    version: '1.8.0', //版本号
+    baseUrl: `${import.meta.env.VITE_APP_BASE_URL || ''}/`, //请求接口域名
+    urlPrefix: 'adminapi', //请求默认前缀
+    timeout: 10 * 1000 //请求超时时长
+}
+
+export default config
diff --git a/src/config/setting.ts b/src/config/setting.ts
new file mode 100644
index 0000000..35d62e1
--- /dev/null
+++ b/src/config/setting.ts
@@ -0,0 +1,16 @@
+const defaultSetting = {
+    showCrumb: true, // 是否显示面包屑
+    showLogo: true, // 是否显示logo
+    isUniqueOpened: false, //只展开一个一级菜单
+    sideWidth: 200, //侧边栏宽度
+    sideTheme: 'light', //侧边栏主题
+    sideDarkColor: '#1d2124', //侧边栏深色主题颜色
+    openMultipleTabs: true, // 是否开启多标签tab栏
+    theme: '#4A5DFF', //主题色
+    successTheme: '#67c23a', //成功主题色
+    warningTheme: '#e6a23c', //警告主题色
+    dangerTheme: '#f56c6c', //危险主题色
+    errorTheme: '#f56c6c', //错误主题色
+    infoTheme: '#909399' //信息主题色
+}
+export default defaultSetting
diff --git a/src/enums/appEnums.ts b/src/enums/appEnums.ts
new file mode 100644
index 0000000..90ac145
--- /dev/null
+++ b/src/enums/appEnums.ts
@@ -0,0 +1,40 @@
+//菜单主题类型
+export enum ThemeEnum {
+    LIGHT = 'light',
+    DARK = 'dark'
+}
+
+// 菜单类型
+export enum MenuEnum {
+    CATALOGUE = 'M',
+    MENU = 'C',
+    BUTTON = 'A'
+}
+
+// 屏幕
+export enum ScreenEnum {
+    SM = 640,
+    MD = 768,
+    LG = 1024,
+    XL = 1280,
+    '2XL' = 1536
+}
+
+// 客户端类型
+export enum ClientEnum {
+    MP_WEIXIN = 1, // 微信-小程序
+    OA_WEIXIN = 2, // 微信-公众号
+    H5 = 3, // H5
+    PC = 4, // PC
+    IOS = 5, //苹果
+    ANDROID = 6 //安卓
+}
+
+export const ClientMap = {
+    [ClientEnum.MP_WEIXIN]: '微信小程序',
+    [ClientEnum.OA_WEIXIN]: '微信公众号',
+    [ClientEnum.H5]: '手机H5',
+    [ClientEnum.PC]: '电脑PC',
+    [ClientEnum.IOS]: '苹果APP',
+    [ClientEnum.ANDROID]: '安卓APP'
+}
diff --git a/src/enums/cacheEnums.ts b/src/enums/cacheEnums.ts
new file mode 100644
index 0000000..45624e4
--- /dev/null
+++ b/src/enums/cacheEnums.ts
@@ -0,0 +1,8 @@
+// 本地缓冲key
+
+//token
+export const TOKEN_KEY = 'token'
+//账号
+export const ACCOUNT_KEY = 'account'
+//设置
+export const SETTING_KEY = 'setting'
diff --git a/src/enums/pageEnum.ts b/src/enums/pageEnum.ts
new file mode 100644
index 0000000..1509ff5
--- /dev/null
+++ b/src/enums/pageEnum.ts
@@ -0,0 +1,7 @@
+export enum PageEnum {
+    //登录页面
+    LOGIN = '/login',
+    //无权限页面
+    ERROR_403 = '/403',
+    INDEX = '/'
+}
diff --git a/src/enums/requestEnums.ts b/src/enums/requestEnums.ts
new file mode 100644
index 0000000..7ee2107
--- /dev/null
+++ b/src/enums/requestEnums.ts
@@ -0,0 +1,18 @@
+export enum ContentTypeEnum {
+    // json
+    JSON = 'application/json;charset=UTF-8',
+    // form-data   上传资源（图片，视频）
+    FORM_DATA = 'multipart/form-data;charset=UTF-8'
+}
+
+export enum RequestMethodsEnum {
+    GET = 'GET',
+    POST = 'POST'
+}
+
+export enum RequestCodeEnum {
+    SUCCESS = 1,
+    FAIL = 0,
+    LOGIN_FAILURE = -1,
+    OPEN_NEW_PAGE = 2
+}
diff --git a/src/hooks/useDictOptions.ts b/src/hooks/useDictOptions.ts
new file mode 100644
index 0000000..d79ec5a
--- /dev/null
+++ b/src/hooks/useDictOptions.ts
@@ -0,0 +1,67 @@
+import { getDictData } from '@/api/app'
+import { reactive, toRaw } from 'vue'
+
+interface Options {
+    [propName: string]: {
+        api: PromiseFun
+        params?: Record<string, any>
+        transformData?(data: any): any
+    }
+}
+
+// {
+//     dict: {
+//         api: dictData,
+//         params: { name: 'user' },
+//         transformData(data: any) {
+//             return data.list
+//         }
+//     }
+// }
+
+export function useDictOptions<T = any>(options: Options) {
+    const optionsData: any = reactive({})
+    const optionsKey = Object.keys(options)
+    const apiLists = optionsKey.map((key) => {
+        const value = options[key]
+        optionsData[key] = []
+        return () => value.api(toRaw(value.params) || {})
+    })
+
+    const refresh = async () => {
+        const res = await Promise.allSettled<Promise<any>>(apiLists.map((api) => api()))
+        res.forEach((item, index) => {
+            const key = optionsKey[index]
+            if (item.status == 'fulfilled') {
+                const { transformData } = options[key]
+                const data = transformData ? transformData(item.value) : item.value
+                optionsData[key] = data
+            }
+        })
+    }
+    refresh()
+    return {
+        optionsData: optionsData as T,
+        refresh
+    }
+}
+
+// useDictData<{
+//     dict: any[]
+// }>(['dict'])
+
+export function useDictData<T = any>(dict: string) {
+    const dictData: any = reactive({})
+    const refresh = async () => {
+        const data = await getDictData({
+            type: dict
+        })
+        Object.assign(dictData, data)
+    }
+    refresh()
+
+    return {
+        dictData: dictData as T,
+        refresh
+    }
+}
diff --git a/src/hooks/useLockFn.ts b/src/hooks/useLockFn.ts
new file mode 100644
index 0000000..c4423d6
--- /dev/null
+++ b/src/hooks/useLockFn.ts
@@ -0,0 +1,21 @@
+import { ref } from 'vue'
+
+export function useLockFn(fn: (...args: any[]) => Promise<any>) {
+    const isLock = ref(false)
+    const lockFn = async (...args: any[]) => {
+        if (isLock.value) return
+        isLock.value = true
+        try {
+            const res = await fn(...args)
+            isLock.value = false
+            return res
+        } catch (e) {
+            isLock.value = false
+            throw e
+        }
+    }
+    return {
+        isLock,
+        lockFn
+    }
+}
diff --git a/src/hooks/useMultipleTabs.ts b/src/hooks/useMultipleTabs.ts
new file mode 100644
index 0000000..02e1e43
--- /dev/null
+++ b/src/hooks/useMultipleTabs.ts
@@ -0,0 +1,47 @@
+import useTabsStore from '@/stores/modules/multipleTabs'
+import useSettingStore from '@/stores/modules/setting'
+
+export default function useMultipleTabs() {
+    const router = useRouter()
+    const route = useRoute()
+    const tabsStore = useTabsStore()
+    const settingStore = useSettingStore()
+
+    const tabsLists = computed(() => {
+        return tabsStore.getTabList
+    })
+
+    const currentTab = computed(() => {
+        return route.fullPath
+    })
+
+    const addTab = () => {
+        if (!settingStore.openMultipleTabs) return
+        tabsStore.addTab(router)
+    }
+
+    const removeTab = (fullPath?: any) => {
+        if (!settingStore.openMultipleTabs) return
+        fullPath = fullPath ?? route.fullPath
+        tabsStore.removeTab(fullPath, router)
+    }
+
+    const removeOtherTab = () => {
+        if (!settingStore.openMultipleTabs) return
+        tabsStore.removeOtherTab(route)
+    }
+
+    const removeAllTab = () => {
+        if (!settingStore.openMultipleTabs) return
+        tabsStore.removeAllTab(router)
+    }
+
+    return {
+        tabsLists,
+        currentTab,
+        addTab,
+        removeTab,
+        removeOtherTab,
+        removeAllTab
+    }
+}
diff --git a/src/hooks/usePaging.ts b/src/hooks/usePaging.ts
new file mode 100644
index 0000000..9c33890
--- /dev/null
+++ b/src/hooks/usePaging.ts
@@ -0,0 +1,64 @@
+import { reactive, toRaw } from 'vue'
+
+// 分页钩子函数
+interface Options {
+    page?: number
+    size?: number
+    fetchFun: (_arg: any) => Promise<any>
+    params?: Record<any, any>
+    firstLoading?: boolean
+}
+
+export function usePaging(options: Options) {
+    const { page = 1, size = 15, fetchFun, params = {}, firstLoading = false } = options
+    // 记录分页初始参数
+    const paramsInit: Record<any, any> = Object.assign({}, toRaw(params))
+    // 分页数据
+    const pager = reactive({
+        page,
+        size,
+        loading: firstLoading,
+        count: 0,
+        lists: [] as any[],
+        extend: {} as Record<string, any>
+    })
+    // 请求分页接口
+    const getLists = () => {
+        pager.loading = true
+        return fetchFun({
+            page_no: pager.page,
+            page_size: pager.size,
+            ...params
+        })
+            .then((res: any) => {
+                pager.count = res?.count
+                pager.lists = res?.lists
+                pager.extend = res?.extend
+                return Promise.resolve(res)
+            })
+            .catch((err: any) => {
+                return Promise.reject(err)
+            })
+            .finally(() => {
+                pager.loading = false
+            })
+    }
+    // 重置为第一页
+    const resetPage = () => {
+        pager.page = 1
+        getLists()
+    }
+    // 重置参数
+    const resetParams = () => {
+        Object.keys(paramsInit).forEach((item) => {
+            params[item] = paramsInit[item]
+        })
+        getLists()
+    }
+    return {
+        pager,
+        getLists,
+        resetParams,
+        resetPage
+    }
+}
diff --git a/src/hooks/useWatchRoute.ts b/src/hooks/useWatchRoute.ts
new file mode 100644
index 0000000..381b2ec
--- /dev/null
+++ b/src/hooks/useWatchRoute.ts
@@ -0,0 +1,17 @@
+import type { RouteLocationNormalizedLoaded } from 'vue-router'
+
+export function useWatchRoute(callback: (route: RouteLocationNormalizedLoaded) => void) {
+    const route = useRoute()
+    watch(
+        route,
+        () => {
+            callback(route)
+        },
+        {
+            immediate: true
+        }
+    )
+    return {
+        route
+    }
+}
diff --git a/src/install/directives/copy.ts b/src/install/directives/copy.ts
new file mode 100644
index 0000000..c0b1909
--- /dev/null
+++ b/src/install/directives/copy.ts
@@ -0,0 +1,28 @@
+/**
+ * perm 操作权限处理
+ * 指令用法：
+ *  <el-button v-perms="['auth.menu/edit']">编辑</el-button>
+ */
+
+import feedback from '@/utils/feedback'
+import useClipboard from 'vue-clipboard3'
+const clipboard = 'data-clipboard-text'
+export default {
+    mounted: (el: HTMLElement, binding: any) => {
+        el.setAttribute(clipboard, binding.value)
+        const { toClipboard } = useClipboard()
+
+        el.onclick = () => {
+            toClipboard(el.getAttribute(clipboard)!)
+                .then(() => {
+                    feedback.msgSuccess('复制成功')
+                })
+                .catch(() => {
+                    feedback.msgError('复制失败')
+                })
+        }
+    },
+    updated: (el: HTMLElement, binding: any) => {
+        el.setAttribute(clipboard, binding.value)
+    }
+}
diff --git a/src/install/directives/perms.ts b/src/install/directives/perms.ts
new file mode 100644
index 0000000..507dbfe
--- /dev/null
+++ b/src/install/directives/perms.ts
@@ -0,0 +1,29 @@
+/**
+ * perm 操作权限处理
+ * 指令用法：
+ *  <el-button v-perms="['auth.menu/edit']">编辑</el-button>
+ */
+
+import useUserStore from '@/stores/modules/user'
+
+export default {
+    mounted: (el: HTMLElement, binding: any) => {
+        const { value } = binding
+        const userStore = useUserStore()
+        const permissions = userStore.perms
+        const all_permission = '*'
+        if (Array.isArray(value)) {
+            if (value.length > 0) {
+                const hasPermission = permissions.some((key: string) => {
+                    return all_permission == key || value.includes(key)
+                })
+
+                if (!hasPermission) {
+                    el.parentNode && el.parentNode.removeChild(el)
+                }
+            }
+        } else {
+            throw new Error('like v-perms="[\'auth.menu/edit\']"')
+        }
+    }
+}
diff --git a/src/install/index.ts b/src/install/index.ts
new file mode 100644
index 0000000..eab8563
--- /dev/null
+++ b/src/install/index.ts
@@ -0,0 +1,27 @@
+import type { App } from 'vue'
+const modules = import.meta.glob('./**/*', { eager: true })
+
+// 安装方法，执行某一类相同操作
+function install(app: App<Element>) {
+    Object.keys(modules).forEach((key) => {
+        const name = key.replace(/(.*\/)*([^.]+).*/gi, '$2')
+        const type = key.replace(/^\.\/([\w-]+).*/gi, '$1')
+        const module: any = modules[key]
+        if (module.default) {
+            switch (type) {
+                // 用于注册全局指令
+                case 'directives':
+                    app.directive(name, module.default)
+                    break
+                // 使用插件
+                case 'plugins':
+                    typeof module.default === 'function' && module.default(app)
+                    break
+            }
+        }
+    })
+}
+
+export default {
+    install
+}
diff --git a/src/install/plugins/echart.ts b/src/install/plugins/echart.ts
new file mode 100644
index 0000000..96edebb
--- /dev/null
+++ b/src/install/plugins/echart.ts
@@ -0,0 +1,63 @@
+//引入 echarts 核心模块，核心模块提供了 echarts 使用必须要的接口。
+
+import * as echarts from 'echarts/core'
+//引入柱状图图表，图表后缀都为 Chart
+import {
+    BarChart,
+    LineChart,
+    PieChart,
+    MapChart,
+    PictorialBarChart,
+    RadarChart,
+    ScatterChart
+} from 'echarts/charts'
+// 引入提示框，标题，直角坐标系，数据集，内置数据转换器组件，组件后缀都为 Component
+import {
+    TitleComponent,
+    TooltipComponent,
+    GridComponent,
+    PolarComponent,
+    AriaComponent,
+    ParallelComponent,
+    LegendComponent,
+    RadarComponent,
+    ToolboxComponent,
+    DataZoomComponent,
+    VisualMapComponent,
+    TimelineComponent,
+    CalendarComponent,
+    GraphicComponent
+} from 'echarts/components'
+
+//引入 Canvas 渲染器，注意引入 CanvasRenderer 或者 SVGRenderer 是必须的一步
+import { CanvasRenderer } from 'echarts/renderers'
+//标签自动布局，全局过渡动画等特性
+import { LabelLayout, UniversalTransition } from 'echarts/features'
+
+// 注册必须的组件
+echarts.use([
+    LegendComponent,
+    TitleComponent,
+    TooltipComponent,
+    GridComponent,
+    PolarComponent,
+    AriaComponent,
+    ParallelComponent,
+    BarChart,
+    LineChart,
+    PieChart,
+    MapChart,
+    RadarChart,
+    PictorialBarChart,
+    RadarComponent,
+    ToolboxComponent,
+    DataZoomComponent,
+    VisualMapComponent,
+    TimelineComponent,
+    CalendarComponent,
+    GraphicComponent,
+    ScatterChart,
+    CanvasRenderer,
+    LabelLayout,
+    UniversalTransition
+])
diff --git a/src/install/plugins/element.ts b/src/install/plugins/element.ts
new file mode 100644
index 0000000..ac6ae23
--- /dev/null
+++ b/src/install/plugins/element.ts
@@ -0,0 +1,11 @@
+import * as ElementPlusIcons from '@element-plus/icons-vue'
+import type { App } from 'vue'
+//https://github.com/element-plus/element-plus/issues/7293
+import 'element-plus/es/components/dialog/style/css'
+
+export default (app: App<Element>) => {
+    // 全局注册ElementPlus图标
+    for (const [key, component] of Object.entries(ElementPlusIcons)) {
+        app.component(key, component)
+    }
+}
diff --git a/src/install/plugins/hljs.ts b/src/install/plugins/hljs.ts
new file mode 100644
index 0000000..041ac77
--- /dev/null
+++ b/src/install/plugins/hljs.ts
@@ -0,0 +1,8 @@
+import type { App } from 'vue'
+import 'highlight.js/styles/github.css'
+import hljs from 'highlight.js/lib/common'
+import hljsVuePlugin from '@highlightjs/vue-plugin'
+console.log(hljs)
+export default (app: App<Element>) => {
+    app.use(hljsVuePlugin)
+}
diff --git a/src/install/plugins/pinia.ts b/src/install/plugins/pinia.ts
new file mode 100644
index 0000000..6e72e75
--- /dev/null
+++ b/src/install/plugins/pinia.ts
@@ -0,0 +1,6 @@
+import store from '@/stores'
+import type { App } from 'vue'
+
+export default (app: App<Element>) => {
+    app.use(store)
+}
diff --git a/src/install/plugins/router.ts b/src/install/plugins/router.ts
new file mode 100644
index 0000000..475874e
--- /dev/null
+++ b/src/install/plugins/router.ts
@@ -0,0 +1,8 @@
+import router from '@/router'
+import { registerRouteGuard } from '@/router/guard'
+import type { App } from 'vue'
+
+export default (app: App<Element>) => {
+    registerRouteGuard(router)
+    app.use(router)
+}
diff --git a/src/layout/components/footer.vue b/src/layout/components/footer.vue
new file mode 100644
index 0000000..1a41561
--- /dev/null
+++ b/src/layout/components/footer.vue
@@ -0,0 +1,22 @@
+<template>
+    <footer class="layout-footer">
+        <div class="text-center p-2 text-xs text-tx-secondary max-w-[900px] mx-auto">
+            <a
+                class="mx-1 hover:underline"
+                :href="item.value"
+                target="_blank"
+                v-for="item in copyright"
+                :key="item.key"
+            >
+                {{ item.key }}
+            </a>
+        </div>
+    </footer>
+</template>
+
+<script setup lang="ts">
+import useAppStore from '@/stores/modules/app'
+
+const appStore = useAppStore()
+const copyright = computed(() => appStore.config.copyright_config || [])
+</script>
diff --git a/src/layout/default/components/header/breadcrumb.vue b/src/layout/default/components/header/breadcrumb.vue
new file mode 100644
index 0000000..58c8ef2
--- /dev/null
+++ b/src/layout/default/components/header/breadcrumb.vue
@@ -0,0 +1,20 @@
+<template>
+    <el-breadcrumb class="app-breadcrumb">
+        <el-breadcrumb-item v-for="item in breadcrumbs" :key="item.path">
+            {{ item.meta.title }}
+        </el-breadcrumb-item>
+    </el-breadcrumb>
+</template>
+<script setup lang="ts">
+import { useWatchRoute } from '@/hooks/useWatchRoute'
+import type { RouteLocationMatched, RouteLocationNormalizedLoaded } from 'vue-router'
+const breadcrumbs = ref<RouteLocationMatched[]>([])
+const getBreadcrumb = (route: RouteLocationNormalizedLoaded) => {
+    const matched = route.matched.filter((item) => item.meta && item.meta.title)
+    breadcrumbs.value = matched
+}
+
+useWatchRoute((route) => {
+    getBreadcrumb(route)
+})
+</script>
diff --git a/src/layout/default/components/header/fold.vue b/src/layout/default/components/header/fold.vue
new file mode 100644
index 0000000..7ce9360
--- /dev/null
+++ b/src/layout/default/components/header/fold.vue
@@ -0,0 +1,15 @@
+<template>
+    <div class="fold h-full cursor-pointer flex items-center px-2" @click="toggleCollapsed">
+        <icon :name="`local-icon-${isCollapsed ? 'close' : 'open'}`" :size="20" />
+    </div>
+</template>
+
+<script setup lang="ts">
+import useAppStore from '@/stores/modules/app'
+const appStore = useAppStore()
+const isCollapsed = computed(() => appStore.isCollapsed)
+// 折叠展开菜单
+const toggleCollapsed = () => {
+    appStore.toggleCollapsed()
+}
+</script>
diff --git a/src/layout/default/components/header/full-screen.vue b/src/layout/default/components/header/full-screen.vue
new file mode 100644
index 0000000..96cec1e
--- /dev/null
+++ b/src/layout/default/components/header/full-screen.vue
@@ -0,0 +1,10 @@
+<template>
+    <div class="full-screen h-full cursor-pointer flex items-center px-2" @click="toggleFullscreen">
+        <icon :size="16" :name="`local-icon-${isFullscreen ? 'fullscreen-exit' : 'fullscreen'}`" />
+    </div>
+</template>
+
+<script setup lang="ts">
+import { useFullscreen } from '@vueuse/core'
+const { toggle: toggleFullscreen, isFullscreen } = useFullscreen()
+</script>
diff --git a/src/layout/default/components/header/index.vue b/src/layout/default/components/header/index.vue
new file mode 100644
index 0000000..3f6d839
--- /dev/null
+++ b/src/layout/default/components/header/index.vue
@@ -0,0 +1,55 @@
+<template>
+    <header class="header">
+        <div class="navbar">
+            <div class="flex-1 flex">
+                <div class="navbar-item">
+                    <fold />
+                </div>
+                <div class="navbar-item">
+                    <refresh />
+                </div>
+                <div class="flex items-center px-2" v-if="!isMobile && settingStore.showCrumb">
+                    <breadcrumb />
+                </div>
+            </div>
+            <div class="flex">
+                <div class="navbar-item" v-if="!isMobile">
+                    <full-screen />
+                </div>
+                <div class="navbar-item">
+                    <user-drop-down />
+                </div>
+                <div class="navbar-item">
+                    <setting />
+                </div>
+            </div>
+        </div>
+        <multiple-tabs v-if="settingStore.openMultipleTabs" />
+    </header>
+</template>
+
+<script setup lang="ts">
+import useAppStore from '@/stores/modules/app'
+import Fold from './fold.vue'
+import Refresh from './refresh.vue'
+import Breadcrumb from './breadcrumb.vue'
+import FullScreen from './full-screen.vue'
+import UserDropDown from './user-drop-down.vue'
+import Setting from '../setting/index.vue'
+import MultipleTabs from './multiple-tabs.vue'
+
+import useSettingStore from '@/stores/modules/setting'
+const appStore = useAppStore()
+const isMobile = computed(() => appStore.isMobile)
+const settingStore = useSettingStore()
+</script>
+
+<style lang="scss">
+.navbar {
+    height: var(--navbar-height);
+    @apply flex px-2 bg-body;
+    .navbar-item {
+        @apply h-full  flex justify-center items-center  hover:bg-page;
+    }
+}
+</style>
diff --git a/src/layout/default/components/header/multiple-tabs.vue b/src/layout/default/components/header/multiple-tabs.vue
new file mode 100644
index 0000000..16a5d48
--- /dev/null
+++ b/src/layout/default/components/header/multiple-tabs.vue
@@ -0,0 +1,122 @@
+<template>
+    <div class="app-tabs pl-4 flex bg-body">
+        <div class="flex-1 min-w-0">
+            <el-tabs
+                :model-value="currentTab"
+                :closable="tabsLists.length > 1"
+                @tab-change="handleChange"
+                @tab-remove="removeTab($event)"
+            >
+                <template v-for="item in tabsLists" :key="item.fullPath">
+                    <el-tab-pane :label="item.title" :name="item.fullPath"></el-tab-pane>
+                </template>
+            </el-tabs>
+        </div>
+        <el-dropdown @command="handleCommand">
+            <span class="flex items-center px-3">
+                <icon :size="16" name="el-icon-arrow-down" />
+            </span>
+            <template #dropdown>
+                <el-dropdown-menu>
+                    <el-dropdown-item command="closeCurrent"> 关闭当前 </el-dropdown-item>
+                    <el-dropdown-item command="closeOther"> 关闭其他 </el-dropdown-item>
+                    <el-dropdown-item command="closeAll"> 关闭全部 </el-dropdown-item>
+                </el-dropdown-menu>
+            </template>
+        </el-dropdown>
+    </div>
+</template>
+
+<script setup lang="ts">
+import useMultipleTabs from '@/hooks/useMultipleTabs'
+import { useWatchRoute } from '@/hooks/useWatchRoute'
+import useTabsStore, { getRouteParams } from '@/stores/modules/multipleTabs'
+const router = useRouter()
+const tabsStore = useTabsStore()
+const { removeOtherTab, addTab, removeAllTab, removeTab, tabsLists, currentTab } = useMultipleTabs()
+useWatchRoute(() => {
+    addTab()
+})
+
+const handleChange = (fullPath: any) => {
+    const tabItem = tabsStore.tasMap[fullPath]
+    router.push(getRouteParams(tabItem))
+}
+
+const handleCommand = (command: any) => {
+    switch (command) {
+        case 'closeCurrent':
+            removeTab()
+            break
+        case 'closeOther':
+            removeOtherTab()
+            break
+        case 'closeAll':
+            removeAllTab()
+            break
+    }
+}
+</script>
+<style lang="scss" scoped>
+.app-tabs {
+    @apply border-t border-br;
+    :deep(.el-tabs) {
+        height: 40px;
+        .el-tabs {
+            &__header {
+                margin-bottom: 0;
+            }
+            &__content {
+                display: none;
+            }
+            &__nav-next,
+            &__nav-prev {
+                @apply text-xl;
+            }
+
+            &__nav-wrap::after {
+                height: 0;
+            }
+            &__item {
+                font-weight: normal;
+                padding: 0 15px !important;
+                box-sizing: border-box;
+                &.is-active {
+                    background-color: var(--el-color-primary-light-9);
+                    &::before {
+                        content: '';
+                        display: inline-block;
+                        width: 6px;
+                        height: 6px;
+                        background-color: var(--el-color-primary);
+                        margin-right: 6px;
+                        border-radius: 50%;
+                        vertical-align: 2px;
+                    }
+                    &::after {
+                        position: absolute;
+                        content: '';
+                        display: block;
+                        top: 0;
+                        height: 2px;
+                        left: 0;
+                        width: 100%;
+                        background-color: var(--el-color-primary);
+                    }
+                }
+                .is-icon-close {
+                    color: var(--el-text-color-regular);
+                    vertical-align: -2px;
+                    &:hover {
+                        color: var(--color-white);
+                        background-color: var(--el-color-danger);
+                    }
+                }
+            }
+            &__active-bar {
+                display: none;
+            }
+        }
+    }
+}
+</style>
diff --git a/src/layout/default/components/header/refresh.vue b/src/layout/default/components/header/refresh.vue
new file mode 100644
index 0000000..a55ccba
--- /dev/null
+++ b/src/layout/default/components/header/refresh.vue
@@ -0,0 +1,14 @@
+<template>
+    <div class="refresh cursor-pointer h-full flex items-center px-2" @click="refreshView">
+        <icon name="el-icon-RefreshRight" :size="18" />
+    </div>
+</template>
+
+<script setup lang="ts">
+import useAppStore from '@/stores/modules/app'
+const appStore = useAppStore()
+// 刷新页面
+const refreshView = () => {
+    appStore.refreshView()
+}
+</script>
diff --git a/src/layout/default/components/header/user-drop-down.vue b/src/layout/default/components/header/user-drop-down.vue
new file mode 100644
index 0000000..371bfda
--- /dev/null
+++ b/src/layout/default/components/header/user-drop-down.vue
@@ -0,0 +1,42 @@
+<template>
+    <el-dropdown class="px-2" @command="handleCommand">
+        <div class="flex items-center">
+            <el-avatar :size="34" :src="userInfo.avatar" />
+            <div class="ml-3 mr-1">{{ userInfo.name }}</div>
+            <icon name="el-icon-ArrowDown" />
+        </div>
+
+        <template #dropdown>
+            <el-dropdown-menu>
+                <router-link to="/user/setting">
+                    <el-dropdown-item>个人设置</el-dropdown-item>
+                </router-link>
+                <el-dropdown-item command="cache">清除缓存</el-dropdown-item>
+                <el-dropdown-item command="logout">退出登录</el-dropdown-item>
+            </el-dropdown-menu>
+        </template>
+    </el-dropdown>
+</template>
+
+<script setup lang="ts">
+import { systemCacheClear } from '@/api/setting/system'
+import useUserStore from '@/stores/modules/user'
+import feedback from '@/utils/feedback'
+const userStore = useUserStore()
+
+const userInfo = computed(() => userStore.userInfo)
+
+const handleCommand = async (command: string) => {
+    switch (command) {
+        case 'logout':
+            await feedback.confirm('确定退出登录吗？')
+            userStore.logout();
+            break;
+        case 'cache':
+            // 清理缓存
+            await systemCacheClear()
+            window.location.reload()
+            break
+    }
+}
+</script>
diff --git a/src/layout/default/components/main.vue b/src/layout/default/components/main.vue
new file mode 100644
index 0000000..b5386b3
--- /dev/null
+++ b/src/layout/default/components/main.vue
@@ -0,0 +1,26 @@
+<template>
+    <main class="main-wrap h-full bg-page">
+        <el-scrollbar>
+            <div class="p-4">
+                <router-view v-if="isRouteShow" v-slot="{ Component, route }">
+                    <keep-alive :include="includeList" :max="20">
+                        <component :is="Component" :key="route.fullPath" />
+                    </keep-alive>
+                </router-view>
+            </div>
+        </el-scrollbar>
+    </main>
+</template>
+
+<script setup lang="ts">
+import useAppStore from '@/stores/modules/app'
+import useTabsStore from '@/stores/modules/multipleTabs'
+import useSettingStore from '@/stores/modules/setting'
+const appStore = useAppStore()
+const tabsStore = useTabsStore()
+const settingStore = useSettingStore()
+const isRouteShow = computed(() => appStore.isRouteShow)
+const includeList = computed(() => (settingStore.openMultipleTabs ? tabsStore.getCacheTabList : []))
+</script>
+
+<style></style>
diff --git a/src/layout/default/components/setting/drawer.vue b/src/layout/default/components/setting/drawer.vue
new file mode 100644
index 0000000..efd08fd
--- /dev/null
+++ b/src/layout/default/components/setting/drawer.vue
@@ -0,0 +1,220 @@
+<template>
+    <div class="setting-drawer">
+        <el-drawer
+            v-model="showSetting"
+            append-to-body
+            direction="rtl"
+            size="250px"
+            title="主题设置"
+        >
+            <div class="setting-item mb-5">
+                <span class="text-tx-secondary">风格设置</span>
+                <div class="flex mt-4 cursor-pointer">
+                    <div
+                        class="mr-4 flex relative text-primary"
+                        v-for="item in sideThemeList"
+                        :key="item.type"
+                        @click="sideTheme = item.type"
+                    >
+                        <img :src="item.image" width="52" height="36" />
+                        <icon
+                            v-if="sideTheme == item.type"
+                            class="icon-select"
+                            name="el-icon-Select"
+                        />
+                    </div>
+                </div>
+            </div>
+            <div class="setting-item mb-5 flex justify-between items-center">
+                <span class="text-tx-secondary">主题颜色</span>
+                <div>
+                    <el-color-picker v-model="theme" :predefine="predefineColors" />
+                </div>
+            </div>
+            <div class="setting-item mb-5 flex justify-between items-center">
+                <span class="text-tx-secondary">开启黑暗模式</span>
+                <div>
+                    <el-switch :model-value="isDark" @change="toggleDark" />
+                </div>
+            </div>
+            <div class="setting-item mb-5 flex justify-between items-center">
+                <span class="text-tx-secondary">开启多页签栏</span>
+                <div>
+                    <el-switch
+                        v-model="openMultipleTabs"
+                        :active-value="true"
+                        :inactive-value="false"
+                    />
+                </div>
+            </div>
+            <div class="setting-item mb-5 flex justify-between items-center">
+                <span class="text-tx-secondary">只展开一个一级菜单</span>
+                <div>
+                    <el-switch
+                        v-model="isUniqueOpened"
+                        :active-value="true"
+                        :inactive-value="false"
+                    />
+                </div>
+            </div>
+            <div class="setting-item mb-5 flex justify-between items-center">
+                <div class="text-tx-secondary flex-none mr-3">菜单栏宽度</div>
+                <div>
+                    <el-input-number v-model="sideWidth" :min="180" :max="250" />
+                </div>
+            </div>
+            <div class="setting-item mb-5 flex justify-between items-center">
+                <div class="text-tx-secondary flex-none mr-3">显示LOGO</div>
+                <div>
+                    <el-switch v-model="showLogo" :active-value="true" :inactive-value="false" />
+                </div>
+            </div>
+            <div class="setting-item mb-5 flex justify-between items-center">
+                <div class="text-tx-secondary flex-none mr-3">显示面包屑</div>
+                <div>
+                    <el-switch v-model="showCrumb" :active-value="true" :inactive-value="false" />
+                </div>
+            </div>
+            <div class="setting-item mb-5 flex justify-between items-center">
+                <el-button @click="resetTheme">重置主题</el-button>
+            </div>
+        </el-drawer>
+    </div>
+</template>
+
+<script setup lang="ts">
+import useSettingStore from '@/stores/modules/setting'
+import { useDark, useToggle } from '@vueuse/core'
+import theme_light from '@/assets/images/theme_white.png'
+import theme_dark from '@/assets/images/theme_black.png'
+
+const settingStore = useSettingStore()
+const predefineColors = ref(['#409EFF', '#28C76F', '#EA5455', '#FF9F43', '#01CFE8', '#4A5DFF'])
+const sideThemeList = [
+    {
+        type: 'dark',
+        image: theme_dark
+    },
+    {
+        type: 'light',
+        image: theme_light
+    }
+]
+
+const sideTheme = computed({
+    get() {
+        return settingStore.sideTheme
+    },
+    set(value) {
+        settingStore.setSetting({
+            key: 'sideTheme',
+            value
+        })
+    }
+})
+
+const openMultipleTabs = computed({
+    get() {
+        return settingStore.openMultipleTabs
+    },
+    set(value) {
+        settingStore.setSetting({
+            key: 'openMultipleTabs',
+            value
+        })
+    }
+})
+
+const isUniqueOpened = computed({
+    get() {
+        return settingStore.isUniqueOpened
+    },
+    set(value) {
+        settingStore.setSetting({
+            key: 'isUniqueOpened',
+            value
+        })
+    }
+})
+
+const sideWidth = computed({
+    get() {
+        return settingStore.sideWidth
+    },
+    set(value) {
+        settingStore.setSetting({
+            key: 'sideWidth',
+            value
+        })
+    }
+})
+const showSetting = computed({
+    get() {
+        return settingStore.showDrawer
+    },
+    set(value) {
+        settingStore.setSetting({
+            key: 'showDrawer',
+            value
+        })
+    }
+})
+const theme = computed({
+    get() {
+        return settingStore.theme
+    },
+    set(value) {
+        settingStore.setSetting({
+            key: 'theme',
+            value
+        })
+        themeChange()
+    }
+})
+
+const showLogo = computed({
+    get() {
+        return settingStore.showLogo
+    },
+    set(value) {
+        settingStore.setSetting({
+            key: 'showLogo',
+            value
+        })
+    }
+})
+
+const showCrumb = computed({
+    get() {
+        return settingStore.showCrumb
+    },
+    set(value) {
+        settingStore.setSetting({
+            key: 'showCrumb',
+            value
+        })
+    }
+})
+
+const isDark = useDark()
+const themeChange = () => {
+    settingStore.setTheme(isDark.value)
+}
+
+const toggleDark = () => {
+    useToggle(isDark)()
+    themeChange()
+}
+const resetTheme = () => {
+    isDark.value = false
+    settingStore.resetTheme()
+    themeChange()
+}
+</script>
+
+<style lang="scss" scoped>
+.icon-select {
+    @apply absolute left-1/2 top-1/2;
+    transform: translate(-50%, -50%);
+}
+</style>
diff --git a/src/layout/default/components/setting/index.vue b/src/layout/default/components/setting/index.vue
new file mode 100644
index 0000000..d0f4957
--- /dev/null
+++ b/src/layout/default/components/setting/index.vue
@@ -0,0 +1,19 @@
+<template>
+    <div class="setting flex cursor-pointer h-full items-center px-2" @click="openSetting">
+        <icon :size="16" name="el-icon-Setting" />
+        <layout-setting />
+    </div>
+</template>
+
+<script setup lang="ts">
+import useSettingStore from '@/stores/modules/setting'
+import LayoutSetting from './drawer.vue'
+const settingStore = useSettingStore()
+
+const openSetting = () => {
+    settingStore.setSetting({
+        key: 'showDrawer',
+        value: true
+    })
+}
+</script>
diff --git a/src/layout/default/components/sidebar/index.vue b/src/layout/default/components/sidebar/index.vue
new file mode 100644
index 0000000..28413a0
--- /dev/null
+++ b/src/layout/default/components/sidebar/index.vue
@@ -0,0 +1,44 @@
+<template>
+    <aside class="sidebar h-full">
+        <el-drawer
+            v-model="showMenuDrawer"
+            direction="ltr"
+            :size="drawderSize"
+            title="主题设置"
+            :with-header="false"
+        >
+            <side />
+        </el-drawer>
+        <side v-show="!isMobile" />
+    </aside>
+</template>
+
+<script setup lang="ts">
+import Side from './side.vue'
+import useAppStore from '@/stores/modules/app'
+import useSettingStore from '@/stores/modules/setting'
+
+const appStore = useAppStore()
+const settingStore = useSettingStore()
+const isMobile = computed(() => appStore.isMobile)
+const showMenuDrawer = computed({
+    get() {
+        return !appStore.isCollapsed && isMobile.value
+    },
+    set(value) {
+        appStore.toggleCollapsed(!value)
+    }
+})
+
+const drawderSize = computed(() => {
+    return `${settingStore.sideWidth + 1}px`
+})
+</script>
+
+<style lang="scss" scoped>
+.sidebar {
+    :deep(.el-drawer__body) {
+        padding: 0;
+    }
+}
+</style>
diff --git a/src/layout/default/components/sidebar/logo.vue b/src/layout/default/components/sidebar/logo.vue
new file mode 100644
index 0000000..f1e8cb9
--- /dev/null
+++ b/src/layout/default/components/sidebar/logo.vue
@@ -0,0 +1,61 @@
+<template>
+    <div class="logo">
+        <image-contain :width="szie" :height="szie" :src="config.web_logo" />
+        <transition name="title-width">
+            <div
+                v-show="showTitle"
+                class="logo-title overflow-hidden whitespace-nowrap"
+                :class="{ 'text-white': theme == ThemeEnum.DARK }"
+                :style="{ left: `${szie + 16}px` }"
+            >
+                <overflow-tooltip
+                    :content="title || config.web_name"
+                    :teleported="true"
+                    placement="bottom"
+                    overflo-type="unset"
+                >
+                </overflow-tooltip>
+            </div>
+        </transition>
+    </div>
+</template>
+
+<script setup lang="ts">
+import useAppStore from '@/stores/modules/app'
+import { ThemeEnum } from '@/enums/appEnums'
+defineProps({
+    szie: { type: Number, default: 34 },
+    title: { type: String },
+    theme: { type: String },
+    showTitle: { type: Boolean, default: true }
+})
+const appStore = useAppStore()
+const config = computed(() => appStore.config)
+</script>
+<style lang="scss" scoped>
+.logo {
+    height: var(--navbar-height);
+    overflow: hidden;
+    @apply flex items-center p-2 relative;
+    .logo-title {
+        width: 70%;
+        position: absolute;
+        @apply text-xl;
+    }
+
+    .title-width-enter-active {
+        opacity: 0;
+        transition: all 0.3s ease-out;
+    }
+
+    .title-width-leave-active {
+        transition: all 0.3s cubic-bezier(1, 0.5, 0.8, 1);
+    }
+
+    .title-width-enter-from,
+    .title-width-leave-to {
+        width: 0;
+        opacity: 0;
+    }
+}
+</style>
diff --git a/src/layout/default/components/sidebar/menu-item.vue b/src/layout/default/components/sidebar/menu-item.vue
new file mode 100644
index 0000000..09b46aa
--- /dev/null
+++ b/src/layout/default/components/sidebar/menu-item.vue
@@ -0,0 +1,87 @@
+<template>
+    <template v-if="!route.meta?.hidden">
+        <app-link v-if="!hasShowChild" :to="`${routePath}?${queryStr}`">
+            <el-menu-item :index="routePath">
+                <icon
+                    class="menu-item-icon"
+                    :size="16"
+                    v-if="routeMeta?.icon"
+                    :name="routeMeta?.icon"
+                />
+                <template #title>
+                    <span>{{ routeMeta?.title }}</span>
+                </template>
+            </el-menu-item>
+        </app-link>
+        <el-sub-menu v-else :index="routePath" :popper-class="popperClass">
+            <template #title>
+                <icon
+                    class="menu-item-icon"
+                    :size="16"
+                    v-if="routeMeta?.icon"
+                    :name="routeMeta?.icon"
+                />
+                <span>{{ routeMeta?.title }}</span>
+            </template>
+            <menu-item
+                v-for="item in route?.children"
+                :key="resolvePath(item.path)"
+                :route="item"
+                :route-path="resolvePath(item.path)"
+                :popper-class="popperClass"
+            />
+        </el-sub-menu>
+    </template>
+</template>
+
+<script lang="ts" setup>
+import { getNormalPath, objectToQuery } from '@/utils/util'
+import { isExternal } from '@/utils/validate'
+import type { RouteRecordRaw } from 'vue-router'
+interface Props {
+    route: RouteRecordRaw
+    routePath: string
+    popperClass: string
+}
+
+const props = defineProps<Props>()
+
+const hasShowChild = computed(() => {
+    const children: RouteRecordRaw[] = props.route.children ?? []
+    return !!children.filter((item) => !item.meta?.hidden).length
+})
+
+const routeMeta = computed(() => {
+    return props.route.meta
+})
+
+const resolvePath = (path: string) => {
+    if (isExternal(path)) {
+        return path
+    }
+    const newPath = getNormalPath(`${props.routePath}/${path}`)
+    return newPath
+}
+const queryStr = computed<string>(() => {
+    const query = props.route.meta?.query as string
+    try {
+        const queryObj = JSON.parse(query)
+        return objectToQuery(queryObj)
+    } catch (error) {
+        // console.log(error)
+
+        return query
+    }
+})
+</script>
+<style lang="scss" scoped>
+.el-menu-item,
+.el-sub-menu__title {
+    .menu-item-icon {
+        margin-right: 8px;
+        width: var(--el-menu-icon-width);
+        text-align: center;
+        vertical-align: middle;
+    }
+}
+</style>
diff --git a/src/layout/default/components/sidebar/menu.vue b/src/layout/default/components/sidebar/menu.vue
new file mode 100644
index 0000000..a56a181
--- /dev/null
+++ b/src/layout/default/components/sidebar/menu.vue
@@ -0,0 +1,101 @@
+<template>
+    <div
+        class="menu flex-1 min-h-0"
+        :class="themeClass"
+        :style="isCollapsed ? '' : `--aside-width: ${width}px`"
+    >
+        <el-scrollbar>
+            <el-menu
+                v-bind="config"
+                :default-active="activeMenu"
+                :collapse="isCollapsed"
+                mode="vertical"
+                :unique-opened="uniqueOpened"
+                @select="$emit('select')"
+            >
+                <menu-item
+                    v-for="route in routes"
+                    :key="route.path"
+                    :route="route"
+                    :route-path="route.path"
+                    :popper-class="themeClass"
+                />
+            </el-menu>
+        </el-scrollbar>
+    </div>
+</template>
+
+<script setup lang="ts">
+import type { PropType } from 'vue'
+import MenuItem from './menu-item.vue'
+import type { RouteRecordRaw } from 'vue-router'
+
+const props = defineProps({
+    routes: {
+        type: Object as PropType<RouteRecordRaw[]>
+    },
+    config: {
+        type: Object
+    },
+    uniqueOpened: {
+        type: Boolean,
+        default: false
+    },
+    isCollapsed: {
+        type: Boolean,
+        default: false
+    },
+    theme: {
+        type: String
+    },
+    width: {
+        type: Number,
+        default: 200
+    }
+})
+
+defineEmits(['select'])
+
+const route = useRoute()
+const activeMenu = computed<string>(() => route.meta?.activeMenu || route.path)
+const themeClass = computed(() => `theme-${props.theme}`)
+</script>
+
+<style lang="scss" scoped>
+.menu {
+    &.theme-dark {
+        .el-menu {
+            :deep(.el-menu-item) {
+                &.is-active {
+                    @apply bg-primary border-primary;
+                }
+            }
+        }
+        :deep(.el-menu--collapse) {
+            .el-sub-menu.is-active .el-sub-menu__title {
+                @apply bg-primary #{!important};
+            }
+        }
+    }
+    &.theme-light {
+        :deep(.el-menu) {
+            .el-menu-item {
+                border-color: transparent;
+                &.is-active {
+                    @apply bg-primary-light-9 border-r-2 border-primary;
+                }
+            }
+            .el-menu-item:hover,
+            .el-sub-menu__title:hover {
+                color: var(--el-color-primary);
+            }
+        }
+    }
+    .el-menu {
+        border-right: none;
+        &:not(.el-menu--collapse) {
+            width: var(--aside-width);
+        }
+    }
+}
+</style>
diff --git a/src/layout/default/components/sidebar/side.vue b/src/layout/default/components/sidebar/side.vue
new file mode 100644
index 0000000..dc499e8
--- /dev/null
+++ b/src/layout/default/components/sidebar/side.vue
@@ -0,0 +1,66 @@
+<template>
+    <div class="side" :style="sideStyle">
+        <side-logo v-if="settingStore.showLogo" :show-title="!isCollapsed" :theme="sideTheme" />
+        <side-menu
+            :routes="routes"
+            :is-collapsed="isCollapsed"
+            :width="settingStore.sideWidth"
+            :unique-opened="settingStore.isUniqueOpened"
+            :config="menuProp"
+            :theme="sideTheme"
+            @select="handleSelect"
+        />
+    </div>
+</template>
+
+<script setup lang="ts">
+import useAppStore from '@/stores/modules/app'
+import useSettingStore from '@/stores/modules/setting'
+import useUserStore from '@/stores/modules/user'
+import SideLogo from './logo.vue'
+import SideMenu from './menu.vue'
+
+const appStore = useAppStore()
+const isCollapsed = computed(() => {
+    if (appStore.isMobile) {
+        return false
+    } else {
+        return appStore.isCollapsed
+    }
+})
+
+const settingStore = useSettingStore()
+const sideTheme = computed(() => settingStore.sideTheme)
+const userStore = useUserStore()
+
+const routes = computed(() => userStore.routes)
+
+const sideStyle = computed(() => {
+    return sideTheme.value == 'dark'
+        ? {
+              '--side-dark-color': settingStore.sideDarkColor
+          }
+        : ''
+})
+const menuProp = computed(() => {
+    return {
+        backgroundColor: sideTheme.value == 'dark' ? settingStore.sideDarkColor : '',
+        textColor: sideTheme.value == 'dark' ? 'var(--el-color-white)' : '',
+        activeTextColor: sideTheme.value == 'dark' ? 'var(--el-color-white)' : ''
+    }
+})
+const handleSelect = () => {
+    if (appStore.isMobile) {
+        appStore.toggleCollapsed(true)
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.side {
+    position: relative;
+    z-index: 999;
+    @apply border-r border-br-light h-full flex flex-col;
+    background-color: var(--side-dark-color, var(--el-bg-color));
+}
+</style>
diff --git a/src/layout/default/index.vue b/src/layout/default/index.vue
new file mode 100644
index 0000000..ba6eb38
--- /dev/null
+++ b/src/layout/default/index.vue
@@ -0,0 +1,22 @@
+<template>
+    <div class="layout-default flex h-screen w-full">
+        <div class="app-aside">
+            <layout-sidebar />
+        </div>
+
+        <div class="flex-1 flex flex-col min-w-0">
+            <div class="app-header">
+                <layout-header />
+            </div>
+            <div class="app-main flex-1 min-h-0">
+                <layout-main />
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import LayoutMain from './components/main.vue'
+import LayoutSidebar from './components/sidebar/index.vue'
+import LayoutHeader from './components/header/index.vue'
+</script>
diff --git a/src/main.ts b/src/main.ts
new file mode 100644
index 0000000..79cae31
--- /dev/null
+++ b/src/main.ts
@@ -0,0 +1,10 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+import install from './install'
+import './permission'
+import './styles/index.scss'
+import 'virtual:svg-icons-register'
+
+const app = createApp(App)
+app.use(install)
+app.mount('#app')
diff --git a/src/permission.ts b/src/permission.ts
new file mode 100644
index 0000000..decf89b
--- /dev/null
+++ b/src/permission.ts
@@ -0,0 +1,83 @@
+/**
+ * 权限控制
+ */
+
+import NProgress from 'nprogress'
+import router, { findFirstValidRoute } from './router'
+import 'nprogress/nprogress.css'
+import { isExternal } from './utils/validate'
+import useUserStore from './stores/modules/user'
+import { INDEX_ROUTE, INDEX_ROUTE_NAME } from './router/routes'
+import { PageEnum } from './enums/pageEnum'
+import useTabsStore from './stores/modules/multipleTabs'
+import { clearAuthInfo } from './utils/auth'
+import config from './config'
+
+// NProgress配置
+NProgress.configure({ showSpinner: false })
+
+const loginPath = PageEnum.LOGIN
+const defaultPath = PageEnum.INDEX
+// 免登录白名单
+const whiteList: string[] = [PageEnum.LOGIN, PageEnum.ERROR_403]
+router.beforeEach(async (to, from, next) => {
+    // 开始 Progress Bar
+    NProgress.start()
+    document.title = to.meta.title ?? config.title
+    const userStore = useUserStore()
+    const tabsStore = useTabsStore()
+    if (whiteList.includes(to.path)) {
+        // 在免登录白名单，直接进入
+        next()
+    } else if (userStore.token) {
+        // 获取用户信息
+        const hasGetUserInfo = Object.keys(userStore.userInfo).length !== 0
+        if (hasGetUserInfo) {
+            if (to.path === loginPath) {
+                next({ path: defaultPath })
+            } else {
+                next()
+            }
+        } else {
+            try {
+                await userStore.getUserInfo()
+                const routes = userStore.routes
+                // 找到第一个有效路由
+                const routeName = findFirstValidRoute(routes)
+                // 没有有效路由跳转到403页面
+                if (!routeName) {
+                    clearAuthInfo()
+                    next(PageEnum.ERROR_403)
+                    return
+                }
+                tabsStore.setRouteName(routeName!)
+                INDEX_ROUTE.redirect = { name: routeName }
+
+                // 动态添加index路由
+                router.addRoute(INDEX_ROUTE)
+                routes.forEach((route: any) => {
+                    // https 则不插入
+                    if (isExternal(route.path)) {
+                        return
+                    }
+                    if (!route.children) {
+                        router.addRoute(INDEX_ROUTE_NAME, route)
+                        return
+                    }
+                    // 动态添加可访问路由表
+                    router.addRoute(route)
+                })
+                next({ ...to, replace: true })
+            } catch (err) {
+                clearAuthInfo()
+                next({ path: loginPath, query: { redirect: to.fullPath } })
+            }
+        }
+    } else {
+        next({ path: loginPath, query: { redirect: to.fullPath } })
+    }
+})
+
+router.afterEach(() => {
+    NProgress.done()
+})
diff --git a/src/router/guard/index.ts b/src/router/guard/index.ts
new file mode 100644
index 0000000..7662402
--- /dev/null
+++ b/src/router/guard/index.ts
@@ -0,0 +1,12 @@
+import type { Router } from 'vue-router'
+
+const modules = import.meta.glob('./*.ts', { eager: true })
+
+export function registerRouteGuard(router: Router) {
+    Object.keys(modules).forEach((key) => {
+        const fn = (modules[key] as any).default
+        if (typeof fn === 'function') {
+            fn(router)
+        }
+    })
+}
\ No newline at end of file
diff --git a/src/router/guard/init.ts b/src/router/guard/init.ts
new file mode 100644
index 0000000..9fd48d9
--- /dev/null
+++ b/src/router/guard/init.ts
@@ -0,0 +1,22 @@
+import useAppStore from '@/stores/modules/app'
+import type { Router } from 'vue-router'
+
+export default function createInitGuard(router: Router) {
+    router.beforeEach(async () => {
+        const appStore = useAppStore()
+        if (Object.keys(appStore.config).length == 0) {
+            // 获取配置
+            const data: any = await appStore.getConfig()
+
+            // 设置网站logo
+            let favicon: HTMLLinkElement = document.querySelector('link[rel="icon"]')!
+            if (favicon) {
+                favicon.href = data.web_favicon
+            }
+            favicon = document.createElement('link')
+            favicon.rel = 'icon'
+            favicon.href = data.web_favicon
+            document.head.appendChild(favicon)
+        }
+    })
+}
diff --git a/src/router/index.ts b/src/router/index.ts
new file mode 100644
index 0000000..f9a9bde
--- /dev/null
+++ b/src/router/index.ts
@@ -0,0 +1,110 @@
+import { createRouter, createWebHistory, RouterView, type RouteRecordRaw } from 'vue-router'
+import { MenuEnum } from '@/enums/appEnums'
+import { isExternal } from '@/utils/validate'
+import { constantRoutes, INDEX_ROUTE_NAME, LAYOUT } from './routes'
+import useUserStore from '@/stores/modules/user'
+
+// 匹配views里面所有的.vue文件，动态引入
+const modules = import.meta.glob('/src/views/**/*.vue')
+
+//
+export function getModulesKey() {
+    return Object.keys(modules).map((item) => item.replace('/src/views/', '').replace('.vue', ''))
+}
+
+// 过滤路由所需要的数据
+export function filterAsyncRoutes(routes: any[], firstRoute = true) {
+    return routes.map((route) => {
+        const routeRecord = createRouteRecord(route, firstRoute)
+        if (route.children != null && route.children && route.children.length) {
+            routeRecord.children = filterAsyncRoutes(route.children, false)
+        }
+        return routeRecord
+    })
+}
+
+// 创建一条路由记录
+export function createRouteRecord(route: any, firstRoute: boolean): RouteRecordRaw {
+    //@ts-ignore
+    const routeRecord: RouteRecordRaw = {
+        path: isExternal(route.paths) ? route.paths : firstRoute ? `/${route.paths}` : route.paths,
+        name: Symbol(route.paths),
+        meta: {
+            hidden: !route.is_show,
+            keepAlive: !!route.is_cache,
+            title: route.name,
+            perms: route.perms,
+            query: route.params,
+            icon: route.icon,
+            type: route.type,
+            activeMenu: route.selected
+        }
+    }
+    switch (route.type) {
+        case MenuEnum.CATALOGUE:
+            routeRecord.component = firstRoute ? LAYOUT : RouterView
+            if (!route.children) {
+                routeRecord.component = RouterView
+            }
+            break
+        case MenuEnum.MENU:
+            routeRecord.component = loadRouteView(route.component)
+            break
+    }
+    return routeRecord
+}
+
+// 动态加载组件
+export function loadRouteView(component: string) {
+    try {
+        const key = Object.keys(modules).find((key) => {
+            return key.includes(`/${component}.vue`)
+        })
+        if (key) {
+            return modules[key]
+        }
+        throw Error(`找不到组件${component}，请确保组件路径正确`)
+    } catch (error) {
+        console.error(error)
+        return RouterView
+    }
+}
+
+// 找到第一个有效的路由
+export function findFirstValidRoute(routes: RouteRecordRaw[]): string | undefined {
+    for (const route of routes) {
+        if (route.meta?.type == MenuEnum.MENU && !route.meta?.hidden && !isExternal(route.path)) {
+            return route.name as string
+        }
+        if (route.children) {
+            const name = findFirstValidRoute(route.children)
+            if (name) {
+                return name
+            }
+        }
+    }
+}
+//通过权限字符查询路由路径
+export function getRoutePath(perms: string) {
+    const routerObj = useRouter() || router
+    return routerObj.getRoutes().find((item) => item.meta?.perms == perms)?.path || ''
+}
+
+// 重置路由
+export function resetRouter() {
+    router.removeRoute(INDEX_ROUTE_NAME)
+    const { routes } = useUserStore()
+    routes.forEach((route) => {
+        const name = route.name
+        if (name && router.hasRoute(name)) {
+            router.removeRoute(name)
+        }
+    })
+}
+
+const router = createRouter({
+    history: createWebHistory(import.meta.env.BASE_URL),
+    routes: constantRoutes
+})
+
+export default router
diff --git a/src/router/routes.ts b/src/router/routes.ts
new file mode 100644
index 0000000..100d54c
--- /dev/null
+++ b/src/router/routes.ts
@@ -0,0 +1,89 @@
+/**
+ * Note: 路由配置项
+ *
+ * path: '/path'                    // 路由路径
+ * name:'router-name'               // 设定路由的名字，一定要填写不然使用<keep-alive>时会出现各种问题
+ * meta : {
+	title: 'title'                  // 设置该路由在侧边栏的名字
+	icon: 'icon-name'                // 设置该路由的图标
+	activeMenu: '/system/user'      // 当路由设置了该属性，则会高亮相对应的侧边栏。
+	query: '{"id": 1}'             // 访问路由的默认传递参数
+	hidden: true                   // 当设置 true 的时候该路由不会在侧边栏出现 
+    hideTab: true                   //当设置 true 的时候该路由不会在多标签tab栏出现
+  }
+ */
+
+import type { RouteRecordRaw } from 'vue-router'
+import { PageEnum } from '@/enums/pageEnum'
+import Layout from '@/layout/default/index.vue'
+
+export const LAYOUT = () => Promise.resolve(Layout)
+
+export const INDEX_ROUTE_NAME = Symbol()
+
+export const constantRoutes: Array<RouteRecordRaw> = [
+    {
+        path: '/:pathMatch(.*)*',
+        component: () => import('@/views/error/404.vue')
+    },
+    {
+        path: PageEnum.ERROR_403,
+        component: () => import('@/views/error/403.vue')
+    },
+    {
+        path: PageEnum.LOGIN,
+        component: () => import('@/views/account/login.vue')
+    },
+    {
+        path: '/user',
+        component: LAYOUT,
+        children: [
+            {
+                path: 'setting',
+                component: () => import('@/views/user/setting.vue'),
+                name: Symbol(),
+                meta: {
+                    title: '个人设置'
+                }
+            }
+        ]
+    },
+    {
+        path: '/decoration/pc_details',
+        component: () => import('@/views/decoration/pc_details.vue')
+    }
+    // {
+    //     path: '/dev_tools',
+    //     component: LAYOUT,
+    //     children: [
+    //         {
+    //             path: 'code/edit',
+    //             component: () => import('@/views/dev_tools/code/edit.vue'),
+    //             meta: {
+    //                 title: '编辑数据表',
+    //                 activeMenu: '/dev_tools/code'
+    //             }
+    //         }
+    //     ]
+    // },
+    // {
+    //     path: '/setting',
+    //     component: LAYOUT,
+    //     children: [
+    //         {
+    //             path: 'dict/data',
+    //             component: () => import('@/views/setting/dict/data/index.vue'),
+    //             meta: {
+    //                 title: '数据管理',
+    //                 activeMenu: '/setting/dict'
+    //             }
+    //         }
+    //     ]
+    // }
+]
+
+export const INDEX_ROUTE: RouteRecordRaw = {
+    path: PageEnum.INDEX,
+    component: LAYOUT,
+    name: INDEX_ROUTE_NAME
+}
diff --git a/src/stores/index.ts b/src/stores/index.ts
new file mode 100644
index 0000000..7c7ea69
--- /dev/null
+++ b/src/stores/index.ts
@@ -0,0 +1,3 @@
+import { createPinia } from 'pinia'
+const store = createPinia()
+export default store
diff --git a/src/stores/modules/app.ts b/src/stores/modules/app.ts
new file mode 100644
index 0000000..07ab422
--- /dev/null
+++ b/src/stores/modules/app.ts
@@ -0,0 +1,51 @@
+import { getConfig } from '@/api/app'
+import { defineStore } from 'pinia'
+interface AppSate {
+    config: Record<string, any>
+    isMobile: boolean
+    isCollapsed: boolean
+    isRouteShow: boolean
+}
+
+const useAppStore = defineStore({
+    id: 'app',
+    state: (): AppSate => {
+        return {
+            config: {},
+            isMobile: true,
+            isCollapsed: false,
+            isRouteShow: true
+        }
+    },
+    actions: {
+        getImageUrl(url: string) {
+            return url.indexOf('http') ? `${this.config.oss_domain}${url}` : url
+        },
+        getConfig() {
+            return new Promise((resolve, reject) => {
+                getConfig()
+                    .then((data) => {
+                        this.config = data
+                        resolve(data)
+                    })
+                    .catch((err) => {
+                        reject(err)
+                    })
+            })
+        },
+        setMobile(value: boolean) {
+            this.isMobile = value
+        },
+        toggleCollapsed(toggle?: boolean) {
+            this.isCollapsed = toggle ?? !this.isCollapsed
+        },
+        refreshView() {
+            this.isRouteShow = false
+            nextTick(() => {
+                this.isRouteShow = true
+            })
+        }
+    }
+})
+
+export default useAppStore
diff --git a/src/stores/modules/multipleTabs.ts b/src/stores/modules/multipleTabs.ts
new file mode 100644
index 0000000..5c60b03
--- /dev/null
+++ b/src/stores/modules/multipleTabs.ts
@@ -0,0 +1,169 @@
+import { defineStore } from 'pinia'
+import { isExternal } from '@/utils/validate'
+import type {
+    LocationQuery,
+    RouteLocationNormalized,
+    RouteParamsRaw,
+    Router,
+    RouteRecordName
+} from 'vue-router'
+import { PageEnum } from '@/enums/pageEnum'
+
+interface TabItem {
+    name: RouteRecordName
+    fullPath: string
+    path: string
+    title?: string
+    query?: LocationQuery
+    params?: RouteParamsRaw
+}
+
+interface TabsSate {
+    cacheTabList: Set<string>
+    tabList: TabItem[]
+    tasMap: Record<string, TabItem>
+    indexRouteName: RouteRecordName
+}
+
+const getHasTabIndex = (fullPath: string, tabList: TabItem[]) => {
+    return tabList.findIndex((item) => item.fullPath == fullPath)
+}
+
+const isCannotAddRoute = (route: RouteLocationNormalized, router: Router) => {
+    const { path, meta, name } = route
+    if (!path || isExternal(path)) return true
+    if (meta?.hideTab) return true
+    if (!router.hasRoute(name!)) return true
+    if (([PageEnum.LOGIN, PageEnum.ERROR_403] as string[]).includes(path)) {
+        return true
+    }
+    return false
+}
+
+const findTabsIndex = (fullPath: string, tabList: TabItem[]) => {
+    return tabList.findIndex((item) => item.fullPath === fullPath)
+}
+
+const getComponentName = (route: RouteLocationNormalized) => {
+    return route.matched.at(-1)?.components?.default?.name
+}
+
+export const getRouteParams = (tabItem: TabItem) => {
+    const { params, path, query } = tabItem
+    return {
+        params: params || {},
+        path,
+        query: query || {}
+    }
+}
+
+const useTabsStore = defineStore({
+    id: 'tabs',
+    state: (): TabsSate => ({
+        cacheTabList: new Set(),
+        tabList: [],
+        tasMap: {},
+        indexRouteName: ''
+    }),
+    getters: {
+        getTabList(): TabItem[] {
+            return this.tabList
+        },
+        getCacheTabList(): string[] {
+            return Array.from(this.cacheTabList)
+        }
+    },
+    actions: {
+        setRouteName(name: RouteRecordName) {
+            this.indexRouteName = name
+        },
+        addCache(componentName?: string) {
+            if (componentName) this.cacheTabList.add(componentName)
+        },
+        removeCache(componentName?: string) {
+            if (componentName && this.cacheTabList.has(componentName)) {
+                this.cacheTabList.delete(componentName)
+            }
+        },
+        clearCache() {
+            this.cacheTabList.clear()
+        },
+        resetState() {
+            this.cacheTabList = new Set()
+            this.tabList = []
+            this.tasMap = {}
+            this.indexRouteName = ''
+        },
+        addTab(router: Router) {
+            const route = unref(router.currentRoute)
+            const { name, query, meta, params, fullPath, path } = route
+            if (isCannotAddRoute(route, router)) return
+            const hasTabIndex = getHasTabIndex(fullPath!, this.tabList)
+            const componentName = getComponentName(route)
+            const tabItem = {
+                name: name!,
+                path,
+                fullPath,
+                title: meta?.title,
+                query,
+                params
+            }
+            this.tasMap[fullPath] = tabItem
+            if (meta?.keepAlive) {
+                console.log(componentName)
+                this.addCache(componentName)
+            }
+            if (hasTabIndex != -1) {
+                return
+            }
+
+            this.tabList.push(tabItem)
+        },
+        removeTab(fullPath: string, router: Router) {
+            const { currentRoute, push } = router
+            const index = findTabsIndex(fullPath, this.tabList)
+            // 移除tab
+            if (this.tabList.length > 1) {
+                index !== -1 && this.tabList.splice(index, 1)
+            }
+            const componentName = getComponentName(currentRoute.value)
+            this.removeCache(componentName)
+            if (fullPath !== currentRoute.value.fullPath) {
+                return
+            }
+            // 删除选中的tab
+            let toTab: TabItem | null = null
+
+            if (index === 0) {
+                toTab = this.tabList[index]
+            } else {
+                toTab = this.tabList[index - 1]
+            }
+
+            const toRoute = getRouteParams(toTab)
+            push(toRoute)
+        },
+        removeOtherTab(route: RouteLocationNormalized) {
+            this.tabList = this.tabList.filter((item) => item.fullPath == route.fullPath)
+            const componentName = getComponentName(route)
+            this.cacheTabList.forEach((name) => {
+                if (componentName !== name) {
+                    this.removeCache(name)
+                }
+            })
+        },
+        removeAllTab(router: Router) {
+            const { push, currentRoute } = router
+            const { name } = unref(currentRoute)
+            if (name == this.indexRouteName) {
+                this.removeOtherTab(currentRoute.value)
+                return
+            }
+            this.tabList = []
+            this.clearCache()
+            push(PageEnum.INDEX)
+        }
+    }
+})
+
+export default useTabsStore
diff --git a/src/stores/modules/setting.ts b/src/stores/modules/setting.ts
new file mode 100644
index 0000000..219a58b
--- /dev/null
+++ b/src/stores/modules/setting.ts
@@ -0,0 +1,55 @@
+import { defineStore } from 'pinia'
+import defaultSetting from '@/config/setting'
+import cache from '@/utils/cache'
+import { isObject } from '@vue/shared'
+import { setTheme } from '@/utils/theme'
+import { SETTING_KEY } from '@/enums/cacheEnums'
+const storageSetting = cache.get(SETTING_KEY)
+
+export const useSettingStore = defineStore({
+    id: 'setting',
+    state: () => {
+        const state = {
+            showDrawer: false,
+            ...defaultSetting
+        }
+        isObject(storageSetting) && Object.assign(state, storageSetting)
+        return state
+    },
+    actions: {
+        // 设置布局设置
+        setSetting(data: Record<string, any>) {
+            const { key, value } = data
+            if (this.hasOwnProperty(key)) {
+                //@ts-ignore
+                this[key] = value
+            }
+            const settings: any = Object.assign({}, this.$state)
+            delete settings.showDrawer
+            cache.set(SETTING_KEY, settings)
+        },
+        // 设置主题色
+        setTheme(isDark: boolean) {
+            setTheme(
+                {
+                    primary: this.theme,
+                    success: this.successTheme,
+                    warning: this.warningTheme,
+                    danger: this.dangerTheme,
+                    error: this.errorTheme,
+                    info: this.infoTheme
+                },
+                isDark
+            )
+        },
+        resetTheme() {
+            for (const key in defaultSetting) {
+                //@ts-ignore
+                this[key] = defaultSetting[key]
+            }
+            cache.remove(SETTING_KEY)
+        }
+    }
+})
+
+export default useSettingStore
diff --git a/src/stores/modules/user.ts b/src/stores/modules/user.ts
new file mode 100644
index 0000000..27b4ebc
--- /dev/null
+++ b/src/stores/modules/user.ts
@@ -0,0 +1,82 @@
+import { defineStore } from 'pinia'
+import cache from '@/utils/cache'
+import type { RouteRecordRaw } from 'vue-router'
+import { getUserInfo, login, logout } from '@/api/user'
+import router, { filterAsyncRoutes } from '@/router'
+import { TOKEN_KEY } from '@/enums/cacheEnums'
+import { PageEnum } from '@/enums/pageEnum'
+import { clearAuthInfo, getToken } from '@/utils/auth'
+export interface UserState {
+    token: string
+    userInfo: Record<string, any>
+    routes: RouteRecordRaw[]
+    perms: string[]
+}
+
+const useUserStore = defineStore({
+    id: 'user',
+    state: (): UserState => ({
+        token: getToken() || '',
+        // 用户信息
+        userInfo: {},
+        // 路由
+        routes: [],
+        // 权限
+        perms: []
+    }),
+    getters: {},
+    actions: {
+        resetState() {
+            this.token = ''
+            this.userInfo = {}
+            this.perms = []
+        },
+        login(playload: any) {
+            const { account, password } = playload
+            return new Promise((resolve, reject) => {
+                login({
+                    account: account.trim(),
+                    password: password
+                })
+                    .then((data) => {
+                        this.token = data.token
+                        cache.set(TOKEN_KEY, data.token)
+                        resolve(data)
+                    })
+                    .catch((error) => {
+                        reject(error)
+                    })
+            })
+        },
+        logout() {
+            return new Promise((resolve, reject) => {
+                logout()
+                    .then(async (data) => {
+                        this.token = ''
+                        await router.push(PageEnum.LOGIN)
+                        clearAuthInfo()
+                        resolve(data)
+                    })
+                    .catch((error) => {
+                        reject(error)
+                    })
+            })
+        },
+        getUserInfo() {
+            return new Promise((resolve, reject) => {
+                getUserInfo()
+                    .then((data) => {
+                        this.userInfo = data.user
+                        this.perms = data.permissions
+                        this.routes = filterAsyncRoutes(data.menu)
+                        resolve(data)
+                    })
+                    .catch((error) => {
+                        reject(error)
+                    })
+            })
+        }
+    }
+})
+
+export default useUserStore
diff --git a/src/styles/dark.css b/src/styles/dark.css
new file mode 100644
index 0000000..ae969fd
--- /dev/null
+++ b/src/styles/dark.css
@@ -0,0 +1,49 @@
+:root.dark {
+    color-scheme: dark;
+    --table-header-bg-color: var(--el-bg-color);
+    --el-bg-color-page: #0a0a0a;
+    --el-bg-color: #1d2124;
+    --el-bg-color-overlay: #1d1e1f;
+    --el-text-color-primary: #e5eaf3;
+    --el-text-color-regular: #cfd3dc;
+    --el-text-color-secondary: #a3a6ad;
+    --el-text-color-placeholder: #8d9095;
+    --el-text-color-disabled: #6c6e72;
+    --el-border-color-darker: #636466;
+    --el-border-color-dark: #58585b;
+    --el-border-color: #4c4d4f;
+    --el-border-color-light: #414243;
+    --el-border-color-lighter: #363637;
+    --el-border-color-extra-light: #2b2b2c;
+    --el-fill-color-darker: #424243;
+    --el-fill-color-dark: #39393a;
+    --el-fill-color: #303030;
+    --el-fill-color-light: #262727;
+    --el-fill-color-lighter: #1d1d1d;
+    --el-fill-color-extra-light: #191919;
+    --el-fill-color-blank: var(--el-bg-color);
+    --el-mask-color: rgba(0, 0, 0, 0.8);
+    --el-mask-color-extra-light: rgba(0, 0, 0, 0.3);
+    --el-box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, 0.36), 0px 8px 20px rgba(0, 0, 0, 0.72);
+    --el-box-shadow-light: 0px 0px 12px rgba(0, 0, 0, 0.72);
+    --el-box-shadow-lighter: 0px 0px 6px rgba(0, 0, 0, 0.72);
+    --el-box-shadow-dark: 0px 16px 48px 16px rgba(0, 0, 0, 0.72), 0px 12px 32px #000000,
+        0px 8px 16px -8px #000000 !important;
+    /* wangeditor主题 */
+    --w-e-textarea-bg-color: var(--el-bg-color);
+    --w-e-textarea-color: var(--el-text-color-primary);
+    --w-e-textarea-border-color: var(--el-border-color);
+    --w-e-textarea-slight-border-color: var(--el-border-color-light);
+    --w-e-textarea-slight-color: var(--el-border-color);
+    --w-e-textarea-slight-bg-color: var(--el-bg-color-page);
+    /* --w-e-textarea-selected-border-color: #b4d5ff;
+  --w-e-textarea-handler-bg-color: #4290f7; */
+    --w-e-toolbar-color: var(--el-text-color-primary);
+    --w-e-toolbar-bg-color: var(--el-bg-color);
+    --w-e-toolbar-active-color: var(--el-text-color-primary);
+    --w-e-toolbar-active-bg-color: var(--el-bg-color);
+    --w-e-toolbar-disabled-color: var(--el-text-color-disabled);
+    --w-e-toolbar-border-color: var(--el-border-color);
+    --w-e-modal-button-bg-color: var(--el-bg-color);
+    --w-e-modal-button-border-color: var(--el-border-color);
+}
diff --git a/src/styles/element.scss b/src/styles/element.scss
new file mode 100644
index 0000000..a493e35
--- /dev/null
+++ b/src/styles/element.scss
@@ -0,0 +1,151 @@
+:root {
+    // 弹窗居中
+    .el-overlay-dialog {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        min-height: 100%;
+        position: static;
+
+        .el-dialog {
+            --el-dialog-content-font-size: var(--el-font-size-base);
+            --el-dialog-margin-top: 50px;
+            max-width: calc(100vw - 30px);
+            flex: none;
+            display: flex;
+            flex-direction: column;
+            border-radius: 5px;
+
+            &.body-padding .el-dialog__body {
+                padding: 0;
+            }
+
+            .el-dialog__body {
+                flex: 1;
+                padding: 15px 20px;
+            }
+            .el-dialog__header {
+                font-size: var(--el-font-size-large);
+            }
+        }
+    }
+
+    .el-drawer {
+        --el-drawer-padding-primary: 16px;
+        &__header {
+            margin-bottom: 0;
+            padding: 13px 16px;
+            border-bottom: 1px solid var(--el-border-color-lighter);
+        }
+        &__title {
+            @apply text-tx-primary;
+        }
+    }
+
+    .el-table {
+        --el-table-header-text-color: var(--el-text-color-primary);
+        --el-table-header-bg-color: var(--table-header-bg-color);
+        font-size: var(--el-font-size-base);
+
+        thead {
+            th {
+                font-weight: 400;
+            }
+        }
+    }
+
+    .el-input-group__prepend {
+        background-color: var(--el-fill-color-blank);
+    }
+
+    .el-checkbox {
+        --el-checkbox-font-size: var(--el-font-size-base);
+    }
+
+    .el-menu--popup-container {
+        &.theme-light {
+            .el-menu {
+                .el-menu-item {
+                    &.is-active {
+                        @apply bg-primary-light-9 border-primary border-r-2;
+                    }
+                }
+                .el-menu-item:hover,
+                .el-sub-menu__title:hover {
+                    color: var(--el-color-primary);
+                }
+            }
+        }
+        &.theme-dark {
+            .el-menu {
+                .el-menu-item {
+                    &.is-active {
+                        @apply bg-primary;
+                    }
+                }
+            }
+        }
+    }
+
+    .el-message-box {
+        --el-messagebox-width: 350px;
+    }
+    .el-date-editor {
+        --el-date-editor-datetimerange-width: 380px;
+        .el-range-input {
+            font-size: var(--el-font-size-small);
+        }
+    }
+
+    .el-button--primary {
+        --el-button-hover-link-text-color: var(--el-color-primary-light-3);
+    }
+    .el-button--success {
+        --el-button-hover-link-text-color: var(--el-color-success-light-3);
+    }
+    .el-button--info {
+        --el-button-hover-link-text-color: var(--el-color-info-light-3);
+    }
+    .el-button--warning {
+        --el-button-hover-link-text-color: var(--el-color-warning-light-3);
+    }
+    .el-button--danger {
+        --el-button-hover-link-text-color: var(--el-color-danger-light-3);
+    }
+    .el-image__error {
+        font-size: 12px;
+    }
+    .el-tabs__nav-wrap::after {
+        height: 1px;
+    }
+    .el-page-header {
+        &__breadcrumb {
+            margin-bottom: 0;
+        }
+    }
+}
+@media (max-width: 768px) {
+    .el-pagination > .el-pagination__jump {
+        display: none !important;
+    }
+    .el-pagination > .el-pagination__sizes {
+        display: none !important;
+    }
+}
+
+.el-button {
+    // 防止被tailwindcss默认样式覆盖
+    background-color: var(--el-button-bg-color, var(--el-color-white));
+
+    //覆盖el-button的点击样式
+    &:focus {
+        color: var(--el-button-text-color);
+        border-color: var(--el-button-border-color);
+        background-color: var(--el-button-bg-color);
+    }
+    &:hover {
+        color: var(--el-button-hover-text-color);
+        border-color: var(--el-button-hover-border-color);
+        background-color: var(--el-button-hover-bg-color);
+    }
+}
diff --git a/src/styles/index.scss b/src/styles/index.scss
new file mode 100644
index 0000000..7bd1726
--- /dev/null
+++ b/src/styles/index.scss
@@ -0,0 +1,6 @@
+
+@import 'element.scss';
+@import 'dark.css';
+@import 'var.css';
+@import 'tailwind.css';
+@import 'public.scss';
diff --git a/src/styles/public.scss b/src/styles/public.scss
new file mode 100644
index 0000000..a11a8bd
--- /dev/null
+++ b/src/styles/public.scss
@@ -0,0 +1,18 @@
+body {
+    @apply text-base text-tx-primary overflow-hidden min-w-[375px];
+}
+.form-tips {
+    @apply text-tx-secondary text-xs leading-6 mt-1;
+}
+
+.clearfix:after {
+    content: '';
+    display: block;
+    clear: both;
+    visibility: hidden;
+}
+
+/* NProgress */
+#nprogress .bar {
+    @apply bg-primary #{!important};
+}
diff --git a/src/styles/tailwind.css b/src/styles/tailwind.css
new file mode 100644
index 0000000..bd6213e
--- /dev/null
+++ b/src/styles/tailwind.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
\ No newline at end of file
diff --git a/src/styles/var.css b/src/styles/var.css
new file mode 100644
index 0000000..a10631a
--- /dev/null
+++ b/src/styles/var.css
@@ -0,0 +1,48 @@
+:root {
+    --el-font-family: theme(fontFamily.sans);
+    --el-font-weight-primary: 400;
+    --el-menu-item-height: 46px;
+    --el-menu-sub-item-height: var(--el-menu-item-height);
+    --el-menu-icon-width: 18px;
+    --aside-width: 200px;
+    --navbar-height: 50px;
+    --color-white: #ffffff;
+    --table-header-bg-color: #f8f8f8;
+    --el-font-size-extra-large: 18px;
+    --el-menu-base-level-padding: 16px;
+    --el-menu-level-padding: 26px;
+    --el-font-size-large: 16px;
+    --el-font-size-medium: 15px;
+    --el-font-size-base: 14px;
+    --el-font-size-small: 13px;
+    --el-font-size-extra-small: 12px;
+
+    --el-bg-color: var(--color-white);
+    --el-bg-color-page: #f6f6f6;
+    --el-bg-color-overlay: #ffffff;
+    --el-text-color-primary: #333333;
+    --el-text-color-regular: #666666;
+    --el-text-color-secondary: #999999;
+    --el-text-color-placeholder: #a8abb2;
+    --el-text-color-disabled: #c0c4cc;
+    --el-border-color: #dcdfe6;
+    --el-border-color-light: #e4e7ed;
+    --el-border-color-lighter: #ebeef5;
+    --el-border-color-extra-light: #f2f2f2;
+    --el-border-color-dark: #d4d7de;
+    --el-border-color-darker: #cdd0d6;
+    --el-fill-color: #f0f2f5;
+    --el-fill-color-light: #f8f8f8;
+    --el-fill-color-lighter: #fafafa;
+    --el-fill-color-extra-light: #fafcff;
+    --el-fill-color-dark: #ebedf0;
+    --el-fill-color-darker: #e6e8eb;
+    --el-fill-color-blank: #ffffff;
+    --el-mask-color: rgba(255, 255, 255, 0.9);
+    --el-mask-color-extra-light: rgba(255, 255, 255, 0.3);
+    -el-box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, 0.04), 0px 8px 20px rgba(0, 0, 0, 0.08);
+    --el-box-shadow-light: 0px 0px 12px rgba(0, 0, 0, 0.12);
+    --el-box-shadow-lighter: 0px 0px 6px rgba(0, 0, 0, 0.12);
+    --el-box-shadow-dark: 0px 16px 48px 16px rgba(0, 0, 0, 0.08), 0px 12px 32px rgba(0, 0, 0, 0.12),
+        0px 8px 16px -8px rgba(0, 0, 0, 0.16);
+}
diff --git a/src/utils/auth.ts b/src/utils/auth.ts
new file mode 100644
index 0000000..abc6f92
--- /dev/null
+++ b/src/utils/auth.ts
@@ -0,0 +1,18 @@
+import { TOKEN_KEY } from '@/enums/cacheEnums'
+import { resetRouter } from '@/router'
+import useTabsStore from '@/stores/modules/multipleTabs'
+import useUserStore from '@/stores/modules/user'
+import cache from './cache'
+
+export function getToken() {
+    return cache.get(TOKEN_KEY)
+}
+
+export function clearAuthInfo() {
+    const userStore = useUserStore()
+    const tabsStore = useTabsStore()
+    userStore.resetState()
+    tabsStore.resetState()
+    cache.remove(TOKEN_KEY)
+    resetRouter()
+}
diff --git a/src/utils/cache.ts b/src/utils/cache.ts
new file mode 100644
index 0000000..e16973f
--- /dev/null
+++ b/src/utils/cache.ts
@@ -0,0 +1,53 @@
+const cache = {
+    key: 'like_admin_',
+    //设置缓存(expire为缓存时效)
+    set(key: string, value: any, expire?: string) {
+        key = this.getKey(key)
+        let data: any = {
+            expire: expire ? this.time() + expire : '',
+            value
+        }
+
+        if (typeof data === 'object') {
+            data = JSON.stringify(data)
+        }
+        try {
+            window.localStorage.setItem(key, data)
+        } catch (e) {
+            return null
+        }
+    },
+    get(key: string) {
+        key = this.getKey(key)
+        try {
+            const data = window.localStorage.getItem(key)
+            if (!data) {
+                return null
+            }
+            const { value, expire } = JSON.parse(data)
+            if (expire && expire < this.time()) {
+                window.localStorage.removeItem(key)
+                return null
+            }
+            return value
+        } catch (e) {
+            return null
+        }
+    },
+    //获取当前时间
+    time() {
+        return Math.round(new Date().getTime() / 1000)
+    },
+    remove(key: string) {
+        key = this.getKey(key)
+        window.localStorage.removeItem(key)
+    },
+    clear() {
+        window.localStorage.clear()
+    },
+    getKey(key: string) {
+        return this.key + key
+    }
+}
+
+export default cache
diff --git a/src/utils/env.ts b/src/utils/env.ts
new file mode 100644
index 0000000..d8951e9
--- /dev/null
+++ b/src/utils/env.ts
@@ -0,0 +1,13 @@
+/**
+ * @description: 开发模式
+ */
+export function isDevMode(): boolean {
+    return import.meta.env.DEV
+}
+
+/**
+ * @description: 生成模式
+ */
+export function isProdMode(): boolean {
+    return import.meta.env.PROD
+}
diff --git a/src/utils/feedback.ts b/src/utils/feedback.ts
new file mode 100644
index 0000000..91672ab
--- /dev/null
+++ b/src/utils/feedback.ts
@@ -0,0 +1,95 @@
+import {
+    ElMessage,
+    ElMessageBox,
+    ElNotification,
+    ElLoading,
+    type ElMessageBoxOptions
+} from 'element-plus'
+import type { LoadingInstance } from 'element-plus/es/components/loading/src/loading'
+
+export class Feedback {
+    private loadingInstance: LoadingInstance | null = null
+    static instance: Feedback | null = null
+    static getInstance() {
+        return this.instance ?? (this.instance = new Feedback())
+    }
+    // 消息提示
+    msg(msg: string) {
+        ElMessage.info(msg)
+    }
+    // 错误消息
+    msgError(msg: string) {
+        ElMessage.error(msg)
+    }
+    // 成功消息
+    msgSuccess(msg: string) {
+        ElMessage.success(msg)
+    }
+    // 警告消息
+    msgWarning(msg: string) {
+        ElMessage.warning(msg)
+    }
+    // 弹出提示
+    alert(msg: string) {
+        ElMessageBox.alert(msg, '系统提示')
+    }
+    // 错误提示
+    alertError(msg: string) {
+        ElMessageBox.alert(msg, '系统提示', { type: 'error' })
+    }
+    // 成功提示
+    alertSuccess(msg: string) {
+        ElMessageBox.alert(msg, '系统提示', { type: 'success' })
+    }
+    // 警告提示
+    alertWarning(msg: string) {
+        ElMessageBox.alert(msg, '系统提示', { type: 'warning' })
+    }
+    // 通知提示
+    notify(msg: string) {
+        ElNotification.info(msg)
+    }
+    // 错误通知
+    notifyError(msg: string) {
+        ElNotification.error(msg)
+    }
+    // 成功通知
+    notifySuccess(msg: string) {
+        ElNotification.success(msg)
+    }
+    // 警告通知
+    notifyWarning(msg: string) {
+        ElNotification.warning(msg)
+    }
+    // 确认窗体
+    confirm(msg: string) {
+        return ElMessageBox.confirm(msg, '温馨提示', {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+        })
+    }
+    // 提交内容
+    prompt(content: string, title: string, options?: ElMessageBoxOptions) {
+        return ElMessageBox.prompt(content, title, {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            ...options
+        })
+    }
+    // 打开全局loading
+    loading(msg: string) {
+        this.loadingInstance = ElLoading.service({
+            lock: true,
+            text: msg
+        })
+    }
+    // 关闭全局loading
+    closeLoading() {
+        this.loadingInstance?.close()
+    }
+}
+
+const feedback = Feedback.getInstance()
+
+export default feedback
diff --git a/src/utils/request/axios.ts b/src/utils/request/axios.ts
new file mode 100644
index 0000000..65703e0
--- /dev/null
+++ b/src/utils/request/axios.ts
@@ -0,0 +1,165 @@
+import { RequestMethodsEnum } from '@/enums/requestEnums'
+import axios, {
+    AxiosError,
+    type AxiosInstance,
+    type AxiosRequestConfig,
+    type AxiosResponse
+} from 'axios'
+import { isFunction, merge, cloneDeep } from 'lodash'
+import axiosCancel from './cancel'
+import type { RequestData, RequestOptions } from './type'
+
+export class Axios {
+    private axiosInstance: AxiosInstance
+    private readonly config: AxiosRequestConfig
+    private readonly options: RequestOptions
+    constructor(config: AxiosRequestConfig) {
+        this.config = config
+        this.options = config.requestOptions
+        this.axiosInstance = axios.create(config)
+        this.setupInterceptors()
+    }
+
+    /**
+     * @description 获取axios实例
+     */
+    getAxiosInstance() {
+        return this.axiosInstance
+    }
+
+    /**
+     * @description 设置拦截器
+     */
+    setupInterceptors() {
+        if (!this.config.axiosHooks) {
+            return
+        }
+        const {
+            requestInterceptorsHook,
+            requestInterceptorsCatchHook,
+            responseInterceptorsHook,
+            responseInterceptorsCatchHook
+        } = this.config.axiosHooks
+        this.axiosInstance.interceptors.request.use(
+            (config) => {
+                this.addCancelToken(config)
+                if (isFunction(requestInterceptorsHook)) {
+                    config = requestInterceptorsHook(config)
+                }
+                return config
+            },
+            (err: Error) => {
+                if (isFunction(requestInterceptorsCatchHook)) {
+                    requestInterceptorsCatchHook(err)
+                }
+                return err
+            }
+        )
+        this.axiosInstance.interceptors.response.use(
+            (response: AxiosResponse<RequestData>) => {
+                this.removeCancelToken(response.config.url!)
+                if (isFunction(responseInterceptorsHook)) {
+                    response = responseInterceptorsHook(response)
+                }
+                return response
+            },
+            (err: AxiosError) => {
+                if (isFunction(responseInterceptorsCatchHook)) {
+                    responseInterceptorsCatchHook(err)
+                }
+                if (err.code != AxiosError.ERR_CANCELED) {
+                    this.removeCancelToken(err.config?.url!)
+                }
+
+                if (err.code == AxiosError.ECONNABORTED || err.code == AxiosError.ERR_NETWORK) {
+                    return new Promise((resolve) => setTimeout(resolve, 500)).then(() =>
+                        this.retryRequest(err)
+                    )
+                }
+                return Promise.reject(err)
+            }
+        )
+    }
+
+    /**
+     * @description 添加CancelToken
+     */
+    addCancelToken(config: AxiosRequestConfig) {
+        const { ignoreCancelToken } = config.requestOptions
+        !ignoreCancelToken && axiosCancel.add(config)
+    }
+
+    /**
+     * @description 移除CancelToken
+     */
+    removeCancelToken(url: string) {
+        axiosCancel.remove(url)
+    }
+
+    /**
+     * @description 重新请求
+     */
+    retryRequest(error: AxiosError) {
+        const config = error.config
+        const { retryCount, isOpenRetry } = config.requestOptions
+        if (!isOpenRetry || config.method?.toUpperCase() == RequestMethodsEnum.POST) {
+            return Promise.reject(error)
+        }
+        config.retryCount = config.retryCount ?? 0
+
+        if (config.retryCount >= retryCount) {
+            return Promise.reject(error)
+        }
+        config.retryCount++
+
+        return this.axiosInstance.request(config)
+    }
+    /**
+     * @description get请求
+     */
+    get<T = any>(
+        config: Partial<AxiosRequestConfig>,
+        options?: Partial<RequestOptions>
+    ): Promise<T> {
+        return this.request({ ...config, method: RequestMethodsEnum.GET }, options)
+    }
+
+    /**
+     * @description post请求
+     */
+    post<T = any>(
+        config: Partial<AxiosRequestConfig>,
+        options?: Partial<RequestOptions>
+    ): Promise<T> {
+        return this.request({ ...config, method: RequestMethodsEnum.POST }, options)
+    }
+
+    /**
+     * @description 请求函数
+     */
+    request<T = any>(
+        config: Partial<AxiosRequestConfig>,
+        options?: Partial<RequestOptions>
+    ): Promise<any> {
+        const opt: RequestOptions = merge({}, this.options, options)
+        const axioxConfig: AxiosRequestConfig = {
+            ...cloneDeep(config),
+            requestOptions: opt
+        }
+        const { urlPrefix } = opt
+        // 拼接请求前缀如api
+        if (urlPrefix) {
+            axioxConfig.url = `${urlPrefix}${config.url}`
+        }
+        return new Promise((resolve, reject) => {
+            this.axiosInstance
+                .request<any, AxiosResponse<RequestData<T>>>(axioxConfig)
+                .then((res) => {
+                    resolve(res)
+                })
+                .catch((err) => {
+                    reject(err)
+                })
+        })
+    }
+}
diff --git a/src/utils/request/cancel.ts b/src/utils/request/cancel.ts
new file mode 100644
index 0000000..00edb5d
--- /dev/null
+++ b/src/utils/request/cancel.ts
@@ -0,0 +1,37 @@
+import axios, { type AxiosRequestConfig, type Canceler } from 'axios'
+
+const cancelerMap = new Map<string, Canceler>()
+
+// 获取一个唯一的请求键，它由请求的 URL 和参数组成
+function getRequestKey(config: AxiosRequestConfig): string {
+    const { url, method, params, data } = config
+    return [method, url, JSON.stringify(params), JSON.stringify(data)].join("&")
+}
+
+export class AxiosCancel {
+    private static instance?: AxiosCancel
+
+    static createInstance() {
+        return this.instance ?? (this.instance = new AxiosCancel())
+    }
+    add(config: AxiosRequestConfig) {
+        const requestKey = getRequestKey(config)
+        this.remove(requestKey)
+        config.cancelToken = new axios.CancelToken((cancel) => {
+            if (!cancelerMap.has(requestKey)) {
+                cancelerMap.set(requestKey, cancel)
+            }
+        })
+    }
+    remove(requestKey: string) {
+        if (cancelerMap.has(requestKey)) {
+            const cancel = cancelerMap.get(requestKey)
+            cancel && cancel(requestKey)
+            cancelerMap.delete(requestKey)
+        }
+    }
+}
+
+const axiosCancel = AxiosCancel.createInstance()
+
+export default axiosCancel
diff --git a/src/utils/request/index.ts b/src/utils/request/index.ts
new file mode 100644
index 0000000..e66915d
--- /dev/null
+++ b/src/utils/request/index.ts
@@ -0,0 +1,123 @@
+import { merge } from 'lodash'
+import configs from '@/config'
+import { Axios } from './axios'
+import { ContentTypeEnum, RequestCodeEnum, RequestMethodsEnum } from '@/enums/requestEnums'
+import type { AxiosHooks } from './type'
+import { clearAuthInfo, getToken } from '../auth'
+import feedback from '../feedback'
+import NProgress from 'nprogress'
+import { AxiosError, type AxiosRequestConfig } from 'axios'
+import router from '@/router'
+import { PageEnum } from '@/enums/pageEnum'
+
+// 处理axios的钩子函数
+const axiosHooks: AxiosHooks = {
+    requestInterceptorsHook(config) {
+        NProgress.start()
+        const { withToken, isParamsToData } = config.requestOptions
+        const params = config.params || {}
+        const headers = config.headers || {}
+
+        // 添加token
+        if (withToken) {
+            const token = getToken()
+            headers.token = token
+        }
+        // POST请求下如果无data，则将params视为data
+        if (
+            isParamsToData &&
+            !Reflect.has(config, 'data') &&
+            config.method?.toUpperCase() === RequestMethodsEnum.POST
+        ) {
+            config.data = params
+            config.params = {}
+        }
+        config.headers = headers
+        return config
+    },
+    requestInterceptorsCatchHook(err) {
+        NProgress.done()
+        return err
+    },
+    async responseInterceptorsHook(response) {
+        NProgress.done()
+        const { isTransformResponse, isReturnDefaultResponse } = response.config.requestOptions
+
+        //返回默认响应，当需要获取响应头及其他数据时可使用
+        if (isReturnDefaultResponse) {
+            return response
+        }
+        // 是否需要对数据进行处理
+        if (!isTransformResponse) {
+            return response.data
+        }
+        const { code, data, show, msg } = response.data
+        switch (code) {
+            case RequestCodeEnum.SUCCESS:
+                if (show) {
+                    msg && feedback.msgSuccess(msg)
+                }
+                return data
+            case RequestCodeEnum.FAIL:
+                if (show) {
+                    msg && feedback.msgError(msg)
+                }
+                return Promise.reject(data)
+            case RequestCodeEnum.LOGIN_FAILURE:
+                clearAuthInfo()
+                router.push(PageEnum.LOGIN)
+                return Promise.reject()
+            case RequestCodeEnum.OPEN_NEW_PAGE:
+                window.location.href = data.url
+                return data
+            default:
+                return data
+        }
+    },
+    responseInterceptorsCatchHook(error) {
+        NProgress.done()
+        if (error.code !== AxiosError.ERR_CANCELED) {
+            error.message && feedback.msgError(error.message)
+        }
+        return Promise.reject(error)
+    }
+}
+
+const defaultOptions: AxiosRequestConfig = {
+    //接口超时时间
+    timeout: configs.timeout,
+    // 基础接口地址
+    baseURL: configs.baseUrl,
+    //请求头
+    headers: { 'Content-Type': ContentTypeEnum.JSON, version: configs.version },
+    // 处理 axios的钩子函数
+    axiosHooks: axiosHooks,
+    // 每个接口可以单独配置
+    requestOptions: {
+        // 是否将params视为data参数，仅限post请求
+        isParamsToData: true,
+        //是否返回默认的响应
+        isReturnDefaultResponse: false,
+        // 需要对返回数据进行处理
+        isTransformResponse: true,
+        // 接口拼接地址
+        urlPrefix: configs.urlPrefix,
+        // 忽略重复请求
+        ignoreCancelToken: false,
+        // 是否携带token
+        withToken: true,
+        // 开启请求超时重新发起请求请求机制
+        isOpenRetry: true,
+        // 重新请求次数
+        retryCount: 2
+    }
+}
+
+function createAxios(opt?: Partial<AxiosRequestConfig>) {
+    return new Axios(
+        // 深度合并
+        merge(defaultOptions, opt || {})
+    )
+}
+const request = createAxios()
+export default request
diff --git a/src/utils/request/type.d.ts b/src/utils/request/type.d.ts
new file mode 100644
index 0000000..a7f364d
--- /dev/null
+++ b/src/utils/request/type.d.ts
@@ -0,0 +1,38 @@
+import type { AxiosRequestConfig, AxiosResponse } from 'axios'
+
+import 'axios'
+declare module 'axios' {
+    // 扩展 RouteMeta
+    interface AxiosRequestConfig {
+        retryCount?: number
+        axiosHooks?: AxiosHooks
+        requestOptions: RequestOptions
+    }
+}
+
+export interface RequestOptions {
+    isParamsToData: boolean
+    isReturnDefaultResponse: boolean
+    isTransformResponse: boolean
+    urlPrefix: string
+    ignoreCancelToken: boolean
+    withToken: boolean
+    isOpenRetry: boolean
+    retryCount: number
+}
+
+export interface AxiosHooks {
+    requestInterceptorsHook?: (config: AxiosRequestConfig) => AxiosRequestConfig
+    requestInterceptorsCatchHook?: (error: Error) => void
+    responseInterceptorsHook?: (
+        response: AxiosResponse<RequestData<T>>
+    ) => AxiosResponse<RequestData> | RequestData | T
+    responseInterceptorsCatchHook?: (error: AxiosError) => void
+}
+
+export interface RequestData<T = any> {
+    code: number
+    data: T
+    msg: string
+    show: boolean
+}
diff --git a/src/utils/theme.ts b/src/utils/theme.ts
new file mode 100644
index 0000000..d11fe18
--- /dev/null
+++ b/src/utils/theme.ts
@@ -0,0 +1,74 @@
+import colors from 'css-color-function'
+const lightConfig = {
+    'dark-2': 'shade(20%)',
+    'light-3': 'tint(30%)',
+    'light-5': 'tint(50%)',
+    'light-7': 'tint(70%)',
+    'light-8': 'tint(80%)',
+    'light-9': 'tint(90%)'
+}
+
+const darkConfig = {
+    'light-3': 'shade(20%)',
+    'light-5': 'shade(30%)',
+    'light-7': 'shade(50%)',
+    'light-8': 'shade(60%)',
+    'light-9': 'shade(70%)',
+    'dark-2': 'tint(20%)'
+}
+
+const themeId = 'theme-vars'
+
+/**
+ * @author Jason
+ * @description 用于生成elementui主题的行为变量
+ * 可选值有primary、success、warning、danger、error、info
+ */
+
+export const generateVars = (color: string, type = 'primary', isDark = false) => {
+    const colos = {
+        [`--el-color-${type}`]: color
+    }
+    const config: Record<string, string> = isDark ? darkConfig : lightConfig
+    for (const key in config) {
+        colos[`--el-color-${type}-${key}`] = `color(${color} ${config[key]})`
+    }
+    return colos
+}
+
+/**
+ * @author Jason
+ * @description 用于设置css变量
+ * @param key css变量key 如 --color-primary
+ * @param value css变量值 如 #f40
+ * @param dom dom元素
+ */
+export const setCssVar = (key: string, value: string, dom = document.documentElement) => {
+    dom.style.setProperty(key, value)
+}
+
+/**
+ * @author Jason
+ * @description 设置主题
+ */
+export const setTheme = (options: Record<string, string>, isDark = false) => {
+    const varsMap: Record<string, string> = Object.keys(options).reduce((prev, key) => {
+        return Object.assign(prev, generateVars(options[key], key, isDark))
+    }, {})
+
+    let theme = Object.keys(varsMap).reduce((prev, key) => {
+        const color = colors.convert(varsMap[key])
+        return `${prev}${key}:${color};`
+    }, '')
+    theme = `:root{${theme}}`
+    let style = document.getElementById(themeId)
+    if (style) {
+        style.innerHTML = theme
+        return
+    }
+    style = document.createElement('style')
+    style.setAttribute('type', 'text/css')
+    style.setAttribute('id', themeId)
+    style.innerHTML = theme
+    document.head.append(style)
+}
diff --git a/src/utils/util.ts b/src/utils/util.ts
new file mode 100644
index 0000000..57d9ab6
--- /dev/null
+++ b/src/utils/util.ts
@@ -0,0 +1,162 @@
+import { isObject } from '@vue/shared'
+import { cloneDeep } from 'lodash'
+
+/**
+ * @description 添加单位
+ * @param {String | Number} value 值 100
+ * @param {String} unit 单位 px em rem
+ */
+export const addUnit = (value: string | number, unit = 'px') => {
+    return !Object.is(Number(value), NaN) ? `${value}${unit}` : value
+}
+
+/**
+ * @description 添加单位
+ * @param {unknown} value
+ * @return {Boolean}
+ */
+export const isEmpty = (value: unknown) => {
+    return value == null && typeof value == 'undefined'
+}
+
+/**
+ * @description 树转数组，队列实现广度优先遍历
+ * @param {Array} data  数据
+ * @param {Object} props `{ children: 'children' }`
+ */
+
+export const treeToArray = (data: any[], props = { children: 'children' }) => {
+    data = cloneDeep(data)
+    const { children } = props
+    const newData = []
+    const queue: any[] = []
+    data.forEach((child: any) => queue.push(child))
+    while (queue.length) {
+        const item: any = queue.shift()
+        if (item[children]) {
+            item[children].forEach((child: any) => queue.push(child))
+            delete item[children]
+        }
+        newData.push(item)
+    }
+    return newData
+}
+
+/**
+ * @description 数组转
+ * @param {Array} data  数据
+ * @param {Object} props `{ parent: 'pid', children: 'children' }`
+ */
+
+export const arrayToTree = (
+    data: any[],
+    props = { id: 'id', parentId: 'pid', children: 'children' }
+) => {
+    data = cloneDeep(data)
+    const { id, parentId, children } = props
+    const result: any[] = []
+    const map = new Map()
+    data.forEach((item) => {
+        map.set(item[id], item)
+        const parent = map.get(item[parentId])
+        if (parent) {
+            parent[children] = parent[children] ?? []
+            parent[children].push(item)
+        } else {
+            result.push(item)
+        }
+    })
+    return result
+}
+
+/**
+ * @description 获取正确的路经
+ * @param {String} path  数据
+ */
+export function getNormalPath(path: string) {
+    if (path.length === 0 || !path || path == 'undefined') {
+        return path
+    }
+    const newPath = path.replace('//', '/')
+    const length = newPath.length
+    if (newPath[length - 1] === '/') {
+        return newPath.slice(0, length - 1)
+    }
+    return newPath
+}
+
+/**
+ * @description对象格式化为Query语法
+ * @param { Object } params
+ * @return {string} Query语法
+ */
+export function objectToQuery(params: Record<string, any>): string {
+    let query = ''
+    for (const props of Object.keys(params)) {
+        const value = params[props]
+        const part = encodeURIComponent(props) + '='
+        if (!isEmpty(value)) {
+            if (isObject(value)) {
+                for (const key of Object.keys(value)) {
+                    if (!isEmpty(value[key])) {
+                        const params = props + '[' + key + ']'
+                        const subPart = encodeURIComponent(params) + '='
+                        query += subPart + encodeURIComponent(value[key]) + '&'
+                    }
+                }
+            } else {
+                query += part + encodeURIComponent(value) + '&'
+            }
+        }
+    }
+    return query.slice(0, -1)
+}
+
+/**
+ * @description 时间格式化
+ * @param dateTime { number } 时间戳
+ * @param fmt { string } 时间格式
+ * @return { string }
+ */
+// yyyy:mm:dd|yyyy:mm|yyyy年mm月dd日|yyyy年mm月dd日 hh时MM分等,可自定义组合
+export const timeFormat = (dateTime: number, fmt = 'yyyy-mm-dd') => {
+    // 如果为null,则格式化当前时间
+    if (!dateTime) {
+        dateTime = Number(new Date())
+    }
+    // 如果dateTime长度为10或者13，则为秒和毫秒的时间戳，如果超过13位，则为其他的时间格式
+    if (dateTime.toString().length == 10) {
+        dateTime *= 1000
+    }
+    const date = new Date(dateTime)
+    let ret
+    const opt: any = {
+        'y+': date.getFullYear().toString(), // 年
+        'm+': (date.getMonth() + 1).toString(), // 月
+        'd+': date.getDate().toString(), // 日
+        'h+': date.getHours().toString(), // 时
+        'M+': date.getMinutes().toString(), // 分
+        's+': date.getSeconds().toString() // 秒
+    }
+    for (const k in opt) {
+        ret = new RegExp('(' + k + ')').exec(fmt)
+        if (ret) {
+            fmt = fmt.replace(
+                ret[1],
+                ret[1].length == 1 ? opt[k] : opt[k].padStart(ret[1].length, '0')
+            )
+        }
+    }
+    return fmt
+}
+
+/**
+ * @description 获取不重复的id
+ * @param length { Number } id的长度
+ * @return { String } id
+ */
+export const getNonDuplicateID = (length = 8) => {
+    let idStr = Date.now().toString(36)
+    idStr += Math.random().toString(36).substring(3, length)
+    return idStr
+}
diff --git a/src/utils/validate.ts b/src/utils/validate.ts
new file mode 100644
index 0000000..0f8d8f1
--- /dev/null
+++ b/src/utils/validate.ts
@@ -0,0 +1,7 @@
+/**
+ * @param {string} path
+ * @returns {Boolean}
+ */
+export function isExternal(path: string) {
+    return /^(https?:|mailto:|tel:)/.test(path)
+}
diff --git a/src/views/account/images/login_bg.png b/src/views/account/images/login_bg.png
new file mode 100644
index 0000000..787837a
Binary files /dev/null and b/src/views/account/images/login_bg.png differ
diff --git a/src/views/account/login.vue b/src/views/account/login.vue
new file mode 100644
index 0000000..74b1aeb
--- /dev/null
+++ b/src/views/account/login.vue
@@ -0,0 +1,130 @@
+<template>
+    <div class="login flex flex-col">
+        <div class="flex-1 flex items-center justify-center">
+            <div class="login-card flex rounded-md">
+                <div class="flex-1 h-full hidden md:inline-block">
+                    <image-contain :src="config.login_image" :width="400" height="100%" />
+                </div>
+                <div
+                    class="login-form bg-body flex flex-col justify-center px-10 py-10 md:w-[400px] w-[375px] flex-none mx-auto"
+                >
+                    <div class="text-center text-3xl font-medium mb-8">{{ config.web_name }}</div>
+                    <el-form ref="formRef" :model="formData" size="large" :rules="rules">
+                        <el-form-item prop="account">
+                            <el-input
+                                v-model="formData.account"
+                                placeholder="请输入账号"
+                                @keyup.enter="handleEnter"
+                            >
+                                <template #prepend>
+                                    <icon name="el-icon-User" />
+                                </template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item prop="password">
+                            <el-input
+                                ref="passwordRef"
+                                v-model="formData.password"
+                                show-password
+                                placeholder="请输入密码"
+                                @keyup.enter="handleLogin"
+                            >
+                                <template #prepend>
+                                    <icon name="el-icon-Lock" />
+                                </template>
+                            </el-input>
+                        </el-form-item>
+                    </el-form>
+                    <div class="mb-5">
+                        <el-checkbox v-model="remAccount" label="记住账号"></el-checkbox>
+                    </div>
+                    <el-button type="primary" size="large" :loading="isLock" @click="lockLogin">
+                        登录
+                    </el-button>
+                </div>
+            </div>
+        </div>
+        <layout-footer />
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { computed, onMounted, reactive, ref, shallowRef } from 'vue'
+import type { InputInstance, FormInstance } from 'element-plus'
+import LayoutFooter from '@/layout/components/footer.vue'
+import useAppStore from '@/stores/modules/app'
+import useUserStore from '@/stores/modules/user'
+import cache from '@/utils/cache'
+import { ACCOUNT_KEY } from '@/enums/cacheEnums'
+import { PageEnum } from '@/enums/pageEnum'
+import { useLockFn } from '@/hooks/useLockFn'
+const passwordRef = shallowRef<InputInstance>()
+const formRef = shallowRef<FormInstance>()
+const appStore = useAppStore()
+const userStore = useUserStore()
+const route = useRoute()
+const router = useRouter()
+const remAccount = ref(false)
+const config = computed(() => appStore.config)
+const formData = reactive({
+    account: '',
+    password: ''
+})
+const rules = {
+    account: [
+        {
+            required: true,
+            message: '请输入账号',
+            trigger: ['blur']
+        }
+    ],
+    password: [
+        {
+            required: true,
+            message: '请输入密码',
+            trigger: ['blur']
+        }
+    ]
+}
+// 回车按键监听
+const handleEnter = () => {
+    if (!formData.password) {
+        return passwordRef.value?.focus()
+    }
+    handleLogin()
+}
+// 登录处理
+const handleLogin = async () => {
+    await formRef.value?.validate()
+    // 记住账号，缓存
+    cache.set(ACCOUNT_KEY, {
+        remember: remAccount.value,
+        account: remAccount.value ? formData.account : ''
+    })
+    await userStore.login(formData)
+    const {
+        query: { redirect }
+    } = route
+    const path = typeof redirect === 'string' ? redirect : PageEnum.INDEX
+    router.push(path)
+}
+const { isLock, lockFn: lockLogin } = useLockFn(handleLogin)
+
+onMounted(() => {
+    const value = cache.get(ACCOUNT_KEY)
+    if (value?.remember) {
+        remAccount.value = value.remember
+        formData.account = value.account
+    }
+})
+</script>
+
+<style lang="scss" scoped>
+.login {
+    background-image: url('./images/login_bg.png');
+    @apply min-h-screen bg-no-repeat bg-center bg-cover;
+    .login-card {
+        height: 400px;
+    }
+}
+</style>
diff --git a/src/views/app/recharge/index.vue b/src/views/app/recharge/index.vue
new file mode 100644
index 0000000..aad882f
--- /dev/null
+++ b/src/views/app/recharge/index.vue
@@ -0,0 +1,52 @@
+<template>
+    <div>
+        <el-card shadow="never" class="!border-none">
+            <template #header>
+                <span class="font-extrabold text-lg">充值设置</span>
+            </template>
+            <el-form :model="formData" label-width="120px">
+                <el-form-item label="状态">
+                    <div>
+                        <el-radio-group v-model="formData.status" class="ml-4">
+                            <el-radio :label="1">开启</el-radio>
+                            <el-radio :label="0">关闭</el-radio>
+                        </el-radio-group>
+                        <div class="form-tips">关闭或开启充值功能，关闭后将不显示充值入口</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="最低充值金额">
+                    <div>
+                        <el-input
+                            v-model="formData.min_amount"
+                            placeholder="请输入最低充值金额"
+                            clearable
+                        />
+                        <div class="form-tips">
+                            最低充值金额要求，不填或填0表示不限制最低充值金额
+                        </div>
+                    </div>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <footer-btns v-perms="['recharge.recharge/setConfig']">
+            <el-button type="primary" @click="handleSubmit">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+<script lang="ts" setup>
+import { getRechargeConfig, setRechargeConfig } from '@/api/app/recharge'
+const formData = reactive({
+    status: 1, //功能状态 1-开启 0-关闭
+    min_amount: '' //最低充值金额
+})
+
+const getConfig = async () => {
+    const data = await getRechargeConfig()
+    Object.assign(formData, data)
+}
+const handleSubmit = async () => {
+    await setRechargeConfig(formData)
+    getConfig()
+}
+getConfig()
+</script>
diff --git a/src/views/article/column/edit.vue b/src/views/article/column/edit.vue
new file mode 100644
index 0000000..b0727ab
--- /dev/null
+++ b/src/views/article/column/edit.vue
@@ -0,0 +1,93 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules">
+                <el-form-item label="栏目名称" prop="name">
+                    <el-input v-model="formData.name" placeholder="请输入栏目名称" clearable />
+                </el-form-item>
+                <el-form-item label="排序" prop="sort">
+                    <div>
+                        <el-input-number v-model="formData.sort" :min="0" :max="9999" />
+                        <div class="form-tips">默认为0， 数值越大越排前</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="状态" prop="is_show">
+                    <el-switch v-model="formData.is_show" :active-value="1" :inactive-value="0" />
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import { articleCateEdit, articleCateAdd, articleCateDetail } from '@/api/article'
+import Popup from '@/components/popup/index.vue'
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑栏目' : '新增栏目'
+})
+const formData = reactive({
+    id: '',
+    name: '',
+    sort: 0,
+    is_show: 1
+})
+
+const formRules = {
+    name: [
+        {
+            required: true,
+            message: '请输入栏目名称',
+            trigger: ['blur']
+        }
+    ]
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    mode.value == 'edit' ? await articleCateEdit(formData) : await articleCateAdd(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+const getDetail = async (row: Record<string, any>) => {
+    const data = await articleCateDetail({
+        id: row.id
+    })
+    setFormData(data)
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+defineExpose({
+    open,
+    setFormData,
+    getDetail
+})
+</script>
diff --git a/src/views/article/column/index.vue b/src/views/article/column/index.vue
new file mode 100644
index 0000000..3f15093
--- /dev/null
+++ b/src/views/article/column/index.vue
@@ -0,0 +1,108 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：用于管理网站的分类，只可添加到一级"
+                :closable="false"
+                show-icon
+            />
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never" v-loading="pager.loading">
+            <div>
+                <el-button
+                    class="mb-4"
+                    v-perms="['article.articleCate/add']"
+                    type="primary"
+                    @click="handleAdd()"
+                >
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+            </div>
+            <el-table size="large" :data="pager.lists">
+                <el-table-column label="栏目名称" prop="name" min-width="120" />
+                <el-table-column label="文章数" prop="article_count" min-width="120" />
+                <el-table-column label="状态" min-width="120">
+                    <template #default="{ row }">
+                        <el-switch
+                            v-perms="['article.articleCate/updateStatus']"
+                            v-model="row.is_show"
+                            :active-value="1"
+                            :inactive-value="0"
+                            @change="changeStatus($event, row.id)"
+                        />
+                    </template>
+                </el-table-column>
+                <el-table-column label="排序" prop="sort" min-width="120" />
+                <el-table-column label="操作" width="120" fixed="right">
+                    <template #default="{ row }">
+                        <el-button
+                            v-perms="['article.articleCate/edit']"
+                            type="primary"
+                            link
+                            @click="handleEdit(row)"
+                        >
+                            编辑
+                        </el-button>
+                        <el-button
+                            v-perms="['article.articleCate/delete']"
+                            type="danger"
+                            link
+                            @click="handleDelete(row.id)"
+                        >
+                            删除
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+<script lang="ts" setup name="articleColumn">
+import { articleCateDelete, articleCateLists, articleCateStatus } from '@/api/article'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const showEdit = ref(false)
+
+const { pager, getLists } = usePaging({
+    fetchFun: articleCateLists
+})
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add')
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.getDetail(data)
+}
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await articleCateDelete({ id })
+    getLists()
+}
+
+const changeStatus = async (is_show: any, id: number) => {
+    try {
+        await articleCateStatus({ id, is_show })
+        getLists()
+    } catch (error) {
+        getLists()
+    }
+}
+
+getLists()
+</script>
diff --git a/src/views/article/lists/edit.vue b/src/views/article/lists/edit.vue
new file mode 100644
index 0000000..27ab1ab
--- /dev/null
+++ b/src/views/article/lists/edit.vue
@@ -0,0 +1,173 @@
+<template>
+    <div class="article-edit">
+        <el-card class="!border-none" shadow="never">
+            <el-page-header :content="$route.meta.title" @back="$router.back()" />
+        </el-card>
+        <el-card class="mt-4 !border-none" shadow="never">
+            <el-form
+                ref="formRef"
+                class="ls-form"
+                :model="formData"
+                label-width="85px"
+                :rules="rules"
+            >
+                <div class="xl:flex">
+                    <div>
+                        <el-form-item label="文章标题" prop="title">
+                            <div class="w-80">
+                                <el-input
+                                    v-model="formData.title"
+                                    placeholder="请输入文章标题"
+                                    type="textarea"
+                                    :autosize="{ minRows: 3, maxRows: 3 }"
+                                    maxlength="64"
+                                    show-word-limit
+                                    clearable
+                                />
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="文章栏目" prop="cid">
+                            <el-select
+                                class="w-80"
+                                v-model="formData.cid"
+                                placeholder="请选择文章栏目"
+                                clearable
+                            >
+                                <el-option
+                                    v-for="item in optionsData.article_cate"
+                                    :key="item.id"
+                                    :label="item.name"
+                                    :value="item.id"
+                                />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="文章简介" prop="desc">
+                            <div class="w-80">
+                                <el-input
+                                    v-model="formData.desc"
+                                    placeholder="请输入文章简介"
+                                    type="textarea"
+                                    :autosize="{ minRows: 3, maxRows: 6 }"
+                                    :maxlength="200"
+                                    show-word-limit
+                                    clearable
+                                />
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="摘要" prop="abstract">
+                            <div class="w-80">
+                                <el-input
+                                    type="textarea"
+                                    :autosize="{ minRows: 6, maxRows: 6 }"
+                                    v-model="formData.abstract"
+                                    maxlength="200"
+                                    show-word-limit
+                                    clearable
+                                />
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="文章封面" prop="image">
+                            <div>
+                                <div>
+                                    <material-picker v-model="formData.image" :limit="1" />
+                                </div>
+                                <div class="form-tips">建议尺寸：240*180px</div>
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="作者" prop="author">
+                            <div class="w-80">
+                                <el-input v-model="formData.author" placeholder="请输入作者名称" />
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="排序" prop="sort">
+                            <div>
+                                <el-input-number v-model="formData.sort" :min="0" :max="9999" />
+                                <div class="form-tips">默认为0， 数值越大越排前</div>
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="初始浏览量" prop="click_virtual">
+                            <div>
+                                <el-input-number v-model="formData.click_virtual" :min="0" />
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="文章状态" required prop="is_show">
+                            <el-radio-group v-model="formData.is_show">
+                                <el-radio :label="1">显示</el-radio>
+                                <el-radio :label="0">隐藏</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                    </div>
+                    <div class="xl:ml-20">
+                        <el-form-item label="文章内容" prop="content">
+                            <editor v-model="formData.content" :height="667" :width="375" />
+                        </el-form-item>
+                    </div>
+                </div>
+            </el-form>
+        </el-card>
+        <footer-btns>
+            <el-button type="primary" @click="handleSave">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script lang="ts" setup name="articleListsEdit">
+import type { FormInstance } from 'element-plus'
+import { useDictOptions } from '@/hooks/useDictOptions'
+import { articleDetail, articleEdit, articleAdd, articleCateAll } from '@/api/article'
+import useMultipleTabs from '@/hooks/useMultipleTabs'
+
+const route = useRoute()
+const router = useRouter()
+const formData = reactive({
+    id: '',
+    title: '',
+    image: '',
+    cid: '',
+    desc: '',
+    author: '',
+    content: '',
+    click_virtual: 0,
+    sort: 0,
+    is_show: 1,
+    abstract: ''
+})
+
+const { removeTab } = useMultipleTabs()
+const formRef = shallowRef<FormInstance>()
+const rules = reactive({
+    title: [{ required: true, message: '请输入文章标题', trigger: 'blur' }],
+    cid: [{ required: true, message: '请选择文章栏目', trigger: 'blur' }]
+})
+
+const getDetails = async () => {
+    const data = await articleDetail({
+        id: route.query.id
+    })
+    Object.keys(formData).forEach((key) => {
+        //@ts-ignore
+        formData[key] = data[key]
+    })
+}
+
+const { optionsData } = useDictOptions<{
+    article_cate: any[]
+}>({
+    article_cate: {
+        api: articleCateAll
+    }
+})
+
+const handleSave = async () => {
+    await formRef.value?.validate()
+    if (route.query.id) {
+        await articleEdit(formData)
+    } else {
+        await articleAdd(formData)
+    }
+    removeTab()
+    router.back()
+}
+
+route.query.id && getDetails()
+</script>
diff --git a/src/views/article/lists/index.vue b/src/views/article/lists/index.vue
new file mode 100644
index 0000000..23ba5b8
--- /dev/null
+++ b/src/views/article/lists/index.vue
@@ -0,0 +1,170 @@
+<template>
+    <div class="article-lists">
+        <el-card class="!border-none" shadow="never">
+            <el-form ref="formRef" class="mb-[-16px]" :model="queryParams" :inline="true">
+                <el-form-item label="文章标题">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.title"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="栏目名称">
+                    <el-select class="w-[280px]" v-model="queryParams.cid">
+                        <el-option label="全部" value />
+                        <el-option
+                            v-for="item in optionsData.article_cate"
+                            :key="item.id"
+                            :label="item.name"
+                            :value="item.id"
+                        />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="文章状态">
+                    <el-select class="w-[280px]" v-model="queryParams.is_show">
+                        <el-option label="全部" value />
+                        <el-option label="显示" :value="1" />
+                        <el-option label="隐藏" :value="0" />
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <div>
+                <router-link
+                    v-perms="['article.article/add', 'article.article/add:edit']"
+                    :to="{
+                        path: getRoutePath('article.article/add:edit')
+                    }"
+                >
+                    <el-button type="primary" class="mb-4">
+                        <template #icon>
+                            <icon name="el-icon-Plus" />
+                        </template>
+                        发布文章
+                    </el-button>
+                </router-link>
+            </div>
+            <el-table size="large" v-loading="pager.loading" :data="pager.lists">
+                <el-table-column label="ID" prop="id" min-width="80" />
+                <el-table-column label="封面" min-width="100">
+                    <template #default="{ row }">
+                        <image-contain
+                            v-if="row.image"
+                            :src="row.image"
+                            :width="60"
+                            :height="45"
+                            :preview-src-list="[row.image]"
+                            preview-teleported
+                            fit="contain"
+                        />
+                    </template>
+                </el-table-column>
+                <el-table-column
+                    label="标题"
+                    prop="title"
+                    min-width="160"
+                    show-tooltip-when-overflow
+                />
+                <el-table-column label="栏目" prop="cate_name" min-width="100" />
+                <el-table-column label="作者" prop="author" min-width="120" />
+                <el-table-column label="浏览量" prop="click" min-width="100" />
+                <el-table-column label="状态" min-width="100">
+                    <template #default="{ row }">
+                        <el-switch
+                            v-perms="['article.article/updateStatus']"
+                            v-model="row.is_show"
+                            :active-value="1"
+                            :inactive-value="0"
+                            @change="changeStatus($event, row.id)"
+                        />
+                    </template>
+                </el-table-column>
+                <el-table-column label="排序" prop="sort" min-width="100" />
+                <el-table-column label="发布时间" prop="create_time" min-width="120" />
+                <el-table-column label="操作" width="120" fixed="right">
+                    <template #default="{ row }">
+                        <el-button
+                            v-perms="['article.article/edit', 'article.article/add:edit']"
+                            type="primary"
+                            link
+                        >
+                            <router-link
+                                :to="{
+                                    path: getRoutePath('article.article/add:edit'),
+                                    query: {
+                                        id: row.id
+                                    }
+                                }"
+                            >
+                                编辑
+                            </router-link>
+                        </el-button>
+                        <el-button
+                            v-perms="['article.article/delete']"
+                            type="danger"
+                            link
+                            @click="handleDelete(row.id)"
+                        >
+                            删除
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup name="articleLists">
+import { articleLists, articleDelete, articleStatus, articleCateAll } from '@/api/article'
+import { useDictOptions } from '@/hooks/useDictOptions'
+import { usePaging } from '@/hooks/usePaging'
+import { getRoutePath } from '@/router'
+import feedback from '@/utils/feedback'
+const queryParams = reactive({
+    title: '',
+    cid: '',
+    is_show: ''
+})
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: articleLists,
+    params: queryParams
+})
+
+const { optionsData } = useDictOptions<{
+    article_cate: any[]
+}>({
+    article_cate: {
+        api: articleCateAll
+    }
+})
+
+const changeStatus = async (is_show: any, id: number) => {
+    try {
+        await articleStatus({ id, is_show })
+        getLists()
+    } catch (error) {
+        getLists()
+    }
+}
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await articleDelete({ id })
+    getLists()
+}
+
+onActivated(() => {
+    getLists()
+})
+
+getLists()
+</script>
diff --git a/src/views/channel/h5.vue b/src/views/channel/h5.vue
new file mode 100644
index 0000000..ec92552
--- /dev/null
+++ b/src/views/channel/h5.vue
@@ -0,0 +1,65 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert type="warning" title="温馨提示：H5设置" :closable="false" show-icon />
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <el-form ref="formRef" :model="formData" label-width="120px">
+                <el-form-item label="渠道状态" required prop="status">
+                    <div>
+                        <el-radio-group v-model="formData.status">
+                            <el-radio :label="1">开启</el-radio>
+                            <el-radio :label="0">关闭</el-radio>
+                        </el-radio-group>
+                        <div class="form-tips">状态为关闭时，将不对外提供服务，请谨慎操作</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="关闭后访问页面" prop="page_status">
+                    <el-radio-group v-model="formData.page_status">
+                        <el-radio :label="0">空页面</el-radio>
+                        <el-radio :label="1">自定义链接</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="" prop="page_url" v-if="formData.page_status == 1">
+                    <div class="w-80">
+                        <el-input v-model="formData.page_url" placeholder="请输入完整的url" />
+                    </div>
+                </el-form-item>
+                <el-form-item label="访问链接">
+                    <div class="flex-1 min-w-0 break-words">
+                        {{ formData.url }}
+                        <el-button v-copy="formData.url">复制</el-button>
+                    </div>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <footer-btns v-perms="['channel.web_page_setting/setConfig']">
+            <el-button type="primary" @click="handelSave">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+<script lang="ts" setup name="h5Config">
+import { getH5Config, setH5Config } from '@/api/channel/h5'
+
+const formData = reactive({
+    status: 0,
+    page_status: 0,
+    page_url: '',
+    url: ''
+})
+
+const getDetail = async () => {
+    const data = await getH5Config()
+    for (const key in formData) {
+        //@ts-ignore
+        formData[key] = data[key]
+    }
+}
+
+const handelSave = async () => {
+    await setH5Config(formData)
+    getDetail()
+}
+
+getDetail()
+</script>
diff --git a/src/views/channel/open_setting.vue b/src/views/channel/open_setting.vue
new file mode 100644
index 0000000..5b99d4c
--- /dev/null
+++ b/src/views/channel/open_setting.vue
@@ -0,0 +1,75 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：填写微信开放平台开发配置，请前往微信开放平台创建应用并完成认证；网站应用配置主要用于网站微信登录和微信支付"
+                :closable="false"
+                show-icon
+            />
+        </el-card>
+        <el-form ref="formRef" :model="formData" :rules="formRules" label-width="160px">
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">网站应用</div>
+                <el-form-item label="AppID" prop="app_id">
+                    <div class="w-80">
+                        <el-input v-model="formData.app_id" placeholder="请输入AppID" />
+                    </div>
+                </el-form-item>
+                <el-form-item label="AppSecret" prop="app_secret">
+                    <div>
+                        <div class="w-80">
+                            <el-input v-model="formData.app_secret" placeholder="请输入AppSecret" />
+                        </div>
+                    </div>
+                </el-form-item>
+            </el-card>
+        </el-form>
+        <footer-btns v-perms="['channel.open_setting/setConfig']">
+            <el-button type="primary" @click="handelSave">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+<script lang="ts" setup name="wxDevConfig">
+import { getOpenSettingConfig, setOpenSettingConfig } from '@/api/channel/open_setting'
+import type { FormInstance } from 'element-plus'
+
+const formData = reactive({
+    app_id: '',
+    app_secret: ''
+})
+
+const formRef = shallowRef<FormInstance>()
+const formRules = {
+    app_id: [
+        {
+            required: true,
+            message: '请输入AppID',
+            trigger: ['blur', 'change']
+        }
+    ],
+    app_secret: [
+        {
+            required: true,
+            message: '请输入AppSecret',
+            trigger: ['blur', 'change']
+        }
+    ]
+}
+
+const getDetail = async () => {
+    const data = await getOpenSettingConfig()
+    for (const key in formData) {
+        //@ts-ignore
+        formData[key] = data[key]
+    }
+}
+
+const handelSave = async () => {
+    await formRef.value?.validate()
+    await setOpenSettingConfig(formData)
+    getDetail()
+}
+
+getDetail()
+</script>
diff --git a/src/views/channel/weapp.vue b/src/views/channel/weapp.vue
new file mode 100644
index 0000000..d3a436e
--- /dev/null
+++ b/src/views/channel/weapp.vue
@@ -0,0 +1,198 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：填写微信小程序开发配置，请前往微信公众平台申请小程序并完成认证"
+                :closable="false"
+                show-icon
+            />
+        </el-card>
+        <el-form
+            ref="formRef"
+            :model="formData"
+            :rules="formRules"
+            :label-width="appStore.isMobile ? '80px' : '160px'"
+        >
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">微信小程序</div>
+                <el-form-item label="小程序名称" prop="name">
+                    <div class="w-80">
+                        <el-input v-model="formData.name" placeholder="请输入小程序名称" />
+                    </div>
+                </el-form-item>
+                <el-form-item label="原始ID" prop="original_id">
+                    <div class="w-80">
+                        <el-input v-model="formData.original_id" placeholder="请输入原始ID" />
+                    </div>
+                </el-form-item>
+                <el-form-item label="小程序码" prop="qr_code">
+                    <div class="flex-1">
+                        <div>
+                            <material-picker v-model="formData.qr_code" :limit="1" />
+                        </div>
+                        <div class="form-tips">建议尺寸：宽400px*高400px。jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+            </el-card>
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">开发者ID</div>
+                <el-form-item label="AppID" prop="app_id">
+                    <div class="w-80">
+                        <el-input v-model="formData.app_id" placeholder="请输入AppID" />
+                    </div>
+                </el-form-item>
+                <el-form-item label="AppSecret" prop="app_secret">
+                    <div class="w-80">
+                        <el-input v-model="formData.app_secret" placeholder="请输入AppSecret" />
+                    </div>
+                </el-form-item>
+                <el-form-item>
+                    <div class="form-tips">
+                        小程序账号登录微信公众平台，点击开发>开发设置->开发者ID，设置AppID和AppSecret
+                    </div>
+                </el-form-item>
+            </el-card>
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">服务器域名</div>
+                <el-form-item label="request合法域名" prop="appId">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.request_domain" disabled />
+                            </div>
+                            <el-button v-copy="formData.request_domain">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            小程序账号登录微信公众平台，点击开发>开发设置->服务器域名，填写https协议域名
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="socket合法域名">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.socket_domain" disabled />
+                            </div>
+                            <el-button v-copy="formData.socket_domain">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            小程序账号登录微信公众平台，点击开发>开发设置->服务器域名，填写wss协议域名
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="uploadFile合法域名">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.upload_file_domain" disabled />
+                            </div>
+                            <el-button v-copy="formData.upload_file_domain">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            小程序账号登录微信公众平台，点击开发>开发设置->服务器域名，填写https协议域名
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="downloadFile合法域名">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.download_file_domain" disabled />
+                            </div>
+                            <el-button v-copy="formData.download_file_domain">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            小程序账号登录微信公众平台，点击开发>开发设置->服务器域名，填写https协议域名
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="udp合法域名">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.udp_domain" disabled />
+                            </div>
+                            <el-button v-copy="formData.udp_domain">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            小程序账号登录微信公众平台，点击开发>开发设置->服务器域名，填写udp协议域名
+                        </div>
+                    </div>
+                </el-form-item>
+            </el-card>
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">业务域名</div>
+                <el-form-item label="业务域名">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.business_domain" disabled />
+                            </div>
+                            <el-button v-copy="formData.business_domain">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            小程序账号登录微信公众平台，点击开发>开发设置->业务域名，填写业务域名
+                        </div>
+                    </div>
+                </el-form-item>
+            </el-card>
+        </el-form>
+        <footer-btns v-perms="['channel.mnp_settings/setConfig']">
+            <el-button type="primary" @click="handelSave">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+<script lang="ts" setup name="weappConfig">
+import { getWeappConfig, setWeappConfig } from '@/api/channel/weapp'
+import useAppStore from '@/stores/modules/app'
+import type { FormInstance } from 'element-plus'
+
+const appStore = useAppStore()
+const formData = reactive({
+    name: '',
+    original_id: '',
+    qr_code: '',
+    app_id: '',
+    app_secret: '',
+    business_domain: '',
+    download_file_domain: '',
+    request_domain: '',
+    socket_domain: '',
+    tcpDomain: '',
+    udp_domain: '',
+    upload_file_domain: ''
+})
+const formRef = shallowRef<FormInstance>()
+const formRules = {
+    app_id: [
+        {
+            required: true,
+            message: '请输入AppID',
+            trigger: ['blur', 'change']
+        }
+    ],
+    app_secret: [
+        {
+            required: true,
+            message: '请输入AppSecret',
+            trigger: ['blur', 'change']
+        }
+    ]
+}
+const getDetail = async () => {
+    const data = await getWeappConfig()
+    for (const key in formData) {
+        //@ts-ignore
+        formData[key] = data[key]
+    }
+}
+
+const handelSave = async () => {
+    await formRef.value?.validate()
+    await setWeappConfig(formData)
+    getDetail()
+}
+
+getDetail()
+</script>
diff --git a/src/views/channel/wx_oa/config.vue b/src/views/channel/wx_oa/config.vue
new file mode 100644
index 0000000..ed7b6f5
--- /dev/null
+++ b/src/views/channel/wx_oa/config.vue
@@ -0,0 +1,215 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：填写微信公众号开发配置，请前往微信公众平台申请服务号并完成认证"
+                :closable="false"
+                show-icon
+            />
+        </el-card>
+        <el-form
+            ref="formRef"
+            :model="formData"
+            :rules="formRules"
+            :label-width="appStore.isMobile ? '80px' : '160px'"
+        >
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">微信公众号</div>
+                <el-form-item label="公众号名称" prop="name">
+                    <div class="w-80">
+                        <el-input v-model="formData.name" placeholder="请输入公众号名称" />
+                    </div>
+                </el-form-item>
+                <el-form-item label="原始ID" prop="original_id">
+                    <div class="w-80">
+                        <el-input v-model="formData.original_id" placeholder="请输入原始ID" />
+                    </div>
+                </el-form-item>
+                <el-form-item label="公众号二维码" prop="qr_code">
+                    <div>
+                        <div>
+                            <material-picker v-model="formData.qr_code" :limit="1" />
+                        </div>
+                        <div class="form-tips">建议尺寸：宽400px*高400px。jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+            </el-card>
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">公众号开发者信息</div>
+                <el-form-item label="AppID" prop="app_id">
+                    <div class="w-80">
+                        <el-input v-model="formData.app_id" placeholder="请输入AppID" />
+                    </div>
+                </el-form-item>
+                <el-form-item label="AppSecret" prop="app_secret">
+                    <div class="w-80">
+                        <el-input v-model="formData.app_secret" placeholder="请输入AppSecret" />
+                    </div>
+                </el-form-item>
+                <el-form-item>
+                    <div class="form-tips">
+                        小程序账号登录微信公众平台，点击开发>开发设置->开发者ID，设置AppID和AppSecret
+                    </div>
+                </el-form-item>
+            </el-card>
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">服务器配置</div>
+                <el-form-item label="URL">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.url" disabled />
+                            </div>
+                            <el-button v-copy="formData.url">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            登录微信公众平台，点击开发>基本配置>服务器配置，填写服务器地址（URL）
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="Token" prop="Token">
+                    <div class="flex-1 min-w-0">
+                        <div class="w-80">
+                            <el-input v-model="formData.token" placeholder="请输入Token" />
+                        </div>
+                        <div class="form-tips">
+                            登录微信公众平台，点击开发>基本配置>服务器配置，设置令牌Token。不填默认为“likeshop”
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="EncodingAESKey" prop="encoding_aes_key">
+                    <div class="flex-1 min-w-0">
+                        <div class="w-80">
+                            <el-input
+                                v-model="formData.encoding_aes_key"
+                                placeholder="请输入EncodingAESKey"
+                            />
+                        </div>
+                        <div class="form-tips">
+                            消息加密密钥由43位字符组成，字符范围为A-Z,a-z,0-9
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="消息加密方式" required prop="encryption_type">
+                    <div class="flex-1 min-w-0">
+                        <el-radio-group
+                            class="flex-col !items-start min-w-0"
+                            v-model="formData.encryption_type"
+                        >
+                            <el-radio :label="1">
+                                明文模式 (不使用消息体加解密功能，安全系数较低)
+                            </el-radio>
+
+                            <el-radio :label="2">
+                                兼容模式 (明文、密文将共存，方便开发者调试和维护)
+                            </el-radio>
+                            <el-radio :label="3">
+                                安全模式（推荐） (消息包为纯密文，需要开发者加密和解密，安全系数高)
+                            </el-radio>
+                        </el-radio-group>
+                    </div>
+                </el-form-item>
+            </el-card>
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">功能设置</div>
+                <el-form-item label="业务域名">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.business_domain" disabled />
+                            </div>
+                            <el-button v-copy="formData.business_domain">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            登录微信公众平台，点击设置>公众号设置>功能设置，填写业务域名
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="JS接口安全域名">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.js_secure_domain" disabled />
+                            </div>
+                            <el-button v-copy="formData.js_secure_domain">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            登录微信公众平台，点击设置>公众号设置>功能设置，填写JS接口安全域名
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="网页授权域名">
+                    <div class="flex-1 min-w-0">
+                        <div class="sm:flex">
+                            <div class="mr-4 sm:w-80 flex">
+                                <el-input v-model="formData.web_auth_domain" disabled />
+                            </div>
+                            <el-button v-copy="formData.web_auth_domain">复制</el-button>
+                        </div>
+                        <div class="form-tips">
+                            登录微信公众平台，点击设置>公众号设置>功能设置，填写网页授权域名
+                        </div>
+                    </div>
+                </el-form-item>
+            </el-card>
+        </el-form>
+        <footer-btns v-perms="['channel.official_account_setting/setConfig']">
+            <el-button type="primary" @click="handelSave">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+<script lang="ts" setup name="wxOaConfig">
+import { getOaConfig, setOaConfig } from '@/api/channel/wx_oa'
+import useAppStore from '@/stores/modules/app'
+import type { FormInstance } from 'element-plus'
+const appStore = useAppStore()
+const formData = reactive({
+    name: '',
+    original_id: ' ',
+    qr_code: '',
+    app_id: '',
+    app_secret: '',
+    url: '',
+    token: '',
+    encoding_aes_key: '',
+    encryption_type: 1,
+    business_domain: '',
+    js_secure_domain: '',
+    web_auth_domain: ''
+})
+
+const formRef = shallowRef<FormInstance>()
+const formRules = {
+    app_id: [
+        {
+            required: true,
+            message: '请输入AppID',
+            trigger: ['blur', 'change']
+        }
+    ],
+    app_secret: [
+        {
+            required: true,
+            message: '请输入AppSecret',
+            trigger: ['blur', 'change']
+        }
+    ]
+}
+
+const getDetail = async () => {
+    const data = await getOaConfig()
+    for (const key in formData) {
+        //@ts-ignore
+        formData[key] = data[key]
+    }
+}
+
+const handelSave = async () => {
+    await formRef.value?.validate()
+    await setOaConfig(formData)
+    getDetail()
+}
+
+getDetail()
+</script>
diff --git a/src/views/channel/wx_oa/menu.vue b/src/views/channel/wx_oa/menu.vue
new file mode 100644
index 0000000..9adb884
--- /dev/null
+++ b/src/views/channel/wx_oa/menu.vue
@@ -0,0 +1,47 @@
+<script setup lang="ts" name="wxOaMenu">
+import OaPhone from './menu_com/oa-phone.vue'
+import OaAttr from './menu_com/oa-attr.vue'
+import { useMenuOa } from './menu_com/useMenuOa'
+
+const { getOaMenuFunc, handleSave, handlePublish } = useMenuOa(undefined)
+getOaMenuFunc()
+</script>
+
+<template>
+    <div class="menu-oa">
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="配置微信公众号菜单，点击确认，保存菜单并发布至微信公众号"
+                :closable="false"
+                show-icon
+            />
+        </el-card>
+
+        <el-card class="!border-none mt-4" shadow="never">
+            <div class="lg:flex flex-1">
+                <!-- Phone -->
+                <oa-phone></oa-phone>
+
+                <!-- Attr -->
+                <div class="mt-4 lg:mt-0 max-w-[400px]">
+                    <oa-attr></oa-attr>
+                </div>
+            </div>
+        </el-card>
+
+        <footer-btns>
+            <el-button type="primary" @click="handleSave" v-perms="['channel:oaMenu:save']">
+                保存
+            </el-button>
+            <el-button type="primary" @click="handlePublish" v-perms="['channel:oaMenu:publish']">
+                发布
+            </el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.menu-oa {
+}
+</style>
diff --git a/src/views/channel/wx_oa/menu_com/oa-attr.vue b/src/views/channel/wx_oa/menu_com/oa-attr.vue
new file mode 100644
index 0000000..2e8a024
--- /dev/null
+++ b/src/views/channel/wx_oa/menu_com/oa-attr.vue
@@ -0,0 +1,90 @@
+<script lang="ts" setup>
+import { useMenuOa } from './useMenuOa'
+import oaMenuForm from './oa-menu-form.vue'
+import oaMenuFormEdit from './oa-menu-form-edit.vue'
+
+const menuRef = shallowRef()
+
+const {
+    menuList,
+    menuIndex,
+    handleAddSubMenu,
+    handleEditSubMenu,
+    handleDelMenu,
+    handleDelSubMenu
+} = useMenuOa(menuRef)
+</script>
+
+<template>
+    <!-- Attr -->
+    <template v-for="(attrItem, attrIndex) in menuList" :key="attrIndex">
+        <div class="flex-1 oa-attr min-w-0" v-show="attrIndex === menuIndex">
+            <div class="text-base oa-attr-title">菜单配置</div>
+
+            <del-wrap @close="handleDelMenu(menuIndex)">
+                <div class="flex items-center w-full p-4 mt-4 rounded bg-fill-light">
+                    <oa-menu-form
+                        ref="menuRef"
+                        modular="master"
+                        v-model:name="attrItem.name"
+                        v-model:menuType="attrItem.has_menu"
+                        v-model:visitType="attrItem.type"
+                        v-model:url="attrItem.url"
+                        v-model:appId="attrItem.appid"
+                        v-model:pagePath="attrItem.pagepath"
+                    >
+                        <div class="flex-1">
+                            <!-- 编辑子菜单 -->
+                            <ul>
+                                <li
+                                    class="flex"
+                                    v-for="(subItem, subIndex) in attrItem.sub_button"
+                                    :key="subIndex"
+                                    style="padding: 8px"
+                                >
+                                    <span class="mr-auto">{{ subItem.name }}</span>
+                                    <!-- 编辑子菜单 -->
+                                    <oa-menu-form-edit
+                                        modular="edit"
+                                        :subItem="subItem"
+                                        @edit="handleEditSubMenu($event, subIndex)"
+                                    >
+                                        <el-button link>
+                                            <el-icon><EditPen /></el-icon>
+                                        </el-button>
+                                    </oa-menu-form-edit>
+
+                                    <!-- 删除子菜单 -->
+                                    <popup @confirm="handleDelSubMenu(menuIndex, subIndex)">
+                                        是否删除当前子菜单？
+                                        <template #trigger>
+                                            <el-button link>
+                                                <el-icon class="ml-5"><Delete /></el-icon>
+                                            </el-button>
+                                        </template>
+                                    </popup>
+                                </li>
+                            </ul>
+
+                            <!-- 新增子菜单 -->
+                            <oa-menu-form-edit modular="add" @add="handleAddSubMenu">
+                                <el-button
+                                    type="primary"
+                                    link
+                                    :disabled="attrItem.sub_button.length >= 5"
+                                >
+                                    添加子菜单({{ attrItem.sub_button.length }}/5)
+                                </el-button>
+                            </oa-menu-form-edit>
+                        </div>
+                    </oa-menu-form>
+                </div>
+            </del-wrap>
+        </div>
+    </template>
+</template>
+
+<style lang="scss" scoped>
+.oa-attr {
+}
+</style>
diff --git a/src/views/channel/wx_oa/menu_com/oa-menu-form-edit.vue b/src/views/channel/wx_oa/menu_com/oa-menu-form-edit.vue
new file mode 100644
index 0000000..a455134
--- /dev/null
+++ b/src/views/channel/wx_oa/menu_com/oa-menu-form-edit.vue
@@ -0,0 +1,73 @@
+<script lang="ts" setup>
+import oaMenuForm from './oa-menu-form.vue'
+
+const emit = defineEmits<{
+    (event: 'add', value: any): void
+    (event: 'edit', value: any): void
+}>()
+
+const props = withDefaults(
+    defineProps<{
+        modular: string
+        subItem?: any
+    }>(),
+    {
+        modular: 'edit',
+        subItem: {}
+    }
+)
+
+const menuFormEditRef = shallowRef()
+const menuFromPopupRef = shallowRef()
+
+const form = {
+    name: '',
+    type: 'view',
+    url: '',
+    appid: '',
+    pagepath: ''
+}
+
+watchEffect(() => {
+    if (Object.keys(props.subItem).length != 0) {
+        for (const key in form) {
+            //@ts-ignore
+            form[key] = props.subItem[key]
+        }
+    }
+})
+
+const handleRules = async () => {
+    await menuFormEditRef.value.menuFormRef.validate()
+    if (props.modular === 'edit') {
+        emit('edit', { ...form })
+    } else {
+        emit('add', { ...form })
+    }
+    menuFromPopupRef.value.close()
+    menuFormEditRef.value.menuFormRef.resetFields()
+}
+</script>
+
+<template>
+    <popup
+        ref="menuFromPopupRef"
+        async
+        :clickModalClose="false"
+        :title="`${modular === 'add' ? '新增' : '编辑'}子菜单`"
+        @confirm="handleRules"
+    >
+        <oa-menu-form
+            ref="menuFormEditRef"
+            modular="secondary"
+            v-model:name="form.name"
+            v-model:visitType="form.type"
+            v-model:url="form.url"
+            v-model:appId="form.appid"
+            v-model:pagePath="form.pagepath"
+        ></oa-menu-form>
+        <template #trigger>
+            <slot></slot>
+        </template>
+    </popup>
+</template>
diff --git a/src/views/channel/wx_oa/menu_com/oa-menu-form.vue b/src/views/channel/wx_oa/menu_com/oa-menu-form.vue
new file mode 100644
index 0000000..3e456a6
--- /dev/null
+++ b/src/views/channel/wx_oa/menu_com/oa-menu-form.vue
@@ -0,0 +1,108 @@
+<template>
+    <el-form ref="menuFormRef" :rules="rules" :model="menuForm" label-width="100px">
+        <!-- 菜单名称 -->
+        <el-form-item :label="modular === 'master' ? '主菜单名称' : '子菜单名称'" prop="name">
+            <el-input v-model="menuForm.name" />
+        </el-form-item>
+
+        <!-- 菜单类型 -->
+        <el-form-item label="主菜单类型" prop="menuType" v-if="modular === 'master'">
+            <el-radio-group v-model="menuForm.menuType">
+                <el-radio :label="false">不配置子菜单</el-radio>
+                <el-radio :label="true">配置子菜单</el-radio>
+            </el-radio-group>
+        </el-form-item>
+        <el-form-item label="" v-if="menuForm.menuType && modular === 'master'">
+            <slot></slot>
+        </el-form-item>
+
+        <template v-if="!menuForm.menuType">
+            <!-- 跳转链接 -->
+            <el-form-item label="跳转链接" prop="visitType">
+                <el-radio-group v-model="menuForm.visitType">
+                    <el-radio label="view">网页</el-radio>
+                    <el-radio label="miniprogram">小程序</el-radio>
+                </el-radio-group>
+            </el-form-item>
+
+            <!-- 网址 -->
+            <el-form-item label="网址" prop="url">
+                <el-input v-model="menuForm.url" />
+            </el-form-item>
+
+            <template v-if="menuForm.visitType == 'miniprogram'">
+                <!-- AppId -->
+                <el-form-item label="AppId" prop="appId">
+                    <el-input v-model="menuForm.appId" />
+                </el-form-item>
+
+                <!-- 路径 -->
+                <el-form-item label="路径" prop="pagePath">
+                    <el-input v-model="menuForm.pagePath" />
+                </el-form-item>
+            </template>
+        </template>
+    </el-form>
+</template>
+
+<script lang="ts" setup>
+import { rules } from './useMenuOa'
+import type { FormInstance } from 'element-plus'
+
+const emit = defineEmits([
+    'update:name',
+    'update:menuType',
+    'update:visitType',
+    'update:url',
+    'update:appId',
+    'update:pagePath'
+])
+
+const props = withDefaults(
+    defineProps<{
+        modular?: string
+        name?: string
+        menuType?: boolean
+        visitType?: string
+        url?: string
+        appId?: string
+        pagePath?: string
+    }>(),
+    {
+        modular: 'master',
+        name: '',
+        menuType: false,
+        visitType: 'view',
+        url: '',
+        appId: '',
+        pagePath: ''
+    }
+)
+
+const menuFormRef = shallowRef<FormInstance>()
+// 表单数据
+const menuForm = ref({ ...props })
+
+watch(
+    () => props,
+    (value) => {
+        menuForm.value = value
+    },
+    { immediate: true }
+)
+
+watchEffect(() => {
+    if (props.modular === 'master') {
+        emit('update:menuType', menuForm.value.menuType)
+    }
+    emit('update:name', menuForm.value.name)
+    emit('update:visitType', menuForm.value.visitType)
+    emit('update:url', menuForm.value.url)
+    emit('update:appId', menuForm.value.appId)
+    emit('update:pagePath', menuForm.value.pagePath)
+})
+
+defineExpose({
+    menuFormRef
+})
+</script>
diff --git a/src/views/channel/wx_oa/menu_com/oa-phone.vue b/src/views/channel/wx_oa/menu_com/oa-phone.vue
new file mode 100644
index 0000000..0d82849
--- /dev/null
+++ b/src/views/channel/wx_oa/menu_com/oa-phone.vue
@@ -0,0 +1,121 @@
+<script lang="ts" setup>
+import { useMenuOa } from './useMenuOa'
+import useSettingStore from '@/stores/modules/setting'
+
+// 菜单颜色（这里采用全局颜色）
+const settingStore = useSettingStore()
+const themeColor = computed(() => settingStore.theme || '#4A5DFF')
+
+const { menuList, menuIndex, handleAddMenu } = useMenuOa(useMenuOa)
+</script>
+
+<template>
+    <!-- Phone -->
+    <div class="oa-phone mr-[35px]">
+        <div class="oa-phone-content"></div>
+
+        <div class="flex oa-phone-menu">
+            <div class="flex items-center justify-center oa-phone-menu-switch">
+                <el-icon>
+                    <Grid />
+                </el-icon>
+            </div>
+
+            <template v-for="(menuItem, i) in menuList" :key="i">
+                <div class="relative flex-1" @click="menuIndex = i">
+                    <!-- 一级菜单 -->
+                    <div
+                        class="flex items-center justify-center flex-1 text-sm oa-phone-menu-item"
+                        :class="{ 'active-menu': menuIndex === i }"
+                    >
+                        {{ menuItem.name }}
+                    </div>
+
+                    <!-- 二级菜单 -->
+                    <div
+                        class="oa-phone-menu-subitem"
+                        v-show="menuItem.sub_button.length && menuItem.has_menu"
+                    >
+                        <template v-for="(subItem, index2) in menuItem.sub_button" :key="index2">
+                            <div class="oa-phone-menu-subitem-title">
+                                {{ subItem.name }}
+                            </div>
+                        </template>
+                    </div>
+                </div>
+            </template>
+            <!-- 新增菜单 -->
+            <template v-if="menuList.length <= 2">
+                <div class="flex items-center justify-center flex-1 h-full" @click="handleAddMenu">
+                    <el-icon>
+                        <Plus />
+                    </el-icon>
+                </div>
+            </template>
+        </div>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.oa-phone {
+    width: 260px;
+    height: 461px;
+    border: 1px solid #e5e5ea;
+    flex: none;
+    &-content {
+        height: 420px;
+        border-bottom: 1px solid #e5e5ea;
+    }
+
+    &-menu {
+        height: 40px;
+        cursor: pointer;
+
+        &-switch {
+            width: 40px;
+            height: 100%;
+            border-right: 1px solid #e5e5ea;
+        }
+
+        // 一级菜单
+        &-item {
+            height: 100%;
+            border-right: 1px solid #e5e5ea;
+        }
+
+        &-item:nth-child(4) {
+            border-right: none;
+        }
+
+        .active-menu {
+            position: relative;
+        }
+
+        .active-menu::after {
+            content: '';
+            width: 100%;
+            height: 41px;
+            top: -1px;
+            position: absolute;
+            border: 1px solid v-bind(themeColor);
+        }
+
+        // 二级菜单
+        &-subitem {
+            width: 98%;
+            left: 2px;
+            bottom: calc(100% + 10px);
+            position: absolute;
+            border: 1px solid #e5e5ea;
+            border-top: none;
+
+            &-title {
+                height: 40px;
+                line-height: 40px;
+                text-align: center;
+                border-top: 1px solid #e5e5ea;
+            }
+        }
+    }
+}
+</style>
diff --git a/src/views/channel/wx_oa/menu_com/useMenuOa.ts b/src/views/channel/wx_oa/menu_com/useMenuOa.ts
new file mode 100644
index 0000000..e536e1d
--- /dev/null
+++ b/src/views/channel/wx_oa/menu_com/useMenuOa.ts
@@ -0,0 +1,165 @@
+import { ref } from 'vue'
+import feedback from '@/utils/feedback'
+import type { FormRules } from 'element-plus'
+import { setOaMenuSave, getOaMenu, setOaMenuPublish } from '@/api/channel/wx_oa'
+import type { Menu } from '@/api/channel/wx_oa'
+
+// 菜单实例
+export const menuRef = shallowRef()
+// 菜单数据
+const menuList = ref<Menu[]>([])
+const menuIndex = ref<number>(0)
+
+// 校验
+export const rules = reactive<FormRules>({
+    name: [
+        {
+            required: true,
+            message: '必填项不能为空',
+            trigger: ['blur', 'change']
+        },
+        {
+            min: 1,
+            max: 12,
+            message: '长度限制12个字符',
+            trigger: ['blur', 'change']
+        }
+    ],
+    menuType: [
+        {
+            required: true,
+            message: '必填项不能为空',
+            trigger: ['blur', 'change']
+        }
+    ],
+    visitType: [
+        {
+            required: true,
+            message: '必填项不能为空',
+            trigger: ['blur', 'change']
+        }
+    ],
+    url: [
+        {
+            required: true,
+            message: '必填项不能为空',
+            trigger: ['blur', 'change']
+        },
+        {
+            pattern:
+                /(http|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/,
+            message: '请输入合法的网址链接',
+            trigger: ['blur', 'change']
+        }
+    ],
+    appId: [
+        {
+            required: true,
+            message: '必填项不能为空',
+            trigger: ['blur', 'change']
+        }
+    ],
+    pagePath: [
+        {
+            required: true,
+            message: '必填项不能为空',
+            trigger: ['blur', 'change']
+        }
+    ]
+})
+
+export const useMenuOa = (ref: any) => {
+    if (ref) menuRef.value = ref
+
+    // 添加主菜单
+    const handleAddMenu = () => {
+        menuList.value.push({
+            name: '菜单名称',
+            has_menu: false,
+            type: 'view',
+            url: '',
+            appid: '',
+            pagepath: '',
+            sub_button: []
+        })
+    }
+
+    // 添加子菜单
+    const handleAddSubMenu = (event?: Menu) => {
+        const index = menuIndex.value
+        if (menuList.value[index].sub_button.length >= 5) {
+            feedback.msgError('已添加上限～')
+            return
+        }
+        menuList.value[index].sub_button.push(event)
+    }
+
+    // 编辑子菜单
+    const handleEditSubMenu = (event: Menu, subIndex: number) => {
+        const index = menuIndex.value
+        menuList.value[index].sub_button[subIndex] = event
+    }
+
+    // 删除主菜单
+    const handleDelMenu = (index: number) => {
+        if (index != 0) {
+            menuIndex.value--
+        }
+        menuList.value.splice(index, 1)
+    }
+
+    // 删除子菜单
+    const handleDelSubMenu = (index: number, subIndex: number) => {
+        menuList.value[index].sub_button.splice(subIndex, 1)
+    }
+
+    // 获取菜单
+    const getOaMenuFunc = async () => {
+        try {
+            menuList.value = await getOaMenu()
+        } catch (error) {
+            console.log('获取菜单=>', error)
+        }
+    }
+
+    // 保存菜单
+    const handleSave = async () => {
+        const refs = menuRef.value.value
+        for (let i = 0; i < refs.length; i++) {
+            try {
+                await refs[i].menuFormRef.validate()
+            } catch (error) {
+                menuIndex.value = i
+                return
+            }
+        }
+        await setOaMenuSave(menuList.value)
+    }
+
+    // 保存菜单
+    const handlePublish = async () => {
+        const refs = menuRef.value.value
+        for (let i = 0; i < refs.length; i++) {
+            try {
+                await refs[i].menuFormRef.validate()
+            } catch (error) {
+                menuIndex.value = i
+                return
+            }
+        }
+        await setOaMenuPublish(menuList.value)
+    }
+
+    return {
+        menuList,
+        menuIndex,
+        handleAddMenu,
+        handleAddSubMenu,
+        handleEditSubMenu,
+        handleDelMenu,
+        handleDelSubMenu,
+        getOaMenuFunc,
+        handleSave,
+        handlePublish
+    }
+}
diff --git a/src/views/channel/wx_oa/reply/default_reply.vue b/src/views/channel/wx_oa/reply/default_reply.vue
new file mode 100644
index 0000000..42e2c92
--- /dev/null
+++ b/src/views/channel/wx_oa/reply/default_reply.vue
@@ -0,0 +1,109 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：1.粉丝在公众号发送内容时，系统无法匹配情况下发送启用的默认文本回复；2.同时只能启用一个默认回复。"
+                :closable="false"
+                show-icon
+            />
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <div>
+                <el-button class="mb-4" type="primary" @click="handleAdd()">
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+            </div>
+            <el-table size="large" :data="pager.lists" v-loading="pager.loading">
+                <el-table-column label="规则名称" prop="name" min-width="120" />
+                <el-table-column label="回复类型" min-width="120">
+                    <template #default="{ row }">
+                        {{ getContentType(row.content_type) }}
+                    </template>
+                </el-table-column>
+                <el-table-column label="回复内容" prop="content" min-width="120" />
+                <el-table-column label="状态" min-width="120">
+                    <template #default="{ row }">
+                        <el-switch
+                            v-model="row.status"
+                            :active-value="1"
+                            :inactive-value="0"
+                            @change="changeStatus(row.id)"
+                        />
+                    </template>
+                </el-table-column>
+                <el-table-column label="排序" prop="sort" min-width="120" />
+                <el-table-column label="操作" width="120" fixed="right">
+                    <template #default="{ row }">
+                        <el-button type="primary" link @click="handleEdit(row)"> 编辑 </el-button>
+                        <el-button type="danger" link @click="handleDelete(row.id)">
+                            删除
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+<script lang="ts" setup>
+import { oaReplyDel, getOaReplyList, changeOaReplyStatus } from '@/api/channel/wx_oa'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const showEdit = ref(false)
+
+const getContentType = computed(() => {
+    return (val: number) => {
+        switch (val) {
+            case 1:
+                return '文本'
+        }
+    }
+})
+
+const { pager, getLists } = usePaging({
+    fetchFun: getOaReplyList,
+    params: {
+        reply_type: 3
+    }
+})
+
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add', 1)
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit', 1)
+    editRef.value?.getDetail(data)
+}
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await oaReplyDel({ id })
+    feedback.msgSuccess('删除成功')
+    getLists()
+}
+
+const changeStatus = async (id: number) => {
+    try {
+        await changeOaReplyStatus({ id })
+        getLists()
+    } catch (error) {
+        getLists()
+    }
+}
+
+getLists()
+</script>
diff --git a/src/views/channel/wx_oa/reply/edit.vue b/src/views/channel/wx_oa/reply/edit.vue
new file mode 100644
index 0000000..38a07eb
--- /dev/null
+++ b/src/views/channel/wx_oa/reply/edit.vue
@@ -0,0 +1,189 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="500px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form
+                ref="formRef"
+                :model="formData"
+                label-width="84px"
+                :rules="formRules"
+                class="pr-10"
+            >
+                <el-form-item label="规则名称" prop="name">
+                    <div class="flex-1">
+                        <el-input v-model="formData.name" placeholder="请输入规则名称" />
+                        <div class="form-tips">方便通过名称管理关注回复内容</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="关键词" prop="keyword" v-if="formData.reply_type == 2">
+                    <div class="flex-1">
+                        <el-input v-model="formData.keyword" placeholder="请输入关键词" />
+                        <div class="form-tips">方便通过名称管理关注回复内容</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="匹配方式" prop="matching_type" v-if="formData.reply_type == 2">
+                    <div class="flex-1">
+                        <el-radio-group v-model="formData.matching_type">
+                            <el-radio :label="1">全匹配</el-radio>
+                            <el-radio :label="2">模糊匹配</el-radio>
+                        </el-radio-group>
+                        <div class="form-tips">模糊匹配时，关键词部分匹配用户输入的内容即可</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="回复类型" prop="content_type" :min="0">
+                    <div class="flex-1">
+                        <el-radio-group v-model="formData.content_type">
+                            <el-radio :label="1">文本</el-radio>
+                        </el-radio-group>
+                        <div class="form-tips">暂时只支持文本类型</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="回复内容" prop="content">
+                    <div class="flex-1">
+                        <el-input
+                            v-model="formData.content"
+                            :autosize="{ minRows: 4, maxRows: 4 }"
+                            type="textarea"
+                            maxlength="200"
+                            show-word-limit
+                            placeholder="请输入回复内容"
+                        />
+                    </div>
+                </el-form-item>
+                <el-form-item label="排序">
+                    <div class="flex-1">
+                        <el-input-number v-model="formData.sort" :min="0" :max="9999" />
+                    </div>
+                </el-form-item>
+                <el-form-item
+                    label="回复数量"
+                    prop="reply_num"
+                    required
+                    v-if="formData.reply_type == 2"
+                >
+                    <div class="flex-1">
+                        <el-radio-group v-model="formData.reply_num">
+                            <el-radio :label="1">回复匹配首词条</el-radio>
+                        </el-radio-group>
+                        <div class="form-tips">
+                            设置关键词匹配多条时回复的数量，暂时支持回复一条内容
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="启用状态">
+                    <el-switch v-model="formData.status" :active-value="1" :inactive-value="0" />
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import { oaReplyEdit, oaReplyAdd, getOaReplyDetail } from '@/api/channel/wx_oa'
+import Popup from '@/components/popup/index.vue'
+import type { FormRules } from 'element-plus'
+
+const emit = defineEmits(['success', 'close'])
+
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑' : '新增'
+})
+const formData = reactive({
+    id: '',
+    name: '',
+    reply_type: 0,
+    content_type: 1,
+    keyword: '',
+    content: '',
+    matching_type: 1,
+    status: 1,
+    sort: 0,
+    reply_num: 1
+})
+
+const formRules: FormRules = {
+    name: [
+        {
+            required: true,
+            message: '请输入规则名称',
+            trigger: ['blur']
+        }
+    ],
+    keyword: [
+        {
+            required: true,
+            message: '请输入关键词',
+            trigger: ['blur']
+        }
+    ],
+    matching_type: [
+        {
+            required: true,
+            message: '请选择匹配方式',
+            trigger: ['blur']
+        }
+    ],
+    content_type: [
+        {
+            required: true,
+            message: '请选择回复类型',
+            trigger: ['blur']
+        }
+    ],
+    content: [
+        {
+            required: true,
+            message: '请输入回复内容',
+            trigger: ['blur']
+        }
+    ]
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    mode.value == 'edit' ? await oaReplyEdit(formData) : await oaReplyAdd(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const open = (modes = 'add', type = 0) => {
+    mode.value = modes
+    formData.reply_type = type
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+const getDetail = async (row: Record<string, any>) => {
+    const data = await getOaReplyDetail({
+        id: row.id
+    })
+    setFormData(data)
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+defineExpose({
+    open,
+    setFormData,
+    getDetail
+})
+</script>
diff --git a/src/views/channel/wx_oa/reply/follow_reply.vue b/src/views/channel/wx_oa/reply/follow_reply.vue
new file mode 100644
index 0000000..0d2e1b7
--- /dev/null
+++ b/src/views/channel/wx_oa/reply/follow_reply.vue
@@ -0,0 +1,108 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：1.粉丝关注公众号时，会自动发送启用的关注回复；2.同时只能启用一个关注回复。"
+                :closable="false"
+                show-icon
+            />
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <div>
+                <el-button class="mb-4" type="primary" @click="handleAdd()">
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+            </div>
+            <el-table size="large" :data="pager.lists" v-loading="pager.loading">
+                <el-table-column label="规则名称" prop="name" min-width="120" />
+                <el-table-column label="回复类型" min-width="120">
+                    <template #default="{ row }">
+                        {{ getContentType(row.content_type) }}
+                    </template>
+                </el-table-column>
+                <el-table-column label="回复内容" prop="content" min-width="120" />
+                <el-table-column label="状态" min-width="120">
+                    <template #default="{ row }">
+                        <el-switch
+                            v-model="row.status"
+                            :active-value="1"
+                            :inactive-value="0"
+                            @change="changeStatus(row.id)"
+                        />
+                    </template>
+                </el-table-column>
+                <el-table-column label="排序" prop="sort" min-width="120" />
+                <el-table-column label="操作" width="120" fixed="right">
+                    <template #default="{ row }">
+                        <el-button type="primary" link @click="handleEdit(row)"> 编辑 </el-button>
+                        <el-button type="danger" link @click="handleDelete(row.id)">
+                            删除
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+<script lang="ts" setup>
+import { oaReplyDel, getOaReplyList, changeOaReplyStatus } from '@/api/channel/wx_oa'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const showEdit = ref(false)
+
+const getContentType = computed(() => {
+    return (val: number) => {
+        switch (val) {
+            case 1:
+                return '文本'
+        }
+    }
+})
+
+const { pager, getLists } = usePaging({
+    fetchFun: getOaReplyList,
+    params: {
+        reply_type: 1
+    }
+})
+
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add', 1)
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit', 1)
+    editRef.value?.getDetail(data)
+}
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await oaReplyDel({ id })
+    getLists()
+}
+
+const changeStatus = async (id: number) => {
+    try {
+        await changeOaReplyStatus({ id })
+        getLists()
+    } catch (error) {
+        getLists()
+    }
+}
+
+getLists()
+</script>
diff --git a/src/views/channel/wx_oa/reply/keyword_reply.vue b/src/views/channel/wx_oa/reply/keyword_reply.vue
new file mode 100644
index 0000000..8a866e9
--- /dev/null
+++ b/src/views/channel/wx_oa/reply/keyword_reply.vue
@@ -0,0 +1,124 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：1.粉丝在公众号发送内容时，通过关键词可触发关键词回复；2.同时可启用多个关键词回复，有多条关键词匹配时优选选择排序靠前的一条"
+                :closable="false"
+                show-icon
+            />
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <div>
+                <el-button class="mb-4" type="primary" @click="handleAdd()">
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+            </div>
+            <el-table size="large" :data="pager.lists" v-loading="pager.loading">
+                <el-table-column label="规则名称" prop="name" min-width="120" />
+
+                <el-table-column label="关键词" prop="keyword" min-width="120" />
+                <el-table-column label="匹配方式" min-width="120">
+                    <template #default="{ row }">
+                        {{ getMatchingType(row.matching_type) }}
+                    </template>
+                </el-table-column>
+                <el-table-column label="回复类型" min-width="120">
+                    <template #default="{ row }">
+                        {{ getContentType(row.content_type) }}
+                    </template>
+                </el-table-column>
+                <el-table-column label="状态" min-width="120">
+                    <template #default="{ row }">
+                        <el-switch
+                            v-model="row.status"
+                            :active-value="1"
+                            :inactive-value="0"
+                            @change="changeStatus(row.id)"
+                        />
+                    </template>
+                </el-table-column>
+                <el-table-column label="排序" prop="sort" min-width="120" />
+                <el-table-column label="操作" width="120" fixed="right">
+                    <template #default="{ row }">
+                        <el-button type="primary" link @click="handleEdit(row)"> 编辑 </el-button>
+                        <el-button type="danger" link @click="handleDelete(row.id)">
+                            删除
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+<script lang="ts" setup>
+import { oaReplyDel, getOaReplyList, changeOaReplyStatus } from '@/api/channel/wx_oa'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const showEdit = ref(false)
+
+const getMatchingType = computed(() => {
+    return (val: number) => {
+        switch (val) {
+            case 1:
+                return '全匹配'
+            case 2:
+                return '模糊匹配'
+        }
+    }
+})
+
+const getContentType = computed(() => {
+    return (val: number) => {
+        switch (val) {
+            case 1:
+                return '文本'
+        }
+    }
+})
+
+const { pager, getLists } = usePaging({
+    fetchFun: getOaReplyList,
+    params: {
+        reply_type: 2
+    }
+})
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add', 2)
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit', 2)
+    editRef.value?.getDetail(data)
+}
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await oaReplyDel({ id })
+    getLists()
+}
+
+const changeStatus = async (id: number) => {
+    try {
+        await changeOaReplyStatus({ id })
+        getLists()
+    } catch (error) {
+        getLists()
+    }
+}
+
+getLists()
+</script>
diff --git a/src/views/consumer/components/account-adjust.vue b/src/views/consumer/components/account-adjust.vue
new file mode 100644
index 0000000..889cb3b
--- /dev/null
+++ b/src/views/consumer/components/account-adjust.vue
@@ -0,0 +1,104 @@
+<template>
+    <popup
+        ref="popupRef"
+        title="余额调整"
+        width="500px"
+        @confirm="handleConfirm"
+        :async="true"
+        @close="popupClose"
+    >
+        <div class="pr-8">
+            <el-form ref="formRef" :model="formData" label-width="120px" :rules="formRules">
+                <el-form-item label="当前余额">¥ {{ value }} </el-form-item>
+                <el-form-item label="余额增减" required prop="action">
+                    <el-radio-group v-model="formData.action">
+                        <el-radio :label="1">增加余额</el-radio>
+                        <el-radio :label="2">扣减余额</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="调整余额" prop="num">
+                    <el-input
+                        :model-value="formData.num"
+                        placeholder="请输入调整的金额"
+                        type="number"
+                        @input="numberValidate"
+                    />
+                </el-form-item>
+                <el-form-item label="调整后余额"> ¥ {{ adjustmentMoney }} </el-form-item>
+                <el-form-item label="备注" prop="remark">
+                    <el-input v-model="formData.remark" type="textarea" :rows="4" />
+                </el-form-item>
+            </el-form>
+        </div>
+    </popup>
+</template>
+<script lang="ts" setup>
+import Popup from '@/components/popup/index.vue'
+import type { FormInstance, FormRules } from 'element-plus'
+import feedback from '@/utils/feedback'
+const formRef = shallowRef<FormInstance>()
+const props = defineProps({
+    show: {
+        type: Boolean,
+        required: true
+    },
+    value: {
+        type: [Number, String],
+        required: true
+    }
+})
+const emit = defineEmits<{
+    (event: 'update:show', value: boolean): void
+    (event: 'confirm', value: any): void
+}>()
+const formData = reactive({
+    action: 1, //变动类型 1-增加 2-减少
+    num: '',
+    remark: ''
+})
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+
+const adjustmentMoney = computed(() => {
+    return Number(props.value) + Number(formData.num) * (formData.action == 1 ? 1 : -1)
+})
+
+const formRules: FormRules = {
+    num: [
+        {
+            required: true,
+            message: '请输入调整的金额'
+        }
+    ]
+}
+const numberValidate = (value: string) => {
+    if (value.includes('-')) {
+        return feedback.msgError('请输入正整数')
+    }
+    formData.num = value
+}
+const handleConfirm = async () => {
+    await formRef.value?.validate()
+    emit('confirm', formData)
+}
+
+const popupClose = () => {
+    emit('update:show', false)
+    formRef.value?.resetFields()
+}
+watch(
+    () => props.show,
+    (val) => {
+        if (val) {
+            popupRef.value?.open()
+        } else {
+            popupRef.value?.close()
+        }
+    }
+)
+watch(adjustmentMoney, (val) => {
+    if (val < 0) {
+        feedback.msgError('调整后余额需大于0')
+        formData.num = ''
+    }
+})
+</script>
diff --git a/src/views/consumer/lists/detail.vue b/src/views/consumer/lists/detail.vue
new file mode 100644
index 0000000..4d49e2a
--- /dev/null
+++ b/src/views/consumer/lists/detail.vue
@@ -0,0 +1,167 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-page-header content="用户详情" @back="$router.back()" />
+        </el-card>
+        <el-card class="mt-4 !border-none" header="基本资料" shadow="never">
+            <el-form ref="formRef" class="ls-form" :model="formData" label-width="120px">
+                <div class="bg-page flex py-5 mb-10 items-center">
+                    <div class="basis-40 flex flex-col justify-center items-center">
+                        <div class="mb-2 text-tx-regular">用户头像</div>
+                        <el-avatar :src="formData.avatar" :size="58" />
+                    </div>
+                    <div class="basis-40 flex flex-col justify-center items-center">
+                        <div class="text-tx-regular">账户余额</div>
+                        <div class="mt-2 flex items-center">
+                            ¥{{ formData.user_money }}
+                            <el-button
+                                v-perms="['user.user/adjustMoney']"
+                                type="primary"
+                                link
+                                @click="handleAdjust(formData.user_money)"
+                            >
+                                调整
+                            </el-button>
+                        </div>
+                    </div>
+                </div>
+                <el-form-item label="用户昵称：">
+                    {{ formData.nickname }}
+                </el-form-item>
+                <el-form-item label="账号：">
+                    {{ formData.account }}
+                    <popover-input
+                        class="ml-[10px]"
+                        @confirm="handleEdit($event, 'account')"
+                        :limit="32"
+                        v-perms="['user.user/edit']"
+                    >
+                        <el-button type="primary" link>
+                            <icon name="el-icon-EditPen" />
+                        </el-button>
+                    </popover-input>
+                </el-form-item>
+                <el-form-item label="真实姓名：">
+                    {{ formData.real_name || '-' }}
+                    <popover-input
+                        class="ml-[10px]"
+                        @confirm="handleEdit($event, 'real_name')"
+                        :limit="32"
+                        v-perms="['user.user/edit']"
+                    >
+                        <el-button type="primary" link>
+                            <icon name="el-icon-EditPen" />
+                        </el-button>
+                    </popover-input>
+                </el-form-item>
+                <el-form-item label="性别：">
+                    {{ formData.sex }}
+                    <popover-input
+                        class="ml-[10px]"
+                        type="select"
+                        :options="[
+                            {
+                                label: '未知',
+                                value: 0
+                            },
+                            {
+                                label: '男',
+                                value: 1
+                            },
+                            {
+                                label: '女',
+                                value: 2
+                            }
+                        ]"
+                        @confirm="handleEdit($event, 'sex')"
+                        v-perms="['user.user/edit']"
+                    >
+                        <el-button type="primary" link>
+                            <icon name="el-icon-EditPen" />
+                        </el-button>
+                    </popover-input>
+                </el-form-item>
+                <el-form-item label="联系电话：">
+                    {{ formData.mobile || '-' }}
+                    <popover-input
+                        class="ml-[10px]"
+                        type="number"
+                        @confirm="handleEdit($event, 'mobile')"
+                        v-perms="['user.user/edit']"
+                    >
+                        <el-button type="primary" link>
+                            <icon name="el-icon-EditPen" />
+                        </el-button>
+                    </popover-input>
+                </el-form-item>
+                <el-form-item label="注册来源："> {{ formData.channel }} </el-form-item>
+                <el-form-item label="注册时间："> {{ formData.create_time }} </el-form-item>
+                <el-form-item label="最近登录时间："> {{ formData.login_time }} </el-form-item>
+            </el-form>
+        </el-card>
+
+        <account-adjust
+            v-model:show="adjustState.show"
+            :value="adjustState.value"
+            @confirm="handleConfirmAdjust"
+        />
+    </div>
+</template>
+
+<script lang="ts" setup name="consumerDetail">
+import type { FormInstance } from 'element-plus'
+import { adjustMoney, getUserDetail, userEdit } from '@/api/consumer'
+import { isEmpty } from '@/utils/util'
+import AccountAdjust from '../components/account-adjust.vue'
+const route = useRoute()
+const formData = reactive({
+    avatar: '',
+    channel: '',
+    create_time: '',
+    login_time: '',
+    mobile: '',
+    nickname: '',
+    real_name: 0,
+    sex: 0,
+    sn: '',
+    account: '',
+    user_money: ''
+})
+
+const adjustState = reactive({
+    show: false,
+    value: ''
+})
+const formRef = shallowRef<FormInstance>()
+
+const getDetails = async () => {
+    const data = await getUserDetail({
+        id: route.query.id
+    })
+    Object.keys(formData).forEach((key) => {
+        //@ts-ignore
+        formData[key] = data[key]
+    })
+}
+
+const handleEdit = async (value: string, field: string) => {
+    if (isEmpty(value)) return
+    await userEdit({
+        id: route.query.id,
+        field,
+        value
+    })
+    getDetails()
+}
+
+const handleAdjust = (value: string) => {
+    adjustState.show = true
+    adjustState.value = value
+}
+const handleConfirmAdjust = async (value: any) => {
+    await adjustMoney({ user_id: route.query.id, ...value })
+    adjustState.show = false
+    getDetails()
+}
+getDetails()
+</script>
diff --git a/src/views/consumer/lists/index.vue b/src/views/consumer/lists/index.vue
new file mode 100644
index 0000000..5d195f2
--- /dev/null
+++ b/src/views/consumer/lists/index.vue
@@ -0,0 +1,98 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-form ref="formRef" class="mb-[-16px]" :model="queryParams" :inline="true">
+                <el-form-item label="用户信息">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.keyword"
+                        placeholder="账号/昵称/手机号码"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="注册时间">
+                    <daterange-picker
+                        v-model:startTime="queryParams.create_time_start"
+                        v-model:endTime="queryParams.create_time_end"
+                    />
+                </el-form-item>
+                <el-form-item label="注册来源">
+                    <el-select class="w-[280px]" v-model="queryParams.channel">
+                        <el-option
+                            v-for="(item, key) in ClientMap"
+                            :key="key"
+                            :label="item"
+                            :value="key"
+                        />
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                    <export-data
+                        class="ml-2.5"
+                        :fetch-fun="getUserList"
+                        :params="queryParams"
+                        :page-size="pager.size"
+                    />
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <el-table size="large" v-loading="pager.loading" :data="pager.lists">
+                <el-table-column label="头像" min-width="100">
+                    <template #default="{ row }">
+                        <el-avatar :src="row.avatar" :size="50" />
+                    </template>
+                </el-table-column>
+                <el-table-column label="昵称" prop="nickname" min-width="100" />
+                <el-table-column label="账号" prop="account" min-width="120" />
+                <el-table-column label="手机号码" prop="mobile" min-width="100" />
+                <el-table-column label="注册来源" prop="channel" min-width="100" />
+                <el-table-column label="注册时间" prop="create_time" min-width="120" />
+                <el-table-column label="操作" width="120" fixed="right">
+                    <template #default="{ row }">
+                        <el-button v-perms="['user.user/detail']" type="primary" link>
+                            <router-link
+                                :to="{
+                                    path: getRoutePath('user.user/detail'),
+                                    query: {
+                                        id: row.id
+                                    }
+                                }"
+                            >
+                                详情
+                            </router-link>
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup name="consumerLists">
+import { usePaging } from '@/hooks/usePaging'
+import { getRoutePath } from '@/router'
+import { getUserList } from '@/api/consumer'
+import { ClientMap } from '@/enums/appEnums'
+const queryParams = reactive({
+    keyword: '',
+    channel: '',
+    create_time_start: '',
+    create_time_end: ''
+})
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: getUserList,
+    params: queryParams
+})
+onActivated(() => {
+    getLists()
+})
+
+getLists()
+</script>
diff --git a/src/views/decoration/component/add-nav.vue b/src/views/decoration/component/add-nav.vue
new file mode 100644
index 0000000..9ad64d3
--- /dev/null
+++ b/src/views/decoration/component/add-nav.vue
@@ -0,0 +1,101 @@
+<template>
+    <div>
+        <div>
+            <draggable class="draggable" v-model="navLists" animation="300" handle=".drag-move">
+                <template v-slot:item="{ element: item, index }">
+                    <del-wrap class="w-[467px]" :key="index" @close="handleDelete(index)">
+                        <div class="bg-fill-light flex items-center w-full p-4 mb-4">
+                            <material-picker
+                                v-model="item.image"
+                                upload-class="bg-body"
+                                size="60px"
+                                exclude-domain
+                            >
+                                <template #upload>
+                                    <div class="upload-btn w-[60px] h-[60px]">
+                                        <icon name="el-icon-Plus" :size="20" />
+                                    </div>
+                                </template>
+                            </material-picker>
+                            <div class="ml-3 flex-1">
+                                <div class="flex">
+                                    <span class="text-tx-regular flex-none mr-3">名称</span>
+                                    <el-input v-model="item.name" placeholder="请输入名称" />
+                                </div>
+                                <div class="flex mt-[18px]">
+                                    <span class="text-tx-regular flex-none mr-3">链接</span>
+                                    <link-picker v-model="item.link" />
+                                </div>
+                                <el-form-item label="是否显示" class="mt-[18px]">
+                                    <div class="flex-1 flex items-center">
+                                        <el-switch
+                                            v-model="item.is_show"
+                                            active-value="1"
+                                            inactive-value="0"
+                                        />
+                                        <div class="drag-move cursor-move ml-auto">
+                                            <icon name="el-icon-Rank" size="18" />
+                                        </div>
+                                    </div>
+                                </el-form-item>
+                            </div>
+                        </div>
+                    </del-wrap>
+                </template>
+            </draggable>
+        </div>
+        <div>
+            <el-button type="primary" @click="handleAdd">添加</el-button>
+        </div>
+    </div>
+</template>
+<script lang="ts" setup>
+import feedback from '@/utils/feedback'
+import type { PropType } from 'vue'
+import Draggable from 'vuedraggable'
+const props = defineProps({
+    modelValue: {
+        type: Array as PropType<any[]>,
+        default: () => []
+    },
+    max: {
+        type: Number,
+        default: 100
+    },
+    min: {
+        type: Number,
+        default: 1
+    }
+})
+
+const emit = defineEmits(['update:modelValue'])
+const navLists = computed({
+    get() {
+        return props.modelValue
+    },
+    set(value) {
+        emit('update:modelValue', value)
+    }
+})
+
+const handleAdd = () => {
+    if (props.modelValue?.length < props.max) {
+        navLists.value.push({
+            image: '',
+            name: '导航名称',
+            link: {},
+            is_show: '1'
+        })
+    } else {
+        feedback.msgError(`最多添加${props.max}个`)
+    }
+}
+const handleDelete = (index: number) => {
+    if (props.modelValue?.length <= props.min) {
+        return feedback.msgError(`最少保留${props.min}个`)
+    }
+    navLists.value.splice(index, 1)
+}
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/decoration-img.vue b/src/views/decoration/component/decoration-img.vue
new file mode 100644
index 0000000..03a0106
--- /dev/null
+++ b/src/views/decoration/component/decoration-img.vue
@@ -0,0 +1,59 @@
+<template>
+    <el-image :style="styles" v-bind="props" :src="getImageUrl(src)">
+        <template #placeholder>
+            <div class="image-slot"></div>
+        </template>
+        <template #error>
+            <div class="image-slot">
+                <icon name="el-icon-Picture" :size="30" />
+            </div>
+        </template>
+    </el-image>
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue'
+import type { CSSProperties } from 'vue'
+import { addUnit } from '@/utils/util'
+import { imageProps } from 'element-plus'
+import useAppStore from '@/stores/modules/app'
+const props = defineProps({
+    width: {
+        type: [String, Number],
+        default: 'auto'
+    },
+    height: {
+        type: [String, Number],
+        default: 'auto'
+    },
+    radius: {
+        type: [String, Number],
+        default: 0
+    },
+    ...imageProps
+})
+
+const { getImageUrl } = useAppStore()
+const styles = computed<CSSProperties>(() => {
+    return {
+        width: addUnit(props.width),
+        height: addUnit(props.height),
+        borderRadius: addUnit(props.radius)
+    }
+})
+</script>
+
+<style lang="scss" scoped>
+.el-image {
+    display: block;
+    .image-slot {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: 100%;
+        height: 100%;
+        background: #fafafa;
+        color: #909399;
+    }
+}
+</style>
diff --git a/src/views/decoration/component/pages/attr-setting.vue b/src/views/decoration/component/pages/attr-setting.vue
new file mode 100644
index 0000000..c5ae4d5
--- /dev/null
+++ b/src/views/decoration/component/pages/attr-setting.vue
@@ -0,0 +1,36 @@
+<template>
+    <div class="pages-setting">
+        <el-card shadow="never" class="!border-none flex">
+            <div
+                class="title flex items-center before:w-[3px] before:h-[14px] before:block before:bg-primary before:mr-2 text-xl font-medium"
+            >
+                {{ widget?.title }}
+            </div>
+        </el-card>
+        <el-scrollbar class="w-full" style="height: calc(100% - 60px)">
+            <keep-alive>
+                <component
+                    :is="widgets[widget?.name]?.attr"
+                    :content="widget?.content"
+                    :styles="widget?.styles"
+                    :type="type"
+                />
+            </keep-alive>
+        </el-scrollbar>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import widgets from '../widgets'
+
+const props = defineProps({
+    widget: {
+        type: Object as PropType<Record<string, any>>,
+        default: () => ({})
+    },
+    type: {
+        type: String as PropType<'mobile' | 'pc'>,
+        default: 'mobile'
+    }
+})
+</script>
diff --git a/src/views/decoration/component/pages/menu.vue b/src/views/decoration/component/pages/menu.vue
new file mode 100644
index 0000000..df774f6
--- /dev/null
+++ b/src/views/decoration/component/pages/menu.vue
@@ -0,0 +1,49 @@
+<template>
+    <div class="pages-menu">
+        <el-menu
+            :default-active="modelValue"
+            class="w-[160px] min-h-[668px]"
+            @select="handleSelect"
+        >
+            <el-menu-item v-for="(item, key) in menus" :index="key" :key="item.id">
+                <span>{{ item.name }}</span>
+            </el-menu-item>
+        </el-menu>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+
+defineProps({
+    menus: {
+        type: Object as PropType<Record<string, any>>,
+        default: () => ({})
+    },
+    modelValue: {
+        type: String,
+        default: '1'
+    }
+})
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: string): void
+}>()
+const handleSelect = (index: string) => {
+    emit('update:modelValue', index)
+}
+</script>
+
+<style lang="scss" scoped>
+.pages-menu {
+    :deep(.el-menu) {
+        border-right: none;
+    }
+    :deep(.el-menu-item) {
+        border-color: transparent;
+        &.is-active {
+            border-right-width: 2px;
+            border-color: var(--el-color-primary);
+            background-color: var(--el-color-primary-light-9);
+        }
+    }
+}
+</style>
diff --git a/src/views/decoration/component/pages/preview-pc.vue b/src/views/decoration/component/pages/preview-pc.vue
new file mode 100644
index 0000000..4aeaa9e
--- /dev/null
+++ b/src/views/decoration/component/pages/preview-pc.vue
@@ -0,0 +1,170 @@
+<template>
+    <div class="pages-preview">
+        <div class="relative flex justify-center h-full mt-5 mx-10">
+            <!--    iframe预览    -->
+            <iframe
+                v-if="$route.query.url"
+                ref="previewIframeRef"
+                class="flex-1 h-full"
+                width="100%"
+                height="100%"
+                scrolling="no"
+                :src="$route.query.url"
+            ></iframe>
+            <div class="max-w-[1200px] w-full absolute">
+                <div
+                    v-for="(widget, index) in pageData"
+                    :key="widget.id"
+                    class="absolute left-0 top-0"
+                    :class="{
+                    'cursor-pointer': !widget?.disabled
+                }"
+                    @click="handleClick(widget, index)"
+                >
+                    <div
+                        class="absolute w-full h-full z-[100] border-dashed"
+                        :class="{
+                            select: index == modelValue,
+                            'border-[#dcdfe6] border-2': !widget?.disabled,
+                            hide: canShowCom(widget.content)
+                        }"
+                        :style="widget.styles"
+                    ></div>
+                    <slot>
+                        <component
+                            :is="widgets[widget?.name]?.content"
+                            :content="widget.content"
+                            :styles="widget.styles"
+                            :key="widget.id"
+                            ref="commonComponentRef"
+                        />
+                    </slot>
+                    <!--  部件操作按钮组  -->
+                    <div
+                        class="widget-btns py-[5px]"
+                        v-if="index == modelValue"
+                        :style="{
+                            top: widget.styles.top,
+                            left:  widget.styles.width
+                        }"
+                    >
+                        <div>
+                            <el-tooltip
+                                effect="dark"
+                                content="编辑组件内容"
+                                placement="right"
+                            >
+                                <el-button
+                                    class="py-[5px]"
+                                    type="primary"
+                                    :icon="Setting"
+                                    @click="handleClickSetting(index)"
+                                />
+                            </el-tooltip>
+                        </div>
+                        <div>
+                            <el-tooltip
+                                effect="dark"
+                                :content="canShowCom(widget.content) ? '显示' : '隐藏'"
+                                placement="right"
+                            >
+                                <el-button
+                                    class="py-[5px]"
+                                    type="primary"
+                                    :icon="canShowCom(widget.content) ? View : Hide"
+                                    @click="changeShowCom(widget.content)"
+                                />
+                            </el-tooltip>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script lang="ts" setup>
+import widgets from '../widgets'
+import type {PropType} from 'vue'
+import {Setting, ArrowLeft, Hide, View} from "@element-plus/icons-vue";
+
+const commonComponentRef = shallowRef<any>()
+
+defineProps({
+    pageData: {
+        type: Array as PropType<any[]>,
+        default: () => []
+    },
+    modelValue: {
+        type: Number,
+        default: 0
+    }
+})
+
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: number): void
+}>()
+
+// 是否显示组件
+const canShowCom = computed(() => {
+    return (data: any) => {
+        return data?.enabled == 0
+    }
+})
+
+// 点击了组件设置
+const handleClickSetting = (index: number) => {
+    commonComponentRef.value[index]?.open()
+}
+
+// 修改组件显示/隐藏
+const changeShowCom = (data: any) => {
+    if (data.enabled === undefined) return
+    data.enabled = data.enabled ? 0 : 1
+}
+
+const handleClick = (widget: any, index: number) => {
+    if (widget.disabled) return
+    emit('update:modelValue', index)
+}
+</script>
+
+<style lang="scss" scoped>
+.pages-preview {
+    @apply w-full h-full relative;
+    height: 85vh;
+
+    .select {
+        @apply border-primary border-solid;
+    }
+
+    .hide::before {
+        content: '已隐藏';
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: white;
+        font-size: 14px;
+        background-color: rgba(0, 0, 0, 0.4);
+    }
+
+    .widget-btns {
+        position: absolute;
+        overflow: hidden;
+
+        width: 46px;
+        border-radius: 8px;
+        @apply bg-primary;
+        margin-left: 10px;
+
+        :deep(.el-button) {
+            width: 46px;
+            border-radius: 0;
+        }
+    }
+}
+</style>
diff --git a/src/views/decoration/component/pages/preview.vue b/src/views/decoration/component/pages/preview.vue
new file mode 100644
index 0000000..bf7db1c
--- /dev/null
+++ b/src/views/decoration/component/pages/preview.vue
@@ -0,0 +1,226 @@
+<template>
+    <el-scrollbar class="pages-preview-container">
+        <div
+            v-if="pageMeta !== null"
+            class="absolute right-4 top-4"
+            @click="handleClickPageMeta"
+        >
+            <el-button>页面设置</el-button>
+        </div>
+        <div class="shadow mx-[30px] pages-preview">
+            <div
+                v-for="(widget, index) in pageData"
+                :key="widget.id"
+                class="relative"
+                :class="{
+                    'cursor-pointer': !widget?.disabled
+                }"
+                @click="handleClick(widget, index)"
+            >
+                <!--  选中的边框  -->
+                <div
+                    class="absolute w-full h-full z-[100] border-dashed"
+                    :class="{
+                        select: index == modelValue,
+                        hide: canShowCom(widget.content),
+                        'border-[#dcdfe6] border-2': !widget?.disabled
+                    }"
+                ></div>
+                <!--  选中的组件  -->
+                <slot>
+                    <component
+                        :is="widgets[widget?.name]?.content"
+                        :content="widget.content"
+                        :styles="widget.styles"
+                        :key="widget.id"
+                    />
+                </slot>
+                <!--  部件操作按钮组  -->
+                <div class="widget-btns py-[5px]" v-if="index == modelValue">
+                    <div>
+                        <el-tooltip
+                            effect="dark"
+                            :content="canShowCom(widget.content) ? '显示' : '隐藏'"
+                            placement="right"
+                        >
+                            <el-button
+                                class="py-[5px]"
+                                type="primary"
+                                :icon="canShowCom(widget.content) ? View : Hide"
+                                @click="changeShowCom(widget.content)"
+                            />
+                        </el-tooltip>
+                    </div>
+                    <div>
+                        <el-tooltip
+                            effect="dark"
+                            content="上移"
+                            placement="right"
+                        >
+                            <el-button
+                                class="py-[5px]"
+                                type="primary"
+                                :icon="ArrowUpBold"
+                                :disabled="canMoveUpCom(index)"
+                                @click.stop="rearrangeArray(index, index - 1)"
+                            />
+                        </el-tooltip>
+                    </div>
+                    <div>
+                        <el-tooltip
+                            effect="dark"
+                            content="下移"
+                            placement="right"
+                        >
+                            <el-button
+                                class="py-[5px]"
+                                type="primary"
+                                :icon="ArrowDownBold"
+                                :disabled="canMoveDownCom(index)"
+                                @click.stop="rearrangeArray(index, index + 1)"
+                            />
+                        </el-tooltip>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </el-scrollbar>
+</template>
+<script lang="ts" setup>
+import widgets from '../widgets'
+import type {PropType} from 'vue'
+import {Hide, View, ArrowUpBold, ArrowDownBold} from "@element-plus/icons-vue";
+import {computed} from "vue";
+
+const props = defineProps({
+    pageMeta: {
+        type: Object as any,
+        default: () => null
+    },
+    pageData: {
+        type: Array as PropType<any[]>,
+        default: () => []
+    },
+    modelValue: {
+        type: Number,
+        default: 0
+    }
+})
+
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: number): void
+}>()
+
+const oldModelValue = ref<number>(-1)
+
+const handleClickPageMeta = () => {
+    if (props.modelValue === -1) {
+        emit('update:modelValue', oldModelValue.value)
+    } else {
+        oldModelValue.value = props.modelValue
+        emit('update:modelValue', -1)
+    }
+}
+
+const handleClick = (widget: any, index: number) => {
+    if (widget.disabled) return
+    emit('update:modelValue', index)
+}
+
+// 是否可以移动组件
+const canMoveUpCom = computed(() => {
+    return (index: number) => {
+        return index === 0
+    }
+})
+
+// 是否可以移动组件
+const canMoveDownCom = computed(() => {
+    return (index: number) => {
+        return props.pageData?.length === (index + 1)
+    }
+})
+
+// 是否显示组件
+const canShowCom = computed(() => {
+    return (data: any) => {
+        return data?.enabled == 0
+    }
+})
+
+// 修改组件显示/隐藏
+const changeShowCom = (data: any) => {
+    if (data.enabled === undefined) return
+    data.enabled = data.enabled ? 0 : 1
+}
+
+const rearrangeArray = (currentIdx: number, targetIdx: number) => {
+    if (
+        currentIdx < 0 ||
+        currentIdx >= props.pageData.length ||
+        targetIdx < 0 ||
+        targetIdx >= props.pageData.length
+    ) {
+        return
+    }
+
+    const element = props.pageData.splice(currentIdx, 1)[0]
+    props.pageData.splice(targetIdx, 0, element)
+
+    emit('update:modelValue', targetIdx)
+}
+
+</script>
+
+<style lang="scss" scoped>
+.pages-preview-container {
+    position: relative;
+    :deep(.el-scrollbar__wrap) {
+        width: 100%;
+        display: flex;
+        justify-content: center;
+    }
+
+    .pages-preview {
+        background-color: #f8f8f8;
+        width: 360px;
+        min-height: 615px;
+        color: #333;
+
+        .select {
+            @apply border-primary border-solid;
+        }
+
+        .hide::before {
+            content: '已隐藏';
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            color: white;
+            font-size: 14px;
+            background-color: rgba(0, 0, 0, 0.4);
+        }
+
+        .widget-btns {
+            position: absolute;
+            top: 10px;
+            right: -60px;
+            overflow: hidden;
+
+            width: 46px;
+            border-radius: 8px;
+            @apply bg-primary;
+
+            :deep(.el-button) {
+                width: 46px;
+                border-radius: 0;
+            }
+        }
+    }
+}
+</style>
diff --git a/src/views/decoration/component/tabbar/mobile/attr.vue b/src/views/decoration/component/tabbar/mobile/attr.vue
new file mode 100644
index 0000000..188d836
--- /dev/null
+++ b/src/views/decoration/component/tabbar/mobile/attr.vue
@@ -0,0 +1,186 @@
+<template>
+    <el-card shadow="never" class="!border-none flex">
+        <div
+            class="title flex items-center before:w-[3px] before:h-[14px] before:block before:bg-primary before:mr-2 text-xl font-medium"
+        >
+            底部导航设置
+            <span class="form-tips ml-[10px] !mt-0"> 至少添加2个导航，最多添加5个导航 </span>
+        </div>
+    </el-card>
+    <el-form label-width="70px">
+
+        <el-card shadow="never" class="!border-none flex mt-2">
+            <div class="flex items-end mb-4">
+                <div class="text-base text-[#101010] font-medium">展示样式</div>
+            </div>
+            <el-form-item label="默认颜色">
+                <color-picker
+                    class="max-w-[400px]"
+                    v-model="data.style.default_color"
+                    default-color="#999999"
+                />
+            </el-form-item>
+            <el-form-item label="选中颜色" style="margin-bottom: 0">
+                <color-picker
+                    class="max-w-[400px]"
+                    v-model="data.style.selected_color"
+                    default-color="#4173ff"
+                />
+            </el-form-item>
+        </el-card>
+        <el-card shadow="never" class="!border-none flex mt-2">
+            <div class="flex items-end mb-4">
+                <div class="text-base text-[#101010] font-medium">菜单设置</div>
+                <div class="text-xs text-tx-secondary ml-2">
+                    建议图片尺寸：100px*100px
+                </div>
+            </div>
+            <div class="mb-[18px] max-w-[400px]">
+                <Draggable
+                    class="draggable"
+                    v-model="data.list"
+                    animation="300"
+                    draggable=".draggable"
+                    handle=".drag-move"
+                    :move="onMove"
+                >
+                    <template v-slot:item="{ element, index }">
+                        <del-wrap
+                            @close="handleDelete(index)"
+                            class="max-w-[400px]"
+                            :show-close="index !== 0"
+                            :class="{ draggable: index != 0 }"
+                        >
+                            <div class="bg-fill-light w-full p-4 mt-4">
+                                <el-form-item label="导航图标">
+                                    <material-picker
+                                        v-model="element.unselected"
+                                        upload-class="bg-body"
+                                        exclude-domain
+                                        size="60px"
+                                    >
+                                        <template #upload>
+                                            <div class="upload-btn w-[60px] h-[60px]">
+                                                <icon name="el-icon-Plus" :size="16"/>
+                                                <span class="text-xs leading-5"> 未选中 </span>
+                                            </div>
+                                        </template>
+                                    </material-picker>
+                                    <material-picker
+                                        v-model="element.selected"
+                                        exclude-domain
+                                        upload-class="bg-body"
+                                        size="60px"
+                                    >
+                                        <template #upload>
+                                            <div class="upload-btn w-[60px] h-[60px]">
+                                                <icon name="el-icon-Plus" :size="16"/>
+                                                <span class="text-xs leading-5"> 选中 </span>
+                                            </div>
+                                        </template>
+                                    </material-picker>
+                                </el-form-item>
+                                <el-form-item label="导航名称">
+                                    <el-input v-model="element.name" placeholder="请输入名称"/>
+                                </el-form-item>
+                                <el-form-item label="链接地址">
+                                    <link-picker
+                                        :is-tab="true"
+                                        :disabled="index === 0"
+                                        v-model="element.link"
+                                    />
+                                </el-form-item>
+                                <el-form-item label="是否显示">
+                                    <div class="flex-1 flex items-center">
+                                        <el-switch
+                                            :disabled="index == 0"
+                                            v-model="element.is_show"
+                                            :active-value="1"
+                                            :inactive-value="0"
+                                            @change="handleShowChange(element)"
+                                        />
+                                        <div class="drag-move cursor-move ml-auto">
+                                            <icon name="el-icon-Rank" size="18"/>
+                                        </div>
+                                    </div>
+                                </el-form-item>
+                            </div>
+                        </del-wrap>
+                    </template>
+                </Draggable>
+            </div>
+
+            <div v-if="data.list?.length < max" class="mt-4">
+                <el-button class="w-full" type="primary" @click="handleAdd">
+                    添加导航 {{ data.list?.length }} / {{ max }}
+                </el-button>
+            </div>
+        </el-card>
+
+    </el-form>
+</template>
+<script lang="ts" setup>
+import feedback from '@/utils/feedback'
+import type {PropType} from 'vue'
+import Draggable from 'vuedraggable'
+
+const props = defineProps({
+    modelValue: {
+        type: Object,
+        default: () => ({
+            list: [],
+            style: {}
+        })
+    }
+})
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: any): void
+}>()
+const data = computed({
+    get() {
+        return props.modelValue
+    },
+    set(value) {
+        emit('update:modelValue', value)
+    }
+})
+
+const max = 5
+const min = 2
+const showTabbarList = computed(() => {
+    return data.value.list?.filter((tab: any) => tab.is_show == '1') || []
+})
+const handleAdd = () => {
+    if (data.value.list?.length < max) {
+        data.value.list.push({
+            name: '',
+            selected: '',
+            unselected: '',
+            is_show: 1,
+            link: {}
+        })
+    } else {
+        feedback.msgError(`最多添加${max}个`)
+    }
+}
+const handleDelete = (index: number) => {
+    if (data.value.list?.length <= min) {
+        return feedback.msgError(`最少保留${min}个`)
+    }
+    data.value.list.splice(index, 1)
+}
+
+const onMove = (e: any) => {
+    if (e.relatedContext.index == 0) {
+        return false
+    }
+    return true
+}
+
+const handleShowChange = (item: any) => {
+    if (showTabbarList.value.length < min) {
+        item.is_show = 1
+        return feedback.msgError(`最少显示${min}个`)
+    }
+}
+</script>
diff --git a/src/views/decoration/component/tabbar/mobile/content.vue b/src/views/decoration/component/tabbar/mobile/content.vue
new file mode 100644
index 0000000..5da1e8d
--- /dev/null
+++ b/src/views/decoration/component/tabbar/mobile/content.vue
@@ -0,0 +1,44 @@
+<template>
+    <div class="tabbar flex">
+        <template v-for="(item, index) in showTabbarList" :key="index">
+            <div
+                class="tabbar-item flex flex-col justify-center items-center flex-1"
+                :style="{ color: style.default_color }"
+            >
+                <decoration-img width="22px" height="22px" :src="item.unselected" fit="cover" />
+                <div class="leading-3 text-[12px] mt-[4px]">
+                    {{ item.name }}
+                </div>
+            </div>
+        </template>
+    </div>
+</template>
+<script lang="ts" setup>
+import DecorationImg from '../../decoration-img.vue'
+import type { PropType } from 'vue'
+
+const props = defineProps({
+    style: {
+        type: Object,
+        default: () => ({})
+    },
+    list: {
+        type: Array as PropType<any[]>,
+        default: () => []
+    }
+})
+
+const showTabbarList = computed(() => {
+    return props.list?.filter((tab: any) => tab.is_show == 1) || []
+})
+</script>
+<style lang="scss" scoped>
+.tabbar {
+    position: absolute;
+    height: 50px;
+    background-color: #fff;
+    bottom: 0;
+    width: 100%;
+    border: 2px solid var(--el-color-primary);
+}
+</style>
diff --git a/src/views/decoration/component/tabbar/mobile/index.ts b/src/views/decoration/component/tabbar/mobile/index.ts
new file mode 100644
index 0000000..44e335d
--- /dev/null
+++ b/src/views/decoration/component/tabbar/mobile/index.ts
@@ -0,0 +1,6 @@
+import attr from './attr.vue'
+import content from './content.vue'
+export default {
+    attr,
+    content
+}
diff --git a/src/views/decoration/component/tabbar/pc/attr.vue b/src/views/decoration/component/tabbar/pc/attr.vue
new file mode 100644
index 0000000..8ae3a89
--- /dev/null
+++ b/src/views/decoration/component/tabbar/pc/attr.vue
@@ -0,0 +1,40 @@
+<template>
+    <div
+        class="title flex items-center before:w-[3px] before:h-[14px] before:block before:bg-primary before:mr-2"
+    >
+        pc导航设置
+    </div>
+    <el-form class="mt-4" label-width="70px">
+        <el-tabs model-value="nav">
+            <el-tab-pane label="主导航设置" name="nav">
+                <menu-set v-model="data.nav" />
+            </el-tab-pane>
+            <el-tab-pane label="菜单设置" name="menu">
+                <menu-set v-model="data.menu" />
+            </el-tab-pane>
+        </el-tabs>
+    </el-form>
+</template>
+<script lang="ts" setup>
+import MenuSet from './menu-set.vue'
+const props = defineProps({
+    modelValue: {
+        type: Object,
+        default: () => ({
+            nav: [],
+            menu: {}
+        })
+    }
+})
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: any): void
+}>()
+const data = computed({
+    get() {
+        return props.modelValue
+    },
+    set(value) {
+        emit('update:modelValue', value)
+    }
+})
+</script>
diff --git a/src/views/decoration/component/tabbar/pc/content.vue b/src/views/decoration/component/tabbar/pc/content.vue
new file mode 100644
index 0000000..4b76a0d
--- /dev/null
+++ b/src/views/decoration/component/tabbar/pc/content.vue
@@ -0,0 +1,101 @@
+<template>
+    <div class="pc-aside absolute top-0 bottom-0 left-0 w-[150px]">
+        <ElScrollbar>
+            <div class="h-full px-[10px] flex flex-col">
+                <div class="mb-auto">
+                    <div class="nav">
+                        <template v-for="(item, index) in nav" :key="index">
+                            <div
+                                v-if="item.is_show == '1'"
+                                :to="item.link.path"
+                                class="nav-item"
+                                :class="{
+                                    active: index == 0
+                                }"
+                            >
+                                <decoration-img
+                                    width="18px"
+                                    height="18px"
+                                    :src="index == 0 ? item.selected : item.unselected"
+                                    fit="cover"
+                                >
+                                    <template #error>
+                                        <span></span>
+                                    </template>
+                                </decoration-img>
+
+                                <div class="ml-[10px]">{{ item.name }}</div>
+                            </div>
+                        </template>
+                    </div>
+                </div>
+                <div>
+                    <div class="menu">
+                        <div class="menu-item" v-for="(item, index) in menu" :key="index">
+                            <decoration-img
+                                width="16px"
+                                height="16px"
+                                :src="item.unselected"
+                                fit="cover"
+                            >
+                                <template #error>
+                                    <span></span>
+                                </template>
+                            </decoration-img>
+
+                            <span class="ml-[6px] line-clamp-1">{{ item.name }}</span>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </ElScrollbar>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import DecorationImg from '../../decoration-img.vue'
+const props = defineProps({
+    nav: {
+        type: Array as PropType<any[]>,
+        default: () => []
+    },
+    menu: {
+        type: Array as PropType<any[]>,
+        default: () => []
+    }
+})
+</script>
+<style lang="scss" scoped>
+.pc-aside {
+    border: 2px solid var(--el-color-primary);
+    :deep(.el-scrollbar__view) {
+        height: 100%;
+    }
+    .nav {
+        .nav-item {
+            border-radius: 8px;
+            display: flex;
+            align-items: center;
+            height: 40px;
+            margin: 10px 0;
+            padding: 0 12px;
+            &.active {
+                color: #fff;
+                background: linear-gradient(90deg, #19e8b7 0%, #00abff 100%);
+            }
+        }
+    }
+
+    .menu-item {
+        display: flex;
+        align-items: center;
+        height: 38px;
+        line-height: 38px;
+        padding: 0 12px;
+        border-radius: 8px;
+        cursor: pointer;
+        margin: 3px 0;
+        font-size: 13px;
+    }
+}
+</style>
diff --git a/src/views/decoration/component/tabbar/pc/index.ts b/src/views/decoration/component/tabbar/pc/index.ts
new file mode 100644
index 0000000..44e335d
--- /dev/null
+++ b/src/views/decoration/component/tabbar/pc/index.ts
@@ -0,0 +1,6 @@
+import attr from './attr.vue'
+import content from './content.vue'
+export default {
+    attr,
+    content
+}
diff --git a/src/views/decoration/component/tabbar/pc/menu-set.vue b/src/views/decoration/component/tabbar/pc/menu-set.vue
new file mode 100644
index 0000000..9bdf926
--- /dev/null
+++ b/src/views/decoration/component/tabbar/pc/menu-set.vue
@@ -0,0 +1,119 @@
+<template>
+    <div class="mb-[18px] max-w-[400px]">
+        <Draggable class="draggable" v-model="menu" animation="300" handle=".drag-move">
+            <template v-slot:item="{ element, index }">
+                <del-wrap @close="handleDelete(index)" class="max-w-[400px]">
+                    <div class="bg-fill-light w-full p-4 mt-4">
+                        <el-form-item
+                            label="导航图标"
+                            v-if="
+                                element.unselected !== undefined || element.selected !== undefined
+                            "
+                        >
+                            <material-picker
+                                v-if="element.unselected !== undefined"
+                                v-model="element.unselected"
+                                upload-class="bg-body"
+                                exclude-domain
+                                size="60px"
+                            >
+                                <template #upload>
+                                    <div class="upload-btn w-[60px] h-[60px]">
+                                        <icon name="el-icon-Plus" :size="16" />
+                                        <span class="text-xs leading-5"> 未选中 </span>
+                                    </div>
+                                </template>
+                            </material-picker>
+                            <material-picker
+                                v-model="element.selected"
+                                v-if="element.selected !== undefined"
+                                upload-class="bg-body"
+                                exclude-domain
+                                size="60px"
+                            >
+                                <template #upload>
+                                    <div class="upload-btn w-[60px] h-[60px]">
+                                        <icon name="el-icon-Plus" :size="16" />
+                                        <span class="text-xs leading-5"> 选中 </span>
+                                    </div>
+                                </template>
+                            </material-picker>
+                        </el-form-item>
+                        <el-form-item label="导航名称" v-if="element.name !== undefined">
+                            <el-input v-model="element.name" placeholder="请输入名称" />
+                        </el-form-item>
+                        <el-form-item label="链接地址" v-if="element.link !== undefined">
+                            <link-picker v-model="element.link" type="pc" />
+                        </el-form-item>
+                        <el-form-item label="是否显示" v-if="element.is_show !== undefined">
+                            <div class="flex-1 flex items-center">
+                                <el-switch
+                                    v-model="element.is_show"
+                                    active-value="1"
+                                    inactive-value="0"
+                                />
+                                <div class="drag-move cursor-move ml-auto">
+                                    <icon name="el-icon-Rank" size="18" />
+                                </div>
+                            </div>
+                        </el-form-item>
+                    </div>
+                </del-wrap>
+            </template>
+        </Draggable>
+    </div>
+
+    <el-form-item v-if="menu.length < max" label-width="0">
+        <el-button type="primary" @click="handleAdd"> 添加导航 </el-button>
+    </el-form-item>
+</template>
+
+<script setup lang="ts">
+import feedback from '@/utils/feedback'
+import { cloneDeep } from 'lodash-es'
+import Draggable from 'vuedraggable'
+const props = withDefaults(
+    defineProps<{
+        modelValue: any[]
+        max?: number
+        min?: number
+        itemData: any
+    }>(),
+    {
+        max: 9999,
+        min: -1,
+        itemData: () => ({
+            name: '',
+            selected: '',
+            unselected: '',
+            is_show: '1',
+            link: {}
+        })
+    }
+)
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: any): void
+}>()
+const menu = computed({
+    get() {
+        return props.modelValue
+    },
+    set(value) {
+        emit('update:modelValue', value)
+    }
+})
+
+const handleAdd = () => {
+    if (menu.value?.length < props.max) {
+        menu.value.push(cloneDeep(props.itemData))
+    } else {
+        feedback.msgError(`最多添加${props.max}个`)
+    }
+}
+const handleDelete = (index: number) => {
+    if (menu.value.length <= props.min && props.min > -1) {
+        return feedback.msgError(`最少保留${props.min}个`)
+    }
+    menu.value.splice(index, 1)
+}
+</script>
diff --git a/src/views/decoration/component/widgets/banner/attr.vue b/src/views/decoration/component/widgets/banner/attr.vue
new file mode 100644
index 0000000..25fd410
--- /dev/null
+++ b/src/views/decoration/component/widgets/banner/attr.vue
@@ -0,0 +1,176 @@
+<template>
+    <el-form label-width="70px">
+        <el-card shadow="never" class="!border-none flex mt-2">
+            <div class="flex items-end mb-4">
+                <div class="text-base text-[#101010] font-medium">展示样式</div>
+            </div>
+            <el-radio-group v-model="content.style">
+                <el-radio :label="1">常规</el-radio>
+                <el-radio :label="2">大屏</el-radio>
+            </el-radio-group>
+        </el-card>
+        <el-card shadow="never" class="!border-none flex mt-2" v-if="content.style == 1">
+            <div class="flex items-end mb-4">
+                <div class="text-base text-[#101010] font-medium">背景联动</div>
+            </div>
+            <el-radio-group v-model="content.bg_style">
+                <el-radio :label="1">开启</el-radio>
+                <el-radio :label="0">关闭</el-radio>
+            </el-radio-group>
+            <div class="p-[15px] rounded-[8px] bg-[#f3f8ff] text-[#136bdf] mt-2">
+                开启背景联动后，需为轮播图设置背景图，轮播图切换时，背景图也跟随切换，此时该页面自身的“页面背景“设置将失效。
+            </div>
+        </el-card>
+        <el-card shadow="never" class="!border-none flex-1 mt-2">
+            <div class="flex items-end">
+                <div class="text-base text-[#101010] font-medium">轮播图片</div>
+                <div
+                    v-if="content.style == 1"
+                    class="text-xs text-tx-secondary ml-2"
+                >
+                    最多添加5张，建议图片尺寸：750px*340px
+                </div>
+                <div
+                    v-else
+                    class="text-xs text-tx-secondary ml-2"
+                >
+                    最多添加5张，建议图片尺寸：750px*1100px
+                </div>
+            </div>
+            <div class="flex-1">
+                <draggable
+                    class="draggable"
+                    v-model="content.data"
+                    animation="300"
+                    handle=".drag-move"
+                >
+                    <template v-slot:item="{ element: item, index }">
+                        <del-wrap
+                            :key="index"
+                            @close="handleDelete(index)"
+                            class="w-full"
+                        >
+                            <div class="bg-fill-light w-full p-4 mt-4">
+                                <div class="flex justify-center w-[467px]">
+                                    <template v-if="content.style == 1">
+                                        <material-picker
+                                            size="122px"
+                                            v-model="item.image"
+                                            upload-class="bg-body"
+                                            exclude-domain
+                                        >
+                                            <template #upload>
+                                                <div class="w-[122px] h-[122px] banner-upload-btn">
+                                                    轮播图
+                                                </div>
+                                            </template>
+                                        </material-picker>
+                                        <material-picker
+                                            v-if="content.style == 0 || content.bg_style == 1"
+                                            class="ml-[40px]"
+                                            size="122px"
+                                            v-model="item.bg"
+                                            upload-class="bg-body"
+                                            exclude-domain
+                                        >
+                                            <template #upload>
+                                                <div class="w-[122px] h-[122px] banner-upload-btn">
+                                                    背景图
+                                                </div>
+                                            </template>
+                                        </material-picker>
+                                    </template>
+                                    <template v-else>
+                                        <material-picker
+                                            width="396px"
+                                            height="196px"
+                                            v-model="item.image"
+                                            upload-class="bg-body"
+                                            exclude-domain
+                                        />
+                                    </template>
+                                </div>
+                                <div class="flex-1">
+                                    <el-form-item class="mt-[18px]" label="图片链接">
+                                        <link-picker
+                                            v-if="type == 'mobile'"
+                                            v-model="item.link"
+                                        />
+                                        <el-input
+                                            v-if="type == 'pc'"
+                                            placeholder="请输入链接"
+                                            v-model="item.link.path"
+                                        />
+                                    </el-form-item>
+                                    <el-form-item label="是否显示" class="mt-[18px] !mb-0">
+                                        <div class="flex-1 flex items-center">
+                                            <el-switch
+                                                v-model="item.is_show"
+                                                active-value="1"
+                                                inactive-value="0"
+                                            />
+                                            <div class="drag-move cursor-move ml-auto">
+                                                <icon name="el-icon-Rank" size="18"/>
+                                            </div>
+                                        </div>
+                                    </el-form-item>
+                                </div>
+                            </div>
+                        </del-wrap>
+                    </template>
+                </draggable>
+            </div>
+            <div class="mt-4" v-if="content.data?.length < limit">
+                <el-button class="w-full" type="primary" @click="handleAdd">添加图片</el-button>
+            </div>
+        </el-card>
+    </el-form>
+</template>
+<script lang="ts" setup>
+import feedback from '@/utils/feedback'
+import type {PropType} from 'vue'
+import type options from './options'
+import Draggable from 'vuedraggable'
+
+const limit = 5
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    },
+    type: {
+        type: String as PropType<'mobile' | 'pc'>,
+        default: 'mobile'
+    }
+})
+
+const handleAdd = () => {
+    if (props.content.data?.length < limit) {
+        props.content.data.push({
+            is_show: '1',
+            image: '',
+            name: '',
+            link: {}
+        })
+    } else {
+        feedback.msgError(`最多添加${limit}张图片`)
+    }
+}
+const handleDelete = (index: number) => {
+    if (props.content.data?.length <= 1) {
+        return feedback.msgError('最少保留一张图片')
+    }
+    props.content.data.splice(index, 1)
+}
+</script>
+
+<style lang="scss" scoped>
+.banner-upload-btn {
+    @apply text-tx-secondary box-border rounded border-br border-dashed border flex flex-col justify-center items-center;
+}
+</style>
diff --git a/src/views/decoration/component/widgets/banner/content.vue b/src/views/decoration/component/widgets/banner/content.vue
new file mode 100644
index 0000000..479808f
--- /dev/null
+++ b/src/views/decoration/component/widgets/banner/content.vue
@@ -0,0 +1,45 @@
+<template>
+    <div class="banner" :style="styles">
+        <div class="banner-image w-full h-full">
+            <decoration-img
+                width="100%"
+                :height="content.style == 1 ? height : '550px'"
+                :src="getImage"
+                fit="contain"
+            />
+        </div>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type options from './options'
+import DecorationImg from '../../decoration-img.vue'
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    },
+    height: {
+        type: String,
+        default: '170px'
+    }
+})
+
+const showList = computed(() => {
+    return props.content.data?.filter((item: any) => item.is_show == '1') || []
+})
+
+const getImage = computed(() => {
+    if (Array.isArray(showList.value)) {
+        return showList.value[0] ? showList.value[0].image : ''
+    }
+    return ''
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/banner/index.ts b/src/views/decoration/component/widgets/banner/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/banner/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/banner/options.ts b/src/views/decoration/component/widgets/banner/options.ts
new file mode 100644
index 0000000..dbd35d4
--- /dev/null
+++ b/src/views/decoration/component/widgets/banner/options.ts
@@ -0,0 +1,18 @@
+export default () => ({
+    title: '首页轮播图',
+    name: 'banner',
+    content: {
+        enabled: 1,
+        style: 1, // 展示样式---1=常规，2=大屏
+        bg_style: 0, // 背景联动---0=关闭，1=开启
+        data: [
+            {
+                image: '',
+                bg: '',
+                name: '',
+                link: {}
+            }
+        ]
+    },
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/customer-service/attr.vue b/src/views/decoration/component/widgets/customer-service/attr.vue
new file mode 100644
index 0000000..0284d6e
--- /dev/null
+++ b/src/views/decoration/component/widgets/customer-service/attr.vue
@@ -0,0 +1,45 @@
+<template>
+    <div>
+        <el-form label-width="90px" size="large" label-position="top">
+            <el-card shadow="never" class="!border-none flex mt-2">
+                <el-form-item label="平台名称">
+                    <el-input class="w-[400px]" show-word-limit maxlength="20" v-model="content.title"/>
+                </el-form-item>
+
+                <el-form-item label="客服二维码">
+                    <div>
+                        <material-picker v-model="content.qrcode" exclude-domain/>
+                    </div>
+                </el-form-item>
+
+                <el-form-item label="备注">
+                    <el-input class="w-[400px]" show-word-limit maxlength="20" v-model="content.remark"/>
+                </el-form-item>
+                <el-form-item label="联系电话">
+                    <el-input class="w-[400px]" v-model="content.mobile"/>
+                </el-form-item>
+                <el-form-item label="服务时间">
+                    <el-input class="w-[400px]" show-word-limit maxlength="20" v-model="content.time"/>
+                </el-form-item>
+            </el-card>
+        </el-form>
+    </div>
+</template>
+<script lang="ts" setup>
+import type {PropType} from 'vue'
+import type options from './options'
+
+type OptionsType = ReturnType<typeof options>
+defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/customer-service/content.vue b/src/views/decoration/component/widgets/customer-service/content.vue
new file mode 100644
index 0000000..056649e
--- /dev/null
+++ b/src/views/decoration/component/widgets/customer-service/content.vue
@@ -0,0 +1,51 @@
+<template>
+    <view class="bg-white p-[15px] flex text-[#101010] font-medium text-lg">
+        联系我们
+    </view>
+    <view
+        class="customer-service bg-white flex flex-col justify-center items-center mx-[18px] mt-[15px] rounded-[10px] px-[10px] pb-[50px]"
+    >
+        <view
+            class="w-full border-solid border-0 border-b border-[#f5f5f5] p-[15px] text-center text-[#101010] text-base font-medium">
+            {{ content.title }}
+        </view>
+
+        <view class="mt-[30px]">
+            <decoration-img width="100px" height="100px" :src="content.qrcode" alt=""/>
+        </view>
+        <view v-if="content.remark" class="text-sm mt-[20px] font-medium">{{ content.remark }}</view>
+        <view v-if="content.mobile" class="text-sm mt-[12px] flex flex-wrap">
+            <a class="ml-[5px] phone text-primary underline" :href="'tel:' + content.mobile">
+                {{ content.mobile }}
+            </a>
+        </view>
+        <view v-if="content.time" class="text-muted text-sm mt-[15px]">
+            服务时间：{{ content.time }}
+        </view>
+    </view>
+    Î
+</template>
+<script lang="ts" setup>
+import type {PropType} from 'vue'
+import type options from './options'
+import DecorationImg from '../../decoration-img.vue'
+
+type OptionsType = ReturnType<typeof options>
+defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+</script>
+
+<style lang="scss" scoped>
+.customer-service {
+    background: #fff;
+    @apply flex flex-col justify-center items-center;
+}
+</style>
diff --git a/src/views/decoration/component/widgets/customer-service/index.ts b/src/views/decoration/component/widgets/customer-service/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/customer-service/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/customer-service/options.ts b/src/views/decoration/component/widgets/customer-service/options.ts
new file mode 100644
index 0000000..a32eb43
--- /dev/null
+++ b/src/views/decoration/component/widgets/customer-service/options.ts
@@ -0,0 +1,12 @@
+export default () => ({
+    title: '客服设置',
+    name: 'customer-service',
+    content: {
+        title: '添加客服二维码',
+        time: '',
+        mobile: '',
+        qrcode: '',
+        remark: ''
+    },
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/index.ts b/src/views/decoration/component/widgets/index.ts
new file mode 100644
index 0000000..20bf4bf
--- /dev/null
+++ b/src/views/decoration/component/widgets/index.ts
@@ -0,0 +1,14 @@
+const widgets: Record<string, any> = import.meta.glob('./**/index.ts', { eager: true })
+interface Widget {
+    attr: any
+    content: any
+    options: any
+}
+console.log(widgets)
+const exportWidgets: Record<string, Widget> = {}
+Object.keys(widgets).forEach((key) => {
+    const widgetName = key.replace(/^\.\/([\w-]+).*/gi, '$1')
+    exportWidgets[widgetName] = widgets[key]?.default
+})
+
+export default exportWidgets
diff --git a/src/views/decoration/component/widgets/middle-banner/attr.vue b/src/views/decoration/component/widgets/middle-banner/attr.vue
new file mode 100644
index 0000000..0351873
--- /dev/null
+++ b/src/views/decoration/component/widgets/middle-banner/attr.vue
@@ -0,0 +1,112 @@
+<template>
+    <div>
+        <el-form label-width="70px">
+            <el-card shadow="never" class="!border-none flex mt-2">
+                <div class="flex items-end">
+                    <div class="text-base text-[#101010] font-medium">图片设置</div>
+                    <div class="text-xs text-tx-secondary ml-2">
+                        最多添加5张，建议图片尺寸：750px*200px
+                    </div>
+                </div>
+                <div class="flex-1">
+                    <draggable
+                        class="draggable"
+                        v-model="content.data"
+                        animation="300"
+                        handle=".drag-move"
+                    >
+                        <template v-slot:item="{ element: item, index }">
+                            <del-wrap
+                                :key="index"
+                                @close="handleDelete(index)"
+                                class="w-full"
+                            >
+                                <div class="bg-fill-light w-full p-4 mt-4">
+                                    <material-picker
+                                        width="396px"
+                                        height="196px"
+                                        v-model="item.image"
+                                        upload-class="bg-body"
+                                        exclude-domain
+                                    />
+                                    <div class="flex-1">
+                                        <el-form-item class="mt-[18px]" label="图片链接">
+                                            <link-picker
+                                                v-if="type == 'mobile'"
+                                                v-model="item.link"
+                                            />
+                                            <el-input
+                                                v-if="type == 'pc'"
+                                                placeholder="请输入链接"
+                                                v-model="item.link.path"
+                                            />
+                                        </el-form-item>
+                                        <el-form-item label="是否显示" class="mt-[18px] !mb-0">
+                                            <div class="flex-1 flex items-center">
+                                                <el-switch
+                                                    v-model="item.is_show"
+                                                    active-value="1"
+                                                    inactive-value="0"
+                                                />
+                                                <div class="drag-move cursor-move ml-auto">
+                                                    <icon name="el-icon-Rank" size="18"/>
+                                                </div>
+                                            </div>
+                                        </el-form-item>
+                                    </div>
+                                </div>
+                            </del-wrap>
+                        </template>
+                    </draggable>
+                </div>
+                <div class="mt-4" v-if="content.data?.length < limit">
+                    <el-button class="w-full" type="primary" @click="handleAdd">添加图片</el-button>
+                </div>
+            </el-card>
+        </el-form>
+    </div>
+</template>
+<script lang="ts" setup>
+import feedback from '@/utils/feedback'
+import type {PropType} from 'vue'
+import type options from './options'
+import Draggable from 'vuedraggable'
+
+const limit = 5
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    },
+    type: {
+        type: String as PropType<'mobile' | 'pc'>,
+        default: 'mobile'
+    }
+})
+
+const handleAdd = () => {
+    if (props.content.data?.length < limit) {
+        props.content.data.push({
+            is_show: '1',
+            image: '',
+            name: '',
+            link: {}
+        })
+    } else {
+        feedback.msgError(`最多添加${limit}张图片`)
+    }
+}
+const handleDelete = (index: number) => {
+    if (props.content.data?.length <= 1) {
+        return feedback.msgError('最少保留一张图片')
+    }
+    props.content.data.splice(index, 1)
+}
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/middle-banner/content.vue b/src/views/decoration/component/widgets/middle-banner/content.vue
new file mode 100644
index 0000000..7f2e1b9
--- /dev/null
+++ b/src/views/decoration/component/widgets/middle-banner/content.vue
@@ -0,0 +1,45 @@
+<template>
+    <div class="banner" :style="styles">
+        <div class="banner-image w-full h-full">
+            <decoration-img
+                width="100%"
+                :height="styles.height || height"
+                :src="getImage"
+                fit="contain"
+            />
+        </div>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type options from './options'
+import DecorationImg from '../../decoration-img.vue'
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    },
+    height: {
+        type: String,
+        default: '96px'
+    }
+})
+
+const showList = computed(() => {
+    return props.content.data?.filter((item: any) => item.is_show == '1') || []
+})
+
+const getImage = computed(() => {
+    if (Array.isArray(showList.value)) {
+        return showList.value[0] ? showList.value[0].image : ''
+    }
+    return ''
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/middle-banner/index.ts b/src/views/decoration/component/widgets/middle-banner/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/middle-banner/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/middle-banner/options.ts b/src/views/decoration/component/widgets/middle-banner/options.ts
new file mode 100644
index 0000000..5242cfe
--- /dev/null
+++ b/src/views/decoration/component/widgets/middle-banner/options.ts
@@ -0,0 +1,15 @@
+export default () => ({
+    title: '首页中部轮播图',
+    name: 'middle-banner',
+    content: {
+        enabled: 1,
+        data: [
+            {
+                image: '',
+                name: '',
+                link: {}
+            }
+        ]
+    },
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/my-service/attr.vue b/src/views/decoration/component/widgets/my-service/attr.vue
new file mode 100644
index 0000000..388a185
--- /dev/null
+++ b/src/views/decoration/component/widgets/my-service/attr.vue
@@ -0,0 +1,50 @@
+<template>
+    <div>
+        <el-form label-width="70px">
+            <el-card shadow="never" class="!border-none flex mt-2">
+                <el-form-item label="标题">
+                    <el-input class="w-[396px]" v-model="content.title"/>
+                </el-form-item>
+            </el-card>
+            <el-card shadow="never" class="!border-none flex mt-2">
+                <div class="flex items-end mb-4">
+                    <div class="text-base text-[#101010] font-medium">展示样式</div>
+                </div>
+                <el-radio-group v-model="content.style">
+                    <el-radio :label="1">横排</el-radio>
+                    <el-radio :label="2">竖排</el-radio>
+                </el-radio-group>
+            </el-card>
+            <el-card shadow="never" class="!border-none flex mt-2">
+                <div class="flex items-end mb-4">
+                    <div class="text-base text-[#101010] font-medium">菜单</div>
+                    <div class="text-xs text-tx-secondary ml-2">
+                        建议图片尺寸：100px*100px
+                    </div>
+                </div>
+                <div class="flex-1">
+                    <AddNav v-model="content.data"/>
+                </div>
+            </el-card>
+        </el-form>
+    </div>
+</template>
+<script lang="ts" setup>
+import type {PropType} from 'vue'
+import type options from './options'
+import AddNav from '../../add-nav.vue'
+
+type OptionsType = ReturnType<typeof options>
+defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/my-service/content.vue b/src/views/decoration/component/widgets/my-service/content.vue
new file mode 100644
index 0000000..17ad15b
--- /dev/null
+++ b/src/views/decoration/component/widgets/my-service/content.vue
@@ -0,0 +1,62 @@
+<template>
+    <div class="my-service">
+        <div v-if="content.title" class="title px-[15px] py-[10px]">
+            <div>{{ content.title }}</div>
+        </div>
+        <div v-if="content.style == 1" class="flex flex-wrap pt-[20px] pb-[10px]">
+            <div
+                v-for="(item, index) in showList"
+                :key="index"
+                class="flex flex-col items-center w-1/4 mb-[15px]"
+            >
+                <decoration-img width="26px" height="26px" :src="item.image" alt="" />
+                <div class="mt-[7px]">{{ item.name }}</div>
+            </div>
+        </div>
+        <div v-if="content.style == 2">
+            <div
+                v-for="(item, index) in showList"
+                :key="index"
+                class="flex items-center border-b border-[#e5e5e5] h-[50px] px-[12px]"
+            >
+                <decoration-img width="24px" height="24px" :src="item.image" alt="" />
+                <div class="ml-[10px] flex-1">{{ item.name }}</div>
+                <div>
+                    <icon name="el-icon-ArrowRight" />
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type options from './options'
+import DecorationImg from '../../decoration-img.vue'
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+const showList = computed(() => {
+    return props.content.data?.filter((item: any) => item.is_show == '1') || []
+})
+</script>
+
+<style lang="scss" scoped>
+.my-service {
+    margin: 10px 10px 0;
+    background-color: #fff;
+    border-radius: 7px;
+    .title {
+        border-bottom: 1px solid #e5e5e5;
+        font-size: 16px;
+        font-weight: 500;
+    }
+}
+</style>
diff --git a/src/views/decoration/component/widgets/my-service/index.ts b/src/views/decoration/component/widgets/my-service/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/my-service/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/my-service/options.ts b/src/views/decoration/component/widgets/my-service/options.ts
new file mode 100644
index 0000000..f54952b
--- /dev/null
+++ b/src/views/decoration/component/widgets/my-service/options.ts
@@ -0,0 +1,16 @@
+export default () => ({
+    title: '我的服务',
+    name: 'my-service',
+    content: {
+        style: 1,
+        title: '我的服务',
+        data: [
+            {
+                image: '',
+                name: '导航名称',
+                link: {}
+            }
+        ]
+    },
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/nav/attr.vue b/src/views/decoration/component/widgets/nav/attr.vue
new file mode 100644
index 0000000..aa8f688
--- /dev/null
+++ b/src/views/decoration/component/widgets/nav/attr.vue
@@ -0,0 +1,70 @@
+<template>
+    <div>
+        <el-form label-width="70px">
+            <el-card shadow="never" class="!border-none flex mt-2">
+                <div class="flex items-end mb-4">
+                    <div class="text-base text-[#101010] font-medium">展示样式</div>
+                </div>
+                <el-radio-group v-model="content.style">
+                    <el-radio :label="1">固定显示</el-radio>
+                    <el-radio :label="2">分页滑动</el-radio>
+                </el-radio-group>
+                <el-form-item label="每行数量" class="mt-4">
+                    <el-select
+                        v-model="content.per_line"
+                        style="width: 300px"
+                    >
+                        <el-option
+                            v-for="item in 5"
+                            :key="item"
+                            :label="item + '个'"
+                            :value="item"
+                        />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="显示行数">
+                    <el-select
+                        v-model="content.show_line"
+                        style="width: 300px"
+                    >
+                        <el-option
+                            v-for="item in 2"
+                            :key="item"
+                            :label="item + '行'"
+                            :value="item"
+                        />
+                    </el-select>
+                </el-form-item>
+            </el-card>
+            <el-card shadow="never" class="!border-none flex mt-2">
+                <div class="flex items-end">
+                    <div class="text-base text-[#101010] font-medium">菜单设置</div>
+                    <div class="text-xs text-tx-secondary ml-2">
+                        建议图片尺寸：100px*100px
+                    </div>
+                </div>
+                <div class="flex-1 mt-4">
+                    <AddNav v-model="content.data" />
+                </div>
+            </el-card>
+        </el-form>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type options from './options'
+import AddNav from '../../add-nav.vue'
+type OptionsType = ReturnType<typeof options>
+defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/nav/content.vue b/src/views/decoration/component/widgets/nav/content.vue
new file mode 100644
index 0000000..8e55a27
--- /dev/null
+++ b/src/views/decoration/component/widgets/nav/content.vue
@@ -0,0 +1,40 @@
+<template>
+    <div class="nav bg-white pt-[15px] pb-[8px]">
+        <div
+            class="grid grid-rows-auto gap-y-3 w-full"
+            :style="{ 'grid-template-columns': `repeat(${content.per_line}, 1fr)` }"
+        >
+            <div
+                v-for="(item, index) in showList"
+                :key="index"
+                class="flex flex-col items-center"
+            >
+                <decoration-img width="41px" height="41px" :src="item.image" alt="" />
+                <div class="mt-[7px]">{{ item.name }}</div>
+            </div>
+        </div>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type options from './options'
+import DecorationImg from '../../decoration-img.vue'
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+
+const showList = computed(() => {
+    const data = props.content.data?.filter((item: any) => item.is_show == '1') || []
+    return data.slice(0, props.content.show_line * props.content.per_line)
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/nav/index.ts b/src/views/decoration/component/widgets/nav/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/nav/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/nav/options.ts b/src/views/decoration/component/widgets/nav/options.ts
new file mode 100644
index 0000000..b3cae1f
--- /dev/null
+++ b/src/views/decoration/component/widgets/nav/options.ts
@@ -0,0 +1,18 @@
+export default () => ({
+    title: '导航菜单',
+    name: 'nav',
+    content: {
+        enabled: 1,
+        style: 1, // 展示样式1=固定显示，2=分页显示
+        per_line:  5, // 每行显示数量
+        show_line: 2, // 显示行数
+        data: [
+            {
+                image: '',
+                name: '导航名称',
+                link: {}
+            }
+        ]
+    },
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/news/attr.vue b/src/views/decoration/component/widgets/news/attr.vue
new file mode 100644
index 0000000..6645dc4
--- /dev/null
+++ b/src/views/decoration/component/widgets/news/attr.vue
@@ -0,0 +1,20 @@
+<template>
+    <div></div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type options from './options'
+type OptionsType = ReturnType<typeof options>
+defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/news/content.vue b/src/views/decoration/component/widgets/news/content.vue
new file mode 100644
index 0000000..0dda52e
--- /dev/null
+++ b/src/views/decoration/component/widgets/news/content.vue
@@ -0,0 +1,70 @@
+<template>
+    <div class="news">
+        <div class="flex items-center news-title mx-[10px] my-[15px] text-[17px] font-medium">
+            最新资讯
+        </div>
+        <div
+            v-for="item in newsList"
+            :key="item.id"
+            class="news-card flex bg-white px-[10px] py-[16px] text-[#333] border-[#f2f2f2] border-b"
+        >
+            <div class="mr-[10px]" v-if="item.image">
+                <img :src="item.image" class="w-[120px] h-[90px] object-contain" />
+            </div>
+            <div class="flex flex-col justify-between flex-1">
+                <div class="text-[15px] font-medium line-clamp-2">{{ item.title }}</div>
+                <div class="line-clamp-1 text-sm mt-[8px]">
+                    {{ item.desc }}
+                </div>
+
+                <div class="text-[#999] text-xs w-full flex justify-between mt-[8px]">
+                    <div>{{ item.create_time }}</div>
+                    <div class="flex items-center">
+                        <icon name="el-icon-View" />
+                        <div class="ml-[5px]">{{ item.click }}</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import { getDecorateArticle } from '@/api/decoration'
+import type options from './options'
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+const newsList = ref<any[]>([])
+const getData = async () => {
+    const data = await getDecorateArticle({
+        limit: 10
+    })
+    newsList.value = data
+}
+getData()
+</script>
+
+<style lang="scss" scoped>
+.news {
+    .news-title {
+        &::before {
+            content: '';
+            width: 4px;
+            height: 17px;
+            display: block;
+            margin-right: 5px;
+            background: #4173ff;
+        }
+    }
+}
+</style>
diff --git a/src/views/decoration/component/widgets/news/index.ts b/src/views/decoration/component/widgets/news/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/news/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/news/options.ts b/src/views/decoration/component/widgets/news/options.ts
new file mode 100644
index 0000000..dde2c1f
--- /dev/null
+++ b/src/views/decoration/component/widgets/news/options.ts
@@ -0,0 +1,7 @@
+export default () => ({
+    title: '资讯',
+    name: 'news',
+    disabled: 1,
+    content: {},
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/page-meta/attr.vue b/src/views/decoration/component/widgets/page-meta/attr.vue
new file mode 100644
index 0000000..9ab8663
--- /dev/null
+++ b/src/views/decoration/component/widgets/page-meta/attr.vue
@@ -0,0 +1,63 @@
+<template>
+    <el-form ref="form" label-width="80px" size="large">
+        <el-card shadow="never" class="!border-none flex mt-2">
+
+            <el-form-item label="页面标题">
+                <el-radio-group v-model="content.title_type">
+                    <el-radio label="1">文字</el-radio>
+                    <el-radio label="2">图片</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item v-if="content.title_type == 1">
+                <el-input
+                    v-model="content.title"
+                    maxlength="8"
+                    show-word-limit
+                    class="w-[300px]"
+                    placeholder="请输入页面标题"
+                ></el-input>
+            </el-form-item>
+            <el-form-item v-if="content.title_type == 2">
+                <material-picker v-model="content.title_img" :limit="1" size="100px"/>
+                <div class="form-tips">建议图片尺寸：300px*40px</div>
+            </el-form-item>
+            <el-form-item label="文字颜色" v-if="content.title_type == 1">
+                <el-radio-group v-model="content.text_color">
+                    <el-radio label="1">白色</el-radio>
+                    <el-radio label="2">黑色</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item label="页面背景">
+                <el-radio-group v-model="content.bg_type">
+                    <el-radio label="1">背景颜色</el-radio>
+                    <el-radio label="2">背景图片</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item v-if="content.bg_type == 1">
+                <color-picker v-model="content.bg_color" reset-color="#F5F5F5"/>
+            </el-form-item>
+            <el-form-item v-if="content.bg_type == 2">
+                <material-picker v-model="content.bg_image" :limit="1" size="100px"/>
+                <div class="form-tips">建议图片尺寸：750px*高度不限</div>
+            </el-form-item>
+        </el-card>
+    </el-form>
+</template>
+<script lang="ts" setup>
+import type {PropType} from 'vue'
+import type options from './options'
+
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/page-meta/content.vue b/src/views/decoration/component/widgets/page-meta/content.vue
new file mode 100644
index 0000000..96aa234
--- /dev/null
+++ b/src/views/decoration/component/widgets/page-meta/content.vue
@@ -0,0 +1,8 @@
+<template>
+    <div class="page-mate">
+    </div>
+</template>
+<script lang="ts" setup></script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/views/decoration/component/widgets/page-meta/index.ts b/src/views/decoration/component/widgets/page-meta/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/page-meta/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/page-meta/options.ts b/src/views/decoration/component/widgets/page-meta/options.ts
new file mode 100644
index 0000000..90b6be1
--- /dev/null
+++ b/src/views/decoration/component/widgets/page-meta/options.ts
@@ -0,0 +1,14 @@
+export default () => ({
+    title: '页面设置',
+    name: 'page-meta',
+    content: {
+        title_type: 1,
+        title: '',
+        title_img: '',
+        bg_type: 1,
+        bg_color: '',
+        bg_image: '',
+        text_color: ''
+    },
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/pc-banner/attr.vue b/src/views/decoration/component/widgets/pc-banner/attr.vue
new file mode 100644
index 0000000..028d383
--- /dev/null
+++ b/src/views/decoration/component/widgets/pc-banner/attr.vue
@@ -0,0 +1,165 @@
+<template>
+    <el-form label-width="70px">
+        <el-card shadow="never" class="!border-none flex mt-2">
+            <div class="flex items-end mb-4">
+                <div class="text-base text-[#101010] font-medium">展示样式</div>
+            </div>
+            <el-radio-group v-model="content.style">
+                <el-radio :label="1">常规</el-radio>
+                <el-radio :label="2">大屏</el-radio>
+            </el-radio-group>
+        </el-card>
+        <el-card shadow="never" class="!border-none flex mt-2">
+            <div class="flex items-end mb-4">
+                <div class="text-base text-[#101010] font-medium">背景联动</div>
+            </div>
+            <el-radio-group v-model="content.bg_style">
+                <el-radio :label="1">开启</el-radio>
+                <el-radio :label="0">关闭</el-radio>
+            </el-radio-group>
+            <div class="p-[15px] rounded-[8px] bg-[#f3f8ff] text-[#136bdf] mt-2">
+                开启背景联动后，需为轮播图设置背景图，轮播图切换时，背景图也跟随切换，此时该页面自身的“页面背景“设置将失效。
+            </div>
+        </el-card>
+        <el-card shadow="never" class="!border-none flex mt-2">
+            <div class="flex items-end">
+                <div class="text-base text-[#101010] font-medium">轮播图片</div>
+                <div class="text-xs text-tx-secondary ml-2">
+                    最多添加5张，建议图片尺寸：750px*340px
+                </div>
+            </div>
+            <div class="flex-1">
+                <draggable
+                    class="draggable"
+                    v-model="content.data"
+                    animation="300"
+                    handle=".drag-move"
+                >
+                    <template v-slot:item="{ element: item, index }">
+                        <del-wrap
+                            :key="index"
+                            @close="handleDelete(index)"
+                            class="w-full"
+                        >
+                            <div class="bg-fill-light w-full p-4 mt-4">
+                                <div class="flex justify-center w-[396px]">
+                                    <template v-if="content.style == 1">
+                                        <material-picker
+                                            size="122px"
+                                            v-model="item.image"
+                                            upload-class="bg-body"
+                                            exclude-domain
+                                        >
+                                            <template #upload>
+                                                <div class="w-[122px] h-[122px] banner-upload-btn">
+                                                    轮播图
+                                                </div>
+                                            </template>
+                                        </material-picker>
+                                        <material-picker
+                                            size="122px"
+                                            v-model="item.bg"
+                                            upload-class="bg-body"
+                                            exclude-domain
+                                        >
+                                            <template #upload>
+                                                <div class="w-[122px] h-[122px] banner-upload-btn">
+                                                    背景图
+                                                </div>
+                                            </template>
+                                        </material-picker>
+                                    </template>
+                                    <template v-else>
+                                        <material-picker
+                                            width="396px"
+                                            height="196px"
+                                            v-model="item.image"
+                                            upload-class="bg-body"
+                                            exclude-domain
+                                        />
+                                    </template>
+                                </div>
+                                <div class="flex-1">
+                                    <el-form-item class="mt-[18px]" label="图片链接">
+                                        <link-picker
+                                            v-if="type == 'mobile'"
+                                            v-model="item.link"
+                                        />
+                                        <el-input
+                                            v-if="type == 'pc'"
+                                            placeholder="请输入链接"
+                                            v-model="item.link.path"
+                                        />
+                                    </el-form-item>
+                                    <el-form-item label="是否显示" class="mt-[18px] !mb-0">
+                                        <div class="flex-1 flex items-center">
+                                            <el-switch
+                                                v-model="item.is_show"
+                                                active-value="1"
+                                                inactive-value="0"
+                                            />
+                                            <div class="drag-move cursor-move ml-auto">
+                                                <icon name="el-icon-Rank" size="18"/>
+                                            </div>
+                                        </div>
+                                    </el-form-item>
+                                </div>
+                            </div>
+                        </del-wrap>
+                    </template>
+                </draggable>
+            </div>
+            <div class="mt-4" v-if="content.data?.length < limit">
+                <el-button class="w-full" type="primary" @click="handleAdd">添加图片</el-button>
+            </div>
+        </el-card>
+    </el-form>
+</template>
+<script lang="ts" setup>
+import feedback from '@/utils/feedback'
+import type {PropType} from 'vue'
+import type options from './options'
+import Draggable from 'vuedraggable'
+
+const limit = 5
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    },
+    type: {
+        type: String as PropType<'mobile' | 'pc'>,
+        default: 'mobile'
+    }
+})
+
+const handleAdd = () => {
+    if (props.content.data?.length < limit) {
+        props.content.data.push({
+            is_show: '1',
+            image: '',
+            name: '',
+            link: {}
+        })
+    } else {
+        feedback.msgError(`最多添加${limit}张图片`)
+    }
+}
+const handleDelete = (index: number) => {
+    if (props.content.data?.length <= 1) {
+        return feedback.msgError('最少保留一张图片')
+    }
+    props.content.data.splice(index, 1)
+}
+</script>
+
+<style lang="scss" scoped>
+.banner-upload-btn {
+    @apply text-tx-secondary box-border rounded border-br border-dashed border flex flex-col justify-center items-center;
+}
+</style>
diff --git a/src/views/decoration/component/widgets/pc-banner/content.vue b/src/views/decoration/component/widgets/pc-banner/content.vue
new file mode 100644
index 0000000..6a9c436
--- /dev/null
+++ b/src/views/decoration/component/widgets/pc-banner/content.vue
@@ -0,0 +1,103 @@
+<template>
+    <popup
+        ref="popupRef"
+        title="轮播图设置"
+        :async="true"
+        width="980px"
+        @confirm="handleSubmit"
+    >
+        <el-alert title="最多可添加10张，建议图片尺寸750px*440px" type="warning"/>
+
+        <el-scrollbar height="400px" class="mt-4">
+            <div class="flex flex-wrap p-4">
+                <div v-for="(item, index) in content.data" :key="index" class="w-[400px] mr-4 mb-4">
+                    <del-wrap
+                        :key="index"
+                        @close="handleDelete(index)"
+                        class="w-full"
+                    >
+                        <div class="bg-fill-light w-full p-4">
+                            <div class="flex items-center ">
+                                <material-picker
+                                    width="122px"
+                                    height="122px"
+                                    v-model="item.image"
+                                    upload-class="bg-body"
+                                    exclude-domain
+                                >
+                                    <template #upload>
+                                        <div class="w-[122px] h-[122px] flex justify-center items-center">
+                                            轮播图
+                                        </div>
+                                    </template>
+                                </material-picker>
+                                <link-picker
+                                    v-model="item.link"
+                                />
+                            </div>
+                        </div>
+                    </del-wrap>
+                </div>
+            </div>
+            <div class="mt-4 ml-4">
+                <el-button link type="primary" @click="handleAdd">+ 添加轮播图</el-button>
+            </div>
+        </el-scrollbar>
+    </popup>
+</template>
+<script lang="ts" setup>
+import type {PropType} from 'vue'
+import type options from './options'
+import Popup from "@/components/popup/index.vue";
+import feedback from "@/utils/feedback";
+
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    },
+    height: {
+        type: String,
+        default: '170px'
+    }
+})
+
+const open = () => {
+    popupRef.value?.open()
+}
+
+const handleSubmit = () => {
+    popupRef.value?.close()
+}
+
+const handleAdd = () => {
+    if (props.content.data?.length < 10) {
+        props.content.data.push({
+            image: '',
+            name: '',
+            link: {}
+        })
+    } else {
+        feedback.msgError(`最多添加${10}张图片`)
+    }
+}
+
+const handleDelete = (index: number) => {
+    if (props.content.data?.length <= 1) {
+        return feedback.msgError('最少保留一个轮播图')
+    }
+    props.content.data.splice(index, 1)
+}
+
+
+defineExpose({open})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/pc-banner/index.ts b/src/views/decoration/component/widgets/pc-banner/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/pc-banner/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/pc-banner/options.ts b/src/views/decoration/component/widgets/pc-banner/options.ts
new file mode 100644
index 0000000..1000b39
--- /dev/null
+++ b/src/views/decoration/component/widgets/pc-banner/options.ts
@@ -0,0 +1,15 @@
+export default () => ({
+    title: '首页轮播图',
+    name: 'pc-banner',
+    content: {
+        enabled: 1,
+        data: [
+            {
+                image: '',
+                name: '',
+                link: {}
+            }
+        ]
+    },
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/search/attr.vue b/src/views/decoration/component/widgets/search/attr.vue
new file mode 100644
index 0000000..93f9278
--- /dev/null
+++ b/src/views/decoration/component/widgets/search/attr.vue
@@ -0,0 +1,20 @@
+<template>
+    <div></div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type options from './options'
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/search/content.vue b/src/views/decoration/component/widgets/search/content.vue
new file mode 100644
index 0000000..db2a07a
--- /dev/null
+++ b/src/views/decoration/component/widgets/search/content.vue
@@ -0,0 +1,23 @@
+<template>
+    <div class="search">
+        <div class="search-con flex items-center px-[15px]">
+            <icon name="el-icon-Search" :size="17" />
+            <span class="ml-[5px]">请输入关键词搜索</span>
+        </div>
+    </div>
+</template>
+<script lang="ts" setup></script>
+
+<style lang="scss" scoped>
+.search {
+    background-color: #fff;
+    padding: 7px 12px;
+    .search-con {
+        height: 100%;
+        height: 36px;
+        border-radius: 36px;
+        background: #f4f4f4;
+        color: #999999;
+    }
+}
+</style>
diff --git a/src/views/decoration/component/widgets/search/index.ts b/src/views/decoration/component/widgets/search/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/search/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/search/options.ts b/src/views/decoration/component/widgets/search/options.ts
new file mode 100644
index 0000000..e02e298
--- /dev/null
+++ b/src/views/decoration/component/widgets/search/options.ts
@@ -0,0 +1,7 @@
+export default () => ({
+    title: '搜索',
+    name: 'search',
+    disabled: 1,
+    content: {},
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/user-banner/attr.vue b/src/views/decoration/component/widgets/user-banner/attr.vue
new file mode 100644
index 0000000..4b180c5
--- /dev/null
+++ b/src/views/decoration/component/widgets/user-banner/attr.vue
@@ -0,0 +1,101 @@
+<template>
+    <div>
+        <el-form label-width="70px">
+            <el-card shadow="never" class="!border-none flex mt-2">
+                <div class="flex items-end mb-4">
+                    <div class="text-base text-[#101010] font-medium">菜单</div>
+                    <div class="text-xs text-tx-secondary ml-2">
+                        最多添加5张，建议图片尺寸：750px*200px
+                    </div>
+                </div>
+                <draggable
+                    class="draggable"
+                    v-model="content.data"
+                    animation="300"
+                    handle=".drag-move"
+                >
+                    <template v-slot:item="{ element: item, index }">
+                        <del-wrap
+                            :key="index"
+                            @close="handleDelete(index)"
+                            class="w-[467px]"
+                        >
+                            <div class="bg-fill-light flex items-center w-full p-4 mt-4">
+                                <material-picker
+                                    v-model="item.image"
+                                    upload-class="bg-body"
+                                    exclude-domain
+                                />
+                                <div class="ml-3 flex-1">
+                                    <el-form-item label="图片名称">
+                                        <el-input
+                                            v-model="item.name"
+                                            placeholder="请输入名称"
+                                        />
+                                    </el-form-item>
+                                    <el-form-item class="mt-[18px]" label="图片链接">
+                                        <link-picker v-model="item.link"/>
+                                    </el-form-item>
+                                    <el-form-item label="是否显示" class="mt-[18px]">
+                                        <div class="flex-1 flex items-center">
+                                            <el-switch
+                                                v-model="item.is_show"
+                                                active-value="1"
+                                                inactive-value="0"
+                                            />
+                                            <div class="drag-move cursor-move ml-auto">
+                                                <icon name="el-icon-Rank" size="18"/>
+                                            </div>
+                                        </div>
+                                    </el-form-item>
+                                </div>
+                            </div>
+                        </del-wrap>
+                    </template>
+                </draggable>
+                <div class="mt-4" v-if="content.data?.length < limit">
+                    <el-button class="w-full" type="primary" @click="handleAdd">添加图片</el-button>
+                </div>
+            </el-card>
+        </el-form>
+    </div>
+</template>
+<script lang="ts" setup>
+import feedback from '@/utils/feedback'
+import type {PropType} from 'vue'
+import type options from './options'
+import Draggable from 'vuedraggable'
+
+const limit = 5
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+
+const handleAdd = () => {
+    if (props.content.data?.length < limit) {
+        props.content.data.push({
+            image: '',
+            name: '',
+            link: {}
+        })
+    } else {
+        feedback.msgError(`最多添加${limit}张图片`)
+    }
+}
+const handleDelete = (index: number) => {
+    if (props.content.data?.length <= 1) {
+        return feedback.msgError('最少保留一张图片')
+    }
+    props.content.data.splice(index, 1)
+}
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/user-banner/content.vue b/src/views/decoration/component/widgets/user-banner/content.vue
new file mode 100644
index 0000000..9668070
--- /dev/null
+++ b/src/views/decoration/component/widgets/user-banner/content.vue
@@ -0,0 +1,34 @@
+<template>
+    <div class="banner mx-[10px] mt-[10px]">
+        <div class="banner-image">
+            <decoration-img width="100%" height="100px" :src="getImage" fit="contain" />
+        </div>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type options from './options'
+import DecorationImg from '../../decoration-img.vue'
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+const showList = computed(() => {
+    return props.content.data?.filter((item: any) => item.is_show == '1') || []
+})
+const getImage = computed(() => {
+    if (Array.isArray(showList.value)) {
+        return showList.value[0] ? showList.value[0].image : ''
+    }
+    return ''
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/user-banner/index.ts b/src/views/decoration/component/widgets/user-banner/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/user-banner/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/user-banner/options.ts b/src/views/decoration/component/widgets/user-banner/options.ts
new file mode 100644
index 0000000..4adc70e
--- /dev/null
+++ b/src/views/decoration/component/widgets/user-banner/options.ts
@@ -0,0 +1,15 @@
+export default () => ({
+    title: '个人中心广告图',
+    name: 'user-banner',
+    content: {
+        enabled: 1,
+        data: [
+            {
+                image: '',
+                name: '',
+                link: {}
+            }
+        ]
+    },
+    styles: {}
+})
diff --git a/src/views/decoration/component/widgets/user-info/attr.vue b/src/views/decoration/component/widgets/user-info/attr.vue
new file mode 100644
index 0000000..93f9278
--- /dev/null
+++ b/src/views/decoration/component/widgets/user-info/attr.vue
@@ -0,0 +1,20 @@
+<template>
+    <div></div>
+</template>
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type options from './options'
+type OptionsType = ReturnType<typeof options>
+const props = defineProps({
+    content: {
+        type: Object as PropType<OptionsType['content']>,
+        default: () => ({})
+    },
+    styles: {
+        type: Object as PropType<OptionsType['styles']>,
+        default: () => ({})
+    }
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/decoration/component/widgets/user-info/content.vue b/src/views/decoration/component/widgets/user-info/content.vue
new file mode 100644
index 0000000..b64e7e7
--- /dev/null
+++ b/src/views/decoration/component/widgets/user-info/content.vue
@@ -0,0 +1,16 @@
+<template>
+    <div class="user-info flex items-center px-[25px]">
+        <img src="./images/default_avatar.png" class="w-[60px] h-[60px]" alt="" />
+        <div class="text-white text-[18px] ml-[10px]">未登录</div>
+    </div>
+</template>
+<script lang="ts" setup></script>
+
+<style lang="scss" scoped>
+.user-info {
+    background: url(./images/my_topbg.png);
+    height: 115px;
+    background-position: bottom;
+    background-size: 100% auto;
+}
+</style>
diff --git a/src/views/decoration/component/widgets/user-info/images/default_avatar.png b/src/views/decoration/component/widgets/user-info/images/default_avatar.png
new file mode 100644
index 0000000..de31d02
Binary files /dev/null and b/src/views/decoration/component/widgets/user-info/images/default_avatar.png differ
diff --git a/src/views/decoration/component/widgets/user-info/images/my_topbg.png b/src/views/decoration/component/widgets/user-info/images/my_topbg.png
new file mode 100644
index 0000000..8984438
Binary files /dev/null and b/src/views/decoration/component/widgets/user-info/images/my_topbg.png differ
diff --git a/src/views/decoration/component/widgets/user-info/index.ts b/src/views/decoration/component/widgets/user-info/index.ts
new file mode 100644
index 0000000..c776bce
--- /dev/null
+++ b/src/views/decoration/component/widgets/user-info/index.ts
@@ -0,0 +1,8 @@
+import attr from './attr.vue'
+import content from './content.vue'
+import options from './options'
+export default {
+    attr,
+    content,
+    options
+}
diff --git a/src/views/decoration/component/widgets/user-info/options.ts b/src/views/decoration/component/widgets/user-info/options.ts
new file mode 100644
index 0000000..b346829
--- /dev/null
+++ b/src/views/decoration/component/widgets/user-info/options.ts
@@ -0,0 +1,7 @@
+export default () => ({
+    title: '用户信息',
+    name: 'user-info',
+    disabled: 1,
+    content: {},
+    styles: {}
+})
diff --git a/src/views/decoration/image/pc_index.png b/src/views/decoration/image/pc_index.png
new file mode 100644
index 0000000..be3e5f9
Binary files /dev/null and b/src/views/decoration/image/pc_index.png differ
diff --git a/src/views/decoration/pages/index.vue b/src/views/decoration/pages/index.vue
new file mode 100644
index 0000000..ac42aea
--- /dev/null
+++ b/src/views/decoration/pages/index.vue
@@ -0,0 +1,132 @@
+<template>
+    <div class="decoration-pages min-w-[1100px]">
+        <div class="flex flex-1 h-full justify-between">
+            <el-card
+                shadow="never"
+                class="!border-none flex scroll-view-content"
+                :body-style="{ 'padding-right': 0 }"
+            >
+                <Menu v-model="activeMenu" :menus="menus" />
+            </el-card>
+
+            <preview
+                class="flex-1 scroll-view-content"
+                v-model="selectWidgetIndex"
+                :pageData="getPageData"
+                :pageMeta="getPageMeta"
+            />
+
+            <attr-setting class="w-[560px] scroll-view-content" :widget="getSelectWidget" />
+        </div>
+        <footer-btns class="mt-4" :fixed="false" v-perms="['decorate:pages:save']">
+            <el-button type="primary" @click="setData">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+<script lang="ts" setup name="decorationPages">
+import Menu from '../component/pages/menu.vue'
+import Preview from '../component/pages/preview.vue'
+import AttrSetting from '../component/pages/attr-setting.vue'
+import widgets from '../component/widgets'
+import { getDecoratePages, setDecoratePages } from '@/api/decoration'
+import { getNonDuplicateID } from '@/utils/util'
+enum pagesTypeEnum {
+    HOME = '1',
+    USER = '2',
+    SERVICE = '3'
+}
+
+const generatePageData = (widgetNames: string[]) => {
+    return widgetNames.map((widgetName) => {
+        const options = {
+            id: getNonDuplicateID(),
+            ...(widgets[widgetName]?.options() || {})
+        }
+        return options
+    })
+}
+
+const menus: Record<
+    string,
+    {
+        id: number
+        name: string
+        pageMeta?: any,
+        pageData: any[]
+    }
+> = reactive({
+    [pagesTypeEnum.HOME]: {
+        id: 1,
+        type: 1,
+        name: '首页装修',
+        pageMeta: generatePageData(['page-meta']),
+        pageData: generatePageData(['search', 'banner', 'nav', 'news'])
+    },
+    [pagesTypeEnum.USER]: {
+        id: 2,
+        type: 2,
+        name: '个人中心',
+        pageMeta: generatePageData(['page-meta']),
+        pageData: generatePageData(['user-info', 'my-service', 'user-banner'])
+    },
+    [pagesTypeEnum.SERVICE]: {
+        id: 3,
+        type: 3,
+        name: '客服设置',
+        pageMeta: null,
+        pageData: generatePageData(['customer-service'])
+    }
+})
+
+const activeMenu = ref('1')
+const selectWidgetIndex = ref(-1)
+const getPageData = computed(() => {
+    return menus[activeMenu.value]?.pageData ?? []
+})
+const getPageMeta = computed(() => {
+    return menus[activeMenu.value]?.pageMeta ?? null
+})
+const getSelectWidget = computed(() => {
+    if (selectWidgetIndex.value === -1) {
+        return menus[activeMenu.value]?.pageMeta[0] ?? ''
+    } else {
+        return menus[activeMenu.value]?.pageData[selectWidgetIndex.value] ?? ''
+    }
+})
+
+const getData = async () => {
+    const data = await getDecoratePages({ id: activeMenu.value })
+    menus[String(data.id)].pageData = JSON.parse(data.data)
+    menus[String(data.id)].pageMeta = data?.meta ? JSON.parse(data?.meta) : null
+}
+
+const setData = async () => {
+    const data = menus[activeMenu.value]
+    await setDecoratePages({
+        ...data,
+        data: JSON.stringify(data.pageData),
+        meta: data?.pageMeta ? JSON.stringify(data?.pageMeta) : null
+    })
+    getData()
+}
+watch(
+    activeMenu,
+    () => {
+        selectWidgetIndex.value = getPageData.value.findIndex((item) => !item.disabled)
+        getData()
+    },
+    {
+        immediate: true
+    }
+)
+</script>
+<style lang="scss" scoped>
+$scroll-height: calc(100vh - var(--navbar-height) - 74px);
+.decoration-pages {
+    height: $scroll-height;
+    @apply flex flex-col;
+    .scroll-view-content {
+        height: calc($scroll-height - 60px);
+    }
+}
+</style>
diff --git a/src/views/decoration/pc.vue b/src/views/decoration/pc.vue
new file mode 100644
index 0000000..3c36bd0
--- /dev/null
+++ b/src/views/decoration/pc.vue
@@ -0,0 +1,40 @@
+<template>
+    <div class="decoration-pc min-w-[1100px]">
+        <el-card shadow="never" class="!border-none flex-1 flex">
+            <div class="text-xl font-medium">首页装修</div>
+            <router-link :to="{
+                path: '/decoration/pc_details',
+                query: {
+                    url: state.pc_url
+                }
+            }">
+                <el-button class="m-5" type="primary" size="large">去装修</el-button>
+            </router-link>
+            <el-form>
+                <el-form-item label="最近更新">{{ state.update_time }}</el-form-item>
+                <el-form-item label="PC端链接">
+                    <el-input style="width: 350px" v-model="state.pc_url" disabled></el-input>
+                    <el-button type="primary" v-copy="state.pc_url">复制</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup name="decorationPc">
+import { getDecoratePc } from '@/api/decoration'
+
+const state = ref({
+    update_time: '',
+    pc_url: ''
+})
+
+const getData = async () => {
+    try {
+        state.value = await getDecoratePc()
+    } catch (error) {
+        console.log(error)
+    }
+}
+
+getData()
+</script>
diff --git a/src/views/decoration/pc_details.vue b/src/views/decoration/pc_details.vue
new file mode 100644
index 0000000..69c7d3b
--- /dev/null
+++ b/src/views/decoration/pc_details.vue
@@ -0,0 +1,94 @@
+<template>
+    <div class="decoration-pages min-w-[1100px]">
+        <el-card shadow="never" class="!border-none !rounded-none !bg-primary">
+            <div class="flex justify-between w-full">
+                <el-button
+                    link
+                    type="primary"
+                    :icon="ArrowLeft"
+                    style="color: #fff"
+                    @click="handleBack"
+                >
+                    返回
+                </el-button>
+                <el-button v-perms="['decorate:pages:save']" @click="setData">
+                    保存
+                </el-button>
+            </div>
+        </el-card>
+        <div class="flex-1 h-full">
+            <preview-pc v-model="selectWidgetIndex" :pageData="getPageData"/>
+        </div>
+    </div>
+</template>
+<script lang="ts" setup name="decorationPc">
+import PreviewPc from './component/pages/preview-pc.vue'
+import widgets from './component/widgets'
+import {getDecoratePages, setDecoratePages} from '@/api/decoration'
+import {getNonDuplicateID} from '@/utils/util'
+import {ArrowLeft} from "@element-plus/icons-vue";
+import feedback from "@/utils/feedback";
+
+const router = useRouter()
+
+enum pagesTypeEnum {
+    HOME = '4'
+}
+
+const menus: Record<
+    string,
+    {
+        id: number
+        name: string
+        pageData: any[]
+    }
+> = reactive({
+    [pagesTypeEnum.HOME]: {
+        id: 4,
+        type: 4,
+        name: '首页装修',
+        pageData: []
+    }
+})
+
+const activeMenu = ref('4')
+const selectWidgetIndex = ref(0)
+const getPageData = computed(() => {
+    return menus[activeMenu.value]?.pageData ?? []
+})
+
+const handleBack = async () => {
+    await feedback.confirm('确定离开此页面？系统可能不会保存您所做的更改。')
+    router.back()
+}
+
+const getData = async () => {
+    const data = await getDecoratePages({id: activeMenu.value})
+    menus[String(data.id)].pageData = JSON.parse(data.data)
+    selectWidgetIndex.value = getPageData.value.findIndex((item) => !item.disabled)
+}
+
+const setData = async () => {
+    await setDecoratePages({
+        ...menus[activeMenu.value],
+        data: JSON.stringify(menus[activeMenu.value].pageData)
+    })
+    getData()
+}
+watch(
+    activeMenu,
+    () => {
+        selectWidgetIndex.value = getPageData.value.findIndex((item) => !item.disabled)
+        getData()
+    },
+    {
+        immediate: true
+    }
+)
+</script>
+<style lang="scss" scoped>
+.decoration-pages {
+    min-height: calc(100vh);
+    @apply flex flex-col;
+}
+</style>
diff --git a/src/views/decoration/style/components/mobile-style.vue b/src/views/decoration/style/components/mobile-style.vue
new file mode 100644
index 0000000..13c3485
--- /dev/null
+++ b/src/views/decoration/style/components/mobile-style.vue
@@ -0,0 +1,136 @@
+<template>
+    <el-form label-width="140px">
+        <div>
+            <div class="text-xl font-medium mb-[20px]">系统主题色</div>
+            <el-form-item label-width="50">
+                <ThemePicker
+                    v-model="formData.themeColorId"
+                    :theme-colors="themeColors"
+                    @change="selectThemeColor"
+                />
+            </el-form-item>
+        </div>
+        <div>
+            <div class="text-xl font-medium mt-[40px] mb-[20px]">样式设置</div>
+
+            <el-form-item label="导航顶部文字颜色">
+                <div>
+                    <el-radio-group v-model="formData.topTextColor">
+                        <el-radio label="white" size="large">白色</el-radio>
+                        <el-radio label="black" size="large">黑色</el-radio>
+                    </el-radio-group>
+                    <div>
+                        <span class="form-tips">页面导航栏文字的颜色</span>
+                    </div>
+                </div>
+            </el-form-item>
+            <el-form-item label="导航顶部背景颜色">
+                <div>
+                    <color-picker
+                        :resetColor="formData.themeColor1"
+                        v-model="formData.navigationBarColor"
+                    ></color-picker>
+                    <div>
+                        <span class="form-tips"> 页面顶部导航栏背景颜色，不设置则跟随主题色 </span>
+                    </div>
+                </div>
+            </el-form-item>
+            <el-form-item label="自定义主题颜色" v-if="formData.themeColorId == 7">
+                <div>
+                    <color-picker
+                        v-model="formData.themeColor1"
+                        default-color="#F8F8F8"
+                    ></color-picker>
+                    <color-picker
+                        v-model="formData.themeColor2"
+                        default-color="#F8F8F8"
+                        class="mt-2"
+                    ></color-picker>
+                    <div>
+                        <span class="form-tips">自定义主题渐变色，用于按钮类和主要文字</span>
+                    </div>
+                </div>
+            </el-form-item>
+            <el-form-item label="按钮文字颜色">
+                <div>
+                    <el-radio-group v-model="formData.buttonColor">
+                        <el-radio label="white" size="large">白色</el-radio>
+                        <el-radio label="black" size="large">黑色</el-radio>
+                    </el-radio-group>
+                </div>
+            </el-form-item>
+        </div>
+        <div>
+            <div class="flex" v-if="formData.themeColorId == 1">
+                <img class="w-[200px]" src="@/assets/images/blue1.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/blue2.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/blue3.png" />
+            </div>
+            <div class="flex" v-if="formData.themeColorId == 2">
+                <img class="w-[200px]" src="@/assets/images/green1.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/green2.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/green3.png" />
+            </div>
+            <div class="flex" v-if="formData.themeColorId == 3">
+                <img class="w-[200px]" src="@/assets/images/purple1.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/purple2.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/purple3.png" />
+            </div>
+            <div class="flex" v-if="formData.themeColorId == 4">
+                <img class="w-[200px]" src="@/assets/images/yellow1.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/yellow2.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/yellow3.png" />
+            </div>
+            <div class="flex" v-if="formData.themeColorId == 5">
+                <img class="w-[200px]" src="@/assets/images/red1.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/red2.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/red3.png" />
+            </div>
+            <div class="flex" v-if="formData.themeColorId == 6">
+                <img class="w-[200px]" src="@/assets/images/pink1.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/pink2.png" />
+                <img class="w-[200px] ml-[30px]" src="@/assets/images/pink3.png" />
+            </div>
+        </div>
+    </el-form>
+</template>
+<script setup lang="ts">
+import ThemePicker from './theme-picker.vue'
+import { useVModel } from '@vueuse/core'
+const props = defineProps<{
+    modelValue: Record<string, any>
+}>()
+const themeColors = ref([
+    {
+        id: 1,
+        name: '科技蓝',
+        color1: '#2F80ED',
+        color2: '#56CCF2',
+        btnColor: 'white'
+    },
+    { id: 2, name: '偏绿蓝', color1: '#2EC840', color2: '#3DE650', btnColor: 'white' },
+    { id: 3, name: '商务紫', color1: '#A74BFD', color2: '#CB60FF', btnColor: 'white' },
+    { id: 4, name: '活力橙', color1: '#F7971E', color2: '#FFD200', btnColor: 'black' },
+    { id: 5, name: '经典红', color1: '#FF2C3C', color2: '#EF1D2D', btnColor: 'white' },
+    { id: 6, name: '美妆色', color1: '#FD498F', color2: '#FA444D', btnColor: 'white' },
+    { id: 7, name: '自定义', color1: '#F8F8F8', color2: '#F5F5F5', btnColor: 'white' },
+])
+
+
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: Record<string, any>): void
+}>()
+
+//选择主题颜色
+const selectThemeColor = (item: any) => {
+    if (item.id != 7) {
+        formData.value.themeColor1 = item.color1
+        formData.value.themeColor2 = item.color2
+        formData.value.navigationBarColor = item.color1
+        formData.value.buttonColor = item.btnColor
+        formData.value.topTextColor = item.btnColor
+    }
+}
+//表单数据
+const formData = useVModel(props, 'modelValue', emit)
+</script>
diff --git a/src/views/decoration/style/components/theme-picker.vue b/src/views/decoration/style/components/theme-picker.vue
new file mode 100644
index 0000000..e0976c0
--- /dev/null
+++ b/src/views/decoration/style/components/theme-picker.vue
@@ -0,0 +1,53 @@
+<template>
+    <div class="flex flex-wrap">
+        <div
+            class="py-[18px] px-[20px] flex items-center text-[14px] shadow rounded-lg mr-[20px] mb-[20px] cursor-pointer"
+            :class="{ 'is-select': selectId == item.id, unselect: selectId != item.id }"
+            v-for="(item, index) in themeColors"
+            :key="index"
+            @click="handleSelect(item)"
+        >
+            <div
+                class="rounded-full h-[34px] w-[34px]"
+                :style="`background: linear-gradient(to right, ${item.color1}, ${item.color2})`"
+            ></div>
+            <div class="ml-[14px]">{{ item.name }}</div>
+        </div>
+    </div>
+</template>
+<script setup lang="ts">
+import { useVModel } from '@vueuse/core'
+
+interface IThemeColors {
+    id: number
+    name: string
+    color1: string
+    color2: string
+    btnColor: string
+}
+const props = defineProps<{
+    themeColors: IThemeColors[]
+    modelValue: number | string
+}>()
+
+const emit = defineEmits<{
+    (event: 'update:modelValue', id: number | string): void
+    (event: 'change', item: IThemeColors): void
+}>()
+//主题色
+
+const selectId = useVModel(props, 'modelValue', emit)
+const handleSelect = (item: IThemeColors) => {
+    selectId.value = item.id
+    emit('change', item)
+}
+</script>
+<style lang="scss" scoped>
+.is-select {
+    border: 1px solid #4153ff;
+}
+
+.unselect {
+    border: 1px solid transparent;
+}
+</style>
diff --git a/src/views/decoration/style/style.vue b/src/views/decoration/style/style.vue
new file mode 100644
index 0000000..39bbf3f
--- /dev/null
+++ b/src/views/decoration/style/style.vue
@@ -0,0 +1,60 @@
+<template>
+    <el-card shadow="never" class="!border-none">
+        <div class="mt-[-10px]">
+            <el-tabs v-model="currentTabIndex" @tab-change="">
+                <el-tab-pane
+                    v-for="(item, index) in tabsList"
+                    :key="item.id"
+                    :label="item.name"
+                    :name="index"
+                >
+                    <component :is="item.component" v-model="item.data" />
+                </el-tab-pane>
+            </el-tabs>
+        </div>
+    </el-card>
+    <footer-btns class="mt-4" :fixed="true">
+        <el-button type="primary" @click="setData">保存</el-button>
+    </footer-btns>
+</template>
+<script setup lang="ts">
+import { getDecoratePages, setDecoratePages } from '@/api/decoration'
+import MobileStyle from './components/mobile-style.vue'
+const currentTabIndex = ref(0)
+const tabsList = ref([
+    {
+        name: '移动端',
+        id: 5,
+        component: MobileStyle,
+        data: {
+            themeColorId: 1,
+            topTextColor: 'white',
+            navigationBarColor: '',
+            themeColor1: '',
+            themeColor2: '',
+            buttonColor: 'white'
+        }
+    }
+])
+const currentTab = computed(() => tabsList.value[currentTabIndex.value] || {})
+//获取数据
+const getData = async () => {
+    const res = await getDecoratePages({ id: currentTab.value.id })
+    currentTab.value.data = JSON.parse(res.data)
+}
+
+//保存数据
+const setData = async () => {
+    await setDecoratePages({
+        id: currentTab.value.id,
+        type: currentTab.value.id,
+        data: JSON.stringify(currentTab.value.data)
+    })
+    getData()
+}
+
+//初始化数据
+onMounted(async () => {
+    await getData()
+})
+</script>
diff --git a/src/views/decoration/tabbar.vue b/src/views/decoration/tabbar.vue
new file mode 100644
index 0000000..5a4b216
--- /dev/null
+++ b/src/views/decoration/tabbar.vue
@@ -0,0 +1,145 @@
+<template>
+    <div class="decoration-tabbar">
+        <div class="flex-1 min-h-0 w-full">
+            <div class="h-full">
+                <ElScrollbar>
+                    <div class="flex min-w-[900px] scroll-view-content">
+                        <el-card
+                            shadow="never"
+                            class="!border-none flex"
+                            :body-style="{ 'padding-right': 0 }"
+                        >
+                            <Menu class="!h-full flex-none" v-model="activeMenu" :menus="menus"/>
+                        </el-card>
+                        <div class="flex-1 pages-preview-box">
+                            <div class="pages-preview mx-[30px]">
+                                <el-scrollbar height="100%">
+                                    <component
+                                        :is="currentTab.component?.content"
+                                        v-bind="currentTab.data"
+                                    />
+                                </el-scrollbar>
+                            </div>
+                        </div>
+                        <el-scrollbar class="attr-setting flex-none">
+                            <div class="px-5 pb-5">
+                                <component
+                                    :is="currentTab.component?.attr"
+                                    v-model="currentTab.data"
+                                />
+                            </div>
+                        </el-scrollbar>
+                    </div>
+                </ElScrollbar>
+            </div>
+        </div>
+
+        <footer-btns :fixed="true" v-perms="['decorate:tabbar:save']">
+            <el-button type="primary" @click="setData">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+<script lang="ts" setup name="decorationTabbar">
+import {getDecorateTabbar, setDecorateTabbar} from '@/api/decoration'
+import Menu from './component/pages/menu.vue'
+import mobileTab from './component/tabbar/mobile'
+// import pcTab from './component/tabbar/pc'
+
+enum ClientTypeEnum {
+    MOBILE = '1',
+    PC = '2'
+}
+
+const activeMenu = ref(ClientTypeEnum.MOBILE)
+const menus: Record<
+    string,
+    {
+        id: number
+        name: string
+        type: number
+        data: any
+        component: any
+    }
+> = reactive({
+    [ClientTypeEnum.MOBILE]: {
+        id: 1,
+        type: 1,
+        name: '移动端导航栏',
+        data: {
+            style: {
+                default_color: '',
+                selected_color: ''
+            },
+            list: []
+        },
+        component: mobileTab
+    }
+})
+const currentTab = computed(() => {
+    return menus[activeMenu.value]
+})
+const getData = async () => {
+    const data = await getDecorateTabbar({
+        type: activeMenu.value
+    })
+    menus['1'].data = data
+}
+const setData = async () => {
+    const {data} = currentTab.value
+
+    await setDecorateTabbar({
+        ...data
+    })
+    getData()
+}
+
+watch(
+    activeMenu,
+    () => {
+        getData()
+    },
+    {
+        immediate: true
+    }
+)
+</script>
+<style lang="scss" scoped>
+$scroll-height: calc(100vh - var(--navbar-height) - 74px);
+.decoration-tabbar {
+    height: $scroll-height;
+    width: 100%;
+    @apply flex flex-col;
+    .scroll-view-content {
+        height: calc($scroll-height - 60px);
+    }
+
+    .pages-preview-box {
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        align-items: center;
+        height: 100%;
+
+        .pages-preview {
+            background-color: #ffffff;
+            width: 360px;
+            height: 615px;
+            color: #333;
+            position: relative;
+        }
+    }
+
+    .nav-item {
+        &:hover {
+            .drag-move {
+                display: block;
+            }
+        }
+    }
+
+    .attr-setting {
+        width: 450px;
+        height: 100%;
+    }
+}
+</style>
diff --git a/src/views/dev_tools/code/edit.vue b/src/views/dev_tools/code/edit.vue
new file mode 100644
index 0000000..6764088
--- /dev/null
+++ b/src/views/dev_tools/code/edit.vue
@@ -0,0 +1,528 @@
+<template>
+    <div class="code-edit">
+        <el-card class="!border-none" shadow="never">
+            <el-page-header content="编辑数据表" @back="$router.back()" />
+        </el-card>
+        <el-card class="mt-4 !border-none" shadow="never">
+            <el-form
+                ref="formRef"
+                class="ls-form"
+                :model="formData"
+                label-width="100px"
+                :rules="rules"
+            >
+                <el-tabs v-model="activeName">
+                    <el-tab-pane label="基础信息" name="base">
+                        <el-form-item label="表名称" prop="table_name">
+                            <div class="w-80">
+                                <el-input
+                                    v-model="formData.table_name"
+                                    placeholder="请输入表名称"
+                                    clearable
+                                />
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="表描述" prop="table_comment">
+                            <div class="w-80">
+                                <el-input
+                                    v-model="formData.table_comment"
+                                    placeholder="请输入表描述"
+                                    clearable
+                                />
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="作者">
+                            <div class="w-80">
+                                <el-input v-model="formData.author" clearable />
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="备注">
+                            <div class="w-80">
+                                <el-input
+                                    v-model="formData.remark"
+                                    class="w-full"
+                                    type="textarea"
+                                    :autosize="{ minRows: 4, maxRows: 4 }"
+                                    maxlength="200"
+                                    show-word-limit
+                                    clearable
+                                />
+                            </div>
+                        </el-form-item>
+                    </el-tab-pane>
+                    <el-tab-pane label="字段管理" name="column">
+                        <el-table :data="formData.table_column">
+                            <el-table-column label="字段列名" prop="column_name" />
+                            <el-table-column label="字段描述" prop="column_comment" min-width="120">
+                                <template v-slot="{ row }">
+                                    <el-input v-model="row.column_comment" clearable />
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="物理类型" prop="column_type" />
+                            <el-table-column label="必填" width="80">
+                                <template v-slot="{ row }">
+                                    <el-checkbox
+                                        v-model="row.is_required"
+                                        :true-label="1"
+                                        :false-label="0"
+                                    />
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="插入" width="80">
+                                <template v-slot="{ row }">
+                                    <el-checkbox
+                                        v-model="row.is_insert"
+                                        :true-label="1"
+                                        :false-label="0"
+                                    />
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="编辑" width="80">
+                                <template v-slot="{ row }">
+                                    <el-checkbox
+                                        v-model="row.is_update"
+                                        :true-label="1"
+                                        :false-label="0"
+                                    />
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="列表" width="80">
+                                <template v-slot="{ row }">
+                                    <el-checkbox
+                                        v-model="row.is_lists"
+                                        :true-label="1"
+                                        :false-label="0"
+                                    />
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="查询" width="80">
+                                <template v-slot="{ row }">
+                                    <el-checkbox
+                                        v-model="row.is_query"
+                                        :true-label="1"
+                                        :false-label="0"
+                                    />
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="查询方式">
+                                <template v-slot="{ row }">
+                                    <el-select v-model="row.query_type">
+                                        <el-option label="=" value="=" />
+                                        <el-option label="!=" value="!=" />
+                                        <el-option label=">" value=">" />
+                                        <el-option label=">=" value=">=" />
+                                        <el-option label="<" value="<" />
+                                        <el-option label="<=" value="<=" />
+                                        <el-option label="LIKE" value="like" />
+                                        <el-option label="BETWEEN" value="between" />
+                                    </el-select>
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="显示类型" min-width="120">
+                                <template v-slot="{ row }">
+                                    <el-select v-model="row.view_type">
+                                        <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="imageSelect" />
+                                        <el-option label="富文本控件" value="editor" />
+                                    </el-select>
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="字典类型" min-width="120">
+                                <template v-slot="{ row }">
+                                    <el-select
+                                        v-model="row.dict_type"
+                                        clearable
+                                        :disabled="
+                                            !(
+                                                row.view_type == 'select' ||
+                                                row.view_type == 'radio' ||
+                                                row.view_type == 'checkbox'
+                                            )
+                                        "
+                                        placeholder="字典类型"
+                                    >
+                                        <el-option
+                                            v-for="(item, index) in optionsData.dict_type"
+                                            :key="index"
+                                            :label="item.name"
+                                            :value="item.type"
+                                            :disabled="!item.status"
+                                        />
+                                    </el-select>
+                                </template>
+                            </el-table-column>
+                        </el-table>
+                    </el-tab-pane>
+                    <el-tab-pane label="生成配置" name="config">
+                        <el-form-item label="模板类型" prop="template_type">
+                            <el-radio-group v-model="formData.template_type">
+                                <el-radio :label="0">单表（curd）</el-radio>
+                                <el-radio :label="1">树表（curd）</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                        <el-form-item label="删除类型" prop="delete.type">
+                            <el-radio-group v-model="formData.delete.type">
+                                <el-radio :label="0">物理删除</el-radio>
+                                <el-radio :label="1">软删除</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                        <el-form-item
+                            label="删除字段"
+                            prop="delete.name"
+                            v-if="formData.delete.type == 1"
+                        >
+                            <el-select class="w-80" v-model="formData.delete.name" clearable>
+                                <el-option
+                                    v-for="item in formData.table_column"
+                                    :key="item.id"
+                                    :value="item.column_name"
+                                    :label="`${item.column_name}：${item.column_comment}`"
+                                />
+                            </el-select>
+                        </el-form-item>
+                        <template v-if="formData.template_type == 1">
+                            <el-form-item label="树表ID" prop="treePrimary">
+                                <div>
+                                    <el-select
+                                        class="w-80"
+                                        v-model="formData.tree.tree_id"
+                                        clearable
+                                    >
+                                        <el-option
+                                            v-for="item in formData.table_column"
+                                            :key="item.id"
+                                            :value="item.column_name"
+                                            :label="`${item.column_name}：${item.column_comment}`"
+                                        />
+                                    </el-select>
+                                    <div class="form-tips">指定树表的主要ID，一般为主键</div>
+                                </div>
+                            </el-form-item>
+                            <el-form-item label="树表父ID" prop="treeParent">
+                                <div>
+                                    <el-select
+                                        class="w-80"
+                                        v-model="formData.tree.tree_pid"
+                                        clearable
+                                    >
+                                        <el-option
+                                            v-for="item in formData.table_column"
+                                            :key="item.id"
+                                            :value="item.column_name"
+                                            :label="`${item.column_name}：${item.column_comment}`"
+                                        />
+                                    </el-select>
+                                    <div class="form-tips">指定树表的父ID，比如：parent_id</div>
+                                </div>
+                            </el-form-item>
+                            <el-form-item label="树名称" prop="treeName">
+                                <el-select class="w-80" v-model="formData.tree.tree_name" clearable>
+                                    <el-option
+                                        v-for="item in formData.table_column"
+                                        :key="item.id"
+                                        :value="item.column_name"
+                                        :label="`${item.column_name}：${item.column_comment}`"
+                                    />
+                                </el-select>
+                            </el-form-item>
+                        </template>
+                        <el-form-item label="类描述">
+                            <div class="w-80">
+                                <div>
+                                    <el-input
+                                        v-model="formData.class_comment"
+                                        placeholder="请输入文件描述"
+                                        clearable
+                                    />
+                                </div>
+                                <div class="form-tips">
+                                    <div>
+                                        例：填写test,生成文件描述为test控制器(test逻辑/test模型)
+                                    </div>
+                                </div>
+                            </div>
+                        </el-form-item>
+
+                        <el-form-item label="生成方式" prop="generate_type">
+                            <el-radio-group v-model="formData.generate_type">
+                                <el-radio :label="0">压缩包下载</el-radio>
+                                <el-radio :label="1">生成到模块</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                        <el-form-item label="模块名" prop="module_name">
+                            <div class="w-80">
+                                <el-input
+                                    v-model="formData.module_name"
+                                    placeholder="请输入模块名"
+                                    clearable
+                                />
+                                <div class="form-tips">生成文件所在模块</div>
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="类目录">
+                            <div class="w-80">
+                                <div>
+                                    <el-input
+                                        v-model="formData.class_dir"
+                                        placeholder="请输入文件所在目录"
+                                        clearable
+                                    />
+                                </div>
+                                <div class="form-tips">
+                                    <div>
+                                        例：填写test,则在app/模块名/controller/test下生成控制器
+                                    </div>
+                                </div>
+                            </div>
+                        </el-form-item>
+
+                        <el-form-item label="父级菜单" prop="menu.pid">
+                            <el-tree-select
+                                class="w-80"
+                                v-model="formData.menu.pid"
+                                :data="optionsData.menu"
+                                clearable
+                                node-key="id"
+                                :props="{
+                                    label: 'name'
+                                }"
+                                default-expand-all
+                                placeholder="请选择父级菜单"
+                                check-strictly
+                            />
+                        </el-form-item>
+                        <el-form-item label="菜单名称" prop="menu.name">
+                            <div class="w-80">
+                                <el-input
+                                    v-model="formData.menu.name"
+                                    placeholder="请输入菜单名称"
+                                    clearable
+                                />
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="菜单构建" prop="menu.type" required>
+                            <div>
+                                <el-radio-group v-model="formData.menu.type">
+                                    <el-radio :label="1">自动构建</el-radio>
+                                    <el-radio :label="0">手动添加</el-radio>
+                                </el-radio-group>
+                                <div class="form-tips">
+                                    自动构建：自动执行生成菜单sql。手动添加：自行添加菜单。
+                                </div>
+                            </div>
+                        </el-form-item>
+                    </el-tab-pane>
+                    <el-tab-pane label="关联配置" name="relations">
+                        <el-button type="primary" @click="showEditPopup('add')">
+                            <template #icon>
+                                <icon name="el-icon-Plus" />
+                            </template>
+                            新增关联
+                        </el-button>
+                        <div class="mt-4">
+                            <el-table :data="formData.relations" size="mini">
+                                <el-table-column prop="type" label="关联类型">
+                                    <template #default="{ row }">
+                                        <dict-value :value="row.type" :options="relationTypes" />
+                                    </template>
+                                </el-table-column>
+                                <el-table-column prop="name" label="关联名称" />
+                                <el-table-column prop="model" label="关联模型" />
+                                <el-table-column prop="local_key" label="关联键">
+                                    <template #default="{ row }">
+                                        <dict-value
+                                            :value="row.local_key"
+                                            :options="formData.table_column"
+                                            :config="{
+                                                label: 'column_comment',
+                                                value: 'column_name'
+                                            }"
+                                        />
+                                    </template>
+                                </el-table-column>
+                                <el-table-column prop="foreign_key" label="外键" />
+                                <el-table-column label="操作">
+                                    <template #default="{ row, $index }">
+                                        <el-button
+                                            link
+                                            type="primary"
+                                            @click="showEditPopup('edit', row, $index)"
+                                        >
+                                            编辑
+                                        </el-button>
+                                        <el-button link type="danger" @click="handelDelete($index)">
+                                            删除
+                                        </el-button>
+                                    </template>
+                                </el-table-column>
+                            </el-table>
+                            <relations-add
+                                :column="formData.table_column"
+                                :types="relationTypes"
+                                v-if="showEdit"
+                                ref="editRef"
+                                @add="handleAdd"
+                                @edit="handleEdit"
+                                @close="showEdit = false"
+                            />
+                        </div>
+                    </el-tab-pane>
+                </el-tabs>
+            </el-form>
+        </el-card>
+        <footer-btns>
+            <el-button type="primary" @click="onSubmit">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script lang="ts" setup name="tableEdit">
+import { generateEdit, tableDetail } from '@/api/tools/code'
+import type { FormInstance } from 'element-plus'
+import feedback from '@/utils/feedback'
+import { useDictOptions } from '@/hooks/useDictOptions'
+import { dictTypeAll } from '@/api/setting/dict'
+import { menuAll } from '@/api/perms/menu'
+import RelationsAdd from '../components/relations-add.vue'
+import { cloneDeep } from 'lodash'
+const route = useRoute()
+const router = useRouter()
+const activeName = ref('column')
+const showEdit = ref(false)
+const relationTypes = [
+    {
+        name: '一对一',
+        value: 'has_one'
+    },
+    {
+        name: '一对多',
+        value: 'has_many'
+    }
+]
+const formData = reactive({
+    id: '',
+    table_name: '',
+    table_comment: '',
+    author: '',
+    remark: '',
+    template_type: 0,
+    generate_type: 0,
+    module_name: '',
+    class_dir: '',
+    class_comment: '',
+    table_column: [] as any[],
+    menu: {
+        pid: 0,
+        name: '',
+        type: 0
+    },
+    tree: {
+        tree_id: 0,
+        tree_pid: 0,
+        tree_name: 0
+    },
+    delete: {
+        name: '',
+        type: 0
+    },
+    relations: [] as any[]
+})
+let editIndex = 0
+const formRef = shallowRef<FormInstance>()
+const editRef = shallowRef<InstanceType<typeof RelationsAdd>>()
+const rules = reactive({
+    table_name: [{ required: true, message: '请输入表名称' }],
+    table_comment: [{ required: true, message: '请输入表描述' }],
+    module_name: [{ required: true, message: '请输入模块名' }],
+    generate_type: [{ required: true, trigger: 'change' }],
+    template_type: [{ required: true, trigger: 'change' }],
+    ['menu.pid']: [{ required: true, message: '请选择父级菜单' }],
+    ['menu.name']: [{ required: true, message: '请输入菜单名称' }],
+    ['delete.type']: [{ required: true, trigger: 'change' }],
+    ['delete.name']: [{ required: true, message: '请选择删除字段' }]
+})
+
+const showEditPopup = async (type: string, data?: any, index?: number) => {
+    showEdit.value = true
+    await nextTick()
+    if (data && index !== undefined) {
+        editRef.value?.setFormData(data)
+        editIndex = index
+    }
+    editRef.value?.open(type)
+}
+
+const handleAdd = (data: any) => {
+    const newData = cloneDeep(toRaw(data))
+    formData.relations.push(newData)
+}
+
+const handleEdit = async (data: any) => {
+    const newData = cloneDeep(toRaw(data))
+    console.log(editIndex)
+    formData.relations.splice(editIndex, 1, newData)
+}
+
+const handelDelete = (index: number) => {
+    formData.relations.splice(index, 1)
+}
+const getDetails = async () => {
+    const data = await tableDetail({
+        id: route.query.id
+    })
+    Object.keys(formData).forEach((key) => {
+        //@ts-ignore
+        formData[key] = data[key]
+    })
+
+    watch(
+        () => formData.generate_type,
+        (value) => {
+            if (value == 1) {
+                feedback
+                    .confirm('生成到模块方式如遇同名文件会覆盖旧文件，确定要选择此方式吗？')
+                    .catch(() => {
+                        formData.generate_type = 0
+                    })
+            }
+        }
+    )
+}
+
+const { optionsData } = useDictOptions<{
+    dict_type: any[]
+    menu: any[]
+}>({
+    dict_type: {
+        api: dictTypeAll
+    },
+    menu: {
+        api: menuAll,
+        transformData(data) {
+            const menu = { id: 0, name: '顶级', children: [] }
+            menu.children = data
+            return [menu]
+        }
+    }
+})
+
+const onSubmit = async () => {
+    try {
+        await formRef.value?.validate()
+        await generateEdit(formData)
+        router.back()
+    } catch (error: any) {
+        for (const err in error) {
+            const isInRules = Object.keys(rules).includes(err)
+            isInRules && feedback.msgError(error[err][0]?.message)
+        }
+    }
+}
+
+getDetails()
+</script>
diff --git a/src/views/dev_tools/code/index.vue b/src/views/dev_tools/code/index.vue
new file mode 100644
index 0000000..1e1fcec
--- /dev/null
+++ b/src/views/dev_tools/code/index.vue
@@ -0,0 +1,232 @@
+<template>
+    <div class="code-generation">
+        <el-card class="!border-none" shadow="never">
+            <el-form class="mb-[-16px]" :model="formData" inline>
+                <el-form-item label="表名称">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="formData.table_name"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="表描述">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="formData.table_comment"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never" v-loading="pager.loading">
+            <div class="flex">
+                <data-table
+                    v-perms="['tools.generator/selectTable']"
+                    class="inline-block mr-[10px]"
+                    @success="getLists"
+                >
+                    <el-button type="primary">
+                        <template #icon>
+                            <icon name="el-icon-Plus" />
+                        </template>
+                        导入数据表
+                    </el-button>
+                </data-table>
+                <el-button
+                    v-perms="['tools.generator/delete']"
+                    :disabled="!selectData.length"
+                    @click="handleDelete(selectData)"
+                    type="danger"
+                >
+                    <template #icon>
+                        <icon name="el-icon-Delete" />
+                    </template>
+                    删除
+                </el-button>
+                <el-button
+                    v-perms="['tools.generator/generate']"
+                    :disabled="!selectData.length"
+                    @click="handleGenerate(selectData)"
+                >
+                    生成代码
+                </el-button>
+            </div>
+            <div class="mt-4">
+                <el-table
+                    :data="pager.lists"
+                    size="large"
+                    @selection-change="handleSelectionChange"
+                >
+                    <el-table-column type="selection" width="55" />
+                    <el-table-column label="表名称" prop="table_name" min-width="180" />
+                    <el-table-column label="表描述" prop="table_comment" min-width="180" />
+                    <el-table-column label="创建时间" prop="create_time" min-width="180" />
+                    <el-table-column label="更新时间" prop="update_time" min-width="180" />
+                    <el-table-column label="操作" width="160" fixed="right">
+                        <template #default="{ row }">
+                            <div class="flex items-center">
+                                <el-button
+                                    v-perms="['tools.generator/preview']"
+                                    type="primary"
+                                    link
+                                    @click="handlePreview(row.id)"
+                                >
+                                    预览
+                                </el-button>
+
+                                <el-button type="primary" link>
+                                    <router-link
+                                        v-perms="['tools.generator/edit']"
+                                        :to="{
+                                            path: getRoutePath('tools.generator/edit'),
+                                            query: {
+                                                id: row.id
+                                            }
+                                        }"
+                                    >
+                                        编辑
+                                    </router-link>
+                                </el-button>
+                                <el-dropdown
+                                    class="ml-2"
+                                    @command="handleCommand($event, row)"
+                                    v-perms="[
+                                        'tools.generator/generate',
+                                        'tools.generator/syncColumn',
+                                        'tools.generator/delete'
+                                    ]"
+                                >
+                                    <el-button type="primary" link>
+                                        更多
+                                        <icon name="el-icon-ArrowDown" :size="14" />
+                                    </el-button>
+
+                                    <template #dropdown>
+                                        <el-dropdown-menu>
+                                            <div v-perms="['tools.generator/generate']">
+                                                <el-dropdown-item command="generate">
+                                                    <el-button type="primary" link>
+                                                        生成代码
+                                                    </el-button>
+                                                </el-dropdown-item>
+                                            </div>
+                                            <div v-perms="['tools.generator/syncColumn']">
+                                                <el-dropdown-item command="sync">
+                                                    <el-button type="primary" link>
+                                                        同步
+                                                    </el-button>
+                                                </el-dropdown-item>
+                                            </div>
+                                            <div v-perms="['tools.generator/delete']">
+                                                <el-dropdown-item command="delete">
+                                                    <el-button type="danger" link> 删除 </el-button>
+                                                </el-dropdown-item>
+                                            </div>
+                                        </el-dropdown-menu>
+                                    </template>
+                                </el-dropdown>
+                            </div>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </div>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <code-preview
+            v-if="previewState.show"
+            v-model="previewState.show"
+            :code="previewState.code"
+        />
+    </div>
+</template>
+
+<script lang="ts" setup name="codeGenerate">
+import {
+    generateTable,
+    syncColumn,
+    generateDelete,
+    generatePreview,
+    generateCode
+} from '@/api/tools/code'
+import { usePaging } from '@/hooks/usePaging'
+import DataTable from '../components/data-table.vue'
+import CodePreview from '../components/code-preview.vue'
+import feedback from '@/utils/feedback'
+import { isProdMode } from '@/utils/env'
+import { getRoutePath } from '@/router'
+
+const formData = reactive({
+    table_name: '',
+    table_comment: ''
+})
+
+const previewState = reactive({
+    show: false,
+    loading: false,
+    code: []
+})
+
+const { pager, getLists, resetParams, resetPage } = usePaging({
+    fetchFun: generateTable,
+    params: formData
+})
+
+const selectData = ref<any[]>([])
+const handleSelectionChange = (val: any[]) => {
+    selectData.value = val.map(({ id }) => id)
+}
+
+const handleSync = async (id: number) => {
+    await feedback.confirm('确定要同步表结构？')
+    await syncColumn({ id })
+}
+
+const handleDelete = async (id: number | any[]) => {
+    await feedback.confirm('确定要删除？')
+    await generateDelete({ id })
+    getLists()
+}
+
+const handlePreview = async (id: number) => {
+    const data: any = await generatePreview({ id })
+    previewState.code = data
+    previewState.show = true
+}
+
+const hasGenerateTypeInModule = (data: any[]) => {
+    return data.some((item) => item.generate_type == 1)
+}
+
+const handleGenerate = async (selectData: any[]) => {
+    if (isProdMode() && hasGenerateTypeInModule(selectData)) {
+        return feedback.msgError('生成方式为生成到模块，请在前端开发模式下使用，详细参考文档')
+    }
+    const data: any = await generateCode({ id: selectData })
+    if (data.file) {
+        window.open(data.file, '_blank')
+    }
+}
+
+const handleCommand = (command: any, row: any) => {
+    switch (command) {
+        case 'generate':
+            handleGenerate([row.id])
+            break
+        case 'sync':
+            handleSync(row.id)
+            break
+        case 'delete':
+            handleDelete(row.id)
+    }
+}
+
+getLists()
+</script>
diff --git a/src/views/dev_tools/components/code-preview.vue b/src/views/dev_tools/components/code-preview.vue
new file mode 100644
index 0000000..0b6a75a
--- /dev/null
+++ b/src/views/dev_tools/components/code-preview.vue
@@ -0,0 +1,63 @@
+<template>
+    <div class="code-preview">
+        <el-dialog v-model="show" width="900px" title="代码预览">
+            <el-tabs v-model="activeTab">
+                <el-tab-pane
+                    v-for="(item, index) in code"
+                    :label="item.name"
+                    :name="`index${index}`"
+                    :key="index"
+                >
+                    <div class="flex" style="height: 50vh">
+                        <el-scrollbar class="flex-1">
+                            <highlightjs autodetect :code="item.content" />
+                        </el-scrollbar>
+                        <div>
+                            <el-button @click="handleCopy(item.content)" type="primary" link>
+                                <template #icon>
+                                    <icon name="el-icon-CopyDocument" />
+                                </template>
+                                复制
+                            </el-button>
+                        </div>
+                    </div>
+                </el-tab-pane>
+            </el-tabs>
+        </el-dialog>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import feedback from '@/utils/feedback'
+import useClipboard from 'vue-clipboard3'
+
+const props = defineProps<{
+    modelValue: boolean
+    code: any[]
+}>()
+
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: boolean): void
+}>()
+const { toClipboard } = useClipboard()
+
+const activeTab = ref('index0')
+
+const handleCopy = async (text: string) => {
+    try {
+        await toClipboard(text)
+        feedback.msgSuccess('复制成功')
+    } catch (e) {
+        feedback.msgError('复制失败')
+    }
+}
+
+const show = computed<boolean>({
+    get() {
+        return props.modelValue
+    },
+    set(value) {
+        emit('update:modelValue', value)
+    }
+})
+</script>
diff --git a/src/views/dev_tools/components/data-table.vue b/src/views/dev_tools/components/data-table.vue
new file mode 100644
index 0000000..0b418d0
--- /dev/null
+++ b/src/views/dev_tools/components/data-table.vue
@@ -0,0 +1,104 @@
+<template>
+    <div class="data-table">
+        <popup
+            ref="popupRef"
+            :clickModalClose="false"
+            title="选择表"
+            width="900px"
+            :async="true"
+            @confirm="handleConfirm"
+        >
+            <template #trigger>
+                <slot></slot>
+            </template>
+            <el-form class="ls-form" :model="formData" inline>
+                <el-form-item label="表名称">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="formData.name"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="表描述">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="formData.comment"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                </el-form-item>
+            </el-form>
+            <div class="m-4" v-loading="pager.loading">
+                <el-table
+                    height="400"
+                    size="large"
+                    :data="pager.lists"
+                    @selection-change="handleSelectionChange"
+                >
+                    <el-table-column type="selection" width="55" />
+                    <el-table-column label="表名称" prop="name" min-width="150" />
+                    <el-table-column label="表描述" prop="comment" min-width="160" />
+                    <el-table-column label="创建时间" prop="create_time" min-width="180" />
+                </el-table>
+            </div>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </popup>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import Popup from '@/components/popup/index.vue'
+import Pagination from '@/components/pagination/index.vue'
+import { usePaging } from '@/hooks/usePaging'
+import { dataTable, selectTable } from '@/api/tools/code'
+import feedback from '@/utils/feedback'
+
+const emit = defineEmits<{
+    (event: 'success'): void
+}>()
+
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+
+const formData = reactive({
+    name: '', // 表名称
+    comment: '' // 表描述
+})
+
+const { pager, getLists, resetParams, resetPage } = usePaging({
+    fetchFun: dataTable,
+    params: formData,
+    size: 10
+})
+
+const selectData = ref<any[]>([])
+
+const handleSelectionChange = (val: any[]) => {
+    selectData.value = val.map(({ name, comment }) => ({
+        name,
+        comment
+    }))
+}
+
+const handleConfirm = async () => {
+    if (!selectData.value.length) return feedback.msgError('请选择数据表')
+    await selectTable({
+        table: selectData.value
+    })
+    popupRef.value?.close()
+    emit('success')
+}
+
+watch(
+    () => popupRef.value?.visible,
+    (value) => {
+        if (value) getLists()
+    }
+)
+</script>
diff --git a/src/views/dev_tools/components/relations-add.vue b/src/views/dev_tools/components/relations-add.vue
new file mode 100644
index 0000000..4b466f0
--- /dev/null
+++ b/src/views/dev_tools/components/relations-add.vue
@@ -0,0 +1,160 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules">
+                <el-form-item label="关联类型" prop="type">
+                    <el-select class="flex-1" v-model="formData.type" placeholder="请选择关联类型">
+                        <el-option
+                            v-for="(item, index) in types"
+                            :key="index"
+                            :label="item.name"
+                            :value="item.value"
+                        />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="关联名称" prop="name">
+                    <el-input v-model="formData.name" placeholder="请输入关联名称" />
+                </el-form-item>
+                <el-form-item label="关联模型" prop="model">
+                    <el-select class="flex-1" v-model="formData.model" placeholder="请选择关联模型">
+                        <el-option
+                            v-for="item in optionsData.models"
+                            :label="item"
+                            :value="item"
+                            :key="item"
+                        />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="关联健" prop="local_key">
+                    <el-select
+                        class="flex-1"
+                        v-model="formData.local_key"
+                        clearable
+                        placeholder="请选择关联健"
+                    >
+                        <el-option
+                            v-for="item in column"
+                            :key="item.id"
+                            :value="item.column_name"
+                            :label="`${item.column_name}：${item.column_comment}`"
+                        />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="外键" prop="foreign_key">
+                    <el-input
+                        v-model="formData.foreign_key"
+                        placeholder="关联表外键或中间表的外键"
+                    />
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import Popup from '@/components/popup/index.vue'
+import { useDictOptions } from '@/hooks/useDictOptions'
+import { getModels } from '@/api/tools/code'
+import type { PropType } from 'vue'
+const props = defineProps({
+    column: {
+        type: Array as PropType<any[]>,
+        default: () => []
+    },
+    types: {
+        type: Array as PropType<any[]>,
+        default: () => []
+    }
+})
+const emit = defineEmits(['add', 'close', 'edit'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref<'add' | 'edit'>('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑关联' : '新增关联'
+})
+const formData = reactive({
+    name: '',
+    model: '',
+    type: '',
+    local_key: '',
+    foreign_key: ''
+})
+
+const formRules = {
+    name: [
+        {
+            required: true,
+            message: '请输入关联名称'
+        }
+    ],
+    type: [
+        {
+            required: true,
+            message: '请选择关联类型'
+        }
+    ],
+    model: [
+        {
+            required: true,
+            message: '请选择关联模型'
+        }
+    ],
+    local_key: [
+        {
+            required: true,
+            message: '请选择关联健'
+        }
+    ],
+    foreign_key: [
+        {
+            required: true,
+            message: '请输入外键'
+        }
+    ]
+}
+
+const { optionsData } = useDictOptions<{
+    models: any[]
+}>({
+    models: {
+        api: getModels
+    }
+})
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    popupRef.value?.close()
+    emit(mode.value, formData)
+}
+
+const open = (type = 'add') => {
+    mode.value = type as 'add' | 'edit'
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+defineExpose({
+    open,
+    setFormData
+})
+</script>
diff --git a/src/views/error/403.vue b/src/views/error/403.vue
new file mode 100644
index 0000000..53905ec
--- /dev/null
+++ b/src/views/error/403.vue
@@ -0,0 +1,15 @@
+<template>
+    <div class="error404">
+        <error code="403" title="您的账号权限不足，请联系管理员添加权限！" :show-btn="false">
+            <template #content>
+                <div class="flex justify-center">
+                    <img class="w-[150px] h-[150px]" src="@/assets/images/no_perms.png" alt="" />
+                </div>
+            </template>
+        </error>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import Error from './components/error.vue'
+</script>
diff --git a/src/views/error/404.vue b/src/views/error/404.vue
new file mode 100644
index 0000000..caa3d7f
--- /dev/null
+++ b/src/views/error/404.vue
@@ -0,0 +1,9 @@
+<template>
+    <div class="error404">
+        <error code="404" title="哎呀，出错了！您访问的页面不存在…"></error>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import Error from './components/error.vue'
+</script>
diff --git a/src/views/error/components/error.vue b/src/views/error/components/error.vue
new file mode 100644
index 0000000..5f0b959
--- /dev/null
+++ b/src/views/error/components/error.vue
@@ -0,0 +1,57 @@
+<template>
+    <div class="error">
+        <div>
+            <slot name="content">
+                <div class="error-code">{{ code }}</div>
+            </slot>
+            <div class="text-lg text-tx-secondary mt-7 mb-7">{{ title }}</div>
+            <el-button v-if="showBtn" type="primary" @click="router.go(-1)">
+                {{ second }} 秒后返回上一页
+            </el-button>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { onUnmounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+const props = defineProps({
+    code: String,
+    title: String,
+    showBtn: {
+        type: Boolean,
+        default: true
+    }
+})
+let timer: any = null
+const second = ref(5)
+const router = useRouter()
+props.showBtn &&
+    (timer = setInterval(() => {
+        if (second.value === 0) {
+            clearInterval(timer)
+            router.go(-1)
+        } else {
+            second.value--
+        }
+    }, 1000))
+onUnmounted(() => {
+    timer && clearInterval(timer)
+})
+</script>
+<style lang="scss" scoped>
+.error {
+    text-align: center;
+    height: 100vh;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .error-code {
+        @apply text-primary;
+        font-size: 150px;
+    }
+    .el-button {
+        width: 176px;
+    }
+}
+</style>
diff --git a/src/views/finance/balance_details.vue b/src/views/finance/balance_details.vue
new file mode 100644
index 0000000..d0fffee
--- /dev/null
+++ b/src/views/finance/balance_details.vue
@@ -0,0 +1,106 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：用户账户变动记录"
+                :closable="false"
+                show-icon
+            ></el-alert>
+            <el-form ref="formRef" class="mb-[-16px] mt-[16px]" :model="queryParams" :inline="true">
+                <el-form-item label="用户信息">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.user_info"
+                        placeholder="请输入用户账号/昵称/手机号"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="变动类型">
+                    <el-select class="w-[280px]" v-model="queryParams.change_type">
+                        <el-option label="全部" value />
+                        <el-option
+                            v-for="(value, key) in optionsData.change_type"
+                            :key="key"
+                            :label="value"
+                            :value="key"
+                        />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="记录时间">
+                    <daterange-picker
+                        v-model:startTime="queryParams.start_time"
+                        v-model:endTime="queryParams.end_time"
+                    />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <el-table size="large" v-loading="pager.loading" :data="pager.lists">
+                <el-table-column label="用户账号" prop="account" min-width="100" />
+                <el-table-column label="用户昵称" min-width="160">
+                    <template #default="{ row }">
+                        <div class="flex items-center">
+                            <image-contain
+                                class="flex-none mr-2"
+                                :src="row.avatar"
+                                :width="40"
+                                :height="40"
+                                preview-teleported
+                                fit="contain"
+                            />
+                            {{ row.nickname }}
+                        </div>
+                    </template>
+                </el-table-column>
+                <el-table-column label="手机号码" prop="mobile" min-width="100" />
+                <el-table-column label="变动金额" prop="change_amount" min-width="100">
+                    <template #default="{ row }">
+                        <span :class="{ 'text-error': row.action == 2 }">
+                            {{ row.change_amount }}
+                        </span>
+                    </template>
+                </el-table-column>
+                <el-table-column label="剩余金额" prop="left_amount" min-width="100" />
+                <el-table-column label="变动类型" prop="change_type_desc" min-width="120" />
+
+                <el-table-column label="来源单号" prop="source_sn" min-width="100" />
+                <el-table-column label="记录时间" prop="create_time" min-width="120" />
+            </el-table>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup name="articleLists">
+import { getUmChangeType, accountLog } from '@/api/finance'
+import { useDictOptions } from '@/hooks/useDictOptions'
+import { usePaging } from '@/hooks/usePaging'
+const queryParams = reactive({
+    user_info: '',
+    change_type: '',
+    start_time: '',
+    end_time: ''
+})
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: accountLog,
+    params: queryParams
+})
+
+const { optionsData } = useDictOptions<{
+    change_type: Record<number, string>
+}>({
+    change_type: {
+        api: getUmChangeType
+    }
+})
+
+getLists()
+</script>
diff --git a/src/views/finance/component/refund-log.vue b/src/views/finance/component/refund-log.vue
new file mode 100644
index 0000000..db20d75
--- /dev/null
+++ b/src/views/finance/component/refund-log.vue
@@ -0,0 +1,68 @@
+<template>
+    <div class="code-preview">
+        <el-dialog v-model="show" width="760px" title="退款日志">
+            <el-table size="large" v-loading="loading" :data="logLists" height="500">
+                <el-table-column label="流水单号" prop="sn" min-width="190" />
+                <el-table-column label="退款金额" min-width="110">
+                    <template #default="{ row }"> ¥{{ row.refund_amount }} </template>
+                </el-table-column>
+                <el-table-column label="退款状态" prop="" min-width="100">
+                    <template #default="{ row }">
+                        <el-tag type="warning" v-if="row.refund_status == 0">
+                            {{ row.refund_status_text }}
+                        </el-tag>
+                        <el-tag v-if="row.refund_status == 1">
+                            {{ row.refund_status_text }}
+                        </el-tag>
+                        <el-tag type="danger" v-if="row.refund_status == 2">
+                            {{ row.refund_status_text }}
+                        </el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column label="记录时间" prop="create_time" min-width="180" />
+                <el-table-column label="操作人" prop="handler" min-width="120" />
+            </el-table>
+        </el-dialog>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { refundLog } from '@/api/finance'
+const loading = ref(false)
+const logLists = ref([])
+const props = defineProps<{
+    modelValue: boolean
+    refundId: number
+}>()
+
+const emit = defineEmits<{
+    (event: 'update:modelValue', value: boolean): void
+}>()
+
+const show = computed<boolean>({
+    get() {
+        return props.modelValue
+    },
+    set(value) {
+        emit('update:modelValue', value)
+    }
+})
+
+const getRefundLog = async () => {
+    loading.value = true
+    logLists.value = []
+    try {
+        const res = await refundLog({
+            record_id: props.refundId
+        })
+        logLists.value = res
+    } catch (error) {}
+    loading.value = false
+}
+
+watch(show, (value) => {
+    if (value) {
+        getRefundLog()
+    }
+})
+</script>
diff --git a/src/views/finance/recharge_record.vue b/src/views/finance/recharge_record.vue
new file mode 100644
index 0000000..83214e0
--- /dev/null
+++ b/src/views/finance/recharge_record.vue
@@ -0,0 +1,141 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：用户充值记录"
+                :closable="false"
+                show-icon
+            ></el-alert>
+            <el-form ref="formRef" class="mb-[-16px] mt-[16px]" :model="queryParams" :inline="true">
+                <el-form-item label="充值单号">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.sn"
+                        placeholder="请输入充值单号"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="用户信息">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.user_info"
+                        placeholder="请输入用户账号/昵称/手机号"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="支付方式">
+                    <el-select class="w-[280px]" v-model="queryParams.pay_way">
+                        <el-option label="全部" value />
+                        <el-option label="微信支付" :value="2" />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="支付状态">
+                    <el-select class="w-[280px]" v-model="queryParams.pay_status">
+                        <el-option label="全部" value />
+                        <el-option label="未支付" :value="0" />
+                        <el-option label="已支付" :value="1" />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="下单时间">
+                    <daterange-picker
+                        v-model:startTime="queryParams.start_time"
+                        v-model:endTime="queryParams.end_time"
+                    />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                    <export-data
+                        class="ml-2.5"
+                        :fetch-fun="rechargeLists"
+                        :params="queryParams"
+                        :page-size="pager.size"
+                    />
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <el-table size="large" v-loading="pager.loading" :data="pager.lists">
+                <el-table-column label="用户信息" min-width="160">
+                    <template #default="{ row }">
+                        <div class="flex items-center">
+                            <image-contain
+                                class="flex-none mr-2"
+                                :src="row.avatar"
+                                :width="40"
+                                :height="40"
+                                preview-teleported
+                                fit="contain"
+                            />
+                            {{ row.nickname }}
+                        </div>
+                    </template>
+                </el-table-column>
+                <el-table-column label="充值单号" prop="sn" min-width="190" />
+                <el-table-column label="充值金额" prop="order_amount" min-width="100">
+                </el-table-column>
+                <el-table-column label="支付方式" prop="pay_way_text" min-width="100" />
+                <el-table-column label="支付状态" prop="" min-width="100">
+                    <template #default="{ row }">
+                        <span
+                            :class="{
+                                'text-error': row.pay_status == 0
+                            }"
+                        >
+                            {{ row.pay_status_text }}
+                        </span>
+                    </template>
+                </el-table-column>
+                <el-table-column label="提交时间" prop="create_time" min-width="180" />
+                <el-table-column label="支付时间" prop="pay_time" min-width="180" />
+                <el-table-column label="操作" width="120" fixed="right">
+                    <template #default="{ row }">
+                        <el-button
+                            v-if="row.pay_status == 1"
+                            v-perms="['recharge.recharge/refund']"
+                            type="primary"
+                            link
+                            :disabled="row.refund_status == 1"
+                            @click="handleRefund(row.id)"
+                        >
+                            退款
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup name="articleLists">
+import { rechargeLists, refund } from '@/api/finance'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+const queryParams = reactive({
+    sn: '',
+    user_info: '',
+    pay_way: '',
+    pay_status: '',
+    start_time: '',
+    end_time: ''
+})
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: rechargeLists,
+    params: queryParams
+})
+const handleRefund = async (id: number) => {
+    await feedback.confirm('确认退款？')
+    await refund({
+        recharge_id: id
+    })
+    getLists()
+}
+
+getLists()
+</script>
diff --git a/src/views/finance/refund_record.vue b/src/views/finance/refund_record.vue
new file mode 100644
index 0000000..b3282a1
--- /dev/null
+++ b/src/views/finance/refund_record.vue
@@ -0,0 +1,228 @@
+<template>
+    <div>
+        <el-card class="!border-none mb-4" shadow="never">
+            <div class="flex flex-wrap">
+                <div class="w-1/2 md:w-1/4">
+                    <div class="leading-10">累计退款金额 (元)</div>
+                    <div class="text-6xl">{{ refundData.total }}</div>
+                </div>
+                <div class="w-1/2 md:w-1/4">
+                    <div class="leading-10">退款中金额 (元)</div>
+                    <div class="text-6xl">{{ refundData.ing }}</div>
+                </div>
+                <div class="w-1/2 md:w-1/4">
+                    <div class="leading-10">退款成功金额 (元)</div>
+                    <div class="text-6xl">{{ refundData.success }}</div>
+                </div>
+                <div class="w-1/2 md:w-1/4">
+                    <div class="leading-10">退款失败金额 (元)</div>
+                    <div class="text-6xl">{{ refundData.error }}</div>
+                </div>
+            </div>
+        </el-card>
+        <el-card class="!border-none" shadow="never">
+            <el-form ref="formRef" class="mb-[-16px] mt-[16px]" :model="queryParams" :inline="true">
+                <el-form-item label="退款单号">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.sn"
+                        placeholder="请输入退款单号"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="来源单号">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.order_sn"
+                        placeholder="请输入来源单号"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="用户信息">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.user_info"
+                        placeholder="请输入用户信息"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="退款类型">
+                    <el-select class="w-[280px]" v-model="queryParams.refund_type">
+                        <el-option label="全部" value />
+                        <el-option label="后台退款" :value="1" />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="记录时间">
+                    <daterange-picker
+                        v-model:startTime="queryParams.start_time"
+                        v-model:endTime="queryParams.end_time"
+                    />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                    <!-- <export-data
+                        class="ml-2.5"
+                        :fetch-fun="refundRecord"
+                        :params="queryParams"
+                        :page-size="pager.size"
+                    /> -->
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <el-tabs v-model="activeTab" @tab-change="handleTabChange">
+                <el-tab-pane
+                    v-for="(item, index) in tabLists"
+                    :label="`${item.name}(${pager.extend[item.numKey] ?? 0})`"
+                    :name="index"
+                    :key="index"
+                >
+                    <el-table size="large" v-loading="pager.loading" :data="pager.lists">
+                        <el-table-column label="退款单号" prop="sn" min-width="190" />
+                        <el-table-column label="用户信息" min-width="160">
+                            <template #default="{ row }">
+                                <div class="flex items-center">
+                                    <image-contain
+                                        class="flex-none mr-2"
+                                        :src="row.avatar"
+                                        :width="40"
+                                        :height="40"
+                                        preview-teleported
+                                        fit="contain"
+                                    />
+                                    {{ row.nickname }}
+                                </div>
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="来源单号" prop="order_sn" min-width="190" />
+                        <el-table-column label="退款金额" min-width="100">
+                            <template #default="{ row }"> ¥ {{ row.refund_amount }} </template>
+                        </el-table-column>
+
+                        <el-table-column label="退款类型" prop="refund_type_text" min-width="100" />
+                        <el-table-column label="退款状态" prop="" min-width="100">
+                            <template #default="{ row }">
+                                <el-tag type="warning" v-if="row.refund_status == 0">
+                                    {{ row.refund_status_text }}
+                                </el-tag>
+                                <el-tag v-if="row.refund_status == 1">
+                                    {{ row.refund_status_text }}
+                                </el-tag>
+                                <el-tag type="danger" v-if="row.refund_status == 2">
+                                    {{ row.refund_status_text }}
+                                </el-tag>
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="记录时间" prop="create_time" min-width="180" />
+                        <el-table-column label="操作" width="180" fixed="right">
+                            <template #default="{ row }">
+                                <el-button
+                                    v-perms="['finance.refund/log']"
+                                    type="primary"
+                                    link
+                                    @click="handleShowRefundLog(row.id)"
+                                >
+                                    退款日志
+                                </el-button>
+                                <el-button
+                                    v-if="row.refund_status == 2"
+                                    v-perms="['recharge.recharge/refundAgain']"
+                                    type="primary"
+                                    link
+                                    @click="handleRefund(row.id)"
+                                >
+                                    重新退款
+                                </el-button>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </el-tab-pane>
+            </el-tabs>
+
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <refund-log v-model="showRefundLog" :refund-id="selectRefundId" />
+    </div>
+</template>
+<script lang="ts" setup name="articleLists">
+import { refundRecord, refundAgain, refundStat } from '@/api/finance'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import RefundLog from './component/refund-log.vue'
+const queryParams = reactive({
+    sn: '',
+    order_sn: '',
+    user_info: '',
+    refund_type: '',
+    start_time: '',
+    end_time: '',
+    refund_status: ''
+})
+const refundData = reactive({
+    total: 0,
+    ing: 0,
+    success: 0,
+    error: 0
+})
+const showRefundLog = ref(false)
+const selectRefundId = ref(0)
+const activeTab = ref(0)
+const tabLists = ref([
+    {
+        name: '全部',
+        type: '',
+        numKey: 'total'
+    },
+    {
+        name: '退款中',
+        type: 0,
+        numKey: 'ing'
+    },
+    {
+        name: '退款成功',
+        type: 1,
+        numKey: 'success'
+    },
+    {
+        name: '退款失败',
+        type: 2,
+        numKey: 'error'
+    }
+])
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: refundRecord,
+    params: queryParams
+})
+
+const handleRefund = async (id: number) => {
+    await feedback.confirm('确认重新退款？')
+    await refundAgain({
+        record_id: id
+    })
+    getLists()
+    getRefundStat()
+}
+
+const handleShowRefundLog = async (id: number) => {
+    showRefundLog.value = true
+    selectRefundId.value = id
+}
+const handleTabChange = (index: any) => {
+    queryParams.refund_status = tabLists.value[index].type as string
+    resetPage()
+}
+
+const getRefundStat = async () => {
+    const res = await refundStat()
+    Object.assign(refundData, res)
+}
+getRefundStat()
+getLists()
+</script>
diff --git a/src/views/material/index.vue b/src/views/material/index.vue
new file mode 100644
index 0000000..7fcfbd9
--- /dev/null
+++ b/src/views/material/index.vue
@@ -0,0 +1,63 @@
+<template>
+    <div class="material-index">
+        <el-card class="!border-none" shadow="never">
+            <el-tabs v-model="activeTab">
+                <el-tab-pane
+                    v-for="item in tabsMap"
+                    :label="item.name"
+                    :name="item.type"
+                    :index="item.type"
+                    :key="item.type"
+                    lazy
+                >
+                    <material
+                        :type="item.type"
+                        mode="page"
+                        file-size="120px"
+                        :limit="-1"
+                        :page-size="20"
+                    />
+                </el-tab-pane>
+            </el-tabs>
+        </el-card>
+    </div>
+</template>
+
+<script lang="ts" setup name="material">
+const tabsMap = [
+    {
+        type: 'image',
+        name: '图片'
+    },
+    {
+        type: 'video',
+        name: '视频'
+    },
+    {
+        type: 'file',
+        name: '文件'
+    }
+]
+const activeTab = ref('image')
+</script>
+
+<style lang="scss" scoped>
+.material-index {
+    min-width: 700px;
+    :deep(.el-tabs) {
+        height: calc(100vh - 180px);
+        display: flex;
+        flex-direction: column;
+        .el-tabs__header {
+            margin-bottom: 0 !important;
+        }
+        .el-tabs__content,
+        .el-tab-pane {
+            min-height: 0;
+            flex: 1;
+            display: flex;
+            flex-direction: column;
+        }
+    }
+}
+</style>
diff --git a/src/views/message/notice/edit.vue b/src/views/message/notice/edit.vue
new file mode 100644
index 0000000..c51ec7c
--- /dev/null
+++ b/src/views/message/notice/edit.vue
@@ -0,0 +1,130 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-page-header content="编辑通知设置" @back="$router.back()" />
+        </el-card>
+        <el-form
+            ref="formRef"
+            :model="formData"
+            label-width="120px"
+            :rules="rules"
+            v-loading="loading"
+        >
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">通知名称</div>
+                <el-form-item label="通知名称"> {{ formData.scene_name }} </el-form-item>
+                <el-form-item label="通知类型"> {{ formData.type }} </el-form-item>
+                <el-form-item label="通知业务"> {{ formData.scene_desc }} </el-form-item>
+            </el-card>
+            <el-card class="!border-none mt-4" shadow="never">
+                <div class="font-medium mb-7">短信通知</div>
+                <el-form-item label="开启状态" prop="sms_notice.status" required>
+                    <el-radio-group v-model="formData.sms_notice.status">
+                        <el-radio label="0">关闭</el-radio>
+                        <el-radio label="1">开启</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="模板ID" prop="sms_notice.template_id">
+                    <div class="w-80">
+                        <el-input
+                            v-model="formData.sms_notice.template_id"
+                            placeholder="请输入模板ID"
+                        />
+                    </div>
+                </el-form-item>
+                <el-form-item label="短信内容" prop="sms_notice.content">
+                    <div class="flex-1">
+                        <div class="w-full max-w-[320px]">
+                            <el-input
+                                type="textarea"
+                                :autosize="{ minRows: 6, maxRows: 6 }"
+                                v-model="formData.sms_notice.content"
+                            />
+                        </div>
+                        <div class="form-tips">
+                            <div v-for="(item, index) in formData.sms_notice.tips" :key="index">
+                                {{ item }}
+                            </div>
+                        </div>
+                    </div>
+                </el-form-item>
+            </el-card>
+        </el-form>
+        <footer-btns>
+            <el-button type="primary" @click="handleSave">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script lang="ts" setup name="noticeEdit">
+import type { FormInstance } from 'element-plus'
+import feedback from '@/utils/feedback'
+import { noticeDetail, setNoticeConfig } from '@/api/message'
+import useMultipleTabs from '@/hooks/useMultipleTabs'
+import { pick } from 'lodash'
+
+const route = useRoute()
+const router = useRouter()
+
+const loading = ref(false)
+const formData = reactive({
+    id: '',
+    scene_name: '',
+    type: '',
+    scene_desc: '',
+    sms_notice: {
+        status: 0,
+        template_id: '',
+        content: '',
+        tips: []
+    },
+    oa_notice: {},
+    mnp_notice: {},
+    system_notice: {}
+})
+
+const rules = {
+    'sms_notice.template_id': [
+        {
+            required: true,
+            message: '请输入模板ID',
+            trigger: 'blur'
+        }
+    ],
+    'sms_notice.content': [
+        {
+            required: true,
+            message: '请输入短信内容',
+            trigger: 'blur'
+        }
+    ]
+}
+const { removeTab } = useMultipleTabs()
+const formRef = shallowRef<FormInstance>()
+
+const getDetails = async () => {
+    loading.value = true
+    const data = await noticeDetail({
+        id: route.query.id
+    })
+    Object.keys(data).forEach((key) => {
+        //@ts-ignore
+        formData[key] = data[key]
+    })
+    loading.value = false
+}
+
+const handleSave = async () => {
+    await formRef.value?.validate()
+    const data = {
+        id: formData.id,
+        template: pick(formData, ['sms_notice', 'oa_notice', 'mnp_notice', 'system_notice'])
+    }
+    await setNoticeConfig(data)
+    feedback.msgSuccess('操作成功')
+    removeTab()
+    router.back()
+}
+
+route.query.id && getDetails()
+</script>
diff --git a/src/views/message/notice/index.vue b/src/views/message/notice/index.vue
new file mode 100644
index 0000000..3ce896c
--- /dev/null
+++ b/src/views/message/notice/index.vue
@@ -0,0 +1,86 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：平台配置在各个场景下的通知发送方式和内容模板"
+                :closable="false"
+                show-icon
+            ></el-alert>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <el-tabs v-model="tabsActive" @tab-change="getLists">
+                <el-tab-pane
+                    v-for="(item, index) in tabsMap"
+                    :key="index"
+                    :label="item.name"
+                    :name="item.type"
+                    lazy
+                ></el-tab-pane>
+            </el-tabs>
+            <el-table size="large" :data="pager.lists" v-loading="pager.loading">
+                <el-table-column label="通知场景" prop="scene_name" min-width="120" />
+                <el-table-column label="通知类型" prop="type_desc" min-width="160" />
+                <el-table-column label="短信通知" min-width="80">
+                    <template #default="{ row }">
+                        <el-tag v-if="row.sms_notice?.status == 1">开启</el-tag>
+                        <el-tag type="danger" v-else>关闭</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" min-width="80" fixed="right">
+                    <template #default="{ row }">
+                        <el-button v-perms="['notice.notice/set']" type="primary" link>
+                            <router-link
+                                :to="{
+                                    path: getRoutePath('notice.notice/set'),
+                                    query: {
+                                        id: row.id
+                                    }
+                                }"
+                            >
+                                设置
+                            </router-link>
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup name="notice">
+import { noticeLists } from '@/api/message'
+import { usePaging } from '@/hooks/usePaging'
+import { getRoutePath } from '@/router'
+
+enum NoticeEnums {
+    USER = 1,
+    PLATFORM = 2
+}
+
+const tabsActive = ref(NoticeEnums.USER)
+const tabsMap = [
+    {
+        name: '通知用户',
+        type: NoticeEnums.USER
+    },
+    {
+        name: '通知平台',
+        type: NoticeEnums.PLATFORM
+    }
+]
+
+// 列表数据
+const params = reactive({
+    recipient: tabsActive
+})
+const { pager, getLists } = usePaging({
+    fetchFun: noticeLists,
+    params
+})
+
+onActivated(() => {
+    getLists()
+})
+
+getLists()
+</script>
diff --git a/src/views/message/short_letter/edit.vue b/src/views/message/short_letter/edit.vue
new file mode 100644
index 0000000..0449081
--- /dev/null
+++ b/src/views/message/short_letter/edit.vue
@@ -0,0 +1,128 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            title="设置短信"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="120px" :rules="formRules">
+                <el-form-item label="短信渠道">
+                    <div>
+                        {{ formData.name }}
+                    </div>
+                </el-form-item>
+                <el-form-item label="短信签名" prop="sign">
+                    <el-input v-model="formData.sign" placeholder="请输入短信签名" />
+                </el-form-item>
+                <el-form-item label="APP_KEY" prop="app_key" v-if="formData.type == 'ali'">
+                    <el-input v-model="formData.app_key" placeholder="请输入APP_KEY" />
+                </el-form-item>
+                <el-form-item label="APP_ID" prop="app_id" v-if="formData.type == 'tencent'">
+                    <el-input v-model="formData.app_id" placeholder="请输入APP_ID" />
+                </el-form-item>
+                <el-form-item label="SECRET_ID" prop="secret_id" v-if="formData.type == 'tencent'">
+                    <el-input v-model="formData.secret_id" placeholder="请输入SECRET_ID" />
+                </el-form-item>
+                <el-form-item label="SECRET_KEY" prop="secret_key">
+                    <el-input v-model="formData.secret_key" placeholder="请输入SECRET_KEY" />
+                </el-form-item>
+                <el-form-item label="状态" prop="status">
+                    <el-radio-group v-model="formData.status">
+                        <el-radio :label="0">关闭</el-radio>
+                        <el-radio :label="1">开启</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import { setSmsConfig, smsDetail } from '@/api/message'
+import type { FormInstance } from 'element-plus'
+import Popup from '@/components/popup/index.vue'
+const emit = defineEmits(['success'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const formData = reactive({
+    name: '',
+    type: '',
+    sign: '',
+    app_key: '',
+    app_id: '',
+    secret_key: '',
+    secret_id: '',
+    status: 0
+})
+
+const formRules = {
+    sign: [
+        {
+            required: true,
+            message: '请输入短信签名',
+            trigger: 'blur'
+        }
+    ],
+    app_id: [
+        {
+            required: true,
+            message: '请输入APP_ID',
+            trigger: 'blur'
+        }
+    ],
+    app_key: [
+        {
+            required: true,
+            message: '请输入APP_KEY',
+            trigger: 'blur'
+        }
+    ],
+    secret_key: [
+        {
+            required: true,
+            message: '请输入SECRET_KEY',
+            trigger: 'blur'
+        }
+    ],
+    secret_id: [
+        {
+            required: true,
+            message: '请输入SECRET_ID',
+            trigger: 'blur'
+        }
+    ]
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    await setSmsConfig(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const getDetail = async () => {
+    const data = await smsDetail({
+        type: formData.type
+    })
+    for (const key in data) {
+        //@ts-ignore
+        formData[key] = data[key]
+    }
+}
+
+const open = (type: string) => {
+    formData.type = type
+    popupRef.value?.open()
+    getDetail()
+}
+
+const handleClose = () => {
+    formRef.value?.resetFields()
+}
+
+defineExpose({
+    open
+})
+</script>
diff --git a/src/views/message/short_letter/index.vue b/src/views/message/short_letter/index.vue
new file mode 100644
index 0000000..3a20862
--- /dev/null
+++ b/src/views/message/short_letter/index.vue
@@ -0,0 +1,56 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never" v-loading="state.loading">
+            <el-table size="large" :data="state.lists">
+                <el-table-column label="短信渠道" prop="name" min-width="120" />
+                <el-table-column label="状态" min-width="120">
+                    <template #default="{ row }">
+                        <el-tag v-if="row.status == 1">开启</el-tag>
+                        <el-tag type="danger" v-else>关闭</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" min-width="120" fixed="right">
+                    <template #default="{ row }">
+                        <el-button
+                            v-perms="['notice.sms_config/setConfig']"
+                            type="primary"
+                            link
+                            @click="handleSet(row.type)"
+                        >
+                            设置
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-card>
+        <edit-popup ref="editRef" @success="getLists" />
+    </div>
+</template>
+<script lang="ts" setup name="shortLetter">
+import { smsLists } from '@/api/message'
+import EditPopup from './edit.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+
+// 列表数据
+const state = reactive({
+    loading: false,
+    lists: []
+})
+
+// 获取存储引擎列表数据
+const getLists = async () => {
+    try {
+        state.loading = true
+        state.lists = await smsLists()
+        state.loading = false
+    } catch (error) {
+        state.loading = false
+    }
+}
+
+const handleSet = (alias: string) => {
+    editRef.value?.open(alias)
+}
+
+getLists()
+</script>
diff --git a/src/views/organization/department/edit.vue b/src/views/organization/department/edit.vue
new file mode 100644
index 0000000..e33309f
--- /dev/null
+++ b/src/views/organization/department/edit.vue
@@ -0,0 +1,161 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules">
+                <el-form-item label="上级部门" prop="pid" v-if="formData.pid !== 0">
+                    <el-tree-select
+                        class="flex-1"
+                        v-model="formData.pid"
+                        :data="optionsData.dept"
+                        clearable
+                        node-key="id"
+                        :props="{
+                            value: 'id',
+                            label: 'name'
+                        }"
+                        check-strictly
+                        :default-expand-all="true"
+                        placeholder="请选择上级部门"
+                    />
+                </el-form-item>
+                <el-form-item label="部门名称" prop="name">
+                    <el-input
+                        v-model="formData.name"
+                        placeholder="请输入部门名称"
+                        :maxlength="100"
+                    />
+                </el-form-item>
+                <el-form-item label="负责人" prop="leader">
+                    <el-input
+                        v-model="formData.leader"
+                        placeholder="请输入负责人姓名"
+                        :maxlength="30"
+                    />
+                </el-form-item>
+                <el-form-item label="联系电话" prop="mobile">
+                    <el-input v-model="formData.mobile" placeholder="请输入联系电话" />
+                </el-form-item>
+                <el-form-item label="排序" prop="sort">
+                    <div>
+                        <el-input-number v-model="formData.sort" :min="0" :max="9999" />
+                        <div class="form-tips">默认为0， 数值越大越排前</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="部门状态">
+                    <el-switch v-model="formData.status" :active-value="1" :inactive-value="0" />
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import { deptEdit, deptAdd, deptDetail, deptAll } from '@/api/org/department'
+import Popup from '@/components/popup/index.vue'
+import { useDictOptions } from '@/hooks/useDictOptions'
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑部门' : '新增部门'
+})
+const formData = reactive({
+    id: '',
+    pid: '' as string | number,
+    name: '',
+    leader: '',
+    mobile: '',
+    sort: 0,
+    status: 1
+})
+
+const checkMobile = (rule: any, value: any, callback: any) => {
+    if (!value) {
+        return callback()
+    } else {
+        const reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/
+        console.log(reg.test(value))
+        if (reg.test(value)) {
+            callback()
+        } else {
+            return callback(new Error('请输入正确的手机号'))
+        }
+    }
+}
+const formRules = {
+    pid: [
+        {
+            required: true,
+            message: '请选择上级部门',
+            trigger: ['change']
+        }
+    ],
+    name: [
+        {
+            required: true,
+            message: '请输入部门名称',
+            trigger: ['blur']
+        }
+    ],
+    mobile: [
+        {
+            validator: checkMobile,
+            trigger: ['blur']
+        }
+    ]
+}
+
+const { optionsData } = useDictOptions<{
+    dept: any[]
+}>({
+    dept: {
+        api: deptAll
+    }
+})
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    mode.value == 'edit' ? await deptEdit(formData) : await deptAdd(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+const getDetail = async (row: Record<string, any>) => {
+    const data = await deptDetail({
+        id: row.id
+    })
+    setFormData(data)
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+defineExpose({
+    open,
+    setFormData,
+    getDetail
+})
+</script>
diff --git a/src/views/organization/department/index.vue b/src/views/organization/department/index.vue
new file mode 100644
index 0000000..beba663
--- /dev/null
+++ b/src/views/organization/department/index.vue
@@ -0,0 +1,166 @@
+<template>
+    <div class="department">
+        <el-card class="!border-none" shadow="never">
+            <el-form ref="formRef" class="mb-[-16px]" :model="queryParams" :inline="true">
+                <el-form-item label="部门名称" prop="name">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.name"
+                        clearable
+                        @keyup.enter="getLists"
+                    />
+                </el-form-item>
+                <el-form-item label="部门状态" prop="status">
+                    <el-select class="w-[280px]" v-model="queryParams.status">
+                        <el-option label="全部" value />
+                        <el-option label="正常" value="1" />
+                        <el-option label="停用" value="0" />
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="getLists">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <div>
+                <el-button v-perms="['dept.dept/add']" type="primary" @click="handleAdd()">
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+                <el-button @click="handleExpand"> 展开/折叠 </el-button>
+            </div>
+            <el-table
+                ref="tableRef"
+                class="mt-4"
+                size="large"
+                v-loading="loading"
+                :data="lists"
+                row-key="id"
+                :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+            >
+                <el-table-column
+                    label="部门名称"
+                    prop="name"
+                    min-width="150"
+                    show-overflow-tooltip
+                />
+                <el-table-column label="部门状态" prop="status" min-width="100">
+                    <template #default="{ row }">
+                        <el-tag class="ml-2" :type="row.status ? '' : 'danger'">{{
+                            row.status_desc
+                        }}</el-tag>
+                    </template>
+                </el-table-column>
+
+                <el-table-column label="排序" prop="sort" min-width="100" />
+                <el-table-column label="更新时间" prop="update_time" min-width="180" />
+                <el-table-column label="操作" width="160" fixed="right">
+                    <template #default="{ row }">
+                        <el-button
+                            v-perms="['dept.dept/add']"
+                            type="primary"
+                            link
+                            @click="handleAdd(row.id)"
+                        >
+                            新增
+                        </el-button>
+                        <el-button
+                            v-perms="['dept.dept/edit']"
+                            type="primary"
+                            link
+                            @click="handleEdit(row)"
+                        >
+                            编辑
+                        </el-button>
+                        <el-button
+                            v-if="row.pid !== 0"
+                            v-perms="['dept.dept/delete']"
+                            type="danger"
+                            link
+                            @click="handleDelete(row.id)"
+                        >
+                            删除
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+<script lang="ts" setup name="department">
+import type { ElTable, FormInstance } from 'element-plus'
+import EditPopup from './edit.vue'
+import { deptDelete, deptLists } from '@/api/org/department'
+import feedback from '@/utils/feedback'
+const tableRef = shallowRef<InstanceType<typeof ElTable>>()
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const formRef = shallowRef<FormInstance>()
+let isExpand = false
+const loading = ref(false)
+const lists = ref<any[]>([])
+const queryParams = reactive({
+    status: '',
+    name: ''
+})
+const showEdit = ref(false)
+const getLists = async () => {
+    loading.value = true
+    lists.value = await deptLists(queryParams)
+    loading.value = false
+}
+
+const resetParams = () => {
+    formRef.value?.resetFields()
+    getLists()
+}
+
+const handleAdd = async (id?: number) => {
+    showEdit.value = true
+    await nextTick()
+    if (id) {
+        editRef.value?.setFormData({
+            pid: id
+        })
+    }
+    editRef.value?.open('add')
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.getDetail(data)
+}
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await deptDelete({ id })
+    getLists()
+}
+
+const handleExpand = () => {
+    isExpand = !isExpand
+    toggleExpand(lists.value, isExpand)
+}
+
+const toggleExpand = (children: any[], unfold = true) => {
+    for (const key in children) {
+        tableRef.value?.toggleRowExpansion(children[key], unfold)
+        if (children[key].children) {
+            toggleExpand(children[key].children!, unfold)
+        }
+    }
+}
+
+onMounted(async () => {
+    await getLists()
+    nextTick(() => {
+        handleExpand()
+    })
+})
+</script>
diff --git a/src/views/organization/post/edit.vue b/src/views/organization/post/edit.vue
new file mode 100644
index 0000000..f6b1574
--- /dev/null
+++ b/src/views/organization/post/edit.vue
@@ -0,0 +1,120 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules">
+                <el-form-item label="岗位名称" prop="name">
+                    <el-input
+                        v-model="formData.name"
+                        placeholder="请输入岗位名称"
+                        clearable
+                        :maxlength="100"
+                    />
+                </el-form-item>
+                <el-form-item label="岗位编码" prop="code">
+                    <el-input v-model="formData.code" placeholder="请输入岗位编码" clearable />
+                </el-form-item>
+                <el-form-item label="排序" prop="sort">
+                    <div>
+                        <el-input-number v-model="formData.sort" :min="0" :max="9999" />
+                        <div class="form-tips">默认为0， 数值越大越排前</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="备注" prop="remark">
+                    <el-input
+                        v-model="formData.remark"
+                        placeholder="请输入备注"
+                        type="textarea"
+                        :autosize="{ minRows: 4, maxRows: 6 }"
+                        maxlength="200"
+                        show-word-limit
+                    />
+                </el-form-item>
+                <el-form-item label="岗位状态" required prop="status">
+                    <el-switch v-model="formData.status" :active-value="1" :inactive-value="0" />
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import { jobsEdit, jobsAdd, jobsDetail } from '@/api/org/post'
+import Popup from '@/components/popup/index.vue'
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑岗位' : '新增岗位'
+})
+const formData = reactive({
+    id: '',
+    name: '',
+    code: '',
+    sort: 0,
+    remark: '',
+    status: 1
+})
+
+const formRules = {
+    code: [
+        {
+            required: true,
+            message: '请输入岗位编码',
+            trigger: ['blur']
+        }
+    ],
+    name: [
+        {
+            required: true,
+            message: '请输入岗位名称',
+            trigger: ['blur']
+        }
+    ]
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    mode.value == 'edit' ? await jobsEdit(formData) : await jobsAdd(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+const getDetail = async (row: Record<string, any>) => {
+    const data = await jobsDetail({
+        id: row.id
+    })
+    setFormData(data)
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+defineExpose({
+    open,
+    setFormData,
+    getDetail
+})
+</script>
diff --git a/src/views/organization/post/index.vue b/src/views/organization/post/index.vue
new file mode 100644
index 0000000..9a6cc1d
--- /dev/null
+++ b/src/views/organization/post/index.vue
@@ -0,0 +1,128 @@
+<template>
+    <div class="post-lists">
+        <el-card class="!border-none" shadow="never">
+            <el-form ref="formRef" class="mb-[-16px]" :model="queryParams" :inline="true">
+                <el-form-item label="岗位编码">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.code"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="岗位名称">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.name"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="岗位状态">
+                    <el-select class="w-[280px]" v-model="queryParams.status">
+                        <el-option label="全部" value />
+                        <el-option label="正常" :value="1" />
+                        <el-option label="停用" :value="0" />
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                    <export-data
+                        class="ml-2.5"
+                        :fetch-fun="jobsLists"
+                        :params="queryParams"
+                        :page-size="pager.size"
+                    />
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <div>
+                <el-button v-perms="['dept.jobs/add']" type="primary" @click="handleAdd()">
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+            </div>
+            <el-table class="mt-4" size="large" v-loading="pager.loading" :data="pager.lists">
+                <el-table-column label="岗位编码" prop="code" min-width="100" />
+                <el-table-column label="岗位名称" prop="name" min-width="100" />
+                <el-table-column label="排序" prop="sort" min-width="100" />
+                <el-table-column label="备注" prop="remark" min-width="100" show-overflow-tooltip />
+                <el-table-column label="添加时间" prop="create_time" min-width="180" />
+                <el-table-column label="状态" prop="status" min-width="100">
+                    <template #default="{ row }">
+                        <el-tag class="ml-2" :type="row.status ? '' : 'danger'">
+                            {{ row.status_desc }}
+                        </el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" width="120" fixed="right">
+                    <template #default="{ row }">
+                        <el-button
+                            v-perms="['dept.jobs/edit']"
+                            type="primary"
+                            link
+                            @click="handleEdit(row)"
+                        >
+                            编辑
+                        </el-button>
+                        <el-button
+                            v-perms="['dept.jobs/delete']"
+                            type="danger"
+                            link
+                            @click="handleDelete(row.id)"
+                        >
+                            删除
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+<script lang="ts" setup name="post">
+import { jobsDelete, jobsLists } from '@/api/org/post'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const showEdit = ref(false)
+const queryParams = reactive({
+    code: '',
+    name: '',
+    status: ''
+})
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: jobsLists,
+    params: queryParams
+})
+
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add')
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.getDetail(data)
+}
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await jobsDelete({ id })
+    getLists()
+}
+
+getLists()
+</script>
diff --git a/src/views/permission/admin/edit.vue b/src/views/permission/admin/edit.vue
new file mode 100644
index 0000000..decf6a5
--- /dev/null
+++ b/src/views/permission/admin/edit.vue
@@ -0,0 +1,274 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules">
+                <!-- 账号输入框 -->
+                <el-form-item label="账号" prop="account">
+                    <el-input
+                        v-model="formData.account"
+                        :disabled="formData.root == 1"
+                        placeholder="请输入账号"
+                        clearable
+                    />
+                </el-form-item>
+                <!-- 管理员头像 -->
+                <el-form-item label="头像">
+                    <div>
+                        <div>
+                            <material-picker v-model="formData.avatar" :limit="1" />
+                        </div>
+                        <div class="form-tips">建议尺寸：100*100px，支持jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+
+                <!-- 名称输入框 -->
+                <el-form-item label="名称" prop="name">
+                    <el-input v-model="formData.name" placeholder="请输入名称" clearable />
+                </el-form-item>
+                <el-form-item label="归属部门" prop="dept_id">
+                    <el-tree-select
+                        class="flex-1"
+                        v-model="formData.dept_id"
+                        :data="optionsData.dept"
+                        clearable
+                        multiple
+                        node-key="id"
+                        :props="{
+                            value: 'id',
+                            label: 'name',
+                            disabled(data: any) {
+                                return data.status !== 1
+                            }
+                        }"
+                        check-strictly
+                        :default-expand-all="true"
+                        placeholder="请选择上级部门"
+                    />
+                </el-form-item>
+                <el-form-item label="岗位" prop="jobs_id">
+                    <el-select
+                        class="flex-1"
+                        v-model="formData.jobs_id"
+                        clearable
+                        multiple
+                        placeholder="请选择岗位"
+                    >
+                        <el-option
+                            v-for="(item, index) in optionsData.jobs"
+                            :key="index"
+                            :label="item.name"
+                            :value="item.id"
+                        />
+                    </el-select>
+                </el-form-item>
+
+                <!-- 角色选择框 -->
+                <el-form-item label="角色" prop="role_id">
+                    <el-select
+                        v-model="formData.role_id"
+                        :disabled="formData.root == 1"
+                        class="flex-1"
+                        multiple
+                        placeholder="请选择角色"
+                        clearable
+                    >
+                        <el-option
+                            v-for="(item, index) in optionsData.role"
+                            :key="index"
+                            :label="item.name"
+                            :value="item.id"
+                        />
+                    </el-select>
+                </el-form-item>
+
+                <!-- 密码输入框 -->
+                <el-form-item label="密码" prop="password">
+                    <el-input
+                        v-model="formData.password"
+                        show-password
+                        clearable
+                        placeholder="请输入密码"
+                    />
+                </el-form-item>
+
+                <!-- 确认密码输入框 -->
+                <el-form-item label="确认密码" prop="password_confirm">
+                    <el-input
+                        v-model="formData.password_confirm"
+                        show-password
+                        clearable
+                        placeholder="请输入确认密码"
+                    />
+                </el-form-item>
+
+                <!-- 管理员状态 -->
+                <el-form-item label="管理员状态" v-if="formData.root != 1">
+                    <el-switch v-model="formData.disable" :active-value="0" :inactive-value="1" />
+                </el-form-item>
+
+                <!-- 多处登录 -->
+                <el-form-item label="多处登录">
+                    <div>
+                        <el-switch
+                            v-model="formData.multipoint_login"
+                            :active-value="1"
+                            :inactive-value="0"
+                        />
+                        <div class="form-tips">允许多人同时在线登录</div>
+                    </div>
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import Popup from '@/components/popup/index.vue'
+import { useDictOptions } from '@/hooks/useDictOptions'
+import { adminAdd, adminDetail, adminEdit } from '@/api/perms/admin'
+import { roleAll } from '@/api/perms/role'
+import { jobsAll } from '@/api/org/post'
+import { deptAll } from '@/api/org/department'
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑管理员' : '新增管理员'
+})
+const formData = reactive({
+    id: '',
+    account: '',
+    name: '',
+    dept_id: [],
+    jobs_id: [],
+    role_id: [],
+    avatar: '',
+    password: '',
+    password_confirm: '',
+    disable: 0,
+    multipoint_login: 1,
+    root: 0
+})
+const passwordConfirmValidator = (rule: object, value: string, callback: any) => {
+    if (formData.password) {
+        if (!value) callback(new Error('请再次输入密码'))
+        if (value !== formData.password) callback(new Error('两次输入密码不一致!'))
+    }
+    callback()
+}
+
+const roleIdValidator = (rule: object, value: string, callback: any) => {
+    if (formData.root) {
+        callback()
+    } else {
+        if (formData.role_id.length) {
+            callback()
+        } else {
+            callback(new Error('请选择角色'))
+        }
+    }
+}
+const formRules = reactive({
+    account: [
+        {
+            required: true,
+            message: '请输入账号',
+            trigger: ['blur']
+        }
+    ],
+    name: [
+        {
+            required: true,
+            message: '请输入名称',
+            trigger: ['blur']
+        }
+    ],
+    role_id: [
+        {
+            required: true,
+            validator: roleIdValidator
+        }
+    ],
+    password: [
+        {
+            required: true,
+            message: '请输入密码',
+            trigger: ['blur']
+        }
+    ] as any[],
+    password_confirm: [
+        {
+            required: true,
+            message: '请输入确认密码',
+            trigger: ['blur']
+        },
+        {
+            validator: passwordConfirmValidator,
+            trigger: 'blur'
+        }
+    ] as any[]
+})
+const { optionsData } = useDictOptions<{
+    role: any[]
+    jobs: any[]
+    dept: any[]
+}>({
+    role: {
+        api: roleAll
+    },
+    jobs: {
+        api: jobsAll
+    },
+    dept: {
+        api: deptAll
+    }
+})
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    mode.value == 'edit' ? await adminEdit(formData) : await adminAdd(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+const setFormData = async (row: any) => {
+    formRules.password = []
+    formRules.password_confirm = [
+        {
+            validator: passwordConfirmValidator,
+            trigger: 'blur'
+        }
+    ]
+    const data = await adminDetail({
+        id: row.id
+    })
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+defineExpose({
+    open,
+    setFormData
+})
+</script>
diff --git a/src/views/permission/admin/index.vue b/src/views/permission/admin/index.vue
new file mode 100644
index 0000000..cbebc10
--- /dev/null
+++ b/src/views/permission/admin/index.vue
@@ -0,0 +1,183 @@
+<template>
+    <div class="admin">
+        <el-card class="!border-none" shadow="never">
+            <el-form class="mb-[-16px]" :model="formData" inline>
+                <el-form-item label="管理员账号">
+                    <el-input
+                        v-model="formData.account"
+                        class="w-[280px]"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="管理员名称">
+                    <el-input
+                        v-model="formData.name"
+                        class="w-[280px]"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="管理员角色">
+                    <el-select class="w-[280px]" v-model="formData.role_id">
+                        <el-option label="全部" value="" />
+                        <el-option
+                            v-for="(item, index) in optionsData.role"
+                            :key="index"
+                            :label="item.name"
+                            :value="item.id"
+                        />
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                    <export-data
+                        class="ml-2.5"
+                        :fetch-fun="adminLists"
+                        :params="formData"
+                        :page-size="pager.size"
+                    />
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card v-loading="pager.loading" class="mt-4 !border-none" shadow="never">
+            <el-button v-perms="['auth.admin/add']" type="primary" @click="handleAdd">
+                <template #icon>
+                    <icon name="el-icon-Plus" />
+                </template>
+                新增
+            </el-button>
+            <div class="mt-4">
+                <el-table :data="pager.lists" size="large">
+                    <el-table-column label="ID" prop="id" min-width="60" />>
+                    <el-table-column label="头像" min-width="100">
+                        <template #default="{ row }">
+                            <el-avatar :size="50" :src="row.avatar"></el-avatar>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="账号" prop="account" min-width="100" />
+                    <el-table-column label="名称" prop="name" min-width="100" />
+                    <el-table-column
+                        label="角色"
+                        prop="role_name"
+                        min-width="100"
+                        show-tooltip-when-overflow
+                    />
+                    <el-table-column
+                        label="部门"
+                        prop="dept_name"
+                        min-width="100"
+                        show-tooltip-when-overflow
+                    />
+                    <el-table-column label="创建时间" prop="create_time" min-width="180" />
+                    <el-table-column label="最近登录时间" prop="login_time" min-width="180" />
+                    <el-table-column label="最近登录IP" prop="login_ip" min-width="120" />
+                    <el-table-column label="状态" min-width="100" v-perms="['auth.admin/edit']">
+                        <template #default="{ row }">
+                            <el-switch
+                                v-if="row.root != 1"
+                                v-model="row.disable"
+                                :active-value="0"
+                                :inactive-value="1"
+                                @change="changeStatus(row)"
+                            />
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="操作" width="120" fixed="right">
+                        <template #default="{ row }">
+                            <el-button
+                                v-perms="['auth.admin/edit']"
+                                type="primary"
+                                link
+                                @click="handleEdit(row)"
+                            >
+                                编辑
+                            </el-button>
+                            <el-button
+                                v-if="row.root != 1"
+                                v-perms="['auth.admin/delete']"
+                                type="danger"
+                                link
+                                @click="handleDelete(row.id)"
+                            >
+                                删除
+                            </el-button>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </div>
+            <div class="flex mt-4 justify-end">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+
+<script lang="ts" setup name="admin">
+import { adminEdit, adminLists, adminDelete } from '@/api/perms/admin'
+import { roleAll } from '@/api/perms/role'
+import { useDictOptions } from '@/hooks/useDictOptions'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+// 表单数据
+const formData = reactive({
+    account: '',
+    name: '',
+    role_id: ''
+})
+const showEdit = ref(false)
+const { pager, getLists, resetParams, resetPage } = usePaging({
+    fetchFun: adminLists,
+    params: formData
+})
+
+const changeStatus = (data: any) => {
+    adminEdit({
+        id: data.id,
+        avatar: data.avatar,
+        account: data.account,
+        name: data.name,
+        role_id: data.role_id,
+        job_id: data.job_id,
+        dept_id: data.dept_id,
+        disable: data.disable,
+        multipoint_login: data.multipoint_login
+    }).finally(() => {
+        getLists()
+    })
+}
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add')
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.setFormData(data)
+}
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await adminDelete({ id })
+    getLists()
+}
+
+const { optionsData } = useDictOptions<{
+    role: any[]
+}>({
+    role: {
+        api: roleAll
+    }
+})
+
+onMounted(() => {
+    getLists()
+})
+</script>
diff --git a/src/views/permission/menu/edit.vue b/src/views/permission/menu/edit.vue
new file mode 100644
index 0000000..35a290b
--- /dev/null
+++ b/src/views/permission/menu/edit.vue
@@ -0,0 +1,299 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="80px" :rules="formRules">
+                <el-form-item label="菜单类型" prop="type" required>
+                    <el-radio-group v-model="formData.type">
+                        <el-radio :label="MenuEnum.CATALOGUE">目录</el-radio>
+                        <el-radio :label="MenuEnum.MENU">菜单</el-radio>
+                        <el-radio :label="MenuEnum.BUTTON">按钮</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="父级菜单" prop="pid">
+                    <el-tree-select
+                        class="flex-1"
+                        v-model="formData.pid"
+                        :data="menuOptions"
+                        clearable
+                        node-key="id"
+                        :props="{
+                            label: 'name'
+                        }"
+                        :default-expand-all="true"
+                        placeholder="请选择父级菜单"
+                        check-strictly
+                    />
+                </el-form-item>
+                <el-form-item label="菜单名称" prop="name">
+                    <el-input v-model="formData.name" placeholder="请输入菜单名称" clearable />
+                </el-form-item>
+                <el-form-item v-if="formData.type != MenuEnum.BUTTON" label="菜单图标" prop="icon">
+                    <icon-picker class="flex-1" v-model="formData.icon" />
+                </el-form-item>
+
+                <el-form-item v-if="formData.type != MenuEnum.BUTTON" label="路由路径" prop="paths">
+                    <div class="flex-1">
+                        <el-input v-model="formData.paths" placeholder="请输入路由路径" clearable />
+                        <div class="form-tips">
+                            访问的路由地址，如：`user`，如外网地址需内链访问则以`http(s)://`开头
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item
+                    v-if="formData.type == MenuEnum.MENU"
+                    label="组件路径"
+                    prop="component"
+                >
+                    <div class="flex-1">
+                        <el-autocomplete
+                            class="w-full"
+                            v-model="formData.component"
+                            :fetch-suggestions="querySearch"
+                            clearable
+                            placeholder="请输入组件路径"
+                        />
+                        <div class="form-tips">
+                            访问的组件路径，如：`user/setting`，默认在`views`目录下
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item
+                    label="选中菜单"
+                    prop="selected"
+                    v-if="formData.type == MenuEnum.MENU"
+                >
+                    <div class="flex-1">
+                        <el-input
+                            v-model="formData.selected"
+                            placeholder="请输入路由路径"
+                            clearable
+                        />
+                        <div class="form-tips">
+                            访问详情页面，编辑页面时，菜单高亮显示，如`/consumer/lists`
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item
+                    v-if="formData.type != MenuEnum.CATALOGUE"
+                    label="权限字符"
+                    prop="perms"
+                >
+                    <div class="flex-1">
+                        <el-input v-model="formData.perms" placeholder="请输入权限字符" clearable />
+                        <div class="form-tips">
+                            将作为server端API验权使用，如`auth.admin/user`，请谨慎修改
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item v-if="formData.type == MenuEnum.MENU" label="路由参数" prop="params">
+                    <div>
+                        <div class="flex-1">
+                            <el-input
+                                v-model="formData.params"
+                                placeholder="请输入路由参数"
+                                clearable
+                            />
+                        </div>
+                        <div class="form-tips">
+                            访问路由的默认传递参数，如：`{"id": 1, "name":
+                            "admin"}`或`id=1&name=admin`
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item
+                    v-if="formData.type == MenuEnum.MENU"
+                    label="是否缓存"
+                    prop="is_cache"
+                    required
+                >
+                    <div>
+                        <el-radio-group v-model="formData.is_cache">
+                            <el-radio :label="1">缓存</el-radio>
+                            <el-radio :label="0">不缓存</el-radio>
+                        </el-radio-group>
+                        <div class="form-tips">选择缓存则会被`keep-alive`缓存</div>
+                    </div>
+                </el-form-item>
+                <el-form-item
+                    v-if="formData.type != MenuEnum.BUTTON"
+                    label="是否显示"
+                    prop="is_show"
+                    required
+                >
+                    <div>
+                        <el-radio-group v-model="formData.is_show">
+                            <el-radio :label="1">显示</el-radio>
+                            <el-radio :label="0">隐藏</el-radio>
+                        </el-radio-group>
+                        <div class="form-tips">
+                            选择隐藏则路由将不会出现在侧边栏，但仍然可以访问
+                        </div>
+                    </div>
+                </el-form-item>
+                <el-form-item
+                    v-if="formData.type != MenuEnum.BUTTON"
+                    label="菜单状态"
+                    prop="is_disable"
+                    required
+                >
+                    <div>
+                        <el-radio-group v-model="formData.is_disable">
+                            <el-radio :label="0">正常</el-radio>
+                            <el-radio :label="1">停用</el-radio>
+                        </el-radio-group>
+                        <div class="form-tips">选择停用则路由将不会出现在侧边栏，也不能被访问</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="菜单排序" prop="sort">
+                    <div>
+                        <el-input-number v-model="formData.sort" :min="0" :max="9999" />
+                        <div class="form-tips">数值越大越排前</div>
+                    </div>
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import { menuLists, menuEdit, menuAdd, menuDetail } from '@/api/perms/menu'
+import { MenuEnum } from '@/enums/appEnums'
+import Popup from '@/components/popup/index.vue'
+import { arrayToTree, treeToArray } from '@/utils/util'
+import { getModulesKey } from '@/router'
+
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑菜单' : '新增菜单'
+})
+
+const componentsOptions = ref(getModulesKey())
+const querySearch = (queryString: string, cb: any) => {
+    const results = queryString
+        ? componentsOptions.value.filter((item) =>
+              item.toLowerCase().includes(queryString.toLowerCase())
+          )
+        : componentsOptions.value
+    cb(results.map((item) => ({ value: item })))
+}
+const formData = reactive({
+    id: '',
+    //父级id
+    pid: 0,
+    //类型
+    type: MenuEnum.CATALOGUE,
+    //图标
+    icon: '',
+    //名称
+    name: '',
+    //排序号
+    sort: 0,
+    // 路由路径
+    paths: '',
+    //权限链接
+    perms: '',
+    //前端组件
+    component: '',
+    //选中路径
+    selected: '',
+    //路由参数
+    params: '',
+    //是否缓存 0=否， 1=是
+    is_cache: 0,
+    //是否显示 0=否， 1=是
+    is_show: 1,
+    //是否禁用 0=否， 1=是
+    is_disable: 0
+})
+
+const formRules = {
+    pid: [
+        {
+            required: true,
+            message: '请选择父级菜单',
+            trigger: ['blur', 'change']
+        }
+    ],
+    name: [
+        {
+            required: true,
+            message: '请输入菜单名称',
+            trigger: 'blur'
+        }
+    ],
+    paths: [
+        {
+            required: true,
+            message: '请输入路由地址',
+            trigger: 'blur'
+        }
+    ],
+    component: [
+        {
+            required: true,
+            message: '请输入组件地址',
+            trigger: 'blur'
+        }
+    ]
+}
+const menuOptions = ref<any[]>([])
+
+const getMenu = async () => {
+    const data: any = await menuLists({ page_type: 0 })
+    const menu: any = { id: 0, name: '顶级', children: [] }
+    menu.children = arrayToTree(
+        treeToArray(data.lists).filter((item) => item.type != MenuEnum.BUTTON)
+    )
+    menuOptions.value.push(menu)
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    mode.value == 'edit' ? await menuEdit(formData) : await menuAdd(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+const getDetail = async (row: Record<string, any>) => {
+    const data = await menuDetail({
+        id: row.id
+    })
+    setFormData(data)
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+getMenu()
+
+defineExpose({
+    open,
+    setFormData,
+    getDetail
+})
+</script>
diff --git a/src/views/permission/menu/index.vue b/src/views/permission/menu/index.vue
new file mode 100644
index 0000000..3e6360f
--- /dev/null
+++ b/src/views/permission/menu/index.vue
@@ -0,0 +1,151 @@
+<template>
+    <div class="menu-lists">
+        <el-card class="!border-none" shadow="never">
+            <div>
+                <el-button v-perms="['auth.menu/add']" type="primary" @click="handleAdd()">
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+                <el-button @click="handleExpand"> 展开/折叠 </el-button>
+            </div>
+            <el-table
+                ref="tableRef"
+                class="mt-4"
+                size="large"
+                v-loading="pager.loading"
+                :data="pager.lists"
+                row-key="id"
+                :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+            >
+                <el-table-column
+                    label="菜单名称"
+                    prop="name"
+                    min-width="150"
+                    show-overflow-tooltip
+                />
+                <el-table-column label="类型" prop="type" min-width="80">
+                    <template #default="{ row }">
+                        <div v-if="row.type == MenuEnum.CATALOGUE">目录</div>
+                        <div v-else-if="row.type == MenuEnum.MENU">菜单</div>
+                        <div v-else-if="row.type == MenuEnum.BUTTON">按钮</div>
+                    </template>
+                </el-table-column>
+                <el-table-column label="图标" prop="icon" min-width="80">
+                    <template #default="{ row }">
+                        <div class="flex">
+                            <icon :name="row.icon" :size="20" />
+                        </div>
+                    </template>
+                </el-table-column>
+                <el-table-column
+                    label="权限标识"
+                    prop="perms"
+                    min-width="150"
+                    show-overflow-tooltip
+                />
+                <el-table-column label="状态" prop="is_disable" min-width="100">
+                    <template #default="{ row }">
+                        <el-tag v-if="row.is_disable == 0">正常</el-tag>
+                        <el-tag v-else type="danger">停用</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column label="排序" prop="sort" min-width="100" />
+                <el-table-column
+                    label="更新时间"
+                    prop="update_time"
+                    min-width="180"
+                ></el-table-column>
+                <el-table-column label="操作" width="160" fixed="right">
+                    <template #default="{ row }">
+                        <el-button
+                            v-if="row.type !== MenuEnum.BUTTON"
+                            v-perms="['auth.menu/add']"
+                            type="primary"
+                            link
+                            @click="handleAdd(row.id)"
+                        >
+                            新增
+                        </el-button>
+                        <el-button
+                            v-perms="['auth.menu/edit']"
+                            type="primary"
+                            link
+                            @click="handleEdit(row)"
+                        >
+                            编辑
+                        </el-button>
+                        <el-button
+                            v-perms="['auth.menu/delete']"
+                            type="danger"
+                            link
+                            @click="handleDelete(row.id)"
+                        >
+                            删除
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+<script lang="ts" setup name="menu">
+import { menuDelete, menuLists } from '@/api/perms/menu'
+import type { ElTable } from 'element-plus'
+import { usePaging } from '@/hooks/usePaging'
+import { MenuEnum } from '@/enums/appEnums'
+import EditPopup from './edit.vue'
+import feedback from '@/utils/feedback'
+const tableRef = shallowRef<InstanceType<typeof ElTable>>()
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+let isExpand = false
+const showEdit = ref(false)
+const { pager, getLists } = usePaging({
+    fetchFun: menuLists,
+    params: {
+        page_type: 0
+    }
+})
+
+const handleAdd = async (id?: number) => {
+    showEdit.value = true
+    await nextTick()
+    if (id) {
+        editRef.value?.setFormData({
+            pid: id
+        })
+    }
+    editRef.value?.open('add')
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.getDetail(data)
+}
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await menuDelete({ id })
+    getLists()
+}
+
+const handleExpand = () => {
+    isExpand = !isExpand
+    toggleExpand(pager.lists, isExpand)
+}
+
+const toggleExpand = (children: any[], unfold = true) => {
+    for (const key in children) {
+        tableRef.value?.toggleRowExpansion(children[key], unfold)
+        if (children[key].children) {
+            toggleExpand(children[key].children!, unfold)
+        }
+    }
+}
+
+getLists()
+</script>
diff --git a/src/views/permission/role/auth.vue b/src/views/permission/role/auth.vue
new file mode 100644
index 0000000..616edb7
--- /dev/null
+++ b/src/views/permission/role/auth.vue
@@ -0,0 +1,154 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            title="分配权限"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form
+                class="ls-form"
+                ref="formRef"
+                :rules="rules"
+                :model="formData"
+                label-width="60px"
+                v-loading="loading"
+            >
+                <el-scrollbar class="h-[400px] sm:h-[600px]">
+                    <el-form-item label="权限" prop="menu_id">
+                        <div>
+                            <el-checkbox label="展开/折叠" @change="handleExpand" />
+                            <el-checkbox label="全选/不全选" @change="handleSelectAll" />
+                            <el-checkbox v-model="checkStrictly" label="父子联动" />
+                            <div>
+                                <el-tree
+                                    ref="treeRef"
+                                    :data="menuTree"
+                                    :props="{
+                                        label: 'name',
+                                        children: 'children'
+                                    }"
+                                    :check-strictly="!checkStrictly"
+                                    node-key="id"
+                                    :default-expand-all="isExpand"
+                                    show-checkbox
+                                />
+                            </div>
+                        </div>
+                    </el-form-item>
+                </el-scrollbar>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { CheckboxValueType, ElTree, FormInstance } from 'element-plus'
+import { roleEdit } from '@/api/perms/role'
+import Popup from '@/components/popup/index.vue'
+import { treeToArray } from '@/utils/util'
+import { menuAll } from '@/api/perms/menu'
+const emit = defineEmits(['success', 'close'])
+const treeRef = shallowRef<InstanceType<typeof ElTree>>()
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const isExpand = ref(false)
+const checkStrictly = ref(true)
+const loading = ref(false)
+const menuArray = ref<any[]>([])
+const menuTree = ref<any[]>([])
+const formData = reactive({
+    id: '',
+    name: '',
+    desc: '',
+    sort: 0,
+    menu_id: [] as any[]
+})
+
+const rules = {
+    name: [
+        {
+            required: true,
+            message: '请输入名称',
+            trigger: ['blur']
+        }
+    ]
+}
+
+const getOptions = () => {
+    loading.value = true
+    menuAll().then((res: any) => {
+        menuTree.value = res
+        menuArray.value = treeToArray(res)
+        nextTick(() => {
+            setDeptAllCheckedKeys()
+        })
+        loading.value = false
+    })
+}
+
+// 获取所有选择的节点包括半选中节点
+const getDeptAllCheckedKeys = () => {
+    const checkedKeys = treeRef.value?.getCheckedKeys()
+    const halfCheckedKeys = treeRef.value?.getHalfCheckedKeys()!
+    checkedKeys?.unshift.apply(checkedKeys, halfCheckedKeys)
+    return checkedKeys
+}
+
+const setDeptAllCheckedKeys = () => {
+    formData.menu_id.forEach((v) => {
+        nextTick(() => {
+            treeRef.value?.setChecked(v, true, false)
+        })
+    })
+}
+
+const handleExpand = (check: CheckboxValueType) => {
+    const treeList = menuTree.value
+    for (let i = 0; i < treeList.length; i++) {
+        //@ts-ignore
+        treeRef.value.store.nodesMap[treeList[i].id].expanded = check
+    }
+}
+
+const handleSelectAll = (check: CheckboxValueType) => {
+    if (check) {
+        treeRef.value?.setCheckedKeys(menuArray.value.map((item) => item.id))
+    } else {
+        treeRef.value?.setCheckedKeys([])
+    }
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    formData.menu_id = getDeptAllCheckedKeys()!
+    await roleEdit(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+const open = () => {
+    popupRef.value?.open()
+}
+
+const setFormData = async (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+getOptions()
+
+defineExpose({
+    open,
+    setFormData
+})
+</script>
diff --git a/src/views/permission/role/edit.vue b/src/views/permission/role/edit.vue
new file mode 100644
index 0000000..f4ec48b
--- /dev/null
+++ b/src/views/permission/role/edit.vue
@@ -0,0 +1,101 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form
+                class="ls-form"
+                ref="formRef"
+                :rules="rules"
+                :model="formData"
+                label-width="60px"
+            >
+                <el-form-item label="名称" prop="name">
+                    <el-input
+                        class="ls-input"
+                        v-model="formData.name"
+                        placeholder="请输入名称"
+                        clearable
+                    />
+                </el-form-item>
+                <el-form-item label="备注" prop="desc">
+                    <el-input
+                        v-model="formData.desc"
+                        type="textarea"
+                        :autosize="{ minRows: 4, maxRows: 6 }"
+                        placeholder="请输入备注"
+                        maxlength="200"
+                        show-word-limit
+                    />
+                </el-form-item>
+                <el-form-item label="排序" prop="sort">
+                    <el-input-number v-model="formData.sort" :min="0" :max="9999" />
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import { roleAdd, roleEdit } from '@/api/perms/role'
+import Popup from '@/components/popup/index.vue'
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑角色' : '新增角色'
+})
+const formData = reactive({
+    id: '',
+    name: '',
+    desc: '',
+    sort: 0,
+    menu_id: []
+})
+
+const rules = {
+    name: [
+        {
+            required: true,
+            message: '请输入名称',
+            trigger: ['blur']
+        }
+    ]
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    mode.value == 'edit' ? await roleEdit(formData) : await roleAdd(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+const setFormData = async (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+defineExpose({
+    open,
+    setFormData
+})
+</script>
diff --git a/src/views/permission/role/index.vue b/src/views/permission/role/index.vue
new file mode 100644
index 0000000..bae8076
--- /dev/null
+++ b/src/views/permission/role/index.vue
@@ -0,0 +1,107 @@
+<template>
+    <div class="role-lists">
+        <el-card class="!border-none" shadow="never">
+            <div>
+                <el-button v-perms="['auth.role/add']" type="primary" @click="handleAdd">
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+            </div>
+            <div class="mt-4" v-loading="pager.loading">
+                <div>
+                    <el-table :data="pager.lists" size="large">
+                        <el-table-column prop="id" label="ID" min-width="100" />
+                        <el-table-column prop="name" label="名称" min-width="150" />
+                        <el-table-column
+                            prop="desc"
+                            label="备注"
+                            min-width="150"
+                            show-overflow-tooltip
+                        />
+                        <el-table-column prop="sort" label="排序" min-width="100" />
+                        <el-table-column prop="num" label="管理员人数" min-width="100" />
+                        <el-table-column prop="create_time" label="创建时间" min-width="180" />
+                        <el-table-column label="操作" width="200" fixed="right">
+                            <template #default="{ row }">
+                                <el-button
+                                    link
+                                    type="primary"
+                                    v-perms="['auth.role/edit']"
+                                    @click="handleEdit(row)"
+                                >
+                                    编辑
+                                </el-button>
+                                <el-button
+                                    link
+                                    type="primary"
+                                    v-perms="['auth.role/edit']"
+                                    @click="handleAuth(row)"
+                                >
+                                    分配权限
+                                </el-button>
+                                <el-button
+                                    v-perms="['auth.role/delete']"
+                                    link
+                                    type="danger"
+                                    @click="handleDelete(row.id)"
+                                >
+                                    删除
+                                </el-button>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+                <div class="flex justify-end mt-4">
+                    <pagination v-model="pager" @change="getLists" />
+                </div>
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+        <auth-popup v-if="showAuth" ref="authRef" @success="getLists" @close="showAuth = false" />
+    </div>
+</template>
+
+<script lang="ts" setup name="role">
+import { roleLists, roleDelete } from '@/api/perms/role'
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+import AuthPopup from './auth.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const authRef = shallowRef<InstanceType<typeof AuthPopup>>()
+const showEdit = ref(false)
+const showAuth = ref(false)
+const { pager, getLists } = usePaging({
+    fetchFun: roleLists
+})
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add')
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.setFormData(data)
+}
+
+const handleAuth = async (data: any) => {
+    showAuth.value = true
+    await nextTick()
+    authRef.value?.open()
+    authRef.value?.setFormData(data)
+}
+
+// 删除角色
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await roleDelete({ id })
+    getLists()
+}
+
+getLists()
+</script>
diff --git a/src/views/record/edit.vue b/src/views/record/edit.vue
new file mode 100644
index 0000000..75de6a3
--- /dev/null
+++ b/src/views/record/edit.vue
@@ -0,0 +1,131 @@
+<template>
+    <div class="edit-popup">
+        <popup ref="popupRef" :title="popupTitle" :async="true" width="550px" @confirm="handleSubmit"
+            @close="handleClose">
+            <el-form ref="formRef" :model="formData" label-width="90px" :rules="formRules">
+                <el-form-item label="主题" prop="theme">
+                    <el-input v-model="formData.theme" clearable placeholder="请输入主题" />
+                </el-form-item>
+                <el-form-item label="记录类型" prop="rid">
+                    <el-input v-model="formData.rid" clearable placeholder="请输入记录类型" />
+                </el-form-item>
+                <el-form-item label="记录人" prop="admin_id">
+                    <el-input v-model="formData.admin_id" clearable placeholder="请输入记录人" />
+                </el-form-item>
+                <el-form-item label="备注" prop="remark">
+                    <el-input v-model="formData.remark" clearable placeholder="请输入备注" />
+                </el-form-item>
+                <el-form-item label="更进时间" prop="flow_time">
+                    <el-input v-model="formData.flow_time" clearable placeholder="请输入更进时间" />
+                </el-form-item>
+
+            </el-form>
+        </popup>
+    </div>
+</template>
+
+<script lang="ts" setup name="recordEdit">
+import type { FormInstance } from 'element-plus'
+import Popup from '@/components/popup/index.vue'
+import { apiRecordAdd, apiRecordEdit, apiRecordDetail } from '@/api/record'
+import { timeFormat } from '@/utils/util'
+import type { PropType } from 'vue'
+defineProps({
+    dictData: {
+        type: Object as PropType<Record<string, any[]>>,
+        default: () => ({})
+    }
+})
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+
+
+// 弹窗标题
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑跟踪记录表' : '新增跟踪记录表'
+})
+
+// 表单数据
+const formData = reactive({
+    id: '',
+    theme: '',
+    rid: '',
+    admin_id: '',
+    remark: '',
+    flow_time: '',
+
+})
+
+
+// 表单验证
+const formRules = reactive<any>({
+    theme: [{
+        required: true,
+        message: '请输入主题',
+        trigger: ['blur']
+    }],
+    rid: [{
+        required: true,
+        message: '请输入记录类型',
+        trigger: ['blur']
+    }],
+    admin_id: [{
+        required: true,
+        message: '请输入记录人',
+        trigger: ['blur']
+    }],
+})
+
+
+// 获取详情
+const setFormData = async (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+
+
+}
+
+const getDetail = async (row: Record<string, any>) => {
+    const data = await apiRecordDetail({
+        id: row.id
+    })
+    setFormData(data)
+}
+
+
+// 提交按钮
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    const data = { ...formData, }
+    mode.value == 'edit'
+        ? await apiRecordEdit(data)
+        : await apiRecordAdd(data)
+    popupRef.value?.close()
+    emit('success')
+}
+
+//打开弹窗
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+// 关闭回调
+const handleClose = () => {
+    emit('close')
+}
+
+
+
+defineExpose({
+    open,
+    setFormData,
+    getDetail
+})
+</script>
diff --git a/src/views/record/index.vue b/src/views/record/index.vue
new file mode 100644
index 0000000..21357d7
--- /dev/null
+++ b/src/views/record/index.vue
@@ -0,0 +1,137 @@
+<template>
+    <div>
+        <el-card class="!border-none mb-4" shadow="never">
+            <el-form class="mb-[-16px]" :model="queryParams" inline>
+                <el-form-item label="主题" prop="theme">
+                    <el-input class="w-[280px]" v-model="queryParams.theme" clearable placeholder="请输入主题" />
+                </el-form-item>
+                <el-form-item label="记录类型" prop="rid">
+                    <el-input class="w-[280px]" v-model="queryParams.rid" clearable placeholder="请输入记录类型" />
+                </el-form-item>
+                <el-form-item label="记录人" prop="admin_id">
+                    <el-input class="w-[280px]" v-model="queryParams.admin_id" clearable placeholder="请输入记录人" />
+                </el-form-item>
+
+                <el-form-item label="商户" prop="merchant_id">
+                    <el-input class="w-[280px]" v-model="queryParams.merchant_id" clearable placeholder="请选择商户" />
+                </el-form-item>
+
+                <el-form-item label="备注" prop="remark">
+                    <el-input class="w-[280px]" v-model="queryParams.remark" clearable placeholder="请输入备注" />
+                </el-form-item>
+                <el-form-item label="更进时间" prop="flow_time">
+                    <el-input class="w-[280px]" v-model="queryParams.flow_time" clearable placeholder="请输入更进时间" />
+                </el-form-item>
+
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none" v-loading="pager.loading" shadow="never">
+            <el-button v-perms="['record.record/add']" type="primary" @click="handleAdd">
+                <template #icon>
+                    <icon name="el-icon-Plus" />
+                </template>
+                新增
+            </el-button>
+            <el-button v-perms="['record.record/delete']" :disabled="!selectData.length"
+                @click="handleDelete(selectData)">
+                删除
+            </el-button>
+            <div class="mt-4">
+                <el-table :data="pager.lists" @selection-change="handleSelectionChange">
+                    <el-table-column type="selection" width="55" />
+                    <el-table-column label="主题" prop="theme" show-overflow-tooltip />
+                    <el-table-column label="记录类型" prop="rid" show-overflow-tooltip />
+                    <el-table-column label="记录人" prop="admin_id" show-overflow-tooltip />
+                    <el-table-column label="商户" prop="merchant_name" show-overflow-tooltip />
+                    <el-table-column label="备注" prop="remark" show-overflow-tooltip />
+                    <el-table-column label="更进时间" prop="flow_time" show-overflow-tooltip />
+                    <el-table-column label="创建时间" prop="create_time" show-overflow-tooltip />
+                    <el-table-column label="操作" width="120" fixed="right">
+                        <template #default="{ row }">
+                            <el-button v-perms="['record.record/edit']" type="primary" link @click="handleEdit(row)">
+                                编辑
+                            </el-button>
+                            <el-button v-perms="['record.record/delete']" type="danger" link
+                                @click="handleDelete(row.id)">
+                                删除
+                            </el-button>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </div>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" :dict-data="dictData" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+
+<script lang="ts" setup name="recordLists">
+import { usePaging } from '@/hooks/usePaging'
+import { useDictData } from '@/hooks/useDictOptions'
+import { apiRecordLists, apiRecordDelete } from '@/api/record'
+import { timeFormat } from '@/utils/util'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+// 是否显示编辑框
+const showEdit = ref(false)
+
+
+// 查询条件
+const queryParams = reactive({
+    theme: '',
+    rid: '',
+    admin_id: '',
+    merchant_id: '',
+    remark: '',
+    flow_time: '',
+})
+
+// 选中数据
+const selectData = ref<any[]>([])
+
+// 表格选择后回调事件
+const handleSelectionChange = (val: any[]) => {
+    selectData.value = val.map(({ id }) => id)
+}
+
+// 获取字典数据
+const { dictData } = useDictData('')
+
+// 分页相关
+const { pager, getLists, resetParams, resetPage } = usePaging({
+    fetchFun: apiRecordLists,
+    params: queryParams
+})
+
+// 添加
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add')
+}
+
+// 编辑
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.setFormData(data)
+}
+
+// 删除
+const handleDelete = async (id: number | any[]) => {
+    await feedback.confirm('确定要删除？')
+    await apiRecordDelete({ id })
+    getLists()
+}
+
+getLists()
+</script>
diff --git a/src/views/record_cate/edit.vue b/src/views/record_cate/edit.vue
new file mode 100644
index 0000000..2d22d8b
--- /dev/null
+++ b/src/views/record_cate/edit.vue
@@ -0,0 +1,112 @@
+<template>
+    <div class="edit-popup">
+        <popup ref="popupRef" :title="popupTitle" :async="true" width="550px" @confirm="handleSubmit"
+            @close="handleClose">
+            <el-form ref="formRef" :model="formData" label-width="90px" :rules="formRules">
+                <el-form-item label="分类名称" prop="name">
+                    <el-input v-model="formData.name" clearable placeholder="请输入分类名称" />
+                </el-form-item>
+                <el-form-item label="排序" prop="sort">
+                    <el-input v-model="formData.sort" clearable placeholder="请输入排序" />
+                </el-form-item>
+                <el-form-item label="是否显示:" prop="is_show">
+                    <el-select class="flex-1" v-model="formData.is_show" clearable placeholder="请选择是否显示:">
+                        <el-option v-for="(item, index) in dictData.show_status" :key="index" :label="item.name"
+                            :value="parseInt(item.value)" />
+                    </el-select>
+                </el-form-item>
+
+            </el-form>
+        </popup>
+    </div>
+</template>
+
+<script lang="ts" setup name="recordCateEdit">
+import type { FormInstance } from 'element-plus'
+import Popup from '@/components/popup/index.vue'
+import { apiRecordCateAdd, apiRecordCateEdit, apiRecordCateDetail } from '@/api/record_cate'
+import { timeFormat } from '@/utils/util'
+import type { PropType } from 'vue'
+defineProps({
+    dictData: {
+        type: Object as PropType<Record<string, any[]>>,
+        default: () => ({})
+    }
+})
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+
+
+// 弹窗标题
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑记录类型表' : '新增记录类型表'
+})
+
+// 表单数据
+const formData = reactive({
+    id: '',
+    name: '',
+    sort: '',
+    is_show: '',
+
+})
+
+
+// 表单验证
+const formRules = reactive<any>({
+
+})
+
+
+// 获取详情
+const setFormData = async (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+
+
+}
+
+const getDetail = async (row: Record<string, any>) => {
+    const data = await apiRecordCateDetail({
+        id: row.id
+    })
+    setFormData(data)
+}
+
+
+// 提交按钮
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    const data = { ...formData, }
+    mode.value == 'edit'
+        ? await apiRecordCateEdit(data)
+        : await apiRecordCateAdd(data)
+    popupRef.value?.close()
+    emit('success')
+}
+
+//打开弹窗
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+// 关闭回调
+const handleClose = () => {
+    emit('close')
+}
+
+
+
+defineExpose({
+    open,
+    setFormData,
+    getDetail
+})
+</script>
diff --git a/src/views/record_cate/index.vue b/src/views/record_cate/index.vue
new file mode 100644
index 0000000..a42da3b
--- /dev/null
+++ b/src/views/record_cate/index.vue
@@ -0,0 +1,129 @@
+<template>
+    <div>
+        <el-card class="!border-none mb-4" shadow="never">
+            <el-form class="mb-[-16px]" :model="queryParams" inline>
+                <el-form-item label="分类名称" prop="name">
+                    <el-input class="w-[280px]" v-model="queryParams.name" clearable placeholder="请输入分类名称" />
+                </el-form-item>
+                <el-form-item label="排序" prop="sort">
+                    <el-input class="w-[280px]" v-model="queryParams.sort" clearable placeholder="请输入排序" />
+                </el-form-item>
+                <el-form-item label="是否显示:" prop="is_show">
+                    <el-select class="w-[280px]" v-model="queryParams.is_show" clearable placeholder="请选择是否显示:">
+                        <el-option label="全部" value=""></el-option>
+                        <el-option v-for="(item, index) in dictData.show_status" :key="index" :label="item.name"
+                            :value="item.value" />
+                    </el-select>
+                </el-form-item>
+
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none" v-loading="pager.loading" shadow="never">
+            <el-button v-perms="['record.record_cate/add']" type="primary" @click="handleAdd">
+                <template #icon>
+                    <icon name="el-icon-Plus" />
+                </template>
+                新增
+            </el-button>
+            <el-button v-perms="['record.record_cate/delete']" :disabled="!selectData.length"
+                @click="handleDelete(selectData)">
+                删除
+            </el-button>
+            <div class="mt-4">
+                <el-table :data="pager.lists" @selection-change="handleSelectionChange">
+                    <el-table-column type="selection" width="55" />
+                    <el-table-column label="分类名称" prop="name" show-overflow-tooltip />
+                    <el-table-column label="排序" prop="sort" show-overflow-tooltip />
+                    <el-table-column label="是否显示:" prop="is_show">
+                        <template #default="{ row }">
+                            <dict-value :options="dictData.show_status" :value="row.is_show" />
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column label="操作" width="120" fixed="right">
+                        <template #default="{ row }">
+                            <el-button v-perms="['record.record_cate/edit']" type="primary" link
+                                @click="handleEdit(row)">
+                                编辑
+                            </el-button>
+                            <el-button v-perms="['record.record_cate/delete']" type="danger" link
+                                @click="handleDelete(row.id)">
+                                删除
+                            </el-button>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </div>
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" :dict-data="dictData" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+
+<script lang="ts" setup name="recordCateLists">
+import { usePaging } from '@/hooks/usePaging'
+import { useDictData } from '@/hooks/useDictOptions'
+import { apiRecordCateLists, apiRecordCateDelete } from '@/api/record_cate'
+import { timeFormat } from '@/utils/util'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+// 是否显示编辑框
+const showEdit = ref(false)
+
+
+// 查询条件
+const queryParams = reactive({
+    name: '',
+    sort: '',
+    is_show: '',
+})
+
+// 选中数据
+const selectData = ref<any[]>([])
+
+// 表格选择后回调事件
+const handleSelectionChange = (val: any[]) => {
+    selectData.value = val.map(({ id }) => id)
+}
+
+// 获取字典数据
+const { dictData } = useDictData('show_status')
+
+// 分页相关
+const { pager, getLists, resetParams, resetPage } = usePaging({
+    fetchFun: apiRecordCateLists,
+    params: queryParams
+})
+
+// 添加
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add')
+}
+
+// 编辑
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.setFormData(data)
+}
+
+// 删除
+const handleDelete = async (id: number | any[]) => {
+    await feedback.confirm('确定要删除？')
+    await apiRecordCateDelete({ id })
+    getLists()
+}
+
+getLists()
+</script>
diff --git a/src/views/setting/dict/data/edit.vue b/src/views/setting/dict/data/edit.vue
new file mode 100644
index 0000000..8ebd142
--- /dev/null
+++ b/src/views/setting/dict/data/edit.vue
@@ -0,0 +1,126 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form
+                class="ls-form"
+                ref="formRef"
+                :rules="rules"
+                :model="formData"
+                label-width="84px"
+            >
+                <el-form-item label="字典类型">
+                    <el-input
+                        :model-value="formData.type_value"
+                        placeholder="请输入字典类型"
+                        disabled
+                    />
+                </el-form-item>
+                <el-form-item label="数据名称" prop="name">
+                    <el-input v-model="formData.name" placeholder="请输入数据名称" clearable />
+                </el-form-item>
+                <el-form-item label="数据值" prop="value">
+                    <el-input v-model="formData.value" placeholder="请输入数据值" clearable />
+                </el-form-item>
+                <el-form-item label="排序" prop="sort">
+                    <div>
+                        <el-input-number v-model="formData.sort" :min="0" :max="9999" />
+                        <div class="form-tips">数值越大越排前</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="状态" required prop="status">
+                    <el-radio-group v-model="formData.status">
+                        <el-radio :label="1">正常</el-radio>
+                        <el-radio :label="0">停用</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="备注" prop="remark">
+                    <el-input
+                        v-model="formData.remark"
+                        type="textarea"
+                        :autosize="{ minRows: 4, maxRows: 6 }"
+                        clearable
+                        maxlength="200"
+                        show-word-limit
+                    />
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import Popup from '@/components/popup/index.vue'
+import { dictDataAdd, dictDataEdit } from '@/api/setting/dict'
+
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑字典数据' : '新增字典数据'
+})
+const formData = reactive({
+    id: '',
+    type_value: '',
+    name: '',
+    value: '',
+    sort: 0,
+    status: 1,
+    remark: '',
+    type_id: 0
+})
+
+const rules = {
+    name: [
+        {
+            required: true,
+            message: '请输入数据名称',
+            trigger: ['blur']
+        }
+    ],
+    value: [
+        {
+            required: true,
+            message: '请输入数据值',
+            trigger: ['blur']
+        }
+    ]
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    mode.value == 'edit' ? await dictDataEdit(formData) : await dictDataAdd(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+defineExpose({
+    open,
+    setFormData
+})
+</script>
diff --git a/src/views/setting/dict/data/index.vue b/src/views/setting/dict/data/index.vue
new file mode 100644
index 0000000..8d1fed0
--- /dev/null
+++ b/src/views/setting/dict/data/index.vue
@@ -0,0 +1,181 @@
+<template>
+    <div class="dict-type">
+        <el-card class="!border-none" shadow="never">
+            <el-page-header class="mb-4" content="数据管理" @back="$router.back()" />
+            <el-form ref="formRef" class="mb-[-16px]" :model="queryParams" inline>
+                <el-form-item label="字典名称">
+                    <el-select class="w-[280px]" v-model="queryParams.type_id" @change="getLists">
+                        <el-option
+                            v-for="item in optionsData.dict_type"
+                            :label="item.name"
+                            :value="item.id"
+                            :key="item.id"
+                        />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="数据名称">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.name"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="数据状态">
+                    <el-select class="w-[280px]" v-model="queryParams.status">
+                        <el-option label="全部" value />
+                        <el-option label="正常" :value="1" />
+                        <el-option label="停用" :value="0" />
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <div>
+                <el-button
+                    v-perms="['setting.dict.dict_data/add']"
+                    type="primary"
+                    @click="handleAdd"
+                >
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    添加数据
+                </el-button>
+                <el-button
+                    v-perms="['setting.dict.dict_data/delete']"
+                    :disabled="!selectData.length"
+                    type="danger"
+                    @click="handleDelete(selectData)"
+                >
+                    <template #icon>
+                        <icon name="el-icon-Delete" />
+                    </template>
+                    删除
+                </el-button>
+            </div>
+            <div class="mt-4" v-loading="pager.loading">
+                <div>
+                    <el-table
+                        :data="pager.lists"
+                        size="large"
+                        @selection-change="handleSelectionChange"
+                    >
+                        <el-table-column type="selection" width="55" />
+                        <el-table-column label="ID" prop="id" />
+                        <el-table-column label="数据名称" prop="name" min-width="120" />
+                        <el-table-column label="数据值" prop="value" min-width="120" />
+                        <el-table-column label="状态">
+                            <template v-slot="{ row }">
+                                <el-tag v-if="row.status == 1">正常</el-tag>
+                                <el-tag v-else type="danger">停用</el-tag>
+                            </template>
+                        </el-table-column>
+                        <el-table-column
+                            label="备注"
+                            prop="remark"
+                            min-width="120"
+                            show-tooltip-when-overflow
+                        />
+                        <el-table-column label="排序" prop="sort" />
+                        <el-table-column label="操作" width="120" fixed="right">
+                            <template #default="{ row }">
+                                <el-button
+                                    v-perms="['setting.dict.dict_data/edit']"
+                                    link
+                                    type="primary"
+                                    @click="handleEdit(row)"
+                                >
+                                    编辑
+                                </el-button>
+                                <el-button
+                                    v-perms="['setting.dict.dict_data/delete']"
+                                    link
+                                    type="danger"
+                                    @click="handleDelete(row.id)"
+                                >
+                                    删除
+                                </el-button>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+                <div class="flex justify-end mt-4">
+                    <pagination v-model="pager" @change="getLists" />
+                </div>
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+
+<script lang="ts" setup name="dictData">
+import { dictDataDelete, dictDataLists, dictTypeLists } from '@/api/setting/dict'
+
+import { usePaging } from '@/hooks/usePaging'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+const { query } = useRoute()
+const showEdit = ref(false)
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+
+const queryParams = reactive({
+    type: '',
+    type_id: Number(query.id),
+    name: '',
+    status: ''
+})
+
+const optionsData = reactive<{
+    dict_type: any[]
+}>({
+    dict_type: []
+})
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: dictDataLists,
+    params: queryParams
+})
+
+const selectData = ref<any[]>([])
+
+const handleSelectionChange = (val: any[]) => {
+    selectData.value = val.map(({ id }) => id)
+}
+
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    const type = optionsData.dict_type.find((item) => item.id == queryParams.type_id)
+    editRef.value?.setFormData({
+        type_value: type?.type,
+        type_id: type.id
+    })
+    editRef.value?.open('add')
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.setFormData(data)
+}
+
+const handleDelete = async (id: any[] | number) => {
+    await feedback.confirm('确定要删除？')
+    await dictDataDelete({ id })
+    getLists()
+}
+
+const getDictType = async () => {
+    const data = await dictTypeLists({ page_type: 0 })
+    optionsData.dict_type = data.lists
+}
+
+getLists()
+getDictType()
+</script>
diff --git a/src/views/setting/dict/type/edit.vue b/src/views/setting/dict/type/edit.vue
new file mode 100644
index 0000000..887e73e
--- /dev/null
+++ b/src/views/setting/dict/type/edit.vue
@@ -0,0 +1,109 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form
+                class="ls-form"
+                ref="formRef"
+                :rules="rules"
+                :model="formData"
+                label-width="84px"
+            >
+                <el-form-item label="字典名称" prop="name">
+                    <el-input v-model="formData.name" placeholder="请输入字典名称" clearable />
+                </el-form-item>
+                <el-form-item label="字典类型" prop="type">
+                    <el-input v-model="formData.type" placeholder="请输入字典类型" clearable />
+                </el-form-item>
+                <el-form-item label="字典状态" required prop="status">
+                    <el-radio-group v-model="formData.status">
+                        <el-radio :label="1">正常</el-radio>
+                        <el-radio :label="0">停用</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="备注" prop="remark">
+                    <el-input
+                        v-model="formData.remark"
+                        type="textarea"
+                        :autosize="{ minRows: 4, maxRows: 6 }"
+                        clearable
+                        maxlength="200"
+                        show-word-limit
+                    />
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance } from 'element-plus'
+import Popup from '@/components/popup/index.vue'
+import { dictTypeAdd, dictTypeEdit } from '@/api/setting/dict'
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const mode = ref('add')
+const popupTitle = computed(() => {
+    return mode.value == 'edit' ? '编辑字典类型' : '新增字典类型'
+})
+const formData = reactive({
+    id: '',
+    name: '',
+    type: '',
+    status: 1,
+    remark: ''
+})
+
+const rules = {
+    name: [
+        {
+            required: true,
+            message: '请输入字典名称',
+            trigger: ['blur']
+        }
+    ],
+    type: [
+        {
+            required: true,
+            message: '请输入字典类型',
+            trigger: ['blur']
+        }
+    ]
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    mode.value == 'edit' ? await dictTypeEdit(formData) : await dictTypeAdd(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+const open = (type = 'add') => {
+    mode.value = type
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+defineExpose({
+    open,
+    setFormData
+})
+</script>
diff --git a/src/views/setting/dict/type/index.vue b/src/views/setting/dict/type/index.vue
new file mode 100644
index 0000000..58860e1
--- /dev/null
+++ b/src/views/setting/dict/type/index.vue
@@ -0,0 +1,170 @@
+<template>
+    <div class="dict-type">
+        <el-card class="!border-none" shadow="never">
+            <el-form ref="formRef" class="mb-[-16px]" :model="queryParams" inline>
+                <el-form-item label="字典名称">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.name"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="字典类型">
+                    <el-input
+                        class="w-[280px]"
+                        v-model="queryParams.type"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+                <el-form-item label="状态">
+                    <el-select class="w-[280px]" v-model="queryParams.status">
+                        <el-option label="全部" value />
+                        <el-option label="正常" :value="1" />
+                        <el-option label="停用" :value="0" />
+                    </el-select>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never">
+            <div>
+                <el-button
+                    v-perms="['setting.dict.dict_type/add']"
+                    type="primary"
+                    @click="handleAdd"
+                >
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+                <el-button
+                    v-perms="['setting.dict.dict_type/delete']"
+                    :disabled="!selectData.length"
+                    type="danger"
+                    @click="handleDelete(selectData)"
+                >
+                    <template #icon>
+                        <icon name="el-icon-Delete" />
+                    </template>
+                    删除
+                </el-button>
+            </div>
+            <div class="mt-4" v-loading="pager.loading">
+                <div>
+                    <el-table
+                        :data="pager.lists"
+                        size="large"
+                        @selection-change="handleSelectionChange"
+                    >
+                        <el-table-column type="selection" width="55" />
+                        <el-table-column label="ID" prop="id" />
+                        <el-table-column label="字典名称" prop="name" min-width="120" />
+                        <el-table-column label="字典类型" prop="type" min-width="120" />
+                        <el-table-column label="状态">
+                            <template v-slot="{ row }">
+                                <el-tag v-if="row.status == 1">正常</el-tag>
+                                <el-tag v-else type="danger">停用</el-tag>
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="备注" prop="remark" show-tooltip-when-overflow />
+                        <el-table-column label="创建时间" prop="create_time" min-width="180" />
+                        <el-table-column label="操作" width="190" fixed="right">
+                            <template #default="{ row }">
+                                <el-button
+                                    v-perms="['setting.dict.dict_type/edit']"
+                                    link
+                                    type="primary"
+                                    @click="handleEdit(row)"
+                                >
+                                    编辑
+                                </el-button>
+                                <el-button
+                                    v-perms="['setting.dict.dict_data/lists']"
+                                    type="primary"
+                                    link
+                                >
+                                    <router-link
+                                        :to="{
+                                            path: getRoutePath('setting.dict.dict_data/lists'),
+                                            query: {
+                                                id: row.id
+                                            }
+                                        }"
+                                    >
+                                        数据管理
+                                    </router-link>
+                                </el-button>
+                                <el-button
+                                    v-perms="['setting.dict.dict_type/delete']"
+                                    link
+                                    type="danger"
+                                    @click="handleDelete(row.id)"
+                                >
+                                    删除
+                                </el-button>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+                <div class="flex justify-end mt-4">
+                    <pagination v-model="pager" @change="getLists" />
+                </div>
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
+    </div>
+</template>
+
+<script lang="ts" setup name="dictType">
+import { dictTypeDelete, dictTypeLists } from '@/api/setting/dict'
+import { usePaging } from '@/hooks/usePaging'
+import { getRoutePath } from '@/router'
+import feedback from '@/utils/feedback'
+import EditPopup from './edit.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const showEdit = ref(false)
+const queryParams = reactive({
+    name: '',
+    type: '',
+    status: ''
+})
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: dictTypeLists,
+    params: queryParams
+})
+
+const selectData = ref<any[]>([])
+
+const handleSelectionChange = (val: any[]) => {
+    selectData.value = val.map(({ id }) => id)
+}
+
+const handleAdd = async () => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('add')
+}
+
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open('edit')
+    editRef.value?.setFormData(data)
+}
+
+// 删除角色
+const handleDelete = async (id: any[] | number) => {
+    await feedback.confirm('确定要删除？')
+    await dictTypeDelete({ id })
+    getLists()
+}
+
+getLists()
+</script>
diff --git a/src/views/setting/pay/config/edit.vue b/src/views/setting/pay/config/edit.vue
new file mode 100644
index 0000000..3465ba4
--- /dev/null
+++ b/src/views/setting/pay/config/edit.vue
@@ -0,0 +1,298 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            :title="popupTitle"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules">
+                <el-form-item label="支付方式">
+                    <el-radio :label="popupTitle" :model-value="popupTitle" />
+                </el-form-item>
+                <el-form-item label="显示名称" prop="name">
+                    <el-input v-model="formData.name" placeholder="请输入显示名称" />
+                </el-form-item>
+                <el-form-item label="显示图标" prop="image">
+                    <div>
+                        <material-picker :limit="1" :disabled="false" v-model="formData.icon" />
+                        <span class="form-tips">建议尺寸：200*200px</span>
+                    </div>
+                </el-form-item>
+                <template v-if="formData.pay_way == PayWayEnum.WECHAT">
+                    <el-form-item prop="config.interface_version" label="微信支付接口版本">
+                        <div>
+                            <el-radio-group v-model="formData.config.interface_version">
+                                <el-radio label="v3"></el-radio>
+                            </el-radio-group>
+                            <div class="form-tips">暂时只支持V3版本</div>
+                        </div>
+                    </el-form-item>
+
+                    <el-form-item label="商户类型" prop="config.merchant_type">
+                        <div>
+                            <el-radio-group v-model="formData.config.merchant_type">
+                                <el-radio label="ordinary_merchant">普通商户</el-radio>
+                            </el-radio-group>
+                            <div class="form-tips">
+                                暂时只支持普通商户类型，服务商户类型模式暂不支持
+                            </div>
+                        </div>
+                    </el-form-item>
+
+                    <el-form-item label="微信支付商户号" prop="config.mch_id">
+                        <div class="flex-1">
+                            <el-input
+                                v-model="formData.config.mch_id"
+                                placeholder="请输入微信支付商户号"
+                            />
+                            <div class="form-tips">微信支付商户号（MCHID）</div>
+                        </div>
+                    </el-form-item>
+
+                    <el-form-item label="商户API密钥" prop="config.pay_sign_key">
+                        <el-input
+                            v-model="formData.config.pay_sign_key"
+                            placeholder="请输入微信支付商户API密钥"
+                        />
+                        <span class="form-tips">微信支付商户API密钥（paySignKey）</span>
+                    </el-form-item>
+
+                    <el-form-item label="微信支付证书" prop="config.apiclient_cert">
+                        <el-input
+                            type="textarea"
+                            rows="3"
+                            v-model="formData.config.apiclient_cert"
+                            placeholder="请输入微信支付证书"
+                        />
+
+                        <span class="form-tips">
+                            微信支付证书（apiclient_cert.pem），前往微信商家平台生成并黏贴至此处
+                        </span>
+                    </el-form-item>
+
+                    <el-form-item label="微信支付证书密钥" prop="config.apiclient_key">
+                        <el-input
+                            type="textarea"
+                            rows="3"
+                            v-model="formData.config.apiclient_key"
+                            placeholder="请输入微信支付证书密钥"
+                        />
+                        <span class="form-tips">
+                            微信支付证书密钥（apiclient_key.pem），前往微信商家平台生成并黏贴至此处
+                        </span>
+                    </el-form-item>
+
+                    <el-form-item label="支付授权目录">
+                        <div>
+                            <div>
+                                <span class="mr-[20px]">{{ formData.domain }}</span>
+                                <el-button link type="primary" v-copy="formData.domain">
+                                    复制
+                                </el-button>
+                            </div>
+                            <span class="form-tips">
+                                支付授权目录仅用于参考，复制后前往微信商家平台填写
+                            </span>
+                        </div>
+                    </el-form-item>
+                </template>
+                <template v-if="formData.pay_way == PayWayEnum.ALIPAY">
+                    <el-form-item label="模式" prop="config.mode">
+                        <div>
+                            <el-radio-group v-model="formData.config.mode">
+                                <el-radio label="normal_mode">普通模式</el-radio>
+                            </el-radio-group>
+                            <div class="form-tips">暂时仅支持支付宝普通模式</div>
+                        </div>
+                    </el-form-item>
+
+                    <el-form-item label="商户类型" prop="config.merchant_type">
+                        <div>
+                            <el-radio-group v-model="formData.config.merchant_type">
+                                <el-radio label="ordinary_merchant">普通商户</el-radio>
+                            </el-radio-group>
+                            <div class="form-tips">
+                                暂时只支持普通商户类型，服务商户类型模式暂不支持
+                            </div>
+                        </div>
+                    </el-form-item>
+
+                    <el-form-item label="应用ID" prop="config.app_id">
+                        <div class="flex-1">
+                            <el-input
+                                v-model="formData.config.app_id"
+                                placeholder="请输入支付宝应用ID"
+                            />
+                            <span class="form-tips"> 支付宝应用APP_ID </span>
+                        </div>
+                    </el-form-item>
+
+                    <el-form-item label="应用私钥" prop="config.private_key">
+                        <div class="flex-1">
+                            <el-input
+                                type="textarea"
+                                rows="3"
+                                v-model="formData.config.private_key"
+                                placeholder="请输入支付宝应用私钥"
+                            />
+                            <span class="form-tips">支付宝应用私钥（private_key） </span>
+                        </div>
+                    </el-form-item>
+
+                    <el-form-item label="支付宝公钥" prop="config.ali_public_key">
+                        <div class="flex-1">
+                            <el-input
+                                type="textarea"
+                                rows="3"
+                                v-model="formData.config.ali_public_key"
+                                placeholder="请输入支付宝公钥"
+                            />
+                            <span class="form-tips">支付宝公钥（ali_public_key） </span>
+                        </div>
+                    </el-form-item>
+                </template>
+                <el-form-item label="排序" prop="sort">
+                    <div>
+                        <el-input-number v-model="formData.sort" :min="0" :max="9999" />
+                        <div class="form-tips">默认为0， 数值越大越排前</div>
+                    </div>
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { getPayConfig, setPayConfig } from '@/api/setting/pay'
+import Popup from '@/components/popup/index.vue'
+const emit = defineEmits(['success', 'close'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+enum PayWayEnum {
+    BALANCE = 1,
+    WECHAT = 2,
+    ALIPAY = 3
+}
+const popupTitle = computed(() => {
+    switch (formData.pay_way) {
+        case PayWayEnum.BALANCE:
+            return '余额支付'
+        case PayWayEnum.WECHAT:
+            return '微信支付'
+        case PayWayEnum.ALIPAY:
+            return '支付宝支付'
+    }
+})
+const formData = reactive({
+    id: '',
+    pay_way: 0,
+    name: '',
+    icon: '',
+    sort: 0,
+    remark: '',
+    domain: '',
+    config: {
+        interface_version: '',
+        merchant_type: '',
+        mch_id: '',
+        pay_sign_key: '',
+        apiclient_cert: '',
+        apiclient_key: '',
+        mode: '',
+        app_id: '',
+        private_key: '',
+        ali_public_key: ''
+    }
+})
+
+const formRules: FormRules = {
+    name: [
+        {
+            required: true,
+            message: '请输入显示名称'
+        }
+    ],
+    'config.mch_id': [
+        {
+            required: true,
+            message: '请输入微信支付商户号'
+        }
+    ],
+    'config.pay_sign_key': [
+        {
+            required: true,
+            message: '请输入微信支付商户API密钥'
+        }
+    ],
+    'config.apiclient_cert': [
+        {
+            required: true,
+            message: '请输入微信支付证书'
+        }
+    ],
+    'config.apiclient_key': [
+        {
+            required: true,
+            message: '请输入微信支付证书密钥'
+        }
+    ],
+    'config.app_id': [
+        {
+            required: true,
+            message: '请输入支付宝应用ID'
+        }
+    ],
+    'config.private_key': [
+        {
+            required: true,
+            message: '请输入支付宝应用私钥'
+        }
+    ],
+    'config.ali_public_key': [
+        {
+            required: true,
+            message: '请输入支付宝公钥'
+        }
+    ]
+}
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    await setPayConfig(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const open = () => {
+    popupRef.value?.open()
+}
+
+const setFormData = (data: Record<any, any>) => {
+    for (const key in formData) {
+        if (data[key] != null && data[key] != undefined) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    }
+}
+
+const getDetail = async (row: Record<string, any>) => {
+    const data = await getPayConfig({
+        id: row.id
+    })
+    setFormData(data)
+}
+
+const handleClose = () => {
+    emit('close')
+}
+
+defineExpose({
+    open,
+    setFormData,
+    getDetail
+})
+</script>
diff --git a/src/views/setting/pay/config/index.vue b/src/views/setting/pay/config/index.vue
new file mode 100644
index 0000000..89c14bd
--- /dev/null
+++ b/src/views/setting/pay/config/index.vue
@@ -0,0 +1,63 @@
+<template>
+    <div>
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：设置系统支持的支付方式"
+                :closable="false"
+                show-icon
+            />
+        </el-card>
+        <el-card shadow="never" class="mt-4 !border-none">
+            <div>
+                <el-table :data="payConfigList">
+                    <el-table-column prop="pay_way_name" label="支付方式" min-width="150" />
+                    <el-table-column prop="name" label="显示名称" min-width="150" />
+                    <el-table-column label="图标" min-width="150">
+                        <template #default="{ row }">
+                            <el-image
+                                :src="row.icon"
+                                alt="图标"
+                                style="width: 34px; height: 34px"
+                            />
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="sort" label="排序" min-width="150" />
+                    <el-table-column label="操作" min-width="80" fixed="right">
+                        <!-- 操作 -->
+                        <template #default="{ row }">
+                            <el-button
+                                v-perms="['setting.pay.pay_config/setConfig']"
+                                link
+                                type="primary"
+                                @click="handleEdit(row)"
+                            >
+                                配置
+                            </el-button>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </div>
+        </el-card>
+        <edit-popup v-if="showEdit" ref="editRef" @success="getConfig" @close="showEdit = false" />
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { getPayConfigLists } from '@/api/setting/pay'
+import EditPopup from './edit.vue'
+const payConfigList = ref<any[]>([])
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const showEdit = ref(false)
+const getConfig = async () => {
+    const { lists } = await getPayConfigLists()
+    payConfigList.value = lists
+}
+const handleEdit = async (data: any) => {
+    showEdit.value = true
+    await nextTick()
+    editRef.value?.open()
+    editRef.value?.getDetail(data)
+}
+getConfig()
+</script>
diff --git a/src/views/setting/pay/method/index.vue b/src/views/setting/pay/method/index.vue
new file mode 100644
index 0000000..efc5fe7
--- /dev/null
+++ b/src/views/setting/pay/method/index.vue
@@ -0,0 +1,136 @@
+<template>
+    <div>
+        <div>
+            <el-button
+                type="primary"
+                v-perms="['setting.pay.pay_way/setPayWay']"
+                @click="handelSetupPayWay"
+            >
+                设置支付方式
+            </el-button>
+        </div>
+
+        <el-card
+            shadow="never"
+            class="mt-4 !border-none"
+            v-for="(value, scene) in payWay"
+            :key="scene"
+        >
+            <div>
+                <div class="text-lg mb-[24px]" v-if="scene == PaySceneEnum.MP_WEIXIN">
+                    微信小程序
+                    <span class="form-tips ml-[10px]">在微信小程序中付款的场景</span>
+                </div>
+                <div class="text-lg mb-[24px]" v-if="scene == PaySceneEnum.OA">
+                    微信公众号
+                    <span class="form-tips ml-[10px]">
+                        在微信公众号H5页面中付款的场景，公众号类型一般为服务号
+                    </span>
+                </div>
+                <div class="text-lg mb-[24px]" v-if="scene == PaySceneEnum.H5">
+                    H5支付
+                    <span class="form-tips ml-[10px]">在浏览器H5页面中付款的场景</span>
+                </div>
+                <div class="text-lg mb-[24px]" v-if="scene == PaySceneEnum.PC">
+                    PC支付
+                    <span class="form-tips ml-[10px]">在浏览器PC页面中付款的场景</span>
+                </div>
+                <div class="text-lg mb-[24px]" v-if="scene == PaySceneEnum.APP">
+                    APP支付
+                    <span class="form-tips ml-[10px]">在APP付款的场景</span>
+                </div>
+                <el-table v-if="value.length" :data="value" style="width: 100%">
+                    <el-table-column label="图标" min-width="150">
+                        <template #default="{ row }">
+                            <el-image
+                                :src="row.icon"
+                                alt="图标"
+                                style="width: 34px; height: 34px"
+                            />
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="pay_way_name" label="支付方式" min-width="150" />
+                    <el-table-column label="默认支付" min-width="150">
+                        <template #default="{ row, $index }">
+                            <div>
+                                <template v-if="setupPayWay">
+                                    <el-radio
+                                        v-model="row.is_default"
+                                        :label="1"
+                                        @change="changePayDefault($index, scene)"
+                                    >
+                                        设为默认
+                                    </el-radio>
+                                </template>
+                                <template v-else>
+                                    <el-tag v-if="row.is_default == 1">默认</el-tag>
+                                    <span v-else>-</span>
+                                </template>
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="开启状态" min-width="150">
+                        <template #default="{ row }">
+                            <el-switch
+                                v-if="setupPayWay"
+                                v-model="row.status"
+                                :active-value="1"
+                                :inactive-value="0"
+                            />
+                            <span v-else>
+                                {{ row.status == 1 ? '开启' : '关闭' }}
+                            </span>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </div>
+        </el-card>
+        <footer-btns v-if="setupPayWay">
+            <el-button @click="handleCancel">取消</el-button>
+            <el-button type="primary" @click="handleSubmit">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { getPayWay, setPayWay } from '@/api/setting/pay'
+import { cloneDeep } from 'lodash'
+enum PaySceneEnum {
+    MP_WEIXIN = 1,
+    OA = 2,
+    H5 = 3,
+    PC = 4,
+    APP = 5
+}
+const payWay = ref<Record<number, any[]>>({})
+const setupPayWay = ref(false)
+let defaultPayWay = {}
+const getConfig = async () => {
+    payWay.value = await getPayWay()
+    defaultPayWay = cloneDeep(payWay.value)
+}
+
+const handelSetupPayWay = () => {
+    setupPayWay.value = true
+}
+
+const changePayDefault = (index: number, scene: number) => {
+    payWay.value[scene].forEach((item: any) => {
+        item.is_default = 0
+    })
+    payWay.value[scene][index].is_default = 1
+}
+
+const handleCancel = () => {
+    payWay.value = cloneDeep(defaultPayWay)
+    setupPayWay.value = false
+}
+
+const handleSubmit = async () => {
+    await setPayWay(payWay.value)
+    setupPayWay.value = false
+    getConfig()
+}
+
+getConfig()
+</script>
diff --git a/src/views/setting/search/index.vue b/src/views/setting/search/index.vue
new file mode 100644
index 0000000..c5b0a9c
--- /dev/null
+++ b/src/views/setting/search/index.vue
@@ -0,0 +1,171 @@
+<template>
+    <div class="hot-search">
+        <el-card class="!border-none" shadow="never">
+            <el-form ref="formRef" :model="formData" label-width="100px">
+                <el-form-item label="功能状态" style="margin-bottom: 0">
+                    <div>
+                        <el-radio-group v-model="formData.status">
+                            <el-radio :label="1">开启</el-radio>
+                            <el-radio :label="0">关闭</el-radio>
+                        </el-radio-group>
+
+                        <div class="form-tips">默认开启，关闭则前端不显示该功能</div>
+                    </div>
+                </el-form-item>
+            </el-form>
+        </el-card>
+
+        <el-card class="!border-none mt-4" shadow="never">
+            <div class="lg:flex">
+                <div class="flex-1 min-w-0">
+                    <el-button type="primary" class="mb-4" @click="handleAdd">添加</el-button>
+                    <el-table size="large" :data="formData.data">
+                        <el-table-column label="关键词" prop="describe" min-width="160">
+                            <template #default="{ row }">
+                                <el-input
+                                    v-model="row.name"
+                                    clearable
+                                    placeholder="请输入关键字"
+                                    show-word-limit
+                                    maxlength="30"
+                                />
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="排序" prop="describe" min-width="160">
+                            <template #default="{ row }">
+                                <el-input v-model="row.sort" type="number" />
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="操作" min-width="80" fixed="right">
+                            <template #default="{ $index }">
+                                <el-button
+                                    v-perms="['setting:storage:edit']"
+                                    type="danger"
+                                    link
+                                    @click="handleDel($index)"
+                                >
+                                    删除
+                                </el-button>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+
+                <div class="hot-search-phone mt-4 lg:mt-0 lg:ml-4 flex-none">
+                    <div class="mb-4 text-center">- 热搜预览图 -</div>
+                    <div class="hot-search-phone-content">
+                        <!-- 搜索框 -->
+                        <div class="search-com">
+                            <div class="search-con flex items-center px-[15px]">
+                                <icon name="el-icon-Search" :size="17" />
+                                <span class="ml-[5px]">请输入关键词搜索</span>
+                            </div>
+                        </div>
+                        <!-- 热门搜索 -->
+                        <div class="hot-search-title">热门搜索</div>
+                        <div class="hot-search-text">
+                            <span v-for="(text, index) in list" :key="index">
+                                {{ text.name }}
+                            </span>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </el-card>
+
+        <footer-btns v-perms="['setting.hot_search/setConfig']">
+            <el-button type="primary" @click="handleSave">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script setup lang="ts" name="search">
+import { getSearch, setSearch } from '@/api/setting/search'
+import type { Search } from '@/api/setting/search'
+
+const formData = reactive<Search>({
+    status: 1,
+    data: []
+})
+
+const list = computed(() => {
+    return formData.data.filter((text) => text.name).sort((v1, v2) => v2.sort - v1.sort)
+})
+
+// 获取登录注册数据
+const getData = async () => {
+    try {
+        const data = await getSearch()
+        for (const key in formData) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    } catch (error) {
+        console.log('获取=>', error)
+    }
+}
+
+const handleAdd = () => {
+    formData.data.push({
+        name: '',
+        sort: 0
+    })
+}
+
+const handleDel = (index: number) => {
+    formData.data.splice(index, 1)
+}
+
+const handleSave = async () => {
+    try {
+        await setSearch(formData)
+        getData()
+    } catch (error) {
+        console.log('保存=>', error)
+    }
+}
+
+getData()
+</script>
+
+<style lang="scss" scoped>
+.hot-search {
+    .hot-search-phone {
+        width: 300px;
+        background-color: #fff;
+        &-content {
+            width: 100%;
+            height: 530px;
+            padding: 12px 12px;
+            border-radius: 10px;
+            border: 1px solid #e6e6e6;
+
+            .search-com {
+                .search-con {
+                    height: 100%;
+                    height: 36px;
+                    border-radius: 36px;
+                    background: #f4f4f4;
+                    color: #999999;
+                }
+            }
+
+            .hot-search-title {
+                padding: 10px 0;
+                font-size: 13px;
+            }
+
+            .hot-search-text {
+                span {
+                    font-size: 12px;
+                    border-radius: 100px;
+                    padding: 5px 10px;
+                    margin: 0 6px 6px 0;
+                    display: inline-block;
+                    background-color: #f4f4f4;
+                }
+            }
+        }
+    }
+}
+</style>
diff --git a/src/views/setting/storage/edit.vue b/src/views/setting/storage/edit.vue
new file mode 100644
index 0000000..ed87fbb
--- /dev/null
+++ b/src/views/setting/storage/edit.vue
@@ -0,0 +1,194 @@
+<template>
+    <div class="edit-popup">
+        <popup
+            ref="popupRef"
+            title="设置存储"
+            :async="true"
+            width="550px"
+            @confirm="handleSubmit"
+            @close="handleClose"
+        >
+            <el-form ref="formRef" :model="formData" label-width="120px" :rules="formRules">
+                <el-form-item label="存储方式" prop="engine">
+                    <div>
+                        <el-radio model-value>{{ getStorageInfo?.name }} </el-radio>
+                        <div class="form-tips">{{ getStorageInfo?.tips }}</div>
+                    </div>
+                </el-form-item>
+                <div v-if="formData.engine !== 'local'">
+                    <el-form-item label=" 存储空间名称" prop="bucket">
+                        <div class="flex-1">
+                            <el-input
+                                v-model="formData.bucket"
+                                placeholder="请输入存储空间名称(Bucket)"
+                                clearable
+                            />
+                        </div>
+                    </el-form-item>
+                    <el-form-item label="ACCESS_KEY" prop="access_key">
+                        <el-input
+                            v-model="formData.access_key"
+                            placeholder="请输入ACCESS_KEY(AK)"
+                            clearable
+                        />
+                    </el-form-item>
+                    <el-form-item label="SECRET_KEY" prop="secret_key">
+                        <el-input
+                            v-model="formData.secret_key"
+                            placeholder="请输入SECRET_KEY(SK)"
+                            clearable
+                        />
+                    </el-form-item>
+                    <el-form-item label="空间域名" prop="domain">
+                        <div class="flex-1">
+                            <div>
+                                <el-input
+                                    v-model="formData.domain"
+                                    placeholder="请输入空间域名(Domain)"
+                                    clearable
+                                />
+                            </div>
+                            <div class="form-tips">
+                                请补全http://或https://，例如https://static.cloud.com
+                            </div>
+                        </div>
+                    </el-form-item>
+                    <el-form-item
+                        v-if="formData.engine == StorageEnum.QCLOUD"
+                        label="REGION"
+                        prop="region"
+                    >
+                        <el-input v-model="formData.region" placeholder="请输入region" clearable />
+                    </el-form-item>
+                </div>
+                <el-form-item label="状态" prop="status">
+                    <el-radio-group v-model="formData.status">
+                        <el-radio :label="0">关闭</el-radio>
+                        <el-radio :label="1">开启</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+            </el-form>
+        </popup>
+    </div>
+</template>
+<script lang="ts" setup>
+import { storageSetup } from '@/api/setting/storage'
+import type { FormInstance } from 'element-plus'
+import Popup from '@/components/popup/index.vue'
+import { storageDetail } from '@/api/setting/storage'
+enum StorageEnum {
+    LOCAL = 'local', // 本地
+    QINIU = 'qiniu', // 七牛云
+    ALIYUN = 'aliyun', // 阿里云OSS
+    QCLOUD = 'qcloud' // 腾讯云OSS
+}
+
+const emit = defineEmits(['success'])
+const formRef = shallowRef<FormInstance>()
+const popupRef = shallowRef<InstanceType<typeof Popup>>()
+const formData = reactive({
+    engine: '',
+    bucket: '',
+    access_key: '',
+    secret_key: '',
+    domain: '',
+    region: '', // 腾讯云需要
+    status: 0
+})
+
+const storageArr = [
+    {
+        name: '本地存储',
+        type: StorageEnum.LOCAL,
+        tips: '本地存储方式不需要配置其他参数'
+    },
+    {
+        name: '七牛云存储',
+        type: StorageEnum.QINIU,
+        tips: '切换七牛云存储后，素材库需要重新上传至七牛云'
+    },
+    {
+        name: '阿里云OSS',
+        type: StorageEnum.ALIYUN,
+        tips: '切换阿里云OSS后，素材库需要重新上传至阿里云OSS'
+    },
+    {
+        name: '腾讯云OSS',
+        type: StorageEnum.QCLOUD,
+        tips: '切换腾讯云OSS后，素材库需要重新上传至腾讯云OSS'
+    }
+]
+
+const formRules = {
+    bucket: [
+        {
+            required: true,
+            message: '请输入存储空间名称',
+            trigger: 'blur'
+        }
+    ],
+    access_key: [
+        {
+            required: true,
+            message: '请输入ACCESS_KEY',
+            trigger: 'blur'
+        }
+    ],
+    secret_key: [
+        {
+            required: true,
+            message: '请输入SECRET_KEY',
+            trigger: 'blur'
+        }
+    ],
+    domain: [
+        {
+            required: true,
+            message: '请输入空间域名',
+            trigger: 'blur'
+        }
+    ],
+    region: [
+        {
+            required: true,
+            message: '请输入REGION',
+            trigger: 'blur'
+        }
+    ]
+}
+
+const getStorageInfo = computed(() => {
+    return storageArr.find((item) => item.type == formData.engine)
+})
+
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    await storageSetup(formData)
+    popupRef.value?.close()
+    emit('success')
+}
+
+const getDetail = async () => {
+    const data = await storageDetail({
+        engine: formData.engine
+    })
+    for (const key in data) {
+        //@ts-ignore
+        formData[key] = data[key]
+    }
+}
+
+const open = (type: string) => {
+    formData.engine = type
+    popupRef.value?.open()
+    getDetail()
+}
+
+const handleClose = () => {
+    formRef.value?.resetFields()
+}
+
+defineExpose({
+    open
+})
+</script>
diff --git a/src/views/setting/storage/index.vue b/src/views/setting/storage/index.vue
new file mode 100644
index 0000000..6f68e53
--- /dev/null
+++ b/src/views/setting/storage/index.vue
@@ -0,0 +1,65 @@
+<template>
+    <div class="storage">
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：1.切换存储方式后，需要将资源文件传输至新的存储端；2.请勿随意切换存储方式，可能导致图片无法查看"
+                :closable="false"
+                show-icon
+            ></el-alert>
+        </el-card>
+        <el-card class="!border-none mt-4" shadow="never" v-loading="state.loading">
+            <el-table size="large" :data="state.lists">
+                <el-table-column label="储存方式" prop="name" min-width="120" />
+                <el-table-column label="储存位置" prop="path" min-width="160" />
+                <el-table-column label="状态" min-width="80">
+                    <template #default="{ row }">
+                        <el-tag v-if="row.status == 1">开启</el-tag>
+                        <el-tag type="danger" v-else>关闭</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" min-width="80" fixed="right">
+                    <template #default="{ row }">
+                        <el-button
+                            v-perms="['setting.storage/setup']"
+                            type="primary"
+                            link
+                            @click="handleSet(row.engine)"
+                        >
+                            设置
+                        </el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-card>
+        <edit-popup ref="editRef" @success="getLists" />
+    </div>
+</template>
+<script lang="ts" setup name="storage">
+import { storageLists } from '@/api/setting/storage'
+import EditPopup from './edit.vue'
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+
+// 列表数据
+const state = reactive({
+    loading: false,
+    lists: []
+})
+
+// 获取存储引擎列表数据
+const getLists = async () => {
+    try {
+        state.loading = true
+        state.lists = await storageLists()
+        state.loading = false
+    } catch (error) {
+        state.loading = false
+    }
+}
+
+const handleSet = (engine: string) => {
+    editRef.value?.open(engine)
+}
+
+getLists()
+</script>
diff --git a/src/views/setting/system/cache.vue b/src/views/setting/system/cache.vue
new file mode 100644
index 0000000..6fc2e2e
--- /dev/null
+++ b/src/views/setting/system/cache.vue
@@ -0,0 +1,45 @@
+<!-- 系统缓存 -->
+<template>
+    <div class="cache">
+        <el-card class="!border-none" shadow="never">
+            <el-alert
+                type="warning"
+                title="温馨提示：管理系统运行过程中产生的缓存"
+                :closable="false"
+                show-icon
+            ></el-alert>
+        </el-card>
+
+        <el-card class="!border-none mt-4" shadow="never">
+            <el-table :data="cacheDate" size="large">
+                <el-table-column label="管理内容" prop="content" min-width="130"></el-table-column>
+                <el-table-column label="内容说明" prop="desc" min-width="180"></el-table-column>
+                <el-table-column label="操作" width="130" fixed="right">
+                    <template #default>
+                        <el-button type="primary" link @click="handleClean">清除系统缓存</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </el-card>
+    </div>
+</template>
+
+<script setup lang="ts" name="cache">
+import { systemCacheClear } from '@/api/setting/system'
+import feedback from '@/utils/feedback'
+
+// 列表数据
+const cacheDate = ref<Array<object>>([
+    {
+        content: '系统缓存',
+        desc: '系统运行过程中产生的各类缓存数据'
+    }
+])
+
+// 清理缓存
+const handleClean = async () => {
+    await feedback.confirm('确认清除系统缓存？')
+    await systemCacheClear()
+    window.location.reload()
+}
+</script>
diff --git a/src/views/setting/system/environment.vue b/src/views/setting/system/environment.vue
new file mode 100644
index 0000000..0140a86
--- /dev/null
+++ b/src/views/setting/system/environment.vue
@@ -0,0 +1,79 @@
+<!-- 系统环境 -->
+<template>
+    <div class="system-environment">
+        <el-card class="!border-none" shadow="never">
+            <div>服务器信息</div>
+            <div class="mt-4">
+                <el-table :data="info.server">
+                    <el-table-column prop="param" label="参数"></el-table-column>
+                    <el-table-column prop="value" label="值"></el-table-column>
+                </el-table>
+            </div>
+        </el-card>
+
+        <el-card shadow="never" class="!border-none mt-4">
+            <div>PHP环境要求</div>
+            <div class="mt-4">
+                <el-table :data="info.env">
+                    <el-table-column prop="option" label="选项"></el-table-column>
+                    <el-table-column prop="require" label="要求"></el-table-column>
+                    <el-table-column label="状态">
+                        <template #default="scope">
+                            <icon
+                                v-if="scope.row.status"
+                                name="el-icon-Select"
+                                class="text-success"
+                            />
+                            <icon v-else name="el-icon-CloseBold" class="text-danger" />
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="remark" label="说明及帮助"></el-table-column>
+                </el-table>
+            </div>
+        </el-card>
+
+        <el-card shadow="never" class="!border-none mt-4">
+            <div>目录权限</div>
+            <div class="mt-4">
+                <el-table :data="info.auth">
+                    <el-table-column prop="dir" label="选项"></el-table-column>
+                    <el-table-column prop="require" label="要求"></el-table-column>
+                    <el-table-column label="状态">
+                        <template #default="scope">
+                            <icon
+                                v-if="scope.row.status"
+                                name="el-icon-Select"
+                                class="text-success"
+                            />
+                            <icon v-else name="el-icon-CloseBold" class="text-danger" />
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="remark" label="说明及帮助"></el-table-column>
+                </el-table>
+            </div>
+        </el-card>
+    </div>
+</template>
+
+<script lang="ts" setup name="environment">
+import { systemInfo } from '@/api/setting/system'
+const info = reactive({
+    server: [], // 服务器信息
+    env: [], // PHP环境要求
+    auth: [] // 目录权限
+})
+
+const getSystemInfo = () => {
+    systemInfo().then((res) => {
+        info.server = res.server
+        info.env = res.env
+        info.auth = res.auth
+    })
+}
+
+onMounted(() => {
+    getSystemInfo()
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/setting/system/journal.vue b/src/views/setting/system/journal.vue
new file mode 100644
index 0000000..dfd7e9f
--- /dev/null
+++ b/src/views/setting/system/journal.vue
@@ -0,0 +1,149 @@
+<!-- 系统日志 -->
+<template>
+    <div class="journal">
+        <el-card class="!border-none" shadow="never">
+            <el-form class="ls-form" :model="formData" inline>
+                <el-form-item label="管理员">
+                    <el-input
+                        class="w-[280px]"
+                        placeholder="请输入"
+                        v-model="formData.admin_name"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+
+                <el-form-item label="访问方式">
+                    <el-select class="w-[280px]" v-model="formData.type" placeholder="请选择">
+                        <el-option
+                            v-for="(item, index) in visitType"
+                            :key="index"
+                            :label="item.label"
+                            :value="item.value"
+                        />
+                    </el-select>
+                </el-form-item>
+
+                <el-form-item label="来源IP">
+                    <el-input
+                        class="w-[280px]"
+                        placeholder="请输入"
+                        v-model="formData.ip"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+
+                <el-form-item label="访问时间">
+                    <daterange-picker
+                        v-model:startTime="formData.start_time"
+                        v-model:endTime="formData.end_time"
+                    />
+                </el-form-item>
+
+                <el-form-item label="访问链接">
+                    <el-input
+                        class="w-[280px]"
+                        placeholder="请输入"
+                        v-model="formData.url"
+                        clearable
+                        @keyup.enter="resetPage"
+                    />
+                </el-form-item>
+
+                <el-form-item>
+                    <el-button type="primary" @click="resetPage">查询</el-button>
+                    <el-button @click="resetParams">重置</el-button>
+                    <export-data
+                        class="ml-2.5"
+                        :fetch-fun="systemLogLists"
+                        :params="formData"
+                        :page-size="pager.size"
+                    />
+                </el-form-item>
+            </el-form>
+        </el-card>
+
+        <el-card class="!border-none mt-4" shadow="never" v-loading="pager.loading">
+            <div>
+                <el-table :data="pager.lists" size="large">
+                    <el-table-column label="记录ID" prop="id" />
+                    <el-table-column label="操作" prop="action" min-width="120" />
+                    <el-table-column label="管理员" prop="admin_name" min-width="120" />
+                    <el-table-column label="管理员ID" prop="admin_id" min-width="120" />
+                    <el-table-column label="访问链接" prop="url" min-width="160" />
+                    <el-table-column label="访问方式" prop="type" />
+                    <el-table-column label="访问参数" prop="params" min-width="160" />
+                    <el-table-column label="来源IP" prop="ip" min-width="160" />
+                    <el-table-column label="日志时间" prop="create_time" min-width="180" />
+                </el-table>
+            </div>
+            <div class="flex mt-4 justify-end">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+    </div>
+</template>
+
+<script setup lang="ts" name="journal">
+import { systemLogLists } from '@/api/setting/system'
+import { usePaging } from '@/hooks/usePaging'
+
+interface formDataObj {
+    admin_name?: string // 管理员
+    url?: string // 访问链接
+    ip?: string // ip
+    type?: string // 访问方式
+    start_time?: string // 日志时间开始
+    end_time?: string // 日志时间结束
+}
+
+// 查询表单
+const formData = ref<formDataObj>({
+    admin_name: '',
+    url: '',
+    ip: '',
+    type: '',
+    start_time: '',
+    end_time: ''
+})
+
+// 访问方式
+const visitType = ref<Array<any>>([
+    {
+        label: '全部',
+        value: ''
+    },
+    {
+        label: 'get',
+        value: 'get'
+    },
+    {
+        label: 'post',
+        value: 'post'
+    },
+    {
+        label: 'put',
+        value: 'put'
+    },
+    {
+        label: 'delete',
+        value: 'delete'
+    },
+    {
+        label: 'option',
+        value: 'option'
+    }
+])
+
+const { pager, getLists, resetParams, resetPage } = usePaging({
+    fetchFun: systemLogLists,
+    params: formData.value
+})
+
+onMounted(() => {
+    getLists()
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/setting/system/scheduled_task/edit.vue b/src/views/setting/system/scheduled_task/edit.vue
new file mode 100644
index 0000000..bcb4da7
--- /dev/null
+++ b/src/views/setting/system/scheduled_task/edit.vue
@@ -0,0 +1,147 @@
+<template>
+    <div class="article-edit">
+        <el-card class="!border-none" shadow="never">
+            <el-page-header :content="$route.meta.title" @back="$router.back()" />
+        </el-card>
+        <el-card class="mt-4 !border-none" shadow="never">
+            <el-form
+                ref="formRef"
+                class="ls-form"
+                :model="formData"
+                label-width="85px"
+                :rules="rules"
+            >
+                <el-form-item label="名称" prop="name">
+                    <div class="w-80">
+                        <el-input
+                            v-model="formData.name"
+                            placeholder="请输入名称"
+                            maxlength="30"
+                            clearable
+                        />
+                    </div>
+                </el-form-item>
+                <el-form-item label="类型" prop="type">
+                    <el-radio-group v-model="formData.type">
+                        <el-radio :label="1">定时任务</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="命令" prop="command">
+                    <div class="w-80">
+                        <el-input
+                            v-model="formData.command"
+                            placeholder="请输入thinkphp命令，如vresion"
+                            clearable
+                        />
+                    </div>
+                </el-form-item>
+                <el-form-item label="参数" prop="params">
+                    <div class="w-80">
+                        <el-input
+                            v-model="formData.params"
+                            placeholder="请输入参数，例:--id 8 --name 测试"
+                            clearable
+                        />
+                    </div>
+                </el-form-item>
+                <el-form-item label="状态">
+                    <el-switch v-model="formData.status" :active-value="1" :inactive-value="2" />
+                </el-form-item>
+                <el-form-item label="规则" prop="expression">
+                    <div class="w-80">
+                        <el-input
+                            @blur="getExpression"
+                            v-model="formData.expression"
+                            placeholder="请输入crontab规则，例：5 9 * * *"
+                        />
+                    </div>
+                </el-form-item>
+                <el-form-item>
+                    <el-table :data="expressionLists" style="max-width: 320px">
+                        <el-table-column prop="time" label="序号" min-width="80" />
+                        <el-table-column prop="date" label="执行时间" min-width="240" />
+                    </el-table>
+                </el-form-item>
+                <el-form-item label="备注" prop="remark">
+                    <div class="w-80">
+                        <el-input
+                            v-model="formData.remark"
+                            type="textarea"
+                            :autosize="{ minRows: 3, maxRows: 6 }"
+                            :maxlength="200"
+                            show-word-limit
+                            clearable
+                        />
+                    </div>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <footer-btns>
+            <el-button type="primary" @click="handleSave">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script lang="ts" setup name="scheduledTaskEdit">
+import type { FormInstance } from 'element-plus'
+import { crontabAdd, crontabEdit, crontabDetail, crontabExpression } from '@/api/setting/system'
+import useMultipleTabs from '@/hooks/useMultipleTabs'
+
+const route = useRoute()
+const router = useRouter()
+const formData = reactive({
+    id: '',
+    name: '',
+    command: '',
+    expression: '',
+    params: '',
+    remark: '',
+    status: 1,
+    type: 1
+})
+
+const { removeTab } = useMultipleTabs()
+const formRef = shallowRef<FormInstance>()
+const rules = reactive({
+    name: [{ required: true, message: '请输入名称' }],
+    command: [{ required: true, message: '请输入thankphp命令，如vresion' }],
+    expression: [{ required: true, message: '请输入crontab规则，例：5 9 * * *' }]
+})
+
+const getDetails = async () => {
+    const data = await crontabDetail({
+        id: route.query.id
+    })
+    Object.keys(formData).forEach((key) => {
+        //@ts-ignore
+        formData[key] = data[key]
+    })
+}
+
+const expressionLists = ref([])
+const getExpression = async () => {
+    await formRef.value?.validateField(['expression'])
+    const res = await crontabExpression({
+        expression: formData.expression
+    })
+    expressionLists.value = res
+}
+
+const handleSave = async () => {
+    await formRef.value?.validate()
+    if (route.query.id) {
+        await crontabEdit(formData)
+    } else {
+        await crontabAdd(formData)
+    }
+    removeTab()
+    router.back()
+}
+onMounted(async () => {
+    if (!route.query.id) {
+        return
+    }
+    await getDetails()
+    await getExpression()
+})
+</script>
diff --git a/src/views/setting/system/scheduled_task/index.vue b/src/views/setting/system/scheduled_task/index.vue
new file mode 100644
index 0000000..a2b0f2c
--- /dev/null
+++ b/src/views/setting/system/scheduled_task/index.vue
@@ -0,0 +1,96 @@
+<template>
+    <div>
+        <el-card shadow="never" class="!border-none">
+            <router-link
+                v-perms="['crontab.crontab/add', 'crontab.crontab/add:edit']"
+                :to="getRoutePath('crontab.crontab/add:edit')"
+            >
+                <el-button type="primary" class="mb-[16px]">
+                    <template #icon>
+                        <icon name="el-icon-Plus" />
+                    </template>
+                    新增
+                </el-button>
+            </router-link>
+
+            <el-table
+                ref="paneTable"
+                class="m-t-24"
+                :data="pager.lists"
+                v-loading="pager.loading"
+                style="width: 100%"
+            >
+                <el-table-column prop="name" label="名称" min-width="120" />
+                <el-table-column prop="type_desc" label="类型" min-width="100" />
+                <el-table-column prop="command" label="命令" min-width="100" />
+                <el-table-column prop="params" label="参数" min-width="80" />
+                <el-table-column prop="expression" label="规则" min-width="100" />
+                <el-table-column prop="status" label="状态" min-width="100">
+                    <template #default="{ row }">
+                        <el-tag v-if="row.status == 1" type="success">运行中</el-tag>
+                        <el-tag v-if="row.status == 2" type="info">已停止</el-tag>
+                        <el-tag v-if="row.status == 3" type="danger">错误</el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="error" label="错误原因" min-width="120" />
+                <el-table-column prop="last_time" label="最后执行时间" width="180" />
+                <el-table-column prop="time" label="时长" min-width="100" />
+                <el-table-column prop="max_time" label="最大时长" min-width="100" />
+
+                <el-table-column label="操作" width="120" fixed="right">
+                    <template #default="{ row }">
+                        <div class="flex">
+                            <el-button type="primary" link>
+                                <router-link
+                                    v-perms="['crontab.crontab/edit', 'crontab.crontab/add:edit']"
+                                    :to="{
+                                        path: getRoutePath('crontab.crontab/add:edit'),
+                                        query: {
+                                            id: row.id
+                                        }
+                                    }"
+                                >
+                                    <el-button type="primary" link> 编辑 </el-button>
+                                </router-link>
+                            </el-button>
+                            <el-button
+                                v-perms="['crontab.crontab/delete']"
+                                type="danger"
+                                link
+                                @click="handleDelete(row.id)"
+                            >
+                                删除
+                            </el-button>
+                        </div>
+                    </template>
+                </el-table-column>
+            </el-table>
+
+            <div class="flex justify-end mt-4">
+                <pagination v-model="pager" @change="getLists" />
+            </div>
+        </el-card>
+    </div>
+</template>
+
+<script lang="ts" setup name="scheduledTask">
+import { crontabLists, crontabDel } from '@/api/setting/system'
+import { usePaging } from '@/hooks/usePaging'
+import { getRoutePath } from '@/router'
+import feedback from '@/utils/feedback'
+
+const { pager, getLists } = usePaging({
+    fetchFun: crontabLists,
+    params: {}
+})
+
+const handleDelete = async (id: number) => {
+    await feedback.confirm('确定要删除？')
+    await crontabDel({ id })
+    getLists()
+}
+
+getLists()
+</script>
+
+<style lang="scss"></style>
diff --git a/src/views/setting/user/login_register.vue b/src/views/setting/user/login_register.vue
new file mode 100644
index 0000000..8a95eef
--- /dev/null
+++ b/src/views/setting/user/login_register.vue
@@ -0,0 +1,172 @@
+<!-- 网站信息 -->
+<template>
+    <div class="login-register">
+        <el-form ref="formRef" :rules="rules" :model="formData" label-width="120px">
+            <el-card shadow="never" class="!border-none">
+                <div class="font-medium mb-7">通用设置</div>
+
+                <el-form-item label="登录方式" prop="loginWay">
+                    <div>
+                        <el-checkbox-group v-model="formData.login_way">
+                            <el-checkbox label="1">账号密码登录</el-checkbox>
+                            <el-checkbox label="2">手机验证码登录</el-checkbox>
+                        </el-checkbox-group>
+                        <div class="form-tips">系统通用登录方式，至少选择一项</div>
+                    </div>
+                </el-form-item>
+
+                <el-form-item label="强制绑定手机" prop="coerce_mobile">
+                    <div>
+                        <el-switch
+                            v-model="formData.coerce_mobile"
+                            :active-value="1"
+                            :inactive-value="0"
+                        />
+                        <span class="mt-1 ml-2">{{
+                            formData.coerce_mobile ? '开启' : '关闭'
+                        }}</span>
+
+                        <div class="form-tips">
+                            1、如果开启，则新用户在注册完成之后要强制绑定手机号<br />
+                            2、老用户登录时如果检测到没有绑定手机，则要重新绑定手机号
+                        </div>
+                    </div>
+                </el-form-item>
+
+                <el-form-item label="政策协议" prop="login_agreement">
+                    <div>
+                        <el-switch
+                            v-model="formData.login_agreement"
+                            :active-value="1"
+                            :inactive-value="0"
+                        />
+                        <span class="mt-1 ml-2">
+                            {{ formData.login_agreement ? '开启' : '关闭' }}
+                        </span>
+
+                        <div class="form-tips">登录/注册会员时，是否显示服务协议和隐私政策</div>
+                    </div>
+                </el-form-item>
+            </el-card>
+
+            <el-card shadow="never" class="!border-none mt-4">
+                <div class="font-medium mb-7">第三方设置</div>
+
+                <el-form-item label="第三方登录" prop="third_auth">
+                    <div>
+                        <el-switch
+                            v-model="formData.third_auth"
+                            :active-value="1"
+                            :inactive-value="0"
+                        />
+                        <span class="mt-1 ml-2">
+                            {{ formData.third_auth ? '开启' : '关闭' }}
+                        </span>
+
+                        <div class="form-tips">登录时支持第三方登录，新用户授权即自动注册账号</div>
+
+                        <div>
+                            <el-checkbox
+                                v-model="formData.wechat_auth"
+                                :true-label="1"
+                                :false-label="0"
+                            >
+                                微信登录
+                            </el-checkbox>
+                        </div>
+                    </div>
+                </el-form-item>
+
+                <el-form-item label="微信开放平台">
+                    <div>
+                        <a href="https://open.weixin.qq.com/" target="_blank">
+                            <el-button type="primary" link class="underline">
+                                前往微信开放平台
+                            </el-button>
+                        </a>
+
+                        <div class="form-tips">
+                            1、在各渠道使用微信授权登录时，强烈建议配置微信开放平台<br />
+                            2、微信开放平台关联公众号、小程序和APP后，可实现各端用户账号统一，识别买家唯一微信身份<br />
+                            3、没有配置微信开放平台，同一微信号会生成多个用户，配置微信开放平台后已生成的用户账号无法合并
+                        </div>
+                    </div>
+                </el-form-item>
+            </el-card>
+        </el-form>
+
+        <footer-btns v-perms="['setting.user.user/setRegisterConfig']">
+            <el-button type="primary" @click="handleSubmit">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script lang="ts" setup name="loginRegister">
+import type { LoginSetup } from '@/api/setting/user'
+import { getLogin, setLogin } from '@/api/setting/user'
+import type { FormInstance, FormRules } from 'element-plus'
+const formRef = ref<FormInstance>()
+
+// 表单数据
+const formData = reactive<LoginSetup>({
+    login_way: [],
+    coerce_mobile: 0,
+    login_agreement: 0,
+    third_auth: 0,
+    wechat_auth: 0,
+    qq_auth: 0
+})
+
+// 表单验证
+const rules = reactive<FormRules>({
+    loginWay: [
+        {
+            required: true,
+            validator: (rule: any, value: any, callback: any) => {
+                const loginWay = formData.login_way.join('').length
+                if (loginWay === 0) {
+                    callback(new Error('登录方式至少选择一项！'))
+                } else {
+                    if (formData.login_way !== '') {
+                        if (!formRef.value) return
+                        formRef.value.validateField('checkPass', () => null)
+                    }
+                    callback()
+                }
+            },
+            trigger: 'change'
+        }
+    ],
+    coerce_mobile: [{ required: true, trigger: 'blur' }],
+    login_agreement: [{ required: true, trigger: 'blur' }],
+    third_auth: [{ required: true, trigger: 'blur' }]
+})
+
+// 获取登录注册数据
+const getData = async () => {
+    try {
+        const data = await getLogin()
+        for (const key in formData) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    } catch (error) {
+        console.log('获取=>', error)
+    }
+}
+
+// 保存登录注册数据
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    try {
+        await setLogin(formData)
+        getData()
+    } catch (error) {
+        console.log('保存=>', error)
+    }
+}
+
+getData()
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/setting/user/setup.vue b/src/views/setting/user/setup.vue
new file mode 100644
index 0000000..9593fcb
--- /dev/null
+++ b/src/views/setting/user/setup.vue
@@ -0,0 +1,62 @@
+<!-- 网站信息 -->
+<template>
+    <div class="user-setup">
+        <el-card shadow="never" class="!border-none">
+            <div class="font-medium mb-7">基本设置</div>
+            <el-form ref="formRef" :model="formData" label-width="120px">
+                <el-form-item label="用户默认头像">
+                    <div>
+                        <material-picker v-model="formData.default_avatar" :limit="1" />
+                    </div>
+                </el-form-item>
+                <el-form-item>
+                    <div>
+                        <div class="form-tips">
+                            用户注册时给的默认头像，建议尺寸：400*400像素，支持jpg，jpeg，png格式
+                        </div>
+                    </div>
+                </el-form-item>
+            </el-form>
+        </el-card>
+
+        <footer-btns v-perms="['setting.user.user/setConfig']">
+            <el-button type="primary" @click="handleSubmit">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script lang="ts" setup name="userSetup">
+import { getUserSetup, setUserSetup } from '@/api/setting/user'
+
+// 表单数据
+const formData = reactive({
+    default_avatar: '' // 用户默认头像
+})
+
+// 获取用户设置数据
+const getData = async () => {
+    try {
+        const data = await getUserSetup()
+        for (const key in formData) {
+            //@ts-ignore
+            formData[key] = data[key]
+        }
+    } catch (error) {
+        console.log('获取=>', error)
+    }
+}
+
+// 保存用户设置数据
+const handleSubmit = async () => {
+    try {
+        await setUserSetup(formData)
+        getData()
+    } catch (error) {
+        console.log('保存=>', error)
+    }
+}
+
+getData()
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/setting/website/filing.vue b/src/views/setting/website/filing.vue
new file mode 100644
index 0000000..26c9f28
--- /dev/null
+++ b/src/views/setting/website/filing.vue
@@ -0,0 +1,89 @@
+<!-- 备案信息 -->
+<template>
+    <div class="website-filing">
+        <el-card shadow="never" class="!border-none">
+            <div class="mb-5">站点底部版权备案信息设置</div>
+            <el-form ref="form" class="ls-form" label-width="100px">
+                <del-wrap
+                    v-for="(item, index) in formData"
+                    class="mb-4"
+                    :key="index"
+                    :show-close="formData.length > 1"
+                    @close="handleDelete(index)"
+                >
+                    <div class="py-4 bg-fill-lighter">
+                        <el-form-item label="显示名称" prop="icp_link">
+                            <div class="w-80">
+                                <div>
+                                    <el-input v-model="item.key" placeholder="请输入名称" />
+                                </div>
+                            </div>
+                        </el-form-item>
+                        <el-form-item label="跳转链接" prop="icp_link">
+                            <div class="w-80">
+                                <div>
+                                    <el-input
+                                        v-model="item.value"
+                                        placeholder="请输入链接，例如：http://www.beian.gov.cn"
+                                    />
+                                </div>
+                                <div class="form-tips">跳转链接不设置，则不跳转</div>
+                            </div>
+                        </el-form-item>
+                    </div>
+                </del-wrap>
+                <div>
+                    <el-button type="primary" @click="handleAdd">
+                        <icon name="el-icon-Plus" />
+                        添加
+                    </el-button>
+                </div>
+            </el-form>
+        </el-card>
+
+        <footer-btns v-perms="['setting.web.web_setting/setCopyright']">
+            <el-button type="primary" @click="handleSubmit">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script lang="ts" setup name="webFilling">
+import { getCopyright, setCopyright } from '@/api/setting/website'
+import feedback from '@/utils/feedback'
+// 表单数据
+const formData = ref([
+    {
+        key: '',
+        value: ''
+    }
+])
+
+// 获取备案信息
+const getData = async () => {
+    const data = await getCopyright()
+    if (!data.length) return
+    formData.value = data
+}
+
+const handleAdd = () => {
+    formData.value.push({
+        key: '',
+        value: ''
+    })
+}
+
+const handleDelete = (index: number) => {
+    if (formData.value.length <= 1) {
+        return feedback.msgError('至少保留一个')
+    }
+    formData.value.splice(index, 1)
+}
+
+// 设置备案信息
+const handleSubmit = async () => {
+    await setCopyright({ config: formData.value })
+    getData()
+}
+
+getData()
+</script>
diff --git a/src/views/setting/website/information.vue b/src/views/setting/website/information.vue
new file mode 100644
index 0000000..12e7145
--- /dev/null
+++ b/src/views/setting/website/information.vue
@@ -0,0 +1,219 @@
+<!-- 网站信息 -->
+<template>
+    <div class="website-information">
+        <el-form ref="formRef" :rules="rules" class="ls-form" :model="formData" label-width="120px">
+            <el-card shadow="never" class="!border-none">
+                <div class="text-xl font-medium mb-[20px]">后台设置</div>
+                <el-form-item label="网站名称" prop="name">
+                    <div class="w-80">
+                        <el-input
+                            v-model.trim="formData.name"
+                            placeholder="请输入网站名称"
+                            maxlength="30"
+                            show-word-limit
+                        />
+                    </div>
+                </el-form-item>
+                <el-form-item label="网站图标" prop="web_favicon" required>
+                    <div>
+                        <material-picker v-model="formData.web_favicon" :limit="1" />
+                        <div class="form-tips">建议尺寸：100*100像素，支持jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="网站LOGO" prop="web_logo" required>
+                    <div>
+                        <material-picker v-model.trim="formData.web_logo" :limit="1" />
+                        <div class="form-tips">建议尺寸：100*100像素，支持jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="登录页广告图" prop="login_image" required>
+                    <div>
+                        <material-picker v-model.trim="formData.login_image" :limit="1" />
+                        <div class="form-tips">建议尺寸：100*100像素，支持jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+            </el-card>
+            <el-card shadow="never" class="!border-none mt-4">
+                <div class="text-xl font-medium mb-[20px]">前台设置</div>
+                <el-form-item label="前台名称" prop="shop_name">
+                    <div class="w-80">
+                        <el-input
+                            v-model.trim="formData.shop_name"
+                            placeholder="请输入前台名称"
+                            maxlength="30"
+                            show-word-limit
+                        ></el-input>
+                    </div>
+                </el-form-item>
+                <el-form-item label="网站图标" prop="web_favicon" required>
+                    <div>
+                        <material-picker v-model="formData.h5_favicon" :limit="1" />
+                        <div class="form-tips">建议尺寸：100*100像素，支持jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="前台LOGO" prop="shop_logo">
+                    <div>
+                        <material-picker v-model="formData.shop_logo" :limit="1" />
+                        <div class="form-tips">建议尺寸：100*100px，支持jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+            </el-card>
+            <el-card shadow="never" class="!border-none mt-4">
+                <div class="text-xl font-medium mb-[20px]">PC端设置</div>
+                <el-form-item label="PC端LOGO" prop="pc_logo">
+                    <div>
+                        <material-picker v-model="formData.pc_logo" :limit="1" />
+                        <div class="form-tips">建议尺寸：120*28px，支持jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="网站标题" prop="pc_title">
+                    <div class="w-80">
+                        <el-input
+                            v-model.trim="formData.pc_title"
+                            placeholder="请输入PC端网站标题"
+                            maxlength="30"
+                            show-word-limit
+                        />
+                    </div>
+                </el-form-item>
+                <el-form-item label="网站图标" prop="pc_ico">
+                    <div>
+                        <material-picker v-model="formData.pc_ico" :limit="1" />
+                        <div class="form-tips">建议尺寸：100*100像素，支持jpg，jpeg，png格式</div>
+                    </div>
+                </el-form-item>
+                <el-form-item label="网站描述" prop="pc_desc">
+                    <div class="w-80">
+                        <el-input
+                            v-model.trim="formData.pc_desc"
+                            placeholder="请输入PC端网站描述"
+                        />
+                    </div>
+                </el-form-item>
+                <el-form-item label="网站关键词" prop="pc_keywords">
+                    <div class="w-80">
+                        <el-input
+                            v-model.trim="formData.pc_keywords"
+                            placeholder="请输入PC端网站关键词"
+                        />
+                    </div>
+                </el-form-item>
+            </el-card>
+        </el-form>
+        <footer-btns v-perms="['setting.web.web_setting/setWebsite']">
+            <el-button type="primary" @click="handleSubmit">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script lang="ts" setup name="webInformation">
+import { getWebsite, setWebsite } from '@/api/setting/website'
+import useAppStore from '@/stores/modules/app'
+import type { FormInstance } from 'element-plus'
+const formRef = ref<FormInstance>()
+
+const appStore = useAppStore()
+// 表单数据
+const formData = reactive({
+    name: '', // 网站名称
+    web_favicon: '', // 网站图标
+    web_logo: '', // 网站logo
+    login_image: '', // 登录页广告图
+    h5_favicon: '',
+    shop_name: '',
+    shop_logo: '',
+    pc_logo: '',
+    pc_title: '',
+    pc_desc: '',
+    pc_ico: '',
+    pc_keywords: ''
+})
+
+// 表单验证
+const rules = {
+    name: [
+        {
+            required: true,
+            message: '请输入网站名称',
+            trigger: ['blur']
+        }
+    ],
+    web_favicon: [
+        {
+            required: true,
+            message: '请选择网站图标',
+            trigger: ['change']
+        }
+    ],
+    web_logo: [
+        {
+            required: true,
+            message: '请选择网站logo',
+            trigger: ['change']
+        }
+    ],
+    login_image: [
+        {
+            required: true,
+            message: '请选择登录页广告图',
+            trigger: ['change']
+        }
+    ],
+    shop_name: [
+        {
+            required: true,
+            message: '请输入店铺/商城名称',
+            trigger: ['blur']
+        }
+    ],
+    shop_logo: [
+        {
+            required: true,
+            message: '请选择商城LOGO',
+            trigger: ['change']
+        }
+    ],
+    pc_logo: [
+        {
+            required: true,
+            message: '请选择PC端LOGO',
+            trigger: ['change']
+        }
+    ],
+    pc_title: [
+        {
+            required: true,
+            message: '请输入PC端网站标题',
+            trigger: ['blur']
+        }
+    ],
+    pc_ico: [
+        {
+            required: true,
+            message: '请选择PC端网站图标',
+            trigger: ['change']
+        }
+    ]
+}
+
+// 获取备案信息
+const getData = async () => {
+    const data = await getWebsite()
+    for (const key in formData) {
+        //@ts-ignore
+        formData[key] = data[key]
+    }
+}
+
+// 设置备案信息
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    await setWebsite(formData)
+    appStore.getConfig()
+    getData()
+}
+
+getData()
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/setting/website/protocol.vue b/src/views/setting/website/protocol.vue
new file mode 100644
index 0000000..cf45972
--- /dev/null
+++ b/src/views/setting/website/protocol.vue
@@ -0,0 +1,57 @@
+<template>
+    <div class="xl:flex">
+        <el-card class="!border-none flex-1 xl:mr-4 mb-4" shadow="never">
+            <template #header>
+                <span class="font-medium">服务协议</span>
+            </template>
+            <el-form :model="formData" label-width="80px">
+                <el-form-item label="协议名称">
+                    <el-input v-model="formData.service_title" />
+                </el-form-item>
+            </el-form>
+
+            <editor class="mb-10" v-model="formData.service_content" height="500"></editor>
+        </el-card>
+        <el-card class="!border-none flex-1 mb-4" shadow="never">
+            <template #header>
+                <span class="font-medium">隐私协议</span>
+            </template>
+            <el-form :model="formData" label-width="80px">
+                <el-form-item label="协议名称">
+                    <el-input v-model="formData.privacy_title" />
+                </el-form-item>
+            </el-form>
+
+            <editor class="mb-10" v-model="formData.privacy_content" height="500"></editor>
+        </el-card>
+    </div>
+    <footer-btns v-perms="['setting.web.web_setting/setAgreement']">
+        <el-button type="primary" @click="handleProtocolEdit">保存</el-button>
+    </footer-btns>
+</template>
+
+<script setup lang="ts" naem="webProtocol">
+import { getProtocol, setProtocol } from '@/api/setting/website'
+
+interface formDataObj {
+    service_title: string
+    service_content: string
+    privacy_title: string
+    privacy_content: string
+}
+const formData = ref<formDataObj>({
+    service_title: '',
+    service_content: '',
+    privacy_title: '',
+    privacy_content: ''
+})
+const protocolGet = async () => {
+    formData.value = await getProtocol()
+}
+
+const handleProtocolEdit = async (): Promise<void> => {
+    await setProtocol({ ...formData.value })
+    protocolGet()
+}
+protocolGet()
+</script>
diff --git a/src/views/template/component/file.vue b/src/views/template/component/file.vue
new file mode 100644
index 0000000..3e6a06e
--- /dev/null
+++ b/src/views/template/component/file.vue
@@ -0,0 +1,63 @@
+<template>
+    <div>
+        <el-card header="基础使用" shadow="none" class="!border-none">
+            <div class="flex flex-wrap">
+                <div class="flex m-4">
+                    <div class="mr-4">选择图片：</div>
+                    <material-picker v-model="state.value1" />
+                </div>
+                <div class="flex m-4">
+                    <div class="mr-4">选择视频：</div>
+                    <material-picker type="video" v-model="state.value3" />
+                </div>
+                <div class="flex flex-1 m-4">
+                    <div class="mr-4">多张图片：</div>
+                    <div class="flex-1">
+                        <!-- 外层需要有足够的宽度，这样预览图和选择按钮才不会直接换行 -->
+                        <material-picker :limit="4" v-model="state.value2" />
+                    </div>
+                </div>
+            </div>
+        </el-card>
+        <el-card header="进阶用法" shadow="none" class="!border-none mt-4">
+            <div class="flex flex-wrap">
+                <div class="flex m-4">
+                    <div class="mr-4">自定义选择器大小：</div>
+                    <material-picker size="60px" v-model="state.value4" />
+                </div>
+                <div class="flex m-4">
+                    <div class="mr-4">使用插槽：</div>
+                    <material-picker v-model="state.value5">
+                        <template #upload>
+                            <el-button>选择文件</el-button>
+                        </template>
+                    </material-picker>
+                </div>
+                <div class="flex m-4">
+                    <div class="mr-4">选出地址不带域名：</div>
+                    <material-picker :exclude-domain="true" v-model="state.value6" />
+                </div>
+            </div>
+            <div>
+                <div class="flex m-4 items-center">
+                    <div class="w-20 flex-none">带域名：</div>
+                    <el-input class="w-[500px]" :model-value="state.value5" />
+                </div>
+                <div class="flex m-4 items-center">
+                    <div class="w-20 flex-none">不带域名：</div>
+                    <el-input class="w-[500px]" :model-value="state.value6" />
+                </div>
+            </div>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup>
+const state = reactive({
+    value1: '',
+    value2: [],
+    value3: '',
+    value4: '',
+    value5: '',
+    value6: ''
+})
+</script>
diff --git a/src/views/template/component/icon.vue b/src/views/template/component/icon.vue
new file mode 100644
index 0000000..3448778
--- /dev/null
+++ b/src/views/template/component/icon.vue
@@ -0,0 +1,64 @@
+<template>
+    <div>
+        <el-card header="element-plus图标" shadow="none" class="!border-none">
+            <div class="flex items-center">
+                <icon class="m-4" :size="24" name="el-icon-Search" />
+                <icon class="m-4" :size="24" name="el-icon-Plus" />
+                <icon class="m-4" :size="24" name="el-icon-FullScreen" />
+                <icon class="m-4" :size="24" name="el-icon-Setting" />
+                <icon class="m-4" :size="24" name="el-icon-Warning" />
+            </div>
+        </el-card>
+        <el-card header="本地图标" shadow="none" class="!border-none mt-4">
+            <div class="flex items-center">
+                <icon class="m-4" :size="24" name="local-icon-baoxian" />
+                <icon class="m-4" :size="24" name="local-icon-youhui" />
+                <icon class="m-4" :size="24" name="local-icon-daiyunying" />
+                <icon class="m-4" :size="24" name="local-icon-diancanshezhi" />
+                <icon class="m-4" :size="24" name="local-icon-dianzifapiao" />
+            </div>
+        </el-card>
+        <el-card header="图标选择器" shadow="none" class="!border-none mt-4">
+            <div class="flex items-center">
+                <icon-picker v-model="state.value" />
+            </div>
+        </el-card>
+        <el-card
+            header="element-plus图标库大全（点击复制图标名称）"
+            shadow="none"
+            class="!border-none mt-4"
+        >
+            <div class="flex items-center">
+                <div class="flex flex-wrap">
+                    <div v-for="item in getElementPlusIconNames()" :key="item" class="m-1">
+                        <el-button v-copy="item">
+                            <icon :name="item" :size="20" />
+                        </el-button>
+                    </div>
+                </div>
+            </div>
+        </el-card>
+        <el-card
+            header="本地图标库大全（点击复制图标名称）"
+            shadow="none"
+            class="!border-none mt-4"
+        >
+            <div class="flex items-center">
+                <div class="flex flex-wrap">
+                    <div v-for="item in getLocalIconNames()" :key="item" class="m-1">
+                        <el-button v-copy="item">
+                            <icon :name="item" :size="20" />
+                        </el-button>
+                    </div>
+                </div>
+            </div>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup>
+import Icon from '@/components/icon/index.vue'
+import { getElementPlusIconNames, getLocalIconNames } from '@/components/icon'
+const state = reactive({
+    value: ''
+})
+</script>
diff --git a/src/views/template/component/link.vue b/src/views/template/component/link.vue
new file mode 100644
index 0000000..8721042
--- /dev/null
+++ b/src/views/template/component/link.vue
@@ -0,0 +1,12 @@
+<template>
+    <div>
+        <el-card header="基础使用" shadow="none" class="!border-none">
+            <link-picker v-model="state.value1" />
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup>
+const state = reactive({
+    value1: {}
+})
+</script>
diff --git a/src/views/template/component/overflow.vue b/src/views/template/component/overflow.vue
new file mode 100644
index 0000000..f20722b
--- /dev/null
+++ b/src/views/template/component/overflow.vue
@@ -0,0 +1,9 @@
+<template>
+    <div>
+        <el-card header="基础使用" shadow="none" class="!border-none">
+            <overflow-tooltip class="w-20 m-4" content="超出自动打点，悬浮弹窗显示全部内容" />
+            <overflow-tooltip class="w-60 m-4" content="超出自动打点，悬浮弹窗显示全部内容" />
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup></script>
diff --git a/src/views/template/component/popover_input.vue b/src/views/template/component/popover_input.vue
new file mode 100644
index 0000000..90c945f
--- /dev/null
+++ b/src/views/template/component/popover_input.vue
@@ -0,0 +1,48 @@
+<template>
+    <div>
+        <el-card header="基础使用" shadow="none" class="!border-none">
+            <div class="flex flex-wrap">
+                <div class="m-4">
+                    <popover-input @confirm="onConfirm">
+                        <template #default>
+                            <el-button> 点击输入 </el-button>
+                        </template>
+                    </popover-input>
+                </div>
+                <div class="m-4">
+                    <popover-input type="number" @confirm="onConfirm">
+                        <template #default>
+                            <el-button> 输入数字 </el-button>
+                        </template>
+                    </popover-input>
+                </div>
+                <div class="m-4">
+                    <popover-input size="small" @confirm="onConfirm">
+                        <template #default>
+                            <el-button> 调整大小 </el-button>
+                        </template>
+                    </popover-input>
+                </div>
+                <div class="m-4">
+                    <popover-input :limit="20" :show-limit="true" @confirm="onConfirm">
+                        <template #default>
+                            <el-button> 限制输入长度 </el-button>
+                        </template>
+                    </popover-input>
+                </div>
+                <div class="m-4">
+                    <popover-input value="默认值" @confirm="onConfirm">
+                        <template #default>
+                            <el-button> 默认值 </el-button>
+                        </template>
+                    </popover-input>
+                </div>
+            </div>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup>
+const onConfirm = (value: string) => {
+    console.log(value)
+}
+</script>
diff --git a/src/views/template/component/rich_text.vue b/src/views/template/component/rich_text.vue
new file mode 100644
index 0000000..b1303f9
--- /dev/null
+++ b/src/views/template/component/rich_text.vue
@@ -0,0 +1,16 @@
+<template>
+    <div>
+        <el-card header="基础使用" shadow="none" class="!border-none">
+            <editor v-model="state.value1" height="500px" />
+        </el-card>
+        <el-card header="简洁模式" shadow="none" class="!border-none mt-4">
+            <editor v-model="state.value2" height="500px" mode="simple" />
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup>
+const state = reactive({
+    value1: '',
+    value2: ''
+})
+</script>
diff --git a/src/views/template/component/upload.vue b/src/views/template/component/upload.vue
new file mode 100644
index 0000000..4bb8f05
--- /dev/null
+++ b/src/views/template/component/upload.vue
@@ -0,0 +1,65 @@
+<template>
+    <div>
+        <el-card header="基础使用" shadow="none" class="!border-none">
+            <div class="flex flex-wrap">
+                <div class="m-4">
+                    <upload
+                        @change="onChange"
+                        @success="onSuccess"
+                        @error="onError"
+                        :show-progress="true"
+                    >
+                        <el-button type="primary">上传图片</el-button>
+                    </upload>
+                </div>
+                <div class="m-4">
+                    <upload
+                        type="video"
+                        @change="onChange"
+                        @success="onSuccess"
+                        @error="onError"
+                        :show-progress="true"
+                    >
+                        <el-button type="primary">上传视频</el-button>
+                    </upload>
+                </div>
+                <div class="m-4">
+                    <upload
+                        :multiple="false"
+                        @change="onChange"
+                        @success="onSuccess"
+                        @error="onError"
+                        :show-progress="true"
+                    >
+                        <el-button type="primary">取消多选</el-button>
+                    </upload>
+                </div>
+                <div class="m-4">
+                    <upload
+                        :limit="2"
+                        @change="onChange"
+                        @success="onSuccess"
+                        @error="onError"
+                        :show-progress="true"
+                    >
+                        <el-button type="primary">一次最多上传2张</el-button>
+                    </upload>
+                </div>
+            </div>
+        </el-card>
+    </div>
+</template>
+<script lang="ts" setup>
+import Upload from '@/components/upload/index.vue'
+const onChange = (file: any) => {
+    console.log('上传文件的状态发生改变', file)
+}
+
+const onSuccess = (file: any) => {
+    console.log('上传文件成功', file)
+}
+
+const onError = (file: any) => {
+    console.log('上传文件失败', file)
+}
+</script>
diff --git a/src/views/user/setting.vue b/src/views/user/setting.vue
new file mode 100644
index 0000000..4341d9a
--- /dev/null
+++ b/src/views/user/setting.vue
@@ -0,0 +1,156 @@
+<!-- 个人资料 -->
+<template>
+    <div class="user-setting">
+        <el-card class="!border-none" shadow="never">
+            <el-form
+                ref="formRef"
+                class="ls-form"
+                :model="formData"
+                :rules="rules"
+                label-width="100px"
+            >
+                <el-form-item label="头像：" prop="avatar">
+                    <material-picker v-model="formData.avatar" :limit="1" />
+                </el-form-item>
+
+                <el-form-item label="账号：" prop="account">
+                    <div class="w-80">
+                        <el-input v-model="formData.account" disabled />
+                    </div>
+                </el-form-item>
+
+                <el-form-item label="名称：" prop="name">
+                    <div class="w-80">
+                        <el-input v-model="formData.name" placeholder="请输入名称" />
+                    </div>
+                </el-form-item>
+
+                <el-form-item label="当前密码：" prop="password_old">
+                    <div class="w-80">
+                        <el-input
+                            v-model.trim="formData.password_old"
+                            placeholder="修改密码时必填, 不修改密码时留空"
+                            type="password"
+                            show-password
+                        />
+                    </div>
+                </el-form-item>
+
+                <el-form-item label="新的密码：" prop="password">
+                    <div class="w-80">
+                        <el-input
+                            v-model.trim="formData.password"
+                            placeholder="修改密码时必填, 不修改密码时留空"
+                            type="password"
+                            show-password
+                        />
+                    </div>
+                </el-form-item>
+
+                <el-form-item label="确定密码：" prop="password_confirm">
+                    <div class="w-80">
+                        <el-input
+                            v-model.trim="formData.password_confirm"
+                            placeholder="修改密码时必填, 不修改密码时留空"
+                            type="password"
+                            show-password
+                        />
+                    </div>
+                </el-form-item>
+            </el-form>
+        </el-card>
+        <footer-btns>
+            <el-button type="primary" @click="handleSubmit">保存</el-button>
+        </footer-btns>
+    </div>
+</template>
+
+<script setup lang="ts" name="userSetting">
+import { setUserInfo } from '@/api/user'
+import useUserStore from '@/stores/modules/user'
+import feedback from '@/utils/feedback'
+import type { FormInstance } from 'element-plus'
+const formRef = ref<FormInstance>()
+const userStore = useUserStore()
+// 表单数据
+const formData = reactive({
+    avatar: '', // 头像
+    account: '', // 账号
+    name: '', // 名称
+    password_old: '', // 当前密码
+    password: '', // 新的密码
+    password_confirm: '' // 确定密码
+})
+
+// 表单校验规则
+const rules = reactive<object>({
+    avatar: [
+        {
+            required: true,
+            message: '头像不能为空',
+            trigger: ['change']
+        }
+    ],
+    name: [
+        {
+            required: true,
+            message: '请输入名称',
+            trigger: ['blur']
+        }
+    ]
+})
+
+// 获取个人设置
+const getUser = async () => {
+    const userInfo = userStore.userInfo
+    for (const key in formData) {
+        //@ts-ignore
+        formData[key] = userInfo[key]
+    }
+}
+
+// 设置个人设置
+const setUser = async () => {
+    if (formData.password_old || formData.password || formData.password_confirm) {
+        if (!formData.password_old) {
+            return feedback.msgError('请输入当前密码')
+        }
+
+        if (!formData.password) {
+            return feedback.msgError('请输入新的密码')
+        }
+
+        if (!formData.password_confirm) {
+            return feedback.msgError('请输入确定密码')
+        }
+
+        if (formData.password_confirm != formData.password) {
+            return feedback.msgError('两次输入的密码不一样')
+        }
+    }
+
+    if (formData.password_old && formData.password && formData.password_confirm) {
+        if (formData.password_old.length < 6 || formData.password_old.length > 32) {
+            return feedback.msgError('密码长度在6到32之间')
+        }
+        if (formData.password.length < 6 || formData.password.length > 32) {
+            return feedback.msgError('密码长度在6到32之间')
+        }
+        if (formData.password_confirm.length < 6 || formData.password_confirm.length > 32) {
+            return feedback.msgError('密码长度在6到32之间')
+        }
+    }
+    await setUserInfo(formData)
+    userStore.getUserInfo()
+}
+
+// 提交数据
+const handleSubmit = async () => {
+    await formRef.value?.validate()
+    setUser()
+}
+
+getUser()
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/workbench/index.vue b/src/views/workbench/index.vue
new file mode 100644
index 0000000..290d256
--- /dev/null
+++ b/src/views/workbench/index.vue
@@ -0,0 +1,193 @@
+<template>
+    <div class="workbench">
+        <div class="lg:flex">
+            <el-card class="!border-none mb-4 lg:mr-4 lg:w-[350px]" shadow="never">
+                <template #header>
+                    <span class="card-title">版本信息</span>
+                </template>
+                <div>
+                    <div class="flex leading-9">
+                        <div class="w-20">平台名称</div>
+                        <span> {{ workbenchData.version.name }}</span>
+                    </div>
+                    <div class="flex leading-9">
+                        <div class="w-20">当前版本</div>
+                        <span> {{ workbenchData.version.version }}</span>
+                    </div>
+                    <div class="flex leading-9">
+                        <div class="w-20">获取渠道</div>
+                        <div>
+                            <a :href="workbenchData.version.channel.website" target="_blank">
+                                <el-button type="success" size="small">官网</el-button>
+                            </a>
+                            <a
+                                class="ml-3"
+                                :href="workbenchData.version.channel.gitee"
+                                target="_blank"
+                            >
+                                <el-button type="danger" size="small">Gitee</el-button>
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </el-card>
+            <el-card class="!border-none mb-4 flex-1" shadow="never">
+                <template #header>
+                    <div>
+                        <span class="card-title">今日数据</span>
+                        <span class="text-tx-secondary text-xs ml-4">
+                            更新时间：{{ workbenchData.today.time }}
+                        </span>
+                    </div>
+                </template>
+
+                <div class="flex flex-wrap">
+                    <div class="w-1/2 md:w-1/4">
+                        <div class="leading-10">销售额</div>
+                        <div class="text-6xl">{{ workbenchData.today.today_sales }}</div>
+                        <div class="text-tx-secondary text-xs">
+                            总：{{ workbenchData.today.total_sales }}
+                        </div>
+                    </div>
+                    <div class="w-1/2 md:w-1/4">
+                        <div class="leading-10">成交订单</div>
+                        <div class="text-6xl">{{ workbenchData.today.order_num }}</div>
+                        <div class="text-tx-secondary text-xs">
+                            总：{{ workbenchData.today.order_sum }}
+                        </div>
+                    </div>
+                    <div class="w-1/2 md:w-1/4">
+                        <div class="leading-10">新增用户</div>
+                        <div class="text-6xl">{{ workbenchData.today.today_new_user }}</div>
+                        <div class="text-tx-secondary text-xs">
+                            总：{{ workbenchData.today.total_new_user }}
+                        </div>
+                    </div>
+                    <div class="w-1/2 md:w-1/4">
+                        <div class="leading-10">新增访问量</div>
+                        <div class="text-6xl">{{ workbenchData.today.today_visitor }}</div>
+                        <div class="text-tx-secondary text-xs">
+                            总：{{ workbenchData.today.total_visitor }}
+                        </div>
+                    </div>
+                </div>
+            </el-card>
+        </div>
+        <div class="function mb-4">
+            <el-card class="flex-1 !border-none" shadow="never">
+                <template #header>
+                    <span>常用功能</span>
+                </template>
+                <div class="flex flex-wrap">
+                    <div
+                        v-for="item in workbenchData.menu"
+                        class="md:w-[12.5%] w-1/4 flex flex-col items-center"
+                        :key="item"
+                    >
+                        <router-link :to="item.url" class="mb-3 flex flex-col items-center">
+                            <image-contain width="40px" height="40px" :src="item?.image" />
+                            <div class="mt-2">{{ item.name }}</div>
+                        </router-link>
+                    </div>
+                </div>
+            </el-card>
+        </div>
+        <div class="md:flex">
+            <el-card class="flex-1 !border-none md:mr-4 mb-4" shadow="never">
+                <template #header>
+                    <span>访问量趋势图</span>
+                </template>
+                <div>
+                    <v-charts
+                        style="height: 350px"
+                        :option="workbenchData.visitorOption"
+                        :autoresize="true"
+                    />
+                </div>
+            </el-card>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup name="workbench">
+import { getWorkbench } from '@/api/app'
+import vCharts from 'vue-echarts'
+// 表单数据
+const workbenchData: any = reactive({
+    version: {
+        version: '', // 版本号
+        website: '', // 官网
+        based: '',
+        channel: {
+            gitee: '',
+            website: ''
+        }
+    },
+    support: [],
+    today: {}, // 今日数据
+    menu: [], // 常用功能
+    visitor: [], // 访问量
+    article: [], // 文章阅读量
+
+    visitorOption: {
+        xAxis: {
+            type: 'category',
+            data: [0]
+        },
+        yAxis: {
+            type: 'value'
+        },
+        legend: {
+            data: ['访问量']
+        },
+        itemStyle: {
+            // 点的颜色。
+            color: 'red'
+        },
+        tooltip: {
+            trigger: 'axis'
+        },
+        series: [
+            {
+                name: '访问量',
+                data: [0],
+                type: 'line',
+                smooth: true
+            }
+        ]
+    }
+})
+
+// 获取工作台主页数据
+const getData = () => {
+    getWorkbench()
+        .then((res: any) => {
+            workbenchData.version = res.version
+            workbenchData.today = res.today
+            workbenchData.menu = res.menu
+            workbenchData.visitor = res.visitor
+            workbenchData.support = res.support
+
+            // 清空echarts 数据
+            workbenchData.visitorOption.xAxis.data = []
+            workbenchData.visitorOption.series[0].data = []
+
+            // 写入从后台拿来的数据
+            res.visitor.date.reverse().forEach((item: any) => {
+                workbenchData.visitorOption.xAxis.data.push(item)
+            })
+            res.visitor.list[0].data.forEach((item: any) => {
+                workbenchData.visitorOption.series[0].data.push(item)
+            })
+        })
+        .catch((err: any) => {
+            console.log('err', err)
+        })
+}
+
+onMounted(() => {
+    getData()
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/typings/index.d.ts b/typings/index.d.ts
new file mode 100644
index 0000000..6c0aab2
--- /dev/null
+++ b/typings/index.d.ts
@@ -0,0 +1,5 @@
+declare module 'vue3-video-play'
+
+declare module 'css-color-function'
+
+type PromiseFun = (...arg: any[]) => Promise<any>
diff --git a/typings/router.d.ts b/typings/router.d.ts
new file mode 100644
index 0000000..9fae641
--- /dev/null
+++ b/typings/router.d.ts
@@ -0,0 +1,14 @@
+import 'vue-router'
+declare module 'vue-router' {
+    // 扩展 RouteMeta
+    interface RouteMeta {
+        type?: string
+        perms?: string
+        title?: string
+        icon?: string
+        hidden?: boolean
+        activeMenu?: string
+        hideTab?: boolean
+        keepAlive?: boolean
+    }
+}