From 618791d4d3e888a544489a0bdd7e211795ee382b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com>
Date: Fri, 11 Jul 2025 11:15:37 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=EF=BC=9A=E6=96=87=E7=AB=A0?=
 =?UTF-8?q?=E7=BC=96=E8=BE=91=EF=BC=8C=E5=85=BC=E5=AE=B9Image=E5=B0=81?=
 =?UTF-8?q?=E9=9D=A2=E5=9B=BEif=20if(data.image=20&&=20!data.files){...}?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 SELECT_FILE_DRAG_DEMO.md                      |  266 ++
 src/api/cms/cmsWebsiteSetting/model/index.ts  |    2 +
 src/api/shop/shopGoods/model/index.ts         |    1 +
 src/api/system/setting/index.ts               |   27 +
 src/config/setting.ts                         |    2 +-
 src/i18n/lang/en/route.ts                     |  113 -
 src/i18n/lang/zh_CN/route.ts                  |  119 -
 src/layout/components/header-tools.vue        |   48 +-
 src/layout/components/page-footer.vue         |   18 +-
 src/layout/components/setting-drawer.vue      |  742 ++---
 src/store/modules/setting.ts                  |    8 +-
 src/store/modules/theme.ts                    |    9 -
 src/views/cms/cmsAd/index.vue                 |    4 +-
 .../cms/cmsArticle/components/articleEdit.vue |   14 +-
 src/views/cms/cmsArticle/index.vue            |    4 +-
 src/views/cms/cmsLink/index.vue               |    2 +-
 src/views/cms/cmsNavigation/index.vue         |   19 +-
 src/views/cms/cmsSetting/index.vue            |    8 +
 .../components/cmsWebsiteSettingEdit.vue      |   24 +-
 src/views/cms/cmsWebsiteSetting/index.vue     |    2 +-
 src/views/cms/help/index.vue                  |    4 +-
 src/views/shop/shopGoods/components/extra.vue |    2 +-
 .../shop/shopGoods/components/search.vue      |   56 +-
 .../shopGoods/components/shopGoodsEdit.vue    | 2577 ++++++++++-------
 src/views/shop/shopGoods/index.vue            |  432 +--
 .../system/setting/components/privacy.vue     |  102 +
 .../system/setting/components/website.vue     |  187 ++
 src/views/system/setting/index.vue            |   93 +-
 28 files changed, 2801 insertions(+), 2084 deletions(-)
 create mode 100644 SELECT_FILE_DRAG_DEMO.md
 create mode 100644 src/views/system/setting/components/privacy.vue
 create mode 100644 src/views/system/setting/components/website.vue

diff --git a/SELECT_FILE_DRAG_DEMO.md b/SELECT_FILE_DRAG_DEMO.md
new file mode 100644
index 0000000..95c2c65
--- /dev/null
+++ b/SELECT_FILE_DRAG_DEMO.md
@@ -0,0 +1,266 @@
+# 🔄 SelectFile组件拖拽调整顺序功能演示
+
+## 🎯 功能概述
+
+我已经成功为SelectFile组件添加了拖拽调整顺序的功能，让用户可以通过拖拽来重新排列文件的顺序。
+
+### ✨ 核心功能
+
+1. **🔄 拖拽排序**
+   - 支持鼠标拖拽调整文件顺序
+   - 实时视觉反馈和拖拽指示器
+   - 顺序指示器显示当前位置
+
+2. **🎯 智能交互**
+   - 拖拽时显示拖拽指示器
+   - 悬停时显示拖拽提示
+   - 拖拽完成后自动更新数据
+
+3. **📍 视觉反馈**
+   - 顺序指示器显示文件位置
+   - 拖拽时的视觉效果
+   - 悬停时的交互提示
+
+### 🔧 技术实现
+
+#### 1. 组件模板更新
+
+```vue
+<template>
+  <a-image-preview-group>
+    <div class="select-file-container">
+      <!-- 🔄 可拖拽的文件列表 -->
+      <div 
+        class="draggable-file-list"
+        @dragover.prevent
+        @drop="onDrop"
+      >
+        <template v-for="(item, index) in localData" :key="item.id || index">
+          <div 
+            class="image-upload-item draggable-item"
+            :class="{ 'dragging': dragIndex === index }"
+            draggable="true"
+            @dragstart="onDragStart(index, $event)"
+            @dragend="onDragEnd"
+            @dragenter="onDragEnter(index)"
+            @dragleave="onDragLeave"
+            v-if="isImage(item.url)"
+          >
+            <!-- 🎯 拖拽指示器 -->
+            <div class="drag-indicator">
+              <HolderOutlined />
+            </div>
+            
+            <a-image :src="item.url" />
+            
+            <!-- 📍 顺序指示器 -->
+            <div class="order-indicator">{{ index + 1 }}</div>
+          </div>
+        </template>
+      </div>
+    </div>
+  </a-image-preview-group>
+</template>
+```
+
+#### 2. 拖拽逻辑实现
+
+```typescript
+// 🔄 拖拽相关状态
+const dragIndex = ref<number | null>(null);
+const dragOverIndex = ref<number | null>(null);
+
+// 📝 本地数据副本，用于拖拽操作
+const localData = ref<any[]>([]);
+
+// 🔄 监听props.data变化，同步到localData
+watch(
+  () => props.data,
+  (newData) => {
+    if (newData) {
+      localData.value = [...newData];
+    }
+  },
+  { immediate: true, deep: true }
+);
+
+// 🔄 拖拽开始
+const onDragStart = (index: number, event: DragEvent) => {
+  dragIndex.value = index;
+  if (event.dataTransfer) {
+    event.dataTransfer.effectAllowed = 'move';
+    event.dataTransfer.setData('text/html', index.toString());
+  }
+};
+
+// 🔄 拖拽结束
+const onDragEnd = () => {
+  dragIndex.value = null;
+  dragOverIndex.value = null;
+};
+
+// 🔄 拖拽进入
+const onDragEnter = (index: number) => {
+  dragOverIndex.value = index;
+};
+
+// 🔄 拖拽放置
+const onDrop = (event: DragEvent) => {
+  event.preventDefault();
+  
+  if (dragIndex.value !== null && dragOverIndex.value !== null && dragIndex.value !== dragOverIndex.value) {
+    const newData = [...localData.value];
+    const draggedItem = newData[dragIndex.value];
+    
+    // 移除拖拽的项目
+    newData.splice(dragIndex.value, 1);
+    
+    // 在新位置插入项目
+    const insertIndex = dragIndex.value < dragOverIndex.value ? dragOverIndex.value - 1 : dragOverIndex.value;
+    newData.splice(insertIndex, 0, draggedItem);
+    
+    // 更新本地数据
+    localData.value = newData;
+    
+    // 触发重新排序事件
+    emit('reorder', newData);
+  }
+  
+  dragIndex.value = null;
+  dragOverIndex.value = null;
+};
+```
+
+#### 3. 事件定义更新
+
+```typescript
+const emit = defineEmits<{
+  (e: 'done', data: FileRecord): void;
+  (e: 'del', index: number): void;
+  (e: 'clear'): void;
+  (e: 'reorder', data: any[]): void; // 新增重新排序事件
+}>();
+```
+
+#### 4. 样式设计
+
+```less
+// 🔄 可拖拽项目样式
+.draggable-item {
+  position: relative;
+  cursor: move;
+  transition: all 0.3s ease;
+  border-radius: 8px;
+  
+  &:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+    
+    .drag-indicator {
+      opacity: 1;
+    }
+  }
+  
+  &.dragging {
+    opacity: 0.5;
+    transform: rotate(5deg) scale(0.95);
+    z-index: 1000;
+  }
+}
+
+// 🎯 拖拽指示器
+.drag-indicator {
+  position: absolute;
+  top: -8px;
+  left: 50%;
+  transform: translateX(-50%);
+  background: rgba(0, 0, 0, 0.8);
+  color: white;
+  padding: 2px 6px;
+  border-radius: 4px;
+  font-size: 12px;
+  opacity: 0;
+  transition: opacity 0.2s ease;
+  z-index: 10;
+  pointer-events: none;
+}
+
+// 📍 顺序指示器
+.order-indicator {
+  position: absolute;
+  top: -6px;
+  right: -6px;
+  background: #1890ff;
+  color: white;
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 12px;
+  font-weight: bold;
+  z-index: 5;
+  border: 2px solid white;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+}
+```
+
+### 🔗 父组件集成
+
+在articleEdit.vue中添加对reorder事件的处理：
+
+```vue
+<SelectFile
+  :placeholder="`请选择图片`"
+  :limit="6"
+  :data="files"
+  @done="chooseFile"
+  @del="onDeleteFile"
+  @reorder="onReorderFiles"
+/>
+```
+
+```typescript
+// 🔄 处理文件重新排序
+const onReorderFiles = (newData: any[]) => {
+  files.value = newData;
+  form.files = JSON.stringify(files.value.map((d) => d.url));
+  message.success('文件顺序已更新');
+};
+```
+
+### 🎨 用户体验
+
+1. **直观操作**：用户可以直接拖拽文件来调整顺序
+2. **视觉反馈**：拖拽时有清晰的视觉指示
+3. **顺序显示**：每个文件都有序号显示当前位置
+4. **即时更新**：拖拽完成后立即更新数据和UI
+
+### 📊 功能特点
+
+| 特性 | 描述 | 状态 |
+|------|------|------|
+| 拖拽排序 | 支持鼠标拖拽调整顺序 | ✅ |
+| 视觉反馈 | 拖拽时的动画和指示器 | ✅ |
+| 顺序指示 | 显示文件的当前位置 | ✅ |
+| 数据同步 | 拖拽后自动更新数据 | ✅ |
+| 事件通知 | 触发reorder事件通知父组件 | ✅ |
+| 响应式设计 | 适配不同屏幕尺寸 | ✅ |
+
+### 🚀 使用场景
+
+1. **文章封面图排序**：调整封面图的显示顺序，第一张作为主封面
+2. **图片轮播排序**：调整轮播图片的播放顺序
+3. **文件优先级**：根据重要性调整文件的排列顺序
+4. **展示顺序**：调整图片在前端的展示顺序
+
+### 💡 技术亮点
+
+- **原生HTML5拖拽API**：使用标准的拖拽事件
+- **Vue3响应式**：利用Vue3的响应式系统
+- **数据双向绑定**：保持组件内外数据同步
+- **优雅的动画效果**：提供流畅的用户体验
+- **类型安全**：完整的TypeScript类型定义
+
+这个功能让用户可以更直观地管理文件顺序，特别是在处理多个封面图时，可以轻松调整哪张图片作为主封面显示！🎉
diff --git a/src/api/cms/cmsWebsiteSetting/model/index.ts b/src/api/cms/cmsWebsiteSetting/model/index.ts
index 9a5b3e0..71241f8 100644
--- a/src/api/cms/cmsWebsiteSetting/model/index.ts
+++ b/src/api/cms/cmsWebsiteSetting/model/index.ts
@@ -28,6 +28,8 @@ export interface CmsWebsiteSetting {
   loginBtn?: string;
   // 显示悬浮客服工具
   floatTool?: boolean;
+  // 显示版权信息
+  showCopyright?: boolean;
   // 显示版权链接
   copyrightLink?: string;
   // 导航栏最多显示数量
diff --git a/src/api/shop/shopGoods/model/index.ts b/src/api/shop/shopGoods/model/index.ts
index ecc1057..493295d 100644
--- a/src/api/shop/shopGoods/model/index.ts
+++ b/src/api/shop/shopGoods/model/index.ts
@@ -140,6 +140,7 @@ export interface ShopGoodsParam extends PageParam {
   parentId?: number;
   categoryId?: number;
   goodsId?: number;
+  status?: number;
   goodsName?: string;
   isShow?: number;
   stock?: number;
diff --git a/src/api/system/setting/index.ts b/src/api/system/setting/index.ts
index e743223..e7ca3c0 100644
--- a/src/api/system/setting/index.ts
+++ b/src/api/system/setting/index.ts
@@ -48,6 +48,19 @@ export async function getSetting(id: number) {
   return Promise.reject(new Error(res.data.message));
 }
 
+/**
+ * 根据key查询
+ */
+export async function getSettingByKey(key: string) {
+  const res = await request.get<ApiResult<any>>(
+    SERVER_API_URL + '/system/setting/getByKey/' + key
+  );
+  if (res.data.code === 0 && res.data.data) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
 /**
  * 添加设置
  */
@@ -76,6 +89,20 @@ export async function updateSetting(data: Setting) {
   return Promise.reject(new Error(res.data.message));
 }
 
+/**
+ * 根据Key修改设置
+ */
+export async function updateSettingByKey(data: Setting) {
+  const res = await request.put<ApiResult<unknown>>(
+    SERVER_API_URL + '/system/setting/updateByKey',
+    data
+  );
+  if (res.data.code === 0) {
+    return res.data.message;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
 /**
  * 删除设置
  */
diff --git a/src/config/setting.ts b/src/config/setting.ts
index 4179809..b8c4c9f 100644
--- a/src/config/setting.ts
+++ b/src/config/setting.ts
@@ -65,7 +65,7 @@ export const TOKEN_HEADER_NAME = 'Authorization';
 // token 存储的名称
 export const TOKEN_STORE_NAME = 'access_token';
 // 主题配置存储的名称
-export const THEME_STORE_NAME = 'theme:';
+export const THEME_STORE_NAME = 'theme';
 // i18n 缓存的名称
 export const I18N_CACHE_NAME = 'i18n-lang';
 // 是否开启国际化功能
diff --git a/src/i18n/lang/en/route.ts b/src/i18n/lang/en/route.ts
index 4432a1f..557559e 100644
--- a/src/i18n/lang/en/route.ts
+++ b/src/i18n/lang/en/route.ts
@@ -8,48 +8,6 @@ export default {
     analysis: { _name: 'Analysis' },
     monitor: { _name: 'Monitor' }
   },
-  system: {
-    _name: 'System',
-    user: {
-      _name: 'User',
-      details: { _name: '' }
-    },
-    role: { _name: 'Role' },
-    menu: { _name: 'Menu' },
-    dictionary: { _name: 'Dictionary' },
-    dict: { _name: 'Dictionary' },
-    organization: { _name: 'Organization' },
-    loginRecord: { _name: 'LoginRecord' },
-    operationRecord: { _name: 'OperationRecord' },
-    file: { _name: 'File' },
-    userInfo: { _name: '' },
-    admin: {_name: 'Admin'},
-    setting: {_name: 'Setting'}
-  },
-  form: {
-    _name: 'Form',
-    basic: { _name: 'Basic Form' },
-    advanced: { _name: 'Advanced Form' },
-    step: { _name: 'Step Form' }
-  },
-  list: {
-    _name: 'List',
-    basic: {
-      _name: 'Basic List',
-      add: { _name: 'UserAdd' },
-      edit: { _name: 'UserEdit' },
-      details: {
-        ':id': { _name: '' }
-      }
-    },
-    advanced: { _name: 'Advanced List' },
-    card: {
-      _name: 'Card List',
-      project: { _name: 'Project' },
-      application: { _name: 'Application' },
-      article: { _name: 'Article' }
-    }
-  },
   result: {
     _name: 'Result',
     success: { _name: 'Success' },
@@ -60,76 +18,5 @@ export default {
     '403': { _name: '403' },
     '404': { _name: '404' },
     '500': { _name: '500' }
-  },
-  user: {
-    _name: 'User',
-    profile: { _name: 'Profile' },
-    message: { _name: 'Message' }
-  },
-  extension: {
-    _name: 'Extension',
-    tag: { _name: 'Tags' },
-    dialog: { _name: 'DragDialog' },
-    file: { _name: 'FileList' },
-    upload: { _name: 'ImageUpload' },
-    dragsort: { _name: 'DragSort' },
-    colorPicker: { _name: 'ColorPicker' },
-    regions: { _name: 'CitySelect' },
-    printer: { _name: 'Printer' },
-    excel: { _name: 'Excel' },
-    countUp: { _name: 'CountUp' },
-    tableSelect: { _name: 'TableSelect' },
-    player: { _name: 'Player' },
-    map: { _name: 'Map' },
-    qrCode: { _name: 'QRCode' },
-    barCode: { _name: 'BarCode' },
-    editor: { _name: 'Editor' },
-    markdown: { _name: 'Markdown' }
-  },
-  example: {
-    _name: 'Example',
-    table: { _name: 'ProTable' },
-    menuBadge: { _name: 'MenuBadge' },
-    eleadmin: { _name: 'IFrame' },
-    eleadminDoc: { _name: 'IFrame2' },
-    document: { _name: 'Document' },
-    choose: { _name: 'Choose' }
-  },
-  'https://eleadminCom/goods/9': { _name: 'Authorization' },
-  website: {
-    _name: 'Content',
-    index: {
-        _name: 'Home'
-    },
-    navigation: {
-      _name: 'Category'
-    },
-    article: {
-      _name: 'Article'
-    },
-    link: {
-      _name: 'Link'
-    },
-    order: {
-      _name: 'Order'
-    },
-    photo: {
-      _name: 'Photo'
-    },
-    ad: {
-      _name: 'Ad'
-    },
-    form: {
-      _name: 'Form'
-    },
-    dict: {
-      _name: 'Source'
-    },
-    field: {
-      _name: 'Configuration'
-    },
-    template: {
-      _name: 'Template'
-    }
   }
 };
diff --git a/src/i18n/lang/zh_CN/route.ts b/src/i18n/lang/zh_CN/route.ts
index 522e1c1..92944ee 100644
--- a/src/i18n/lang/zh_CN/route.ts
+++ b/src/i18n/lang/zh_CN/route.ts
@@ -2,54 +2,6 @@
 export default {
   login: { _name: '登录' },
   forget: { _name: '忘记密码' },
-  system: {
-    _name: '系统管理',
-    user: {
-      _name: '用户管理',
-      add: { _name: '添加用户' },
-      edit: { _name: '修改用户' },
-      details: { _name: '' }
-    },
-    role: { _name: '角色管理' },
-    menu: { _name: '菜单管理' },
-    dictionary: { _name: '公共字典' },
-    dict: { _name: '字典管理' },
-    loginRecord: { _name: '登录日志' },
-    operationRecord: { _name: '操作日志' },
-    file: { _name: '文件管理' },
-    admin: {_name: '员工管理'},
-    setting: {_name: '系统设置'}
-  },
-  link: {
-    _name: '网址导航',
-    add: { _name: '添加网址' },
-    edit: { _name: '修改网址' },
-    details: { _name: '' }
-  },
-  form: {
-    _name: '表单页面',
-    basic: { _name: '基础表单' },
-    advanced: { _name: '复杂表单' },
-    step: { _name: '分步表单' }
-  },
-  list: {
-    _name: '列表页面',
-    basic: {
-      _name: '基础列表',
-      add: { _name: '添加用户' },
-      edit: { _name: '修改用户' },
-      details: {
-        ':id': { _name: '' }
-      }
-    },
-    advanced: { _name: '复杂列表' },
-    card: {
-      _name: '卡片列表',
-      project: { _name: '项目列表' },
-      application: { _name: '应用列表' },
-      article: { _name: '文章列表' }
-    }
-  },
   result: {
     _name: '结果页面',
     success: { _name: '成功页' },
@@ -60,76 +12,5 @@ export default {
     '403': { _name: '403' },
     '404': { _name: '404' },
     '500': { _name: '500' }
-  },
-  user: {
-    _name: '用户管理',
-    profile: { _name: '账号中心' },
-    message: { _name: '我的消息' }
-  },
-  extension: {
-    _name: '扩展组件',
-    tag: { _name: '标签组件' },
-    dialog: { _name: '拖拽弹窗' },
-    file: { _name: '文件列表' },
-    upload: { _name: '图片上传' },
-    dragsort: { _name: '拖拽排序' },
-    colorPicker: { _name: '颜色选择' },
-    regions: { _name: '城市选择' },
-    printer: { _name: '打印插件' },
-    excel: { _name: 'excel插件' },
-    countUp: { _name: '滚动数字' },
-    tableSelect: { _name: '表格下拉' },
-    player: { _name: '视频播放' },
-    map: { _name: '地图组件' },
-    qrCode: { _name: '二维码' },
-    barCode: { _name: '条形码' },
-    editor: { _name: '富文本框' },
-    markdown: { _name: 'markdown' }
-  },
-  example: {
-    _name: '常用实例',
-    table: { _name: '表格实例' },
-    menuBadge: { _name: '菜单徽章' },
-    eleadmin: { _name: '内嵌页面' },
-    eleadminDoc: { _name: '内嵌文档' },
-    document: { _name: '案卷调整' },
-    choose: { _name: '批量选择' }
-  },
-  'https://eleadminCom/goods/9': { _name: '获取授权' },
-  website: {
-    _name: '内容管理',
-    index: {
-      _name: '网站设置'
-    },
-    navigation: {
-      _name: '栏目导航'
-    },
-    article: {
-      _name: '文章管理'
-    },
-    link: {
-      _name: '友情链接'
-    },
-    order: {
-      _name: '订单管理'
-    },
-    photo: {
-      _name: '素材管理'
-    },
-    ad: {
-      _name: '广告管理'
-    },
-    form: {
-      _name: '表单管理'
-    },
-    dict: {
-      _name: '文章来源'
-    },
-    field: {
-      _name: '扩展程序'
-    },
-    template: {
-      _name: '网站模板'
-    }
   }
 };
diff --git a/src/layout/components/header-tools.vue b/src/layout/components/header-tools.vue
index e92676f..4c6a87b 100644
--- a/src/layout/components/header-tools.vue
+++ b/src/layout/components/header-tools.vue
@@ -3,7 +3,7 @@
   <div class="ele-admin-header-tool">
     <!-- 小程序码 -->
     <div class="ele-admin-header-tool-item" @click="onQrCode">
-      <HomeOutlined />
+      <HomeOutlined/>
     </div>
     <!-- 消息通知 -->
     <div class="ele-admin-header-tool-item" @click="openUrl(`/user/notice`)">
@@ -95,12 +95,12 @@
               </div>
             </a-menu-item>
             <template v-if="loginUser.username == 'admin' || loginUser.username == 'superAdmin'">
-              <!--              <a-menu-divider/>-->
-              <!--              <a-menu-item key="accessKey">-->
-              <!--                <div class="ele-cell">-->
-              <!--                  <div class="ele-cell-content"> {{ t('layout.header.accessKey') }}</div>-->
-              <!--                </div>-->
-              <!--              </a-menu-item>-->
+              <a-menu-divider/>
+              <a-menu-item key="accessKey">
+                <div class="ele-cell">
+                  <div class="ele-cell-content"> {{ t('layout.header.accessKey') }}</div>
+                </div>
+              </a-menu-item>
               <a-menu-divider/>
               <a-menu-item key="system">
                 <div class="ele-cell">
@@ -121,9 +121,9 @@
       </a-dropdown>
     </div>
     <!-- 主题设置 -->
-    <!--    <div class="ele-admin-header-tool-item" @click="openSetting">-->
-    <!--      <more-outlined />-->
-    <!--    </div>-->
+    <div class="ele-admin-header-tool-item" @click="openSetting">
+      <more-outlined/>
+    </div>
   </div>
   <!-- 修改密码弹窗 -->
   <password-modal v-model:visible="passwordVisible"/>
@@ -142,21 +142,18 @@ import {
   DownOutlined,
   ExclamationCircleOutlined,
   FullscreenOutlined,
-  HomeOutlined,
+  MoreOutlined,
   FullscreenExitOutlined
 } from '@ant-design/icons-vue';
 import {storeToRefs} from 'pinia';
-import {copyText, openNew, openUrl} from '@/utils/common';
+import {copyText, openUrl} from '@/utils/common';
 import {useThemeStore} from '@/store/modules/theme';
 import HeaderNotice from './header-notice.vue';
 import PasswordModal from './password-modal.vue';
 import SettingDrawer from './setting-drawer.vue';
 import {useUserStore} from '@/store/modules/user';
 import {logout} from '@/utils/page-tab-util';
-import type {Menu} from '@/api/system/menu/model';
-import {isExternalLink} from 'ele-admin-pro';
 import {listRoles} from '@/api/system/role';
-import I18nIcon from './i18n-icon.vue';
 import {getSiteInfo} from "@/api/layout";
 import {CmsWebsite} from "@/api/cms/cmsWebsite/model";
 import Qrcode from "@/components/QrCode/index.vue";
@@ -164,7 +161,6 @@ import Qrcode from "@/components/QrCode/index.vue";
 // 是否开启响应式布局
 const themeStore = useThemeStore();
 const {styleResponsive} = storeToRefs(themeStore);
-const i18n = localStorage.getItem('i18n');
 const SiteUrl = localStorage.getItem('SiteUrl');
 // 是否显示二维码
 const showQrcode = ref(false);
@@ -187,11 +183,9 @@ const passwordVisible = ref(false);
 
 // 是否显示主题设置抽屉
 const settingVisible = ref(false);
-const domain = ref(localStorage.getItem('Domain'))
 
 // 当前用户信息
 const loginUser = computed(() => userStore.info ?? {});
-const menuList = ref<Menu[]>([]);
 const website = ref<CmsWebsite>();
 
 /* 用户信息下拉点击 */
@@ -231,18 +225,10 @@ const onQrCode = () => {
 const hideShare = () => {
   showQrcode.value = false;
 }
-const onChange = (index: number) => {
-  const item = menuList.value.find((d) => d.menuId == index);
-  const isExternal = isExternalLink(item?.path);
-  if (isExternal) {
-    return openNew(`${item?.path}`);
-  }
-  if (item?.parentId == 0) {
-    return push(item.path);
-  }
-  if (item?.component) {
-    return push(item.path);
-  }
+
+/* 打开主题设置抽屉 */
+const openSetting = () => {
+  settingVisible.value = true;
 };
 
 /* 切换全屏 */
@@ -252,7 +238,7 @@ const toggleFullscreen = () => {
 
 const reload = () => {
   // 查询网站信息
-  if(!localStorage.getItem('Domain')){
+  if (!localStorage.getItem('Domain')) {
     getSiteInfo().then((data) => {
       localStorage.setItem('Domain', `${data.domain}`)
       localStorage.setItem('SiteUrl', `${data.prefix}${data.domain}`)
diff --git a/src/layout/components/page-footer.vue b/src/layout/components/page-footer.vue
index e063d46..fdbb48e 100644
--- a/src/layout/components/page-footer.vue
+++ b/src/layout/components/page-footer.vue
@@ -1,6 +1,6 @@
 <!-- 全局页脚 -->
 <template>
-  <div class="ele-text-center" style="padding: 16px 0">
+  <div v-if="config.setting?.showAdminCopyright" class="ele-text-center" style="padding: 16px 0">
     <div class="ele-text-secondary" style="margin-top: 8px">
       {{ t('layout.footer.copyright') }}
     </div>
@@ -8,7 +8,19 @@
 </template>
 
 <script lang="ts" setup>
-  import { useI18n } from 'vue-i18n';
+import {useI18n} from 'vue-i18n';
+import {useWebsiteSettingStore} from "@/store/modules/setting";
+import {getSettingByKey} from "@/api/system/setting";
 
-  const { t } = useI18n();
+const {t} = useI18n();
+const config = useWebsiteSettingStore();
+
+const reload = async () => {
+  if (!config.setting) {
+    const info = await getSettingByKey('privacy');
+    config.setSetting(info)
+  }
+}
+
+reload();
 </script>
diff --git a/src/layout/components/setting-drawer.vue b/src/layout/components/setting-drawer.vue
index 5586383..ea2a5f1 100644
--- a/src/layout/components/setting-drawer.vue
+++ b/src/layout/components/setting-drawer.vue
@@ -26,12 +26,12 @@
             class="ele-bg-base ele-side-dark"
             @click="updateSideStyle('dark')"
           >
-            <check-outlined v-if="sideStyle === 'dark'" />
+            <check-outlined v-if="sideStyle === 'dark'"/>
           </div>
         </a-tooltip>
         <a-tooltip :title="t('layout.setting.sideStyles.light')">
           <div class="ele-bg-base" @click="updateSideStyle('light')">
-            <check-outlined v-if="sideStyle === 'light'" />
+            <check-outlined v-if="sideStyle === 'light'"/>
           </div>
         </a-tooltip>
       </div>
@@ -42,7 +42,7 @@
             class="ele-bg-base ele-head-light"
             @click="updateHeadStyle('light')"
           >
-            <check-outlined v-if="headStyle === 'light'" />
+            <check-outlined v-if="headStyle === 'light'"/>
           </div>
         </a-tooltip>
         <a-tooltip :title="t('layout.setting.headStyles.dark')">
@@ -50,7 +50,7 @@
             class="ele-bg-base ele-head-dark"
             @click="updateHeadStyle('dark')"
           >
-            <check-outlined v-if="headStyle === 'dark'" />
+            <check-outlined v-if="headStyle === 'dark'"/>
           </div>
         </a-tooltip>
         <a-tooltip :title="t('layout.setting.headStyles.primary')">
@@ -59,7 +59,7 @@
             @click="updateHeadStyle('primary')"
           >
             <div class="ele-bg-primary"></div>
-            <check-outlined v-if="headStyle === 'primary'" />
+            <check-outlined v-if="headStyle === 'primary'"/>
           </div>
         </a-tooltip>
       </div>
@@ -72,7 +72,7 @@
           class="ele-setting-color-item"
           @click="updateColor(item.value)"
         >
-          <check-outlined v-if="item.value ? item.value === color : !color" />
+          <check-outlined v-if="item.value ? item.value === color : !color"/>
           <a-tooltip :title="t('layout.setting.colors.' + item.name)">
             <div class="ele-setting-color-tooltip"></div>
           </a-tooltip>
@@ -89,10 +89,10 @@
       <div class="ele-setting-item">
         <div class="setting-item-title">{{ t('layout.setting.darkMode') }}</div>
         <div class="setting-item-control">
-          <a-switch size="small" :checked="darkMode" @change="updateDarkMode" />
+          <a-switch size="small" :checked="darkMode" @change="updateDarkMode"/>
         </div>
       </div>
-      <a-divider />
+      <a-divider/>
       <!-- 导航布局 -->
       <div
         :class="[
@@ -113,7 +113,7 @@
             class="ele-bg-base ele-side-dark"
             @click="updateLayoutStyle('side')"
           >
-            <check-outlined v-if="layoutStyle === 'side'" />
+            <check-outlined v-if="layoutStyle === 'side'"/>
           </div>
         </a-tooltip>
         <a-tooltip :title="t('layout.setting.layoutStyles.top')">
@@ -121,7 +121,7 @@
             class="ele-bg-base ele-head-dark ele-layout-top"
             @click="updateLayoutStyle('top')"
           >
-            <check-outlined v-if="layoutStyle === 'top'" />
+            <check-outlined v-if="layoutStyle === 'top'"/>
           </div>
         </a-tooltip>
         <a-tooltip :title="t('layout.setting.layoutStyles.mix')">
@@ -129,7 +129,7 @@
             class="ele-bg-base ele-layout-mix"
             @click="updateLayoutStyle('mix')"
           >
-            <check-outlined v-if="layoutStyle === 'mix'" />
+            <check-outlined v-if="layoutStyle === 'mix'"/>
           </div>
         </a-tooltip>
       </div>
@@ -162,7 +162,7 @@
           />
         </div>
       </div>
-      <a-divider :class="{ 'hidden-xs-only': styleResponsive }" />
+      <a-divider :class="{ 'hidden-xs-only': styleResponsive }"/>
       <div class="ele-setting-title ele-text-secondary">
         {{ t('layout.setting.other') }}
       </div>
@@ -282,14 +282,14 @@
       <div class="ele-setting-item">
         <div class="setting-item-title">{{ t('layout.setting.weakMode') }}</div>
         <div class="setting-item-control">
-          <a-switch size="small" :checked="weakMode" @change="updateWeakMode" />
+          <a-switch size="small" :checked="weakMode" @change="updateWeakMode"/>
         </div>
       </div>
       <!-- 页签 -->
       <div class="ele-setting-item">
         <div class="setting-item-title">{{ t('layout.setting.showTabs') }}</div>
         <div class="setting-item-control">
-          <a-switch size="small" :checked="showTabs" @change="updateShowTabs" />
+          <a-switch size="small" :checked="showTabs" @change="updateShowTabs"/>
         </div>
       </div>
       <!-- 页签风格 -->
@@ -345,12 +345,12 @@
         </div>
       </div>
       <!-- 提示 -->
-      <a-divider />
-      <!--      <a-alert show-icon type="warning" :message="t('layout.setting.tips')">-->
-      <!--        <template #icon>-->
-      <!--          <sound-outlined />-->
-      <!--        </template>-->
-      <!--      </a-alert>-->
+      <a-divider/>
+      <a-alert show-icon type="warning" :message="t('layout.setting.tips')">
+        <template #icon>
+          <sound-outlined/>
+        </template>
+      </a-alert>
       <!-- 重置 -->
       <a-button block type="dashed" @click="resetSetting">
         {{ t('layout.setting.reset') }}
@@ -360,386 +360,388 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref } from 'vue';
-  import { useI18n } from 'vue-i18n';
-  import { storeToRefs } from 'pinia';
-  import { message } from 'ant-design-vue/es';
-  import { CheckOutlined, SoundOutlined } from '@ant-design/icons-vue';
-  import { messageLoading } from 'ele-admin-pro/es';
-  import type {
-    ThemeItem,
-    HeadStyleType,
-    SideStyleType,
-    LayoutStyleType,
-    TabStyleType
-  } from 'ele-admin-pro/es';
-  import { useThemeStore } from '@/store/modules/theme';
-
-  defineProps<{
-    // drawer 是否显示, v-model
-    visible: boolean;
-  }>();
-
-  const emit = defineEmits<{
-    (e: 'update:visible', value: boolean): void;
-  }>();
-
-  const { t } = useI18n();
-  const themeStore = useThemeStore();
-
-  const {
-    showTabs,
-    showFooter,
-    headStyle,
-    sideStyle,
-    layoutStyle,
-    sideMenuStyle,
-    tabStyle,
-    transitionName,
-    fixedHeader,
-    fixedSidebar,
-    fixedBody,
-    bodyFull,
-    logoAutoSize,
-    colorfulIcon,
-    sideUniqueOpen,
-    styleResponsive,
-    weakMode,
-    darkMode,
-    color
-  } = storeToRefs(themeStore);
-
-  // 主题列表
-  const themes = ref<ThemeItem[]>([
-    {
-      name: 'default',
-      color: '#1890ff'
-    },
-    {
-      name: 'dust',
-      value: '#5f80c7'
-    },
-    {
-      name: 'sunset',
-      value: '#faad14'
-    },
-    {
-      name: 'volcano',
-      value: '#f5686f'
-    },
-    {
-      name: 'purple',
-      value: '#9266f9'
-    },
-    {
-      name: 'green',
-      value: '#33cc99'
-    },
-    {
-      name: 'geekblue',
-      value: '#32a2d4'
-    }
-  ]);
-
-  // 颜色选择器预设颜色
-  const predefineColors = ref<string[]>([
-    '#f5222d',
-    '#fa541c',
-    '#fa8c16',
-    '#faad14',
-    '#a0d911',
-    '#52c41a',
-    '#13c2c2',
-    '#2f54eb',
-    '#722ed1',
-    '#eb2f96'
-  ]);
-
-  // 颜色选择器选中颜色
-  const colorValue = ref<string | undefined>(void 0);
-
-  const updateVisible = (value: boolean) => {
-    emit('update:visible', value);
-  };
-
-  const updateShowTabs = (value: boolean) => {
-    themeStore.setShowTabs(value);
-  };
-
-  const updateShowFooter = (value: boolean) => {
-    themeStore.setShowFooter(value);
-  };
-
-  const updateHeadStyle = (value: HeadStyleType) => {
-    themeStore.setHeadStyle(value);
-  };
-
-  const updateSideStyle = (value: SideStyleType) => {
-    themeStore.setSideStyle(value);
-  };
-
-  const updateLayoutStyle = (value: LayoutStyleType) => {
-    themeStore.setLayoutStyle(value);
-  };
-
-  const updateSideMenuStyle = (value: boolean) => {
-    themeStore.setSideMenuStyle(value ? 'mix' : 'default');
-  };
-
-  const updateTabStyle = (value: TabStyleType) => {
-    themeStore.setTabStyle(value);
-  };
-
-  const updateTransitionName = (value: string) => {
-    themeStore.setTransitionName(value);
-  };
-
-  const updateFixedHeader = (value: boolean) => {
-    themeStore.setFixedHeader(value);
-  };
-
-  const updateFixedSidebar = (value: boolean) => {
-    themeStore.setFixedSidebar(value);
-  };
-
-  const updateFixedBody = (value: boolean) => {
-    themeStore.setFixedBody(value);
-  };
-
-  const updateBodyFull = (value: boolean) => {
-    themeStore.setBodyFull(!value);
-  };
-
-  const updateLogoAutoSize = (value: boolean) => {
-    themeStore.setLogoAutoSize(value);
-  };
-
-  const updateStyleResponsive = (value: boolean) => {
-    themeStore.setStyleResponsive(value);
-    updateVisible(false);
-  };
-
-  const updateColorfulIcon = (value: boolean) => {
-    themeStore.setColorfulIcon(value);
-  };
-
-  const updateSideUniqueOpen = (value: boolean) => {
-    themeStore.setSideUniqueOpen(value);
-  };
-
-  const updateWeakMode = (value: boolean) => {
-    themeStore.setWeakMode(value);
-  };
-
-  const updateDarkMode = (value: boolean) => {
-    doWithLoading(() => themeStore.setDarkMode(value));
-  };
-
-  const updateColor = (value?: string) => {
-    doWithLoading(() => themeStore.setColor(value));
-  };
-
-  const resetSetting = () => {
-    doWithLoading(() => themeStore.resetSetting());
-  };
-
-  const doWithLoading = (fun: () => Promise<void>) => {
-    const hide = messageLoading('正在加载主题..', 0);
-    setTimeout(() => {
-      fun()
-        .then(() => {
-          hide();
-          initColorValue();
-        })
-        .catch((e) => {
-          hide();
-          console.error(e);
-          message.error('主题加载失败');
-        });
-    }, 0);
-  };
-
-  const initColorValue = () => {
-    if (color?.value && !themes.value.some((t) => t.value === color.value)) {
-      colorValue.value = color.value;
-    } else {
-      colorValue.value = void 0;
-    }
-  };
+import {ref} from 'vue';
+import {useI18n} from 'vue-i18n';
+import {storeToRefs} from 'pinia';
+import {message} from 'ant-design-vue/es';
+import {CheckOutlined, SoundOutlined} from '@ant-design/icons-vue';
+import {messageLoading} from 'ele-admin-pro/es';
+import type {
+  ThemeItem,
+  HeadStyleType,
+  SideStyleType,
+  LayoutStyleType,
+  TabStyleType
+} from 'ele-admin-pro/es';
+import {useThemeStore} from '@/store/modules/theme';
+
+defineProps<{
+  // drawer 是否显示, v-model
+  visible: boolean;
+}>();
+
+const emit = defineEmits<{
+  (e: 'update:visible', value: boolean): void;
+}>();
+
+const {t} = useI18n();
+const themeStore = useThemeStore();
+
+const {
+  showTabs,
+  showFooter,
+  headStyle,
+  sideStyle,
+  layoutStyle,
+  sideMenuStyle,
+  tabStyle,
+  transitionName,
+  fixedHeader,
+  fixedSidebar,
+  fixedBody,
+  bodyFull,
+  logoAutoSize,
+  colorfulIcon,
+  sideUniqueOpen,
+  styleResponsive,
+  weakMode,
+  darkMode,
+  color
+} = storeToRefs(themeStore);
+
+// 主题列表
+const themes = ref<ThemeItem[]>([
+  {
+    name: 'default',
+    color: '#1890ff'
+  },
+  {
+    name: 'dust',
+    value: '#5f80c7'
+  },
+  {
+    name: 'sunset',
+    value: '#faad14'
+  },
+  {
+    name: 'volcano',
+    value: '#f5686f'
+  },
+  {
+    name: 'purple',
+    value: '#9266f9'
+  },
+  {
+    name: 'green',
+    value: '#33cc99'
+  },
+  {
+    name: 'geekblue',
+    value: '#32a2d4'
+  }
+]);
+
+// 颜色选择器预设颜色
+const predefineColors = ref<string[]>([
+  '#f5222d',
+  '#fa541c',
+  '#fa8c16',
+  '#faad14',
+  '#a0d911',
+  '#52c41a',
+  '#13c2c2',
+  '#2f54eb',
+  '#722ed1',
+  '#eb2f96'
+]);
+
+// 颜色选择器选中颜色
+const colorValue = ref<string | undefined>(void 0);
+
+const updateVisible = (value: boolean) => {
+  emit('update:visible', value);
+};
+
+const updateShowTabs = (value: boolean) => {
+  themeStore.setShowTabs(value);
+};
+
+const updateShowFooter = (value: boolean) => {
+  themeStore.setShowFooter(value);
+};
+
+const updateHeadStyle = (value: HeadStyleType) => {
+  themeStore.setHeadStyle(value);
+};
+
+const updateSideStyle = (value: SideStyleType) => {
+  themeStore.setSideStyle(value);
+};
+
+const updateLayoutStyle = (value: LayoutStyleType) => {
+  themeStore.setLayoutStyle(value);
+};
+
+const updateSideMenuStyle = (value: boolean) => {
+  themeStore.setSideMenuStyle(value ? 'mix' : 'default');
+};
+
+const updateTabStyle = (value: TabStyleType) => {
+  themeStore.setTabStyle(value);
+};
+
+const updateTransitionName = (value: string) => {
+  themeStore.setTransitionName(value);
+};
+
+const updateFixedHeader = (value: boolean) => {
+  themeStore.setFixedHeader(value);
+};
+
+const updateFixedSidebar = (value: boolean) => {
+  themeStore.setFixedSidebar(value);
+};
+
+const updateFixedBody = (value: boolean) => {
+  themeStore.setFixedBody(value);
+};
+
+const updateBodyFull = (value: boolean) => {
+  themeStore.setBodyFull(!value);
+};
+
+const updateLogoAutoSize = (value: boolean) => {
+  themeStore.setLogoAutoSize(value);
+};
+
+const updateStyleResponsive = (value: boolean) => {
+  themeStore.setStyleResponsive(value);
+  updateVisible(false);
+};
+
+const updateColorfulIcon = (value: boolean) => {
+  themeStore.setColorfulIcon(value);
+};
+
+const updateSideUniqueOpen = (value: boolean) => {
+  themeStore.setSideUniqueOpen(value);
+};
+
+const updateWeakMode = (value: boolean) => {
+  themeStore.setWeakMode(value);
+};
+
+const updateDarkMode = (value: boolean) => {
+  doWithLoading(() => themeStore.setDarkMode(value));
+};
+
+const updateColor = (value?: string) => {
+  doWithLoading(() => themeStore.setColor(value));
+};
+
+const resetSetting = () => {
+  doWithLoading(() => themeStore.resetSetting());
+};
+
+const doWithLoading = (fun: () => Promise<void>) => {
+  const hide = messageLoading('正在加载主题..', 0);
+  setTimeout(() => {
+    fun()
+      .then(() => {
+        hide();
+        initColorValue();
+      })
+      .catch((e) => {
+        hide();
+        console.error(e);
+        message.error('主题加载失败');
+      });
+  }, 0);
+};
+
+const initColorValue = () => {
+  if (color?.value && !themes.value.some((t) => t.value === color.value)) {
+    colorValue.value = color.value;
+  } else {
+    colorValue.value = void 0;
+  }
+};
 
-  initColorValue();
+initColorValue();
 </script>
 
 <style lang="less">
-  .ele-setting-wrapper {
-    padding: 20px 18px;
+.ele-setting-wrapper {
+  padding: 20px 18px;
 
-    .ele-setting-title {
-      font-size: 13px;
-      margin-bottom: 15px;
-    }
+  .ele-setting-title {
+    font-size: 13px;
+    margin-bottom: 15px;
+  }
 
-    /* 主题风格 */
-    .ele-setting-theme > div {
-      width: 52px;
-      height: 36px;
-      line-height: 1;
-      border-radius: 3px;
-      margin: 0 20px 30px 0;
-      padding: 16px 0 0 26px;
-      box-sizing: border-box;
-      box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
-      display: inline-block;
-      vertical-align: top;
-      position: relative;
-      overflow: hidden;
-      cursor: pointer;
-      transition: background-color 0.2s;
+  /* 主题风格 */
 
-      &:before,
-      &:after,
-      & > .ele-bg-primary {
-        content: '';
-        width: 100%;
-        height: 10px;
-        background: #fff;
-        position: absolute;
-        left: 0;
-        top: 0;
-        transition: background-color 0.2s;
-      }
+  .ele-setting-theme > div {
+    width: 52px;
+    height: 36px;
+    line-height: 1;
+    border-radius: 3px;
+    margin: 0 20px 30px 0;
+    padding: 16px 0 0 26px;
+    box-sizing: border-box;
+    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
+    display: inline-block;
+    vertical-align: top;
+    position: relative;
+    overflow: hidden;
+    cursor: pointer;
+    transition: background-color 0.2s;
+
+    &:before,
+    &:after,
+    & > .ele-bg-primary {
+      content: '';
+      width: 100%;
+      height: 10px;
+      background: #fff;
+      position: absolute;
+      left: 0;
+      top: 0;
+      transition: background-color 0.2s;
+    }
 
-      &:after {
-        width: 14px;
-        height: 100%;
-      }
+    &:after {
+      width: 14px;
+      height: 100%;
+    }
 
-      &.ele-side-dark:after,
-      &.ele-head-dark:before,
-      &.ele-layout-mix:before,
-      &.ele-layout-mix:after {
-        background: #001529;
-      }
+    &.ele-side-dark:after,
+    &.ele-head-dark:before,
+    &.ele-layout-mix:before,
+    &.ele-layout-mix:after {
+      background: #001529;
+    }
 
-      &.ele-head-light:before,
-      &.ele-head-dark:before,
-      & > .ele-bg-primary {
-        z-index: 1;
-      }
+    &.ele-head-light:before,
+    &.ele-head-dark:before,
+    & > .ele-bg-primary {
+      z-index: 1;
+    }
 
-      &.ele-layout-top {
-        padding-left: 19px;
+    &.ele-layout-top {
+      padding-left: 19px;
 
-        &:after {
-          display: none;
-        }
+      &:after {
+        display: none;
       }
     }
+  }
 
-    /* 主题色选择 */
-    .ele-setting-colors {
-      color: #fff;
-      margin-bottom: 20px;
-    }
+  /* 主题色选择 */
 
-    .ele-setting-color-item {
-      width: 20px;
-      height: 20px;
-      line-height: 20px;
-      border-radius: 2px;
-      margin: 8px 8px 0 0;
-      display: inline-block;
-      box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
-      vertical-align: top;
-      position: relative;
-      text-align: center;
-      cursor: pointer;
-
-      .ele-setting-color-tooltip {
-        position: absolute;
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
-      }
+  .ele-setting-colors {
+    color: #fff;
+    margin-bottom: 20px;
+  }
+
+  .ele-setting-color-item {
+    width: 20px;
+    height: 20px;
+    line-height: 20px;
+    border-radius: 2px;
+    margin: 8px 8px 0 0;
+    display: inline-block;
+    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
+    vertical-align: top;
+    position: relative;
+    text-align: center;
+    cursor: pointer;
+
+    .ele-setting-color-tooltip {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
     }
+  }
 
-    /* 主题配置项 */
-    .ele-setting-item {
-      display: flex;
-      align-items: center;
-      margin-bottom: 20px;
+  /* 主题配置项 */
 
-      .setting-item-title {
-        flex: 1;
-        line-height: 28px;
-      }
+  .ele-setting-item {
+    display: flex;
+    align-items: center;
+    margin-bottom: 20px;
 
-      .setting-item-control {
-        line-height: 1;
-      }
+    .setting-item-title {
+      flex: 1;
+      line-height: 28px;
     }
 
-    .ant-divider {
-      margin-bottom: 20px;
+    .setting-item-control {
+      line-height: 1;
     }
+  }
 
-    .ant-alert + .ant-btn {
-      margin-top: 12px;
-    }
+  .ant-divider {
+    margin-bottom: 20px;
+  }
 
-    /* 暗黑模式 */
-    &.ele-setting-dark .ele-setting-theme > div {
-      box-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
+  .ant-alert + .ant-btn {
+    margin-top: 12px;
+  }
 
-      &:before,
-      &:after,
-      & > .ele-bg-primary {
-        background: #1f1f1f;
-      }
+  /* 暗黑模式 */
 
-      &.ele-side-dark:after,
-      &.ele-head-dark:before,
-      &.ele-layout-mix:before,
-      &.ele-layout-mix:after {
-        background: #262626;
-      }
-    }
-  }
+  &.ele-setting-dark .ele-setting-theme > div {
+    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
 
-  /* 颜色选择器 */
-  .ele-setting-color-picker.ele-color-picker-trigger {
-    padding: 0;
-    width: 20px;
-    height: 20px;
-    margin-top: 8px;
-    border: none !important;
-    background: none !important;
-    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
+    &:before,
+    &:after,
+    & > .ele-bg-primary {
+      background: #1f1f1f;
+    }
 
-    & > .ele-color-picker-trigger-inner {
-      background: none;
-
-      &.is-empty {
-        background: conic-gradient(
-          from 90deg at 50% 50%,
-          rgb(255, 0, 0) -19.41deg,
-          rgb(255, 0, 0) 18.76deg,
-          rgb(255, 138, 0) 59.32deg,
-          rgb(255, 230, 0) 99.87deg,
-          rgb(20, 255, 0) 141.65deg,
-          rgb(0, 163, 255) 177.72deg,
-          rgb(5, 0, 255) 220.23deg,
-          rgb(173, 0, 255) 260.13deg,
-          rgb(255, 0, 199) 300.69deg,
-          rgb(255, 0, 0) 340.59deg,
-          rgb(255, 0, 0) 378.76deg
-        );
-
-        & + .ele-color-picker-trigger-arrow {
-          display: none;
-        }
+    &.ele-side-dark:after,
+    &.ele-head-dark:before,
+    &.ele-layout-mix:before,
+    &.ele-layout-mix:after {
+      background: #262626;
+    }
+  }
+}
+
+/* 颜色选择器 */
+.ele-setting-color-picker.ele-color-picker-trigger {
+  padding: 0;
+  width: 20px;
+  height: 20px;
+  margin-top: 8px;
+  border: none !important;
+  background: none !important;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
+
+  & > .ele-color-picker-trigger-inner {
+    background: none;
+
+    &.is-empty {
+      background: conic-gradient(from 90deg at 50% 50%,
+        rgb(255, 0, 0) -19.41deg,
+      rgb(255, 0, 0) 18.76deg,
+      rgb(255, 138, 0) 59.32deg,
+      rgb(255, 230, 0) 99.87deg,
+      rgb(20, 255, 0) 141.65deg,
+      rgb(0, 163, 255) 177.72deg,
+      rgb(5, 0, 255) 220.23deg,
+      rgb(173, 0, 255) 260.13deg,
+      rgb(255, 0, 199) 300.69deg,
+      rgb(255, 0, 0) 340.59deg,
+      rgb(255, 0, 0) 378.76deg);
+
+      & + .ele-color-picker-trigger-arrow {
+        display: none;
       }
     }
   }
+}
 </style>
diff --git a/src/store/modules/setting.ts b/src/store/modules/setting.ts
index 8c10572..0b654a8 100644
--- a/src/store/modules/setting.ts
+++ b/src/store/modules/setting.ts
@@ -2,10 +2,9 @@
  * 网站设置 store
  */
 import { defineStore } from 'pinia';
-import { CmsWebsiteSetting } from '@/api/cms/cmsWebsiteSetting/model';
 
 export interface ParamsState {
-  setting: CmsWebsiteSetting | null;
+  setting: any | null;
 }
 
 export const useWebsiteSettingStore = defineStore({
@@ -16,8 +15,11 @@ export const useWebsiteSettingStore = defineStore({
   }),
   getters: {},
   actions: {
-    setSetting(value: CmsWebsiteSetting) {
+    setSetting(value: any) {
       this.setting = value;
     },
+    getSetting(value: any){
+      return value;
+    }
   },
 });
diff --git a/src/store/modules/theme.ts b/src/store/modules/theme.ts
index 04f5877..ebee743 100644
--- a/src/store/modules/theme.ts
+++ b/src/store/modules/theme.ts
@@ -100,17 +100,8 @@ let disableTransitionTimer: number, updateContentSizeTimer: number;
 function getCacheSetting(): any {
   try {
     const value = localStorage.getItem(THEME_STORE_NAME);
-    // 加载redis缓存
-    // getCache('theme').then((data) => {
-    //   if (typeof data === 'object') {
-    //     // 写入本地缓存
-    //     localStorage.setItem(THEME_STORE_NAME, JSON.stringify(data));
-    //     return data;
-    //   }
-    // });
     if (value) {
       const cache = JSON.parse(value);
-      // 加载本地缓存
       if (typeof cache === 'object') {
         return cache;
       }
diff --git a/src/views/cms/cmsAd/index.vue b/src/views/cms/cmsAd/index.vue
index 33873b5..d4a7ea2 100644
--- a/src/views/cms/cmsAd/index.vue
+++ b/src/views/cms/cmsAd/index.vue
@@ -246,9 +246,7 @@ const query = () => {
   loading.value = true;
   // 加载栏目数据
   if (!navigationList.value) {
-    listCmsNavigation({
-      lang: localStorage.getItem('i18n-lang') || undefined
-    }).then((res) => {
+    listCmsNavigation({}).then((res) => {
       navigationList.value = toTreeData({
         data: res?.map((d) => {
           d.value = d.navigationId;
diff --git a/src/views/cms/cmsArticle/components/articleEdit.vue b/src/views/cms/cmsArticle/components/articleEdit.vue
index 7e17ff5..7588192 100644
--- a/src/views/cms/cmsArticle/components/articleEdit.vue
+++ b/src/views/cms/cmsArticle/components/articleEdit.vue
@@ -1261,13 +1261,6 @@ watch(
         if (data.content) {
           content.value = data.content;
         }
-        if (data.image) {
-          images.value.push({
-            uid: uuid(),
-            url: data.image,
-            status: 'done'
-          });
-        }
         if (!data.source) {
           form.source = undefined;
         }
@@ -1289,6 +1282,13 @@ watch(
             });
           });
         }
+        if (data.image && !data.files) {
+          files.value.push({
+            uid: uuid(),
+            url: data.image,
+            status: 'done'
+          });
+        }
         loading.value = false;
         isUpdate.value = true;
       } else {
diff --git a/src/views/cms/cmsArticle/index.vue b/src/views/cms/cmsArticle/index.vue
index 59ff1c4..465b7e2 100644
--- a/src/views/cms/cmsArticle/index.vue
+++ b/src/views/cms/cmsArticle/index.vue
@@ -397,9 +397,7 @@ const customRow = (record: CmsArticle) => {
 
 // 加载栏目数据
 if (!navigationList.value) {
-  listCmsNavigation({
-    lang: localStorage.getItem('i18n-lang') || undefined
-  }).then((res) => {
+  listCmsNavigation({}).then((res) => {
     navigationList.value = toTreeData({
       data: res?.map((d) => {
         d.value = d.navigationId;
diff --git a/src/views/cms/cmsLink/index.vue b/src/views/cms/cmsLink/index.vue
index bb55223..492bee5 100644
--- a/src/views/cms/cmsLink/index.vue
+++ b/src/views/cms/cmsLink/index.vue
@@ -232,7 +232,7 @@ const query = () => {
   loading.value = true;
   // 加载栏目数据
   if (!navigationList.value) {
-    listCmsNavigation({lang: getLang()}).then((res) => {
+    listCmsNavigation({}).then((res) => {
       navigationList.value = toTreeData({
         data: res?.map((d) => {
           d.value = d.navigationId;
diff --git a/src/views/cms/cmsNavigation/index.vue b/src/views/cms/cmsNavigation/index.vue
index 7a9506b..985dc5f 100644
--- a/src/views/cms/cmsNavigation/index.vue
+++ b/src/views/cms/cmsNavigation/index.vue
@@ -160,14 +160,15 @@
               <!--              <a-tooltip :title="`自定义组件`">-->
               <!--                <a @click="openDesign(record)">组件</a>-->
               <!--              </a-tooltip>-->
-              <!--              <a-divider type="vertical"/>-->
-              <!--              <a-popconfirm-->
-              <!--                placement="topRight"-->
-              <!--                title="确定要删除此菜单吗？"-->
-              <!--                @confirm="remove(record)"-->
-              <!--              >-->
-              <!--                <a class="ele-text-danger">删除</a>-->
-              <!--              </a-popconfirm>-->
+              <a @click="openEdit(record)">修改</a>
+              <a-divider type="vertical"/>
+              <a-popconfirm
+                placement="topRight"
+                title="确定要删除此菜单吗？"
+                @confirm="remove(record)"
+              >
+                <a class="ele-text-danger">删除</a>
+              </a-popconfirm>
             </template>
           </template>
         </template>
@@ -542,7 +543,7 @@ const customRow = (record: CmsNavigation) => {
     },
     // 行双击事件
     onDblclick: () => {
-      if(record.model !== 'index'){
+      if (record.model !== 'index') {
         openEdit(record);
       }
     }
diff --git a/src/views/cms/cmsSetting/index.vue b/src/views/cms/cmsSetting/index.vue
index 6303913..adbc88a 100644
--- a/src/views/cms/cmsSetting/index.vue
+++ b/src/views/cms/cmsSetting/index.vue
@@ -21,6 +21,9 @@
           <a-form-item label="显示站内搜索" name="searchBtn">
             <a-switch v-model:checked="form.searchBtn" checked-children="显示" un-checked-children="隐藏" @change="save" />
           </a-form-item>
+          <a-form-item label="显示版权" name="showCopyright">
+            <a-switch v-model:checked="form.showCopyright" checked-children="显示" un-checked-children="隐藏" @change="save" />
+          </a-form-item>
           <a-form-item label="启用登录注册" name="loginBtn">
             <a-switch v-model:checked="form.loginBtn" checked-children="启用" un-checked-children="不启用" @change="save" />
           </a-form-item>
@@ -61,7 +64,10 @@
   import router from "@/router";
   import {CmsWebsiteSetting} from "@/api/cms/cmsWebsiteSetting/model";
   import {getCmsWebsiteSetting, updateCmsWebsiteSetting} from "@/api/cms/cmsWebsiteSetting";
+  import {useWebsiteSettingStore} from "@/store/modules/setting";
 
+  // 网站设置信息
+  const setting = useWebsiteSettingStore();
   const useForm = Form.useForm;
   // 是否开启响应式布局
   const themeStore = useThemeStore();
@@ -87,6 +93,7 @@
     searchBtn: undefined,
     loginBtn: undefined,
     floatTool: undefined,
+    showCopyright: undefined,
     copyrightLink: undefined,
     maxMenuNum: undefined,
     deleted: undefined,
@@ -137,6 +144,7 @@
         const formData = {
           ...form
         };
+        setting.setSetting(formData);
         updateCmsWebsiteSetting(formData)
           .then((msg) => {
             loading.value = false;
diff --git a/src/views/cms/cmsWebsiteSetting/components/cmsWebsiteSettingEdit.vue b/src/views/cms/cmsWebsiteSetting/components/cmsWebsiteSettingEdit.vue
index 536b30d..ca7b8d8 100644
--- a/src/views/cms/cmsWebsiteSetting/components/cmsWebsiteSettingEdit.vue
+++ b/src/views/cms/cmsWebsiteSetting/components/cmsWebsiteSettingEdit.vue
@@ -133,14 +133,13 @@
 <script lang="ts" setup>
   import { ref, reactive, watch } from 'vue';
   import { Form, message } from 'ant-design-vue';
-  import { assignObject, uuid } from 'ele-admin-pro';
+  import { assignObject } from 'ele-admin-pro';
   import { addCmsWebsiteSetting, updateCmsWebsiteSetting } from '@/api/cms/cmsWebsiteSetting';
   import { CmsWebsiteSetting } from '@/api/cms/cmsWebsiteSetting/model';
   import { useThemeStore } from '@/store/modules/theme';
   import { storeToRefs } from 'pinia';
   import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
   import { FormInstance } from 'ant-design-vue/es/form';
-  import { FileRecord } from '@/api/system/file/model';
 
   // 是否是修改
   const isUpdate = ref(false);
@@ -208,20 +207,6 @@
     ]
   });
 
-  const chooseImage = (data: FileRecord) => {
-    images.value.push({
-      uid: data.id,
-      url: data.path,
-      status: 'done'
-    });
-    form.image = data.path;
-  };
-
-  const onDeleteItem = (index: number) => {
-    images.value.splice(index, 1);
-    form.image = '';
-  };
-
   const { resetFields } = useForm(form, rules);
 
   /* 保存编辑 */
@@ -259,13 +244,6 @@
         images.value = [];
         if (props.data) {
           assignObject(form, props.data);
-          if(props.data.image){
-            images.value.push({
-              uid: uuid(),
-              url: props.data.image,
-              status: 'done'
-            })
-          }
           isUpdate.value = true;
         } else {
           isUpdate.value = false;
diff --git a/src/views/cms/cmsWebsiteSetting/index.vue b/src/views/cms/cmsWebsiteSetting/index.vue
index c0f49cd..72ab5f6 100644
--- a/src/views/cms/cmsWebsiteSetting/index.vue
+++ b/src/views/cms/cmsWebsiteSetting/index.vue
@@ -236,7 +236,7 @@
   /* 删除单个 */
   const remove = (row: CmsWebsiteSetting) => {
     const hide = message.loading('请求中..', 0);
-    removeCmsWebsiteSetting(row.cmsWebsiteSettingId)
+    removeCmsWebsiteSetting(row.id)
       .then((msg) => {
         hide();
         message.success(msg);
diff --git a/src/views/cms/help/index.vue b/src/views/cms/help/index.vue
index cdda049..3c92aa8 100644
--- a/src/views/cms/help/index.vue
+++ b/src/views/cms/help/index.vue
@@ -323,9 +323,7 @@ const customRow = (record: CmsArticle) => {
 
 // 加载栏目数据
 if (!navigationList.value) {
-  listCmsNavigation({
-    lang: localStorage.getItem('i18n-lang') || undefined
-  }).then((res) => {
+  listCmsNavigation({}).then((res) => {
     navigationList.value = toTreeData({
       data: res?.map((d) => {
         d.value = d.navigationId;
diff --git a/src/views/shop/shopGoods/components/extra.vue b/src/views/shop/shopGoods/components/extra.vue
index d8887f7..7708c0d 100644
--- a/src/views/shop/shopGoods/components/extra.vue
+++ b/src/views/shop/shopGoods/components/extra.vue
@@ -4,7 +4,7 @@
     style="flex-wrap: wrap"
     v-if="hasRole('superAdmin') || hasRole('admin') || hasRole('foundation')"
   >
-    <a-button type="text" @click="push('/shop/category')">商品分类</a-button>
+    <a-button type="text" @click="push('/website/navigation')">商品分类</a-button>
   </a-space>
 </template>
 
diff --git a/src/views/shop/shopGoods/components/search.vue b/src/views/shop/shopGoods/components/search.vue
index b48a085..5ef63dd 100644
--- a/src/views/shop/shopGoods/components/search.vue
+++ b/src/views/shop/shopGoods/components/search.vue
@@ -18,27 +18,27 @@
         >已售罄({{ goodsCount?.totalNum3 }})
       </a-radio-button>
     </a-radio-group>
-    <SelectMerchant
-      :placeholder="`商户刷新`"
-      class="input-item"
-      v-if="!merchantId"
-      v-model:value="where.merchantName"
-      @done="chooseMerchantId"
-    />
-    <SelectGoodsCategory
-      class="input-item"
-      :placeholder="`请选择商品分类`"
-      v-model:value="where.categoryId"
-      @done="chooseGoodsCategory"
+    <a-tree-select
+      allow-clear
+      :tree-data="navigationList"
+      tree-default-expand-all
+      style="width: 240px"
+      :listHeight="700"
+      placeholder="请选择栏目"
+      :value="where.categoryId || undefined"
+      :dropdown-style="{ overflow: 'auto' }"
+      @update:value="(value?: number) => (where.categoryId = value)"
+      @change="onCategoryId"
     />
     <a-input-search
       allow-clear
       placeholder="请输入关键词"
+      style="width: 360px"
       v-model:value="where.keywords"
       @pressEnter="reload"
       @search="reload"
     />
-    <a-button @click="reset">重置</a-button>
+    <a-button type="text" @click="reset">重置</a-button>
   </a-space>
 </template>
 
@@ -48,15 +48,15 @@
   import { getCount } from '@/api/shop/shopGoods';
   import type { GoodsCount, ShopGoodsParam } from '@/api/shop/shopGoods/model';
   import useSearch from '@/utils/use-search';
-  import { ShopMerchant } from '@/api/shop/shopMerchant/model';
-  import { ShopGoodsCategory } from '@/api/shop/shopGoodsCategory/model';
   import { getMerchantId } from '@/utils/merchant';
+  import {CmsNavigation} from "@/api/cms/cmsNavigation/model";
 
   const props = withDefaults(
     defineProps<{
       // 选中的角色
       selection?: [];
       merchantId?: number;
+      navigationList?: CmsNavigation[];
     }>(),
     {
       merchantId: getMerchantId()
@@ -112,22 +112,6 @@
     emit('search', where);
   };
 
-  /* 搜索 */
-  const chooseMerchantId = (item: ShopMerchant) => {
-    where.merchantName = item.merchantName;
-    where.merchantId = item.merchantId;
-    reload();
-  };
-
-  const chooseGoodsCategory = (
-    category: ShopGoodsCategory,
-    data: ShopGoodsCategory
-  ) => {
-    where.categoryName = data[1].label;
-    where.categoryId = data[1].value;
-    reload();
-  };
-
   /*  重置 */
   const reset = () => {
     resetFields();
@@ -135,10 +119,12 @@
     reload();
   };
 
-  // watch(
-  //   () => props.selection,
-  //   () => {}
-  // );
+  // 按分类查询
+  const onCategoryId = (id: number) => {
+    where.categoryId = id;
+    emit('search', where);
+  };
+
   watch(
     () => props.merchantId,
     (id) => {
diff --git a/src/views/shop/shopGoods/components/shopGoodsEdit.vue b/src/views/shop/shopGoods/components/shopGoodsEdit.vue
index 98710af..911534f 100644
--- a/src/views/shop/shopGoods/components/shopGoodsEdit.vue
+++ b/src/views/shop/shopGoods/components/shopGoodsEdit.vue
@@ -1,7 +1,7 @@
 <!-- 编辑弹窗 -->
 <template>
-  <ele-modal
-    :width="'80%'"
+  <a-drawer
+    width="70%"
     :visible="visible"
     :maskClosable="false"
     :maxable="maxable"
@@ -10,67 +10,20 @@
     @update:visible="updateVisible"
     @ok="save"
   >
+    <template #extra>
+      <a-button type="primary" style="margin-right: 8px" @click="save">保存</a-button>
+    </template>
     <a-form
       ref="formRef"
       :model="form"
       :rules="rules"
-      :label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }"
+      :label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
       :wrapper-col="
         styleResponsive ? { md: 24, sm: 24, xs: 24 } : { flex: '1' }
       "
     >
       <a-tabs type="card" v-model:active-key="active" @change="onChange">
         <a-tab-pane tab="基本信息" key="base">
-          <!--          <a-form-item label="商品类型" name="type">-->
-          <!--            <a-space>-->
-          <!--              <a-button-->
-          <!--                :type="form.type == 1 ? 'primary' : ''"-->
-          <!--                @click="onType(1)"-->
-          <!--                :ghost="form.type == 1"-->
-          <!--              >实物商品-->
-          <!--              </a-button-->
-          <!--              >-->
-          <!--              <a-button-->
-          <!--                :type="form.type == 2 ? 'primary' : ''"-->
-          <!--                @click="onType(2)"-->
-          <!--                :ghost="form.type == 2"-->
-          <!--              >虚拟商品-->
-          <!--              </a-button-->
-          <!--              >-->
-          <!--            </a-space>-->
-          <!--            <div class="ele-text-placeholder">-->
-          <!--              {{-->
-          <!--                form.type == 1-->
-          <!--                  ? `支持快递邮寄、同城配送或到店自提方式发货`-->
-          <!--                  : '电子券码等，线下到店核销，无需备货'-->
-          <!--              }}-->
-          <!--            </div>-->
-          <!--          </a-form-item>-->
-          <a-form-item v-if="!merchantId" label="选择店铺" name="merchantId">
-            <div class="flex items-center">
-              <SelectMerchant
-                :placeholder="`选择商户`"
-                class="input-item"
-                style="width: 558px"
-                v-model:value="form.merchantName"
-                @done="chooseMerchantId"
-              />
-              <a-button @click="clearMerchant">清除店铺</a-button>
-            </div>
-          </a-form-item>
-          <a-form-item
-            label="供应商"
-            name="supplierMerchantId"
-            v-if="!merchantId"
-          >
-            <SelectMerchant
-              :placeholder="`选择供应商`"
-              class="input-item"
-              style="width: 558px"
-              v-model:value="form.supplierName"
-              @done="chooseSupplier"
-            />
-          </a-form-item>
           <a-form-item label="商品名称" name="name">
             <a-input
               allow-clear
@@ -79,189 +32,61 @@
               v-model:value="form.name"
             />
           </a-form-item>
-          <a-form-item label="商品分类" name="categoryId" v-if="!merchantId">
-            <SelectGoodsCategory
-              :data="data"
-              placeholder="请选择商品分类"
-              style="width: 558px"
-              v-model:value="category"
-              @done="chooseGoodsCategory"
-            />
-          </a-form-item>
-          <a-form-item label="商品分类" name="categoryId" v-else>
-            <SelectGoodsCategory
-              :merchantId="merchantId"
-              placeholder="请选择商品分类"
-              style="width: 558px"
-              v-model:value="form.categoryId"
-              @done="chooseTakeawayCategory"
+          <a-form-item label="所属栏目" name="categoryId">
+            <a-tree-select
+              allow-clear
+              :tree-data="navigationList"
+              tree-default-expand-all
+              style="width: 320px"
+              placeholder="请选择栏目"
+              :value="form.categoryId || undefined"
+              :listHeight="700"
+              :dropdown-style="{ overflow: 'auto' }"
+              @update:value="(value?: number) => (form.categoryId = value)"
+              @change="onCategoryId"
             />
           </a-form-item>
           <a-form-item label="商品卖点" name="comments">
-            <a-input
-              allow-clear
-              :maxlength="60"
-              style="width: 558px"
+            <a-textarea
+              :rows="1"
+              :maxlength="100"
+              show-count
               placeholder="此款商品美观大方 性价比较高 不容错过"
               v-model:value="form.comments"
             />
           </a-form-item>
-          <a-form-item label="是否可以快递配送">
-            <a-switch
-              size="small"
-              v-model:checked="form.canExpress"
-              :checked-value="1"
-              :un-checked-value="0"
-            />
-          </a-form-item>
           <a-form-item label="单位名称" name="unitName">
             <a-input
               allow-clear
-              style="width: 558px"
+              style="width: 240px"
               placeholder="单位名称，如(个)"
               v-model:value="form.unitName"
             />
           </a-form-item>
-          <a-form-item label="原价(划线价)" name="originPrice">
-            <a-input-number
-              :placeholder="`原价(划线价)`"
-              style="width: 240px"
-              :min="0.01"
-              v-model:value="form.originPrice"
-            />
-          </a-form-item>
-          <a-form-item label="普通会员价" name="salePrice">
-            <a-input-number
-              :placeholder="`普通会员价`"
-              style="width: 240px"
-              :min="0.01"
-              v-model:value="form.salePrice"
-            />
-            <div class="ele-text-placeholder">普通用户购物价格</div>
-          </a-form-item>
-          <a-form-item label="牛八哥会员价" name="price">
+          <a-form-item label="商品价格" name="price">
             <a-space>
               <a-input-number
-                :placeholder="`牛八哥会员价`"
+                :placeholder="`商品价格`"
                 style="width: 240px"
                 :min="0.01"
                 v-model:value="form.price"
               />
             </a-space>
-            <div class="ele-text-placeholder">牛八哥会员购物价格</div>
-          </a-form-item>
-          <a-form-item label="是否有赠品">
-            <a-checkbox v-model:checked="form.priceGift">有赠品</a-checkbox>
           </a-form-item>
-          <a-form-item label="赠品">
-            <template v-if="form.priceGift">
-              <a-input
-                v-model:value="form.priceGiftName"
-                style="width: 200px"
-                placeholder="请输入赠品名称"
-              >
-                <template #prefix>名称</template>
-              </a-input>
-              <a-input-number
-                v-model:value="form.priceGiftNum"
-                style="width: 200px"
-                placeholder="请输入赠品数量"
-              >
-                <template #prefix>数量</template>
-              </a-input-number>
-            </template>
-          </a-form-item>
-          <!--          <a-form-item label="经销商价" name="dealerPrice" v-if="!merchantId">-->
-          <!--            <a-space>-->
-          <!--              <a-input-number-->
-          <!--                :placeholder="`经销商价格`"-->
-          <!--                style="width: 240px"-->
-          <!--                :min="0.01"-->
-          <!--                v-model:value="form.dealerPrice"-->
-          <!--              />-->
-          <!--              <a-checkbox v-model:checked="form.dealerGift">有赠品</a-checkbox>-->
-          <!--              <a-input-number v-if="form.dealerGift" v-model:value="form.dealerGiftNum" style="width: 200px"-->
-          <!--                              placeholder="请输入赠品数量"/>-->
-          <!--            </a-space>-->
-          <!--            <div class="ele-text-placeholder">经销商价格</div>-->
-          <!--          </a-form-item>-->
-          <a-form-item label="会员店/总仓批发价" name="buyingPrice">
-            <a-space>
-              <a-input-number
-                :placeholder="`会员店/总仓批发价`"
-                :min="0.01"
-                style="width: 240px"
-                v-model:value="form.buyingPrice"
-              />
-            </a-space>
-            <div class="ele-text-placeholder">会员店/总仓批发价</div>
-          </a-form-item>
-          <a-form-item label="供应价" name="chainStorePrice" v-if="!merchantId">
-            <a-space>
-              <a-input-number
-                :placeholder="`请输入供应价`"
-                :min="0.01"
-                style="width: 240px"
-                v-model:value="form.chainStorePrice"
-              />
-            </a-space>
-            <div class="ele-text-placeholder">供应价</div>
-          </a-form-item>
-          <!--          <a-form-item label="连锁店差价比例(%)" name="chainStoreRate" v-if="!merchantId">-->
-          <!--            <a-space>-->
-          <!--              <a-input-number-->
-          <!--                :placeholder="`请输入连锁店差价比例(%)`"-->
-          <!--                :min="0.01"-->
-          <!--                :max="100"-->
-          <!--                style="width: 240px"-->
-          <!--                v-model:value="form.chainStoreRate"-->
-          <!--              />-->
-          <!--            </a-space>-->
-          <!--            <div class="ele-text-placeholder">连锁店差价比例(%)</div>-->
-          <!--          </a-form-item>-->
-          <!--          <a-form-item label="会员店价格" name="memberStorePrice" v-if="!merchantId">-->
-          <!--            <a-space>-->
-          <!--              <a-input-number-->
-          <!--                :placeholder="`请输入会员店价格`"-->
-          <!--                :min="0.01"-->
-          <!--                style="width: 240px"-->
-          <!--                v-model:value="form.memberStorePrice"-->
-          <!--              />-->
-          <!--            </a-space>-->
-          <!--            <div class="ele-text-placeholder">会员店价格</div>-->
-          <!--          </a-form-item>-->
-          <!--          <a-form-item label="会员店差价比例(%)" name="memberStoreRate" v-if="!merchantId">-->
-          <!--            <a-space>-->
-          <!--              <a-input-number-->
-          <!--                :placeholder="`请输入会员店差价比例(%)`"-->
-          <!--                :min="0.01"-->
-          <!--                :max="100"-->
-          <!--                style="width: 240px"-->
-          <!--                v-model:value="form.memberStoreRate"-->
-          <!--              />-->
-          <!--            </a-space>-->
-          <!--            <div class="ele-text-placeholder">会员店差价比例(%)</div>-->
-          <!--          </a-form-item>-->
-          <a-form-item
-            label="直推收益分配(元)"
-            v-if="!merchantId"
-            name="memberStoreCommission"
-          >
+          <a-form-item label="团长价" name="originPrice">
             <a-input-number
-              :placeholder="`会员店/供应商/总仓直推收益分配`"
+              :placeholder="`团长价`"
               style="width: 240px"
-              v-model:value="form.memberStoreCommission"
+              :min="0.01"
+              v-model:value="form.dealerPrice"
             />
           </a-form-item>
-          <a-form-item
-            label="仓储费(元)"
-            v-if="!merchantId"
-            name="supplierCommission"
-          >
+          <a-form-item label="进货价" name="originPrice">
             <a-input-number
-              :placeholder="`请输入仓储费(元)`"
+              :placeholder="`进货价`"
               style="width: 240px"
-              v-model:value="form.supplierCommission"
+              :min="0.01"
+              v-model:value="form.buyingPrice"
             />
           </a-form-item>
           <a-form-item label="运费模板" v-if="!merchantId">
@@ -270,79 +95,10 @@
                 v-for="(item, index) in expressTemplateList"
                 :key="index"
                 :value="item.id"
-                >{{ item.title }}
+              >{{ item.title }}
               </a-select-option>
             </a-select>
           </a-form-item>
-          <!--          <a-form-item label="合作伙伴直推分佣(元)" v-if="!merchantId">-->
-          <!--            <a-space>-->
-          <!--              <a-input-number-->
-          <!--                :placeholder="`请输入合作伙伴直推分佣(元)`"-->
-          <!--                style="width: 240px"-->
-          <!--                v-model:value="form.coopCommission"-->
-          <!--              />-->
-          <!--            </a-space>-->
-          <!--          </a-form-item>-->
-
-          <!--          <a-form-item label="会员超市价格" name="memberMarketPrice" v-if="!merchantId">-->
-          <!--            <a-space>-->
-          <!--              <a-input-number-->
-          <!--                :placeholder="`请输入会员超市价格`"-->
-          <!--                :min="0.01"-->
-          <!--                style="width: 240px"-->
-          <!--                v-model:value="form.memberMarketPrice"-->
-          <!--              />-->
-          <!--            </a-space>-->
-          <!--            <div class="ele-text-placeholder">会员超市价格</div>-->
-          <!--          </a-form-item>-->
-          <!--          <a-form-item label="会员超市差价比例(%)" name="memberMarketRate" v-if="!merchantId">-->
-          <!--            <a-space>-->
-          <!--              <a-input-number-->
-          <!--                :placeholder="`请输入会员超市差价比例(%)`"-->
-          <!--                :min="0.01"-->
-          <!--                :max="100"-->
-          <!--                style="width: 240px"-->
-          <!--                v-model:value="form.memberMarketRate"-->
-          <!--              />-->
-          <!--            </a-space>-->
-          <!--            <div class="ele-text-placeholder">会员超市差价比例(%)</div>-->
-          <!--          </a-form-item>-->
-          <!--          <a-form-item label="当前库存" name="stock">-->
-          <!--            <a-input-number-->
-          <!--              :placeholder="`商品库存`"-->
-          <!--              style="width: 240px"-->
-          <!--              v-model:value="form.stock"-->
-          <!--            />-->
-          <!--            <div class="ele-text-placeholder">划线价仅用于商品页展示</div>-->
-          <!--          </a-form-item>-->
-          <a-form-item label="是否新品">
-            <a-switch
-              size="small"
-              v-model:checked="form.isNew"
-              :checked-value="1"
-              :un-checked-value="0"
-            />
-          </a-form-item>
-          <a-form-item label="是否开启分红角色功能" v-if="!merchantId">
-            <a-switch
-              size="small"
-              v-model:checked="form.commissionRole"
-              :checked-value="1"
-              :un-checked-value="0"
-            />
-          </a-form-item>
-          <a-form-item label="角色分红配置" v-if="form.commissionRole === 1">
-            <a-space>
-              <a-input
-                v-model:value="form.goodsRoleCommission[index].amount"
-                v-for="(item, index) in form.goodsRoleCommission"
-                :key="index"
-              >
-                <template #addonBefore>{{ item.roleName }}</template>
-                <template #addonAfter>元</template>
-              </a-input>
-            </a-space>
-          </a-form-item>
           <a-form-item label="商品图片(400x400)" name="image">
             <!--            <SelectFile-->
             <!--              :placeholder="`请选择视频文件`"-->
@@ -365,7 +121,7 @@
             >
               <a-button class="ele-btn-icon">
                 <template #icon>
-                  <UploadOutlined />
+                  <UploadOutlined/>
                 </template>
                 <span>上传图标</span>
               </a-button>
@@ -375,13 +131,6 @@
             </div>
           </a-form-item>
           <a-form-item label="轮播图" name="files">
-            <!--            <SelectFile-->
-            <!--              :placeholder="`请选择视频文件`"-->
-            <!--              :limit="9"-->
-            <!--              :data="files"-->
-            <!--              @done="chooseFile"-->
-            <!--              @del="onDeleteFile"-->
-            <!--            />-->
             <div class="flex flex-wrap justify-start items-start">
               <div
                 v-for="(item, index) in files"
@@ -389,12 +138,12 @@
                 style="margin-right: 10px; margin-bottom: 10px"
                 class="relative"
               >
-                <img style="width: 100px; height: 100px" :src="item.url" />
+                <img style="width: 100px; height: 100px" :src="item.url"/>
                 <div
                   class="absolute right-0 top-0 w-6 h-6 bg-red-400 flex justify-center items-center rounded-bl-lg"
                   @click="onDeleteFile(index)"
                 >
-                  <delete-outlined style="color: white" />
+                  <delete-outlined style="color: white"/>
                 </div>
               </div>
             </div>
@@ -407,7 +156,7 @@
             >
               <a-button class="ele-btn-icon">
                 <template #icon>
-                  <UploadOutlined />
+                  <UploadOutlined/>
                 </template>
                 <span>上传轮播图</span>
               </a-button>
@@ -477,10 +226,10 @@
               </a-card>
               <a-space v-if="spec.length > 0">
                 <a-button type="primary" class="mt-5" @click="openSpecForm"
-                  >添加新规格
+                >添加新规格
                 </a-button>
                 <a-button type="primary" class="mt-5" @click="generateSku"
-                  >生成SKU
+                >生成SKU
                 </a-button>
               </a-space>
             </a-space>
@@ -563,28 +312,55 @@
           </a-form-item>
         </a-tab-pane>
         <a-tab-pane tab="商品详情" key="content">
-          <!--          <a-form-item label="视频">-->
-          <!--            <SelectFile-->
-          <!--              type="video"-->
-          <!--              :placeholder="`请选择商品视频`"-->
-          <!--              :limit="1"-->
-          <!--              :data="videos || []"-->
-          <!--              @done="chooseVideo"-->
-          <!--              @del="onDeleteVideo"-->
-          <!--            />-->
-          <!--          </a-form-item>-->
-          <a-form-item name="content">
-            <!-- 编辑器 -->
+          <!-- 富文本编辑器 -->
+          <div v-if="editor == 1">
             <tinymce-editor
               ref="editorRef"
-              class="content"
+              class="editor-content"
               v-model:value="content"
               :disabled="disabled"
               :init="config"
-              placeholder="图片直接粘贴自动上传"
-              @paste="onPaste"
+              placeholder="支持直接粘贴或拖拽图片，也可点击工具栏图片按钮从文件库选择"
             />
-          </a-form-item>
+            <div class="file-selector-tip">
+              💡 提示：工具栏"图片"按钮从图片库选择，"上传"按钮快速上传图片；"视频"按钮从视频库选择，"上传视频"按钮快速上传视频；"一键排版"按钮自动优化文章格式；"首行缩进"按钮切换段落缩进
+            </div>
+          </div>
+
+          <!-- Markdown编辑器 -->
+          <div v-if="editor == 2">
+            <!-- 📝 Markdown编辑器工具栏扩展 -->
+            <div class="markdown-toolbar-extension">
+              <a-button
+                type="primary"
+                size="small"
+                @click="openMarkdownImageSelector"
+                style="margin-right: 8px;"
+              >
+                📷 从图片库选择
+              </a-button>
+              <a-button
+                type="default"
+                size="small"
+                @click="openMarkdownVideoSelector"
+                style="margin-right: 8px;"
+              >
+                🎬 从视频库选择
+              </a-button>
+            </div>
+
+            <MdEditor
+              v-model="content"
+              :disabled="disabled"
+              height="500px"
+              :placeholder="'请输入Markdown内容...'"
+              :toolbars="markdownToolbars"
+              :onUploadImg="onMarkdownUploadImg"
+            />
+            <div class="file-selector-tip">
+              💡 提示：支持Markdown语法，可以使用工具栏按钮从文件库选择图片/视频，也可以直接拖拽上传文件
+            </div>
+          </div>
         </a-tab-pane>
         <a-tab-pane tab="营销设置" key="coupon">
           <a-form-item label="商品重量" name="goodsWeight">
@@ -632,6 +408,42 @@
               v-model:value="form.position"
             />
           </a-form-item>
+          <a-form-item label="是否可以快递配送">
+            <a-switch
+              size="small"
+              v-model:checked="form.canExpress"
+              :checked-value="1"
+              :un-checked-value="0"
+            />
+          </a-form-item>
+          <a-form-item label="是否新品">
+            <a-switch
+              size="small"
+              v-model:checked="form.isNew"
+              :checked-value="1"
+              :un-checked-value="0"
+            />
+          </a-form-item>
+          <a-form-item label="是否开启分红角色功能" v-if="!merchantId">
+            <a-switch
+              size="small"
+              v-model:checked="form.commissionRole"
+              :checked-value="1"
+              :un-checked-value="0"
+            />
+          </a-form-item>
+          <a-form-item label="角色分红配置" v-if="form.commissionRole === 1">
+            <a-space>
+              <a-input
+                v-model:value="form.goodsRoleCommission[index].amount"
+                v-for="(item, index) in form.goodsRoleCommission"
+                :key="index"
+              >
+                <template #addonBefore>{{ item.roleName }}</template>
+                <template #addonAfter>元</template>
+              </a-input>
+            </a-space>
+          </a-form-item>
           <template v-if="form.type === 1 || merchantId">
             <a-form-item label="可用日期">
               <a-select v-model:value="canUseDate" mode="multiple">
@@ -639,7 +451,7 @@
                   v-for="(item, index) in dayList"
                   :key="index"
                   :value="index"
-                  >{{ item }}
+                >{{ item }}
                 </a-select-option>
               </a-select>
             </a-form-item>
@@ -651,11 +463,12 @@
                     :key="item"
                     closable
                     @close="onDeleteEnsureTag(item)"
-                    >{{ item }}
+                  >{{ item }}
                   </a-tag>
                   <a-input v-model:value="ensureTagItem"></a-input>
                   <a-button @click="addEnsureTag()" :disabled="!ensureTagItem"
-                    >添加</a-button
+                  >添加
+                  </a-button
                   >
                 </a-space>
               </div>
@@ -689,869 +502,1439 @@
         </a-tab-pane>
       </a-tabs>
     </a-form>
-  </ele-modal>
+  </a-drawer>
+  <!-- 文件库选择弹窗 -->
+  <SelectData
+    v-model:visible="showFileSelector"
+    title="选择图片"
+    type="image"
+    class="file-selector-modal"
+    @done="onFileSelected"
+  />
+
+  <!-- 视频库选择弹窗 -->
+  <SelectData
+    v-model:visible="showVideoSelector"
+    title="选择视频"
+    type="video"
+    class="file-selector-modal"
+    @done="onVideoSelected"
+  />
+
 </template>
 
 <script lang="ts" setup>
-  import {
-    CloseCircleOutlined,
-    DeleteOutlined,
-    UploadOutlined
-  } from '@ant-design/icons-vue';
-  import { ref, reactive, watch } from 'vue';
-  import { Form, message } from 'ant-design-vue';
-  import { assignObject, messageLoading, uuid } from 'ele-admin-pro';
-  import { addShopGoods, updateShopGoods } from '@/api/shop/shopGoods';
-  import { ShopGoods } from '@/api/shop/shopGoods/model';
-  import { useThemeStore } from '@/store/modules/theme';
-  import { storeToRefs } from 'pinia';
-  import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
-  import { FormInstance, RuleObject } from 'ant-design-vue/es/form';
-  import { FileRecord } from '@/api/system/file/model';
-  import { ShopMerchant } from '@/api/shop/shopMerchant/model';
-  import TinymceEditor from '@/components/TinymceEditor/index.vue';
-  import { uploadFile, uploadOss } from '@/api/system/file';
-  import { ShopSpecValue } from '@/api/shop/shopSpecValue/model';
-  import { ShopSpec } from '@/api/shop/shopSpec/model';
-  import { ShopGoodsSku } from '@/api/shop/shopGoodsSku/model';
-  import { ShopGoodsSpec } from '@/api/shop/shopGoodsSpec/model';
-  import { generateGoodsSku, listShopGoodsSku } from '@/api/shop/shopGoodsSku';
-  import { listShopGoodsSpec } from '@/api/shop/shopGoodsSpec';
-  import { ShopGoodsCategory } from '@/api/shop/shopGoodsCategory/model';
-  import { listShopGoodsCategory } from '@/api/shop/shopGoodsCategory';
-  import { getMerchantId } from '@/utils/merchant';
-  import { ShopExpressTemplate } from '@/api/shop/shopExpressTemplate/model';
-  import { listShopExpressTemplate } from '@/api/shop/shopExpressTemplate';
-  import { listShopCommissionRole } from '@/api/shop/shopCommissionRole';
-  import { listShopGoodsRoleCommission } from '@/api/shop/shopGoodsRoleCommission';
-
-  // 是否是修改
-  const isUpdate = ref(false);
-  const useForm = Form.useForm;
-  // 是否开启响应式布局
-  const themeStore = useThemeStore();
-  const { styleResponsive } = storeToRefs(themeStore);
-
-  const props = defineProps<{
-    // 弹窗是否打开
-    visible: boolean;
-    // 修改回显的数据
-    data?: ShopGoods | null;
-  }>();
-
-  const emit = defineEmits<{
-    (e: 'done'): void;
-    (e: 'update:visible', visible: boolean): void;
-  }>();
-
-  // 提交状态
-  const loading = ref(false);
-  // 是否显示最大化切换按钮
-  const maxable = ref(true);
-  // 表格选中数据
-  const formRef = ref<FormInstance | null>(null);
-  const images = ref<ItemType[]>([]);
-  const content = ref('');
-  const disabled = ref(false);
-  // 当前选项卡
-  const active = ref('base');
-
-  const spec = ref<ShopSpecValue[]>([]);
-  const showSpecForm = ref(false);
-  const name = ref();
-  const value = ref();
-  const skuList = ref<ShopGoodsSku[]>([]);
-  const files = ref<ItemType[]>([]);
-  const goodsSpec = ref<ShopGoodsSpec>();
-  const category = ref<string[]>([]);
-  const takeaway = ref<ShopGoodsCategory[]>([]);
-  const merchantId = getMerchantId();
-
-  const columns = [
+import {
+  CloseCircleOutlined,
+  DeleteOutlined,
+  UploadOutlined
+} from '@ant-design/icons-vue';
+import {ref, reactive, watch} from 'vue';
+import {Form, message} from 'ant-design-vue';
+import {assignObject, messageLoading, uuid} from 'ele-admin-pro';
+import {addShopGoods, updateShopGoods} from '@/api/shop/shopGoods';
+import {ShopGoods} from '@/api/shop/shopGoods/model';
+import {useThemeStore} from '@/store/modules/theme';
+import {storeToRefs} from 'pinia';
+import {ItemType} from 'ele-admin-pro/es/ele-image-upload/types';
+import {FormInstance, RuleObject} from 'ant-design-vue/es/form';
+import {FileRecord} from '@/api/system/file/model';
+import {ShopMerchant} from '@/api/shop/shopMerchant/model';
+import TinymceEditor from '@/components/TinymceEditor/index.vue';
+import {uploadFile, uploadOss} from '@/api/system/file';
+import {ShopSpecValue} from '@/api/shop/shopSpecValue/model';
+import {ShopSpec} from '@/api/shop/shopSpec/model';
+import {ShopGoodsSku} from '@/api/shop/shopGoodsSku/model';
+import {ShopGoodsSpec} from '@/api/shop/shopGoodsSpec/model';
+import {generateGoodsSku, listShopGoodsSku} from '@/api/shop/shopGoodsSku';
+import {listShopGoodsSpec} from '@/api/shop/shopGoodsSpec';
+import {ShopGoodsCategory} from '@/api/shop/shopGoodsCategory/model';
+import {getMerchantId} from '@/utils/merchant';
+import {ShopExpressTemplate} from '@/api/shop/shopExpressTemplate/model';
+import {listShopExpressTemplate} from '@/api/shop/shopExpressTemplate';
+import {listShopCommissionRole} from '@/api/shop/shopCommissionRole';
+import {listShopGoodsRoleCommission} from '@/api/shop/shopGoodsRoleCommission';
+import {CmsNavigation} from "@/api/cms/cmsNavigation/model";
+import SelectData from "@/components/SelectFile/components/select-data.vue";
+
+// 是否是修改
+const isUpdate = ref(false);
+const useForm = Form.useForm;
+// 是否开启响应式布局
+const themeStore = useThemeStore();
+const {styleResponsive} = storeToRefs(themeStore);
+
+const props = defineProps<{
+  // 弹窗是否打开
+  visible: boolean;
+  // 修改回显的数据
+  data?: ShopGoods | null;
+  // 栏目数据
+  navigationList?: CmsNavigation[];
+}>();
+
+const emit = defineEmits<{
+  (e: 'done'): void;
+  (e: 'update:visible', visible: boolean): void;
+}>();
+
+// 提交状态
+const loading = ref(false);
+// 是否显示最大化切换按钮
+const maxable = ref(true);
+// 表格选中数据
+const formRef = ref<FormInstance | null>(null);
+const images = ref<ItemType[]>([]);
+const content = ref('');
+// 编辑器类型
+const editor = ref<number>(1);
+const disabled = ref(false);
+// 当前选项卡
+const active = ref('base');
+
+const spec = ref<ShopSpecValue[]>([]);
+const showSpecForm = ref(false);
+const name = ref();
+const value = ref();
+const skuList = ref<ShopGoodsSku[]>([]);
+const files = ref<ItemType[]>([]);
+const goodsSpec = ref<ShopGoodsSpec>();
+const category = ref<string[]>([]);
+const takeaway = ref<ShopGoodsCategory[]>([]);
+const merchantId = getMerchantId();
+
+const columns = [
+  {
+    title: '图片',
+    dataIndex: 'image',
+    key: 'image',
+    align: 'center'
+  },
+  {
+    title: 'SKU',
+    dataIndex: 'sku',
+    align: 'center'
+  },
+  {
+    title: '商品价格',
+    dataIndex: 'price',
+    key: 'price',
+    align: 'center'
+  },
+  {
+    title: '进货价',
+    dataIndex: 'buyingPrice',
+    key: 'buyingPrice',
+    align: 'center'
+  },
+  {
+    title: '团长价',
+    dataIndex: 'dealerPrice',
+    key: 'dealerPrice',
+    align: 'center'
+  },
+  {
+    title: '直推收益分配(元)',
+    dataIndex: 'memberStoreCommission',
+    key: 'memberStoreCommission',
+    align: 'center'
+  },
+  {
+    title: '仓储费(元)',
+    dataIndex: 'supplierCommission',
+    key: 'supplierCommission',
+    align: 'center'
+  },
+  {
+    title: '商品编号',
+    dataIndex: 'skuNo',
+    key: 'skuNo',
+    align: 'center'
+  }
+];
+
+const dayList = ['周一', '周二', '周三', '周四', '周五', '周六', '周日'];
+const canUseDate = ref([]);
+const ensureTag = ref<string[]>([]);
+const ensureTagItem = ref('');
+const addEnsureTag = (item = '') => {
+  const tag = item || ensureTagItem.value;
+  if (ensureTag.value.findIndex((item) => item === tag) !== -1)
+    return message.error('请勿重复添加');
+  ensureTag.value.push(tag);
+  ensureTagItem.value = '';
+};
+
+// 选择栏目
+const onCategoryId = (id: number) => {
+  form.categoryId = id;
+  // 💾 在新增模式下，用户手动选择栏目时也保存到本地存储
+  if (!isUpdate.value && id) {
+    saveLastCategory(id);
+  }
+};
+
+// �💾 保存和恢复栏目选择的功能
+const LAST_CATEGORY_KEY = 'cms_article_last_category';
+
+// 保存最后选择的栏目到本地存储
+const saveLastCategory = (categoryId: number | undefined) => {
+  if (categoryId) {
+    localStorage.setItem(LAST_CATEGORY_KEY, categoryId.toString());
+  }
+};
+
+// 从本地存储获取最后选择的栏目
+const getLastCategory = (): number | undefined => {
+  const saved = localStorage.getItem(LAST_CATEGORY_KEY);
+  return saved ? parseInt(saved) : undefined;
+};
+
+const onDeleteEnsureTag = (tag: string) => {
+  const index = ensureTag.value.findIndex((item) => item === tag);
+  ensureTag.value.splice(index, 1);
+};
+
+// 从文件库选择图片的回调
+const onFileSelected = (data: FileRecord) => {
+  if (fileSelectCallback.value) {
+    // 使用文件的完整URL，确保有值
+    const imageUrl = data.url || data.path || '';
+    if (imageUrl) {
+      fileSelectCallback.value(imageUrl);
+      message.success('图片插入成功');
+    }
+    fileSelectCallback.value = null;
+  }
+  showFileSelector.value = false;
+};
+
+// 从视频库选择视频的回调
+const onVideoSelected = (data: FileRecord) => {
+  if (videoSelectCallback.value) {
+    // 使用文件的完整URL，确保有值
+    const videoUrl = data.path || data.downloadUrl || '';
+    if (videoUrl) {
+      videoSelectCallback.value(videoUrl);
+      message.success('视频插入成功');
+    }
+    videoSelectCallback.value = null;
+  }
+  showVideoSelector.value = false;
+};
+
+// 🎨 智能一键排版 - 人性化设计
+const handleAutoFormat = (editor: any) => {
+  try {
+    // 1. 检查内容
+    const content = editor.getContent();
+    if (!content || content.trim() === '' || content === '<p><br></p>' || content === '<p></p>') {
+      message.warning({
+        content: '📝 请先输入一些内容，然后再使用一键排版功能',
+        duration: 3
+      });
+      return;
+    }
+
+    // 2. 显示友好的加载提示
+    const loadingMsg = message.loading({
+      content: '✨ 正在为您的文章进行智能排版优化...',
+      duration: 0
+    });
+
+    // 3. 延迟执行，让用户看到加载效果
+    setTimeout(() => {
+      try {
+        const optimizedContent = smartFormatContent(content);
+        editor.setContent(optimizedContent);
+
+        loadingMsg();
+
+        // 4. 显示成功提示
+        message.success({
+          content: '🎉 排版优化完成！您的文章现在看起来更专业了',
+          duration: 4
+        });
+
+        // 5. 可选：显示优化统计
+        showOptimizationStats(content, optimizedContent);
+
+      } catch (error) {
+        loadingMsg();
+        console.error('排版优化失败:', error);
+        message.error({
+          content: '😅 排版优化遇到了问题，请检查文章内容后重试',
+          duration: 4
+        });
+      }
+    }, 800); // 给用户一个良好的反馈体验
+
+  } catch (error) {
+    console.error('一键排版功能错误:', error);
+    message.error({
+      content: '🔧 功能暂时不可用，请刷新页面后重试',
+      duration: 4
+    });
+  }
+};
+
+// 📊 显示优化统计信息
+const showOptimizationStats = (originalContent: string, optimizedContent: string) => {
+  const stats = analyzeOptimization(originalContent, optimizedContent);
+
+  if (stats.optimizations.length > 0) {
+    message.info({
+      content: `📈 本次优化: ${stats.optimizations.join('、')}`,
+      duration: 6
+    });
+  }
+};
+
+// 🔍 分析优化效果
+const analyzeOptimization = (original: string, optimized: string) => {
+  const optimizations: string[] = [];
+
+  // 检查各种优化项目
+  if ((optimized.match(/<h[1-6][^>]*style/g) || []).length > (original.match(/<h[1-6][^>]*style/g) || []).length) {
+    optimizations.push('标题样式');
+  }
+
+  if ((optimized.match(/<p[^>]*style/g) || []).length > (original.match(/<p[^>]*style/g) || []).length) {
+    optimizations.push('段落格式');
+  }
+
+  if ((optimized.match(/<img[^>]*style/g) || []).length > (original.match(/<img[^>]*style/g) || []).length) {
+    optimizations.push('图片布局');
+  }
+
+  if ((optimized.match(/<ul[^>]*style|<ol[^>]*style/g) || []).length > (original.match(/<ul[^>]*style|<ol[^>]*style/g) || []).length) {
+    optimizations.push('列表格式');
+  }
+
+  return {optimizations};
+};
+
+// 🎨 智能排版核心函数 - 简单而强大
+const smartFormatContent = (content: string): string => {
+  let optimized = content;
+
+  // 1. 🏷️ 标题优化 - 让标题更有层次感
+  optimized = optimized.replace(/<h1([^>]*)>/g, '<h1$1 style="font-size: 28px; font-weight: 700; margin: 24px 0 16px 0; line-height: 1.3; color: #1a1a1a; border-bottom: 2px solid #e8e8e8; padding-bottom: 10px;">');
+  optimized = optimized.replace(/<h2([^>]*)>/g, '<h2$1 style="font-size: 24px; font-weight: 600; margin: 20px 0 14px 0; line-height: 1.4; color: #2c2c2c;">');
+  optimized = optimized.replace(/<h3([^>]*)>/g, '<h3$1 style="font-size: 20px; font-weight: 600; margin: 18px 0 12px 0; line-height: 1.4; color: #3c3c3c;">');
+  optimized = optimized.replace(/<h4([^>]*)>/g, '<h4$1 style="font-size: 16px; font-weight: 600; margin: 14px 0 8px 0; line-height: 1.4; color: #4c4c4c;">');
+  optimized = optimized.replace(/<h5([^>]*)>/g, '<h5$1 style="font-size: 14px; font-weight: 600; margin: 12px 0 6px 0; line-height: 1.4; color: #5c5c5c;">');
+  optimized = optimized.replace(/<h6([^>]*)>/g, '<h6$1 style="font-size: 13px; font-weight: 600; margin: 10px 0 5px 0; line-height: 1.4; color: #6c6c6c;">');
+
+  // 2. 📝 段落优化 - 让阅读更舒适
+  optimized = optimized.replace(/<p([^>]*)>/g, (match, attrs) => {
+    if (!attrs.includes('style=')) {
+      return `<p${attrs} style="line-height: 1.8; margin: 16px 0; text-indent: 2em; color: #333;">`;
+    }
+    return match;
+  });
+
+  // 3. 🖼️ 图片优化 - 让图片更美观
+  optimized = optimized.replace(/<img([^>]*?)>/g, (match, attrs) => {
+    if (!attrs.includes('style=')) {
+      const hasAlt = attrs.includes('alt=');
+      return `<img${attrs} style="max-width: 100%; height: auto; margin: 20px auto; display: block; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,0.1);"${!hasAlt ? ' alt="图片"' : ''}>`;
+    }
+    return match;
+  });
+
+  // 4. 📋 列表优化 - 让列表更清晰
+  optimized = optimized.replace(/<ul([^>]*)>/g, '<ul$1 style="margin: 16px 0; padding-left: 24px; line-height: 1.6;">');
+  optimized = optimized.replace(/<ol([^>]*)>/g, '<ol$1 style="margin: 16px 0; padding-left: 24px; line-height: 1.6;">');
+  optimized = optimized.replace(/<li([^>]*)>/g, '<li$1 style="margin: 8px 0; color: #333;">');
+
+  // 5. 💬 引用优化 - 让引用更突出
+  optimized = optimized.replace(/<blockquote([^>]*)>/g, '<blockquote$1 style="margin: 20px 0; padding: 16px 20px; border-left: 4px solid #1890ff; background: linear-gradient(90deg, #f6f8fa 0%, #ffffff 100%); font-style: italic; color: #555;">');
+
+  // 6. 💻 代码优化 - 让代码更专业
+  optimized = optimized.replace(/<code([^>]*)>/g, '<code$1 style="background-color: #f1f3f4; padding: 2px 6px; border-radius: 4px; font-family: \'Fira Code\', Consolas, Monaco, monospace; font-size: 0.9em; color: #d73a49;">');
+  optimized = optimized.replace(/<pre([^>]*)>/g, '<pre$1 style="margin: 20px 0; padding: 20px; background-color: #f8f9fa; border: 1px solid #e9ecef; border-radius: 8px; overflow-x: auto; font-family: \'Fira Code\', Consolas, Monaco, monospace; font-size: 14px; line-height: 1.5;">');
+
+  // 7. 📊 表格优化 - 让表格更美观
+  optimized = optimized.replace(/<table([^>]*)>/g, '<table$1 style="width: 100%; border-collapse: collapse; margin: 20px 0; box-shadow: 0 2px 8px rgba(0,0,0,0.1); border-radius: 8px; overflow: hidden;">');
+  optimized = optimized.replace(/<th([^>]*)>/g, '<th$1 style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 12px; text-align: left; font-weight: 600;">');
+  optimized = optimized.replace(/<td([^>]*)>/g, '<td$1 style="padding: 12px; border-bottom: 1px solid #eee; color: #333;">');
+
+  // 8. 🔗 链接优化 - 让链接更友好
+  optimized = optimized.replace(/<a([^>]*)>/g, '<a$1 style="color: #1890ff; text-decoration: none; border-bottom: 1px solid transparent; transition: border-bottom 0.2s ease;" onmouseover="this.style.borderBottom=\'1px solid #1890ff\'" onmouseout="this.style.borderBottom=\'1px solid transparent\'">');
+
+  // 9. ➖ 分隔线优化 - 让分隔线更优雅
+  optimized = optimized.replace(/<hr([^>]*)>/g, '<hr$1 style="border: none; height: 2px; background: linear-gradient(90deg, transparent, #e8e8e8, transparent); margin: 30px 0;">');
+
+  // 10. 🧹 清理多余空白
+  optimized = optimized.replace(/\s+/g, ' '); // 清理多余空格
+  optimized = optimized.replace(/<p[^>]*>\s*<\/p>/g, ''); // 清理空段落
+  optimized = optimized.replace(/(<\/[^>]+>)\s+(<[^>]+>)/g, '$1$2'); // 清理标签间空白
+
+  return optimized;
+};
+
+// 🔄 段落首行缩进切换功能
+const toggleParagraphIndent = (editor: any) => {
+  try {
+    const content = editor.getContent();
+
+    if (!content || content.trim() === '' || content === '<p><br></p>' || content === '<p></p>') {
+      message.warning({
+        content: '📝 请先输入一些段落内容，然后再切换首行缩进',
+        duration: 3
+      });
+      return;
+    }
+
+    // 检查当前是否有首行缩进
+    const hasIndent = content.includes('text-indent: 2em') || content.includes('text-indent:2em');
+
+    let newContent: string;
+    let actionText: string;
+
+    if (hasIndent) {
+      // 移除首行缩进
+      newContent = removeIndentFromParagraphs(content);
+      actionText = '已移除段落首行缩进';
+    } else {
+      // 添加首行缩进
+      newContent = addIndentToParagraphs(content);
+      actionText = '已添加段落首行缩进';
+    }
+
+    editor.setContent(newContent);
+
+    message.success({
+      content: `📐 ${actionText}`,
+      duration: 3
+    });
+
+  } catch (error) {
+    console.error('首行缩进切换失败:', error);
+    message.error({
+      content: '🔧 首行缩进切换失败，请重试',
+      duration: 3
+    });
+  }
+};
+
+// 为段落添加首行缩进
+const addIndentToParagraphs = (content: string): string => {
+  return content.replace(/<p([^>]*)>/g, (match, attrs) => {
+    // 如果已经有 style 属性
+    if (attrs.includes('style=')) {
+      // 检查是否已经有 text-indent
+      if (attrs.includes('text-indent')) {
+        // 更新现有的 text-indent
+        return match.replace(/text-indent:\s*[^;]+;?/g, 'text-indent: 2em;');
+      } else {
+        // 在现有 style 中添加 text-indent
+        return match.replace(/style="([^"]*)"/, 'style="$1 text-indent: 2em;"');
+      }
+    } else {
+      // 添加新的 style 属性
+      return `<p${attrs} style="text-indent: 2em;">`;
+    }
+  });
+};
+
+// 从段落移除首行缩进
+const removeIndentFromParagraphs = (content: string): string => {
+  return content.replace(/<p([^>]*)>/g, (match, attrs) => {
+    if (attrs.includes('text-indent')) {
+      // 移除 text-indent 属性
+      let newAttrs = attrs.replace(/text-indent:\s*[^;]+;?\s*/g, '');
+
+      // 如果 style 属性变空了，移除整个 style 属性
+      newAttrs = newAttrs.replace(/style="\s*"/g, '');
+      newAttrs = newAttrs.replace(/style=''\s*/g, '');
+
+      return `<p${newAttrs}>`;
+    }
+    return match;
+  });
+};
+
+// 用户信息
+const form = reactive<ShopGoods>({
+  goodsId: undefined,
+  type: 1,
+  code: undefined,
+  name: undefined,
+  goodsName: undefined,
+  image: undefined,
+  video: undefined,
+  content: undefined,
+  canExpress: 1,
+  unitName: '',
+  categoryId: undefined,
+  parentName: undefined,
+  categoryName: undefined,
+  specs: 0,
+  commissionRole: 0,
+  position: undefined,
+  price: undefined,
+  originPrice: undefined,
+  salePrice: undefined,
+  buyingPrice: undefined,
+  dealerPrice: undefined,
+  priceGift: undefined,
+  dealerGift: undefined,
+  priceGiftNum: undefined,
+  priceGiftName: undefined,
+  dealerGiftNum: undefined,
+  files: undefined,
+  sales: 0,
+  isNew: 0,
+  gainIntegral: 0,
+  goodsWeight: undefined,
+  recommend: undefined,
+  merchantId: undefined,
+  merchantName: undefined,
+  supplierMerchantId: undefined,
+  supplierName: undefined,
+  chainStorePrice: undefined,
+  memberStorePrice: undefined,
+  memberMarketPrice: undefined,
+  chainStoreRate: undefined,
+  memberStoreRate: undefined,
+  memberMarketRate: undefined,
+  memberStoreCommission: undefined,
+  supplierCommission: undefined,
+  coopCommission: undefined,
+  expressTemplateId: undefined,
+  canUseDate: undefined,
+  ensureTag: undefined,
+  expiredDay: undefined,
+  stock: 1000,
+  deductStockType: 20,
+  isShow: undefined,
+  status: 0,
+  comments: '',
+  sortNumber: 100,
+  specName: '',
+  goodsRoleCommission: []
+});
+
+/* 更新visible */
+const updateVisible = (value: boolean) => {
+  emit('update:visible', value);
+};
+
+// 表单验证规则
+const rules = reactive({
+  type: [
+    {
+      required: true,
+      message: '请选择商品类型',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  image: [
+    {
+      required: true,
+      message: '请上传图片',
+      type: 'string',
+      trigger: 'blur'
+    }
+  ],
+  files: [
+    {
+      required: true,
+      message: '请上传轮播图',
+      type: 'string',
+      trigger: 'blur',
+      validator: async (_rule: RuleObject, value: string) => {
+        if (form.files?.length == 0) {
+          return Promise.reject('选择上传轮播图');
+        }
+        return Promise.resolve();
+      }
+    }
+  ],
+  specs: [
     {
-      title: '图片',
-      dataIndex: 'image',
-      key: 'image',
-      align: 'center'
-    },
+      required: true,
+      message: '请选择规格类型',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  price: [
     {
-      title: 'SKU',
-      dataIndex: 'sku',
-      align: 'center'
-    },
+      required: true,
+      message: '请填写会员价',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  salePrice: [
     {
-      title: '市场价',
-      dataIndex: 'salePrice',
-      key: 'salePrice',
-      align: 'center'
-    },
+      required: true,
+      message: '请填写市场价',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  buyingPrice: [
     {
-      title: '会员价',
-      dataIndex: 'price',
-      key: 'price',
-      align: 'center'
-    },
+      required: true,
+      message: '请填写会员店/总仓批发价',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  stock: [
     {
-      title: '会员店/总仓批发价',
-      dataIndex: 'buyingPrice',
-      key: 'buyingPrice',
-      align: 'center'
-    },
+      required: true,
+      message: '请填写商品库存',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  // supplierMerchantId: [
+  //   {
+  //     required: true,
+  //     message: '请选择供应商',
+  //     type: 'number',
+  //     trigger: 'blur'
+  //   }
+  // ],
+  // categoryId: [
+  //   {
+  //     required: true,
+  //     type: 'string',
+  //     message: '选择商品分类',
+  //     trigger: 'blur',
+  //     validator: async (_rule: RuleObject, value: string) => {
+  //       if (!form.categoryId) {
+  //         return Promise.reject('选择商品分类');
+  //       }
+  //       return Promise.resolve();
+  //     }
+  //   }
+  // ],
+  name: [
     {
-      title: '供应价',
-      dataIndex: 'chainStorePrice',
-      key: 'chainStorePrice',
-      align: 'center'
-    },
+      required: true,
+      message: '请选择商品名称',
+      type: 'string',
+      trigger: 'blur'
+    }
+  ],
+  goodsName: [
     {
-      title: '直推收益分配(元)',
-      dataIndex: 'memberStoreCommission',
-      key: 'memberStoreCommission',
-      align: 'center'
-    },
+      required: true,
+      message: '请选择商品名称',
+      type: 'string',
+      trigger: 'blur'
+    }
+  ],
+  sortNumber: [
     {
-      title: '仓储费(元)',
-      dataIndex: 'supplierCommission',
-      key: 'supplierCommission',
-      align: 'center'
-    },
+      required: true,
+      message: '请输入排序号',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  chainStorePrice: [
     {
-      title: '商品编号',
-      dataIndex: 'skuNo',
-      key: 'skuNo',
-      align: 'center'
+      required: true,
+      message: '请输入供应价',
+      type: 'number',
+      trigger: 'blur'
     }
-  ];
+  ],
+  memberStorePrice: [
+    {
+      required: true,
+      message: '请输入会员店价格',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  memberMarketPrice: [
+    {
+      required: true,
+      message: '请输入会员超市价格',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  memberStoreCommission: [
+    {
+      required: true,
+      message: '请输入直推收益分配',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  supplierCommission: [
+    {
+      required: true,
+      message: '请输入仓储费',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ]
+});
 
-  const dayList = ['周一', '周二', '周三', '周四', '周五', '周六', '周日'];
-  const canUseDate = ref([]);
-  const ensureTag = ref<string[]>([]);
-  const ensureTagItem = ref('');
-  const addEnsureTag = (item = '') => {
-    const tag = item || ensureTagItem.value;
-    if (ensureTag.value.findIndex((item) => item === tag) !== -1)
-      return message.error('请勿重复添加');
-    ensureTag.value.push(tag);
-    ensureTagItem.value = '';
-  };
+const onType = (index: number) => {
+  form.type = index;
+};
 
-  const onDeleteEnsureTag = (tag: string) => {
-    const index = ensureTag.value.findIndex((item) => item === tag);
-    ensureTag.value.splice(index, 1);
-  };
+/* 搜索 */
+const chooseMerchantId = (item: ShopMerchant) => {
+  form.merchantName = item.merchantName;
+  form.merchantId = item.merchantId;
+};
+
+const clearMerchant = () => {
+  form.merchantName = '';
+  form.merchantId = 0;
+};
+
+const chooseSupplier = (item: ShopMerchant) => {
+  form.supplierName = item.merchantName;
+  form.supplierMerchantId = item.merchantId;
+};
+
+const chooseGoodsCategory = (item: ShopGoodsCategory, value: any) => {
+  form.categoryId = value[1].value;
+  form.parentName = value[0].label;
+  form.categoryName = value[1].label;
+};
+const chooseTakeawayCategory = (item: ShopGoodsCategory, value: any) => {
+  form.categoryParent = '店铺分类';
+  form.categoryChildren = value[0].label;
+  form.categoryId = item[0];
+};
 
-  // 用户信息
-  const form = reactive<ShopGoods>({
-    goodsId: undefined,
-    type: 1,
-    code: undefined,
-    name: undefined,
-    goodsName: undefined,
-    image: undefined,
-    video: undefined,
-    content: undefined,
-    canExpress: 1,
-    unitName: '',
-    categoryId: undefined,
-    parentName: undefined,
-    categoryName: undefined,
-    specs: 0,
-    commissionRole: 0,
-    position: undefined,
-    price: undefined,
-    originPrice: undefined,
-    salePrice: undefined,
-    buyingPrice: undefined,
-    dealerPrice: undefined,
-    priceGift: undefined,
-    dealerGift: undefined,
-    priceGiftNum: undefined,
-    priceGiftName: undefined,
-    dealerGiftNum: undefined,
-    files: undefined,
-    sales: 0,
-    isNew: 0,
-    gainIntegral: 0,
-    goodsWeight: undefined,
-    recommend: undefined,
-    merchantId: undefined,
-    merchantName: undefined,
-    supplierMerchantId: undefined,
-    supplierName: undefined,
-    chainStorePrice: undefined,
-    memberStorePrice: undefined,
-    memberMarketPrice: undefined,
-    chainStoreRate: undefined,
-    memberStoreRate: undefined,
-    memberMarketRate: undefined,
-    memberStoreCommission: undefined,
-    supplierCommission: undefined,
-    coopCommission: undefined,
-    expressTemplateId: undefined,
-    canUseDate: undefined,
-    ensureTag: undefined,
-    expiredDay: undefined,
-    stock: 1000,
-    deductStockType: 20,
-    isShow: undefined,
-    status: 0,
-    comments: '',
-    sortNumber: 100,
-    specName: '',
-    goodsRoleCommission: []
+const chooseImage = (data: FileRecord) => {
+  images.value.push({
+    uid: data.id,
+    url: data.path,
+    status: 'done'
   });
+  form.image = data.path;
+};
 
-  /* 更新visible */
-  const updateVisible = (value: boolean) => {
-    emit('update:visible', value);
-  };
+const chooseSkuImage = (data: FileRecord) => {
+  const index = data?.index;
+  skuList.value[index].images?.push({
+    uid: uuid(),
+    url: data.path,
+    status: 'done'
+  });
+  skuList.value[index].image = data.path;
+};
 
-  // 表单验证规则
-  const rules = reactive({
-    type: [
-      {
-        required: true,
-        message: '请选择商品类型',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    image: [
-      {
-        required: true,
-        message: '请上传图片',
-        type: 'string',
-        trigger: 'blur'
-      }
-    ],
-    files: [
-      {
-        required: true,
-        message: '请上传轮播图',
-        type: 'string',
-        trigger: 'blur',
-        validator: async (_rule: RuleObject, value: string) => {
-          if (form.files?.length == 0) {
-            return Promise.reject('选择上传轮播图');
+const onDeleteSkuItem = (index: number) => {
+  images.value.splice(index, 1);
+};
+
+const videos = ref<ItemType[]>([]);
+const chooseVideo = (data: FileRecord) => {
+  videos.value = [
+    {
+      uid: uuid(),
+      url: data.path,
+      status: 'done'
+    }
+  ];
+  form.video = data.path;
+};
+
+const onDeleteVideo = (index: number) => {
+  images.value.splice(index, 1);
+  form.video = undefined;
+};
+
+const onChange = (text: string) => {
+  // 加载商品多规格
+  if (text == 'spec') {
+    const goodsId = props.data?.goodsId;
+    if (goodsId) {
+      listShopGoodsSpec({goodsId}).then((data) => {
+        if (data.length > 0) {
+          const specValue = data[0].specValue;
+          if (specValue) {
+            spec.value = JSON.parse(specValue).map((d) => {
+              console.log(d);
+              return {
+                value: d.value,
+                detail: d.detail
+              };
+            });
           }
-          return Promise.resolve();
+          console.log(spec.value);
         }
-      }
-    ],
-    specs: [
-      {
-        required: true,
-        message: '请选择规格类型',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    price: [
-      {
-        required: true,
-        message: '请填写会员价',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    salePrice: [
-      {
-        required: true,
-        message: '请填写市场价',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    buyingPrice: [
-      {
-        required: true,
-        message: '请填写会员店/总仓批发价',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    stock: [
-      {
-        required: true,
-        message: '请填写商品库存',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    // supplierMerchantId: [
-    //   {
-    //     required: true,
-    //     message: '请选择供应商',
-    //     type: 'number',
-    //     trigger: 'blur'
-    //   }
-    // ],
-    // categoryId: [
-    //   {
-    //     required: true,
-    //     type: 'string',
-    //     message: '选择商品分类',
-    //     trigger: 'blur',
-    //     validator: async (_rule: RuleObject, value: string) => {
-    //       if (!form.categoryId) {
-    //         return Promise.reject('选择商品分类');
-    //       }
-    //       return Promise.resolve();
-    //     }
-    //   }
-    // ],
-    name: [
-      {
-        required: true,
-        message: '请选择商品名称',
-        type: 'string',
-        trigger: 'blur'
-      }
-    ],
-    goodsName: [
-      {
-        required: true,
-        message: '请选择商品名称',
-        type: 'string',
-        trigger: 'blur'
-      }
-    ],
-    sortNumber: [
-      {
-        required: true,
-        message: '请输入排序号',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    chainStorePrice: [
-      {
-        required: true,
-        message: '请输入供应价',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    memberStorePrice: [
-      {
-        required: true,
-        message: '请输入会员店价格',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    memberMarketPrice: [
-      {
-        required: true,
-        message: '请输入会员超市价格',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    memberStoreCommission: [
-      {
-        required: true,
-        message: '请输入直推收益分配',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ],
-    supplierCommission: [
-      {
-        required: true,
-        message: '请输入仓储费',
-        type: 'number',
-        trigger: 'blur'
-      }
-    ]
+      });
+      listShopGoodsSku({goodsId}).then((data) => {
+        skuList.value = data;
+      });
+    }
+  }
+};
+
+const onDeleteItem = (index: number) => {
+  images.value.splice(index, 1);
+  form.image = '';
+};
+
+const onClose = (index) => {
+  spec.value.splice(index, 1);
+};
+
+const openSpecForm = () => {
+  showSpecForm.value = !showSpecForm.value;
+};
+
+const onSpec = (row: ShopSpec) => {
+  form.specName = row.specName;
+  goodsSpec.value = row;
+  if (row.specValue) {
+    spec.value = JSON.parse(row?.specValue);
+  }
+};
+
+// 新增规格
+const addSpecValue = () => {
+  if (!name.value || !value.value) {
+    message.error(`请输入规格和规格值`);
+    return false;
+  }
+  const findIndex = spec.value.findIndex((d) => d.value == name.value);
+  if (findIndex == 0) {
+    message.error(`${name.value}已存在)`);
+    return false;
+  }
+  spec.value.push({
+    value: name.value,
+    detail: [value.value]
   });
+  name.value = '';
+  value.value = '';
+  openSpecForm();
+};
 
-  const onType = (index: number) => {
-    form.type = index;
-  };
+const chooseFile = (data: FileRecord) => {
+  files.value.push({
+    uid: data.id,
+    url: data.path,
+    status: 'done'
+  });
+};
 
-  /* 搜索 */
-  const chooseMerchantId = (item: ShopMerchant) => {
-    form.merchantName = item.merchantName;
-    form.merchantId = item.merchantId;
-  };
+const onDeleteFile = (index: number) => {
+  files.value.splice(index, 1);
+};
 
-  const clearMerchant = () => {
-    form.merchantName = '';
-    form.merchantId = 0;
-  };
+/**
+ * 生成商品SKU列表
+ */
+const generateSku = () => {
+  generateGoodsSku(spec.value).then((data) => {
+    if (data) {
+      skuList.value = data;
+    }
+  });
+};
 
-  const chooseSupplier = (item: ShopMerchant) => {
-    form.supplierName = item.merchantName;
-    form.supplierMerchantId = item.merchantId;
-  };
 
-  const chooseGoodsCategory = (item: ShopGoodsCategory, value: any) => {
-    form.categoryId = value[1].value;
-    form.parentName = value[0].label;
-    form.categoryName = value[1].label;
-  };
-  const chooseTakeawayCategory = (item: ShopGoodsCategory, value: any) => {
-    form.categoryParent = '店铺分类';
-    form.categoryChildren = value[0].label;
-    form.categoryId = item[0];
-  };
+const editorRef = ref<InstanceType<typeof TinymceEditor> | null>(null);
 
-  const chooseImage = (data: FileRecord) => {
-    images.value.push({
-      uid: data.id,
-      url: data.path,
-      status: 'done'
-    });
-    form.image = data.path;
-  };
+// 文件库选择弹窗状态
+const showFileSelector = ref(false);
+const fileSelectCallback = ref<((url: string) => void) | null>(null);
 
-  const chooseSkuImage = (data: FileRecord) => {
-    const index = data?.index;
-    skuList.value[index].images?.push({
-      uid: uuid(),
-      url: data.path,
-      status: 'done'
-    });
-    skuList.value[index].image = data.path;
-  };
+// 视频库选择弹窗状态
+const showVideoSelector = ref(false);
+const videoSelectCallback = ref<((url: string) => void) | null>(null);
 
-  const onDeleteSkuItem = (index: number) => {
-    images.value.splice(index, 1);
-  };
+// 📝 Markdown编辑器配置
+const markdownToolbars = [
+  'bold',
+  'underline',
+  'italic',
+  '-',
+  'title',
+  'strikeThrough',
+  'sub',
+  'sup',
+  'quote',
+  'unorderedList',
+  'orderedList',
+  'task',
+  '-',
+  'codeRow',
+  'code',
+  'link',
+  'image',
+  'table',
+  'mermaid',
+  'katex',
+  '-',
+  'revoke',
+  'next',
+  'save',
+  '=',
+  'pageFullscreen',
+  'fullscreen',
+  'preview',
+  'previewOnly',
+  'htmlPreview',
+  'catalog'
+] as any;
 
-  const videos = ref<ItemType[]>([]);
-  const chooseVideo = (data: FileRecord) => {
-    videos.value = [
-      {
-        uid: uuid(),
-        url: data.path,
-        status: 'done'
+// 📝 Markdown编辑器图片上传处理
+const onMarkdownUploadImg = async (files: File[], callback: (urls: string[]) => void) => {
+  try {
+    const uploadPromises = files.map(async (file) => {
+      // 检查文件大小（限制为10MB）
+      if (file.size > 10 * 1024 * 1024) {
+        message.error(`图片 ${file.name} 大小超过10MB，请选择更小的文件`);
+        return null;
       }
-    ];
-    form.video = data.path;
-  };
 
-  const onDeleteVideo = (index: number) => {
-    images.value.splice(index, 1);
-    form.video = undefined;
-  };
+      // 检查文件类型
+      if (!file.type.startsWith('image/')) {
+        message.error(`文件 ${file.name} 不是有效的图片格式`);
+        return null;
+      }
 
-  const onChange = (text: string) => {
-    // 加载商品多规格
-    if (text == 'spec') {
-      const goodsId = props.data?.goodsId;
-      if (goodsId) {
-        listShopGoodsSpec({ goodsId }).then((data) => {
-          if(data.length > 0){
-            const specValue = data[0].specValue;
-            if (specValue) {
-              spec.value = JSON.parse(specValue).map((d) => {
-                console.log(d);
-                return {
-                  value: d.value,
-                  detail: d.detail
-                };
-              });
-            }
-            console.log(spec.value);
-          }
-        });
-        listShopGoodsSku({ goodsId }).then((data) => {
-          skuList.value = data;
-        });
+      try {
+        const result = await uploadOss(file);
+        return result.url || result.path;
+      } catch (error) {
+        console.error('图片上传失败:', error);
+        message.error(`图片 ${file.name} 上传失败`);
+        return null;
       }
+    });
+
+    const results = await Promise.all(uploadPromises);
+    const successUrls = results.filter(url => url !== null) as string[];
+
+    if (successUrls.length > 0) {
+      callback(successUrls);
+      message.success(`成功上传 ${successUrls.length} 张图片`);
     }
-  };
+  } catch (error) {
+    console.error('批量上传失败:', error);
+    message.error('图片上传失败，请重试');
+  }
+};
 
-  const onDeleteItem = (index: number) => {
-    images.value.splice(index, 1);
-    form.image = '';
+// 📝 Markdown编辑器图片选择器
+const openMarkdownImageSelector = () => {
+  fileSelectCallback.value = (url: string) => {
+    // 在当前光标位置插入Markdown图片语法
+    const imageMarkdown = `![图片](${url})`;
+    insertMarkdownText(imageMarkdown);
   };
+  showFileSelector.value = true;
+};
 
-  const onClose = (index) => {
-    spec.value.splice(index, 1);
+// 📝 Markdown编辑器视频选择器
+const openMarkdownVideoSelector = () => {
+  videoSelectCallback.value = (url: string) => {
+    // 在当前光标位置插入Markdown视频语法（使用HTML标签）
+    const videoMarkdown = `<video controls style="max-width: 100%; height: auto;">
+  <source src="${url}" type="video/mp4">
+  您的浏览器不支持视频播放。
+</video>`;
+    insertMarkdownText(videoMarkdown);
   };
+  showVideoSelector.value = true;
+};
 
-  const openSpecForm = () => {
-    showSpecForm.value = !showSpecForm.value;
-  };
+// 📝 在Markdown编辑器中插入文本
+const insertMarkdownText = (text: string) => {
+  // 简单的文本插入，在内容末尾添加
+  if (content.value) {
+    content.value += '\n\n' + text;
+  } else {
+    content.value = text;
+  }
+};
+const config = ref({
+  height: 650,
+  paste_data_images: true,
+  automatic_uploads: true,
 
-  const onSpec = (row: ShopSpec) => {
-    form.specName = row.specName;
-    goodsSpec.value = row;
-    if (row.specValue) {
-      spec.value = JSON.parse(row?.specValue);
-    }
-  };
+  // 自定义工具栏，移除默认的image和media按钮，添加自定义按钮
+  toolbar: [
+    'fullscreen preview code codesample emoticons custom_image_selector quick_upload custom_video_selector quick_video_upload auto_format toggle_indent',
+    'undo redo | forecolor backcolor',
+    'bold italic underline strikethrough',
+    'alignleft aligncenter alignright alignjustify',
+    'outdent indent | numlist bullist',
+    'formatselect fontselect fontsizeselect',
+    'link charmap anchor pagebreak | ltr rtl'
+  ].join(' | '),
 
-  // 新增规格
-  const addSpecValue = () => {
-    if (!name.value || !value.value) {
-      message.error(`请输入规格和规格值`);
-      return false;
+  // 图片上传处理器 - 支持拖拽和粘贴上传
+  images_upload_handler: (blobInfo, success, error) => {
+    const file = blobInfo.blob();
+
+    // 检查文件大小（限制为10MB）
+    if (file.size > 10 * 1024 * 1024) {
+      error('图片大小不能超过10MB');
+      return;
     }
-    const findIndex = spec.value.findIndex((d) => d.value == name.value);
-    if (findIndex == 0) {
-      message.error(`${name.value}已存在)`);
-      return false;
+
+    // 检查文件类型
+    if (!file.type.startsWith('image/')) {
+      error('只能上传图片文件');
+      return;
     }
-    spec.value.push({
-      value: name.value,
-      detail: [value.value]
-    });
-    name.value = '';
-    value.value = '';
-    openSpecForm();
-  };
 
-  const chooseFile = (data: FileRecord) => {
-    files.value.push({
-      uid: data.id,
-      url: data.path,
-      status: 'done'
+    // 显示上传进度提示
+    const loadingMsg = message.loading('图片上传中...', 0);
+
+    uploadOss(file)
+      .then((res) => {
+        loadingMsg();
+        success(res.url || res.path);
+        message.success('图片上传成功');
+      })
+      .catch((msg) => {
+        loadingMsg();
+        error(msg || '图片上传失败');
+        message.error('图片上传失败：' + msg);
+      });
+  },
+
+  // 图片工具栏
+  image_toolbar: 'alignleft aligncenter alignright | rotateleft rotateright | imageoptions',
+
+  // 图片标题
+  image_title: true,
+
+  // 图片描述
+  image_description: true,
+
+  // 图片尺寸
+  image_dimensions: true,
+
+  // 图片类别
+  image_class_list: [
+    {title: '无样式', value: ''},
+    {title: '响应式图片', value: 'img-responsive'},
+    {title: '圆角图片', value: 'img-rounded'},
+    {title: '圆形图片', value: 'img-circle'}
+  ],
+
+  // 自定义按钮设置
+  setup: (editor: any) => {
+    // 添加自定义图片选择按钮
+    editor.ui.registry.addButton('custom_image_selector', {
+      text: '图片',
+      icon: 'image',
+      tooltip: '插入图片（从文件库选择或上传）',
+      onAction: () => {
+        // 打开文件库选择弹窗
+        fileSelectCallback.value = (url: string) => {
+          editor.insertContent(`<img src="${url}" alt="图片" style="max-width: 100%;" />`);
+        };
+        showFileSelector.value = true;
+      }
     });
-  };
 
-  const onDeleteFile = (index: number) => {
-    files.value.splice(index, 1);
-  };
+    // 添加快速上传按钮
+    editor.ui.registry.addButton('quick_upload', {
+      text: '上传',
+      icon: 'upload',
+      tooltip: '快速上传图片',
+      onAction: () => {
+        const input = document.createElement('input');
+        input.type = 'file';
+        input.accept = 'image/*';
+        input.onchange = (e: any) => {
+          const file = e.target.files[0];
+          if (file) {
+            // 检查文件大小
+            if (file.size > 10 * 1024 * 1024) {
+              message.error('图片大小不能超过10MB');
+              return;
+            }
 
-  /**
-   * 生成商品SKU列表
-   */
-  const generateSku = () => {
-    generateGoodsSku(spec.value).then((data) => {
-      if (data) {
-        skuList.value = data;
+            const loadingMsg = message.loading('图片上传中...', 0);
+            uploadOss(file)
+              .then((res) => {
+                loadingMsg();
+                const imageUrl = res.url || res.path;
+                editor.insertContent(`<img src="${imageUrl}" alt="${file.name}" style="max-width: 100%;" />`);
+                message.success('图片上传成功');
+              })
+              .catch((msg) => {
+                loadingMsg();
+                message.error('图片上传失败：' + msg);
+              });
+          }
+        };
+        input.click();
       }
     });
-  };
 
-  const editorRef = ref<InstanceType<typeof TinymceEditor> | null>(null);
-  const config = ref({
-    height: 500,
-    images_upload_handler: (blobInfo, success, error) => {
-      const file = blobInfo.blob();
-      const formData = new FormData();
-      formData.append('file', file, file.name);
-      uploadOss(file)
-        .then((res) => {
-          success(res.path);
-        })
-        .catch((msg) => {
-          error(msg);
-        });
-    },
-    video_template_callback: function (data) {
-      console.log(data);
-      return `<video width="${data.width}" height="${data.height}" controls="controls" src="${data.source}"></video>`;
-    },
-    // 自定义文件上传(这里使用把选择的文件转成 blob 演示)
-    file_picker_callback: (callback: any, _value: any, meta: any) => {
-      const input = document.createElement('input');
-      input.setAttribute('type', 'file');
-      // 设定文件可选类型
-      if (meta.filetype === 'image') {
-        input.setAttribute('accept', 'image/*');
-      } else if (meta.filetype === 'media') {
-        input.setAttribute('accept', 'video/*,.pdf');
+    // 添加自定义视频选择按钮
+    editor.ui.registry.addButton('custom_video_selector', {
+      text: '视频',
+      icon: 'embed',
+      tooltip: '插入视频（从视频库选择）',
+      onAction: () => {
+        // 打开视频库选择弹窗
+        videoSelectCallback.value = (url: string) => {
+          // 插入视频标签，使用HTML5 video元素
+          editor.insertContent(`
+              <video controls style="max-width: 100%; height: auto;">
+                <source src="${url}" type="video/mp4">
+                您的浏览器不支持视频播放。
+              </video>
+            `);
+        };
+        showVideoSelector.value = true;
       }
-      input.onchange = () => {
-        const file = input.files?.[0];
-        if (!file) {
-          return;
-        }
-        if (meta.filetype === 'media') {
-          if (file.size / 1024 / 1024 > 200) {
-            editorRef.value?.alert({ content: '大小不能超过 200MB' });
-            return;
-          }
-          if (file.type.startsWith('application/pdf')) {
-            uploadOss(file).then((res) => {
-              const addPath = `<a href="${res.downloadUrl}" target="_blank">${res.name}</a>`;
-              content.value = content.value + addPath;
-            });
-            return;
-          }
-          if (!file.type.startsWith('video/')) {
-            editorRef.value?.alert({ content: '只能选择视频文件' });
-            return;
-          }
-          uploadOss(file).then((res) => {
-            callback(res.path);
-          });
-        }
-      };
-      input.click();
-    }
-  });
+    });
 
-  /* 粘贴图片上传服务器并插入编辑器 */
-  const onPaste = (e) => {
-    const items = (e.clipboardData || e.originalEvent.clipboardData).items;
-    let hasFile = false;
-    for (let i = 0; i < items.length; i++) {
-      if (items[i].type.indexOf('image') !== -1) {
-        let file = items[i].getAsFile();
-        const item: ItemType = {
-          file,
-          uid: (file as any).lastModified,
-          name: file.name
+    // 添加快速视频上传按钮
+    editor.ui.registry.addButton('quick_video_upload', {
+      text: '上传视频',
+      icon: 'upload',
+      tooltip: '快速上传视频',
+      onAction: () => {
+        const input = document.createElement('input');
+        input.type = 'file';
+        input.accept = 'video/*';
+        input.onchange = (e: any) => {
+          const file = e.target.files[0];
+          if (file) {
+            // 检查文件大小（限制为100MB）
+            if (file.size > 100 * 1024 * 1024) {
+              message.error('视频大小不能超过100MB');
+              return;
+            }
+
+            const loadingMsg = message.loading('视频上传中...', 0);
+            uploadOss(file)
+              .then((res) => {
+                loadingMsg();
+                const videoUrl = res.path || res.downloadUrl;
+                editor.insertContent(`
+                    <video controls style="max-width: 100%; height: auto;">
+                      <source src="${videoUrl}" type="video/mp4">
+                      您的浏览器不支持视频播放。
+                    </video>
+                  `);
+                message.success('视频上传成功');
+              })
+              .catch((msg) => {
+                loadingMsg();
+                message.error('视频上传失败：' + msg);
+              });
+          }
         };
-        uploadFile(<File>item.file)
-          .then((result) => {
-            const addPath = `<p><img class="content-img" src="${result.url}"></p>`;
-            content.value = content.value + addPath;
-          })
-          .catch((e) => {
-            message.error(e.message);
-          });
-        hasFile = true;
+        input.click();
       }
-    }
-    if (hasFile) {
-      e.preventDefault();
-    }
-  };
+    });
+
+    // 添加一键排版按钮
+    editor.ui.registry.addButton('auto_format', {
+      text: '一键排版',
+      icon: 'template',
+      tooltip: '智能优化文章格式和排版',
+      onAction: () => {
+        // 直接在这里处理排版，因为此时编辑器肯定已经初始化完成
+        handleAutoFormat(editor);
+      }
+    });
 
-  const { resetFields } = useForm(form, rules);
+    // 添加段落首行缩进切换按钮
+    editor.ui.registry.addButton('toggle_indent', {
+      text: '首行缩进',
+      icon: 'indent',
+      tooltip: '切换段落首行缩进（适合中文排版）',
+      onAction: () => {
+        toggleParagraphIndent(editor);
+      }
+    });
+  }
+});
 
-  /* 保存编辑 */
-  const save = () => {
-    if (!formRef.value) {
-      return;
+/* 粘贴图片上传服务器并插入编辑器 */
+const onPaste = (e) => {
+  const items = (e.clipboardData || e.originalEvent.clipboardData).items;
+  let hasFile = false;
+  for (let i = 0; i < items.length; i++) {
+    if (items[i].type.indexOf('image') !== -1) {
+      let file = items[i].getAsFile();
+      const item: ItemType = {
+        file,
+        uid: (file as any).lastModified,
+        name: file.name
+      };
+      uploadFile(<File>item.file)
+        .then((result) => {
+          const addPath = `<p><img class="content-img" src="${result.url}"></p>`;
+          content.value = content.value + addPath;
+        })
+        .catch((e) => {
+          message.error(e.message);
+        });
+      hasFile = true;
     }
-    formRef.value
-      .validate()
-      .then(() => {
-        loading.value = true;
-        if (form.priceGift && !form.priceGiftNum)
-          return message.error('请输入会员赠品数量');
-        if (ensureTag.value.length) form.ensureTag = ensureTag.value.join();
-        if (canUseDate.value.length) form.canUseDate = canUseDate.value.join();
-
-        // if (form.dealerGift && !form.dealerGiftNum) return message.error('请输入经销商赠品数量');
-        if (form.commissionRole === 1) {
-          for (let i = 0; i < form.goodsRoleCommission.length; i++) {
-            if (
-              form.goodsRoleCommission[i].amount === undefined ||
-              form.goodsRoleCommission[i].amount === '' ||
-              form.goodsRoleCommission[i].amount === null
-            ) {
-              return message.error(
-                '请输入' + form.goodsRoleCommission[i].roleName + '的分红金额'
-              );
-            }
+  }
+  if (hasFile) {
+    e.preventDefault();
+  }
+};
+
+const {resetFields} = useForm(form, rules);
+
+/* 保存编辑 */
+const save = () => {
+  if (!formRef.value) {
+    return;
+  }
+  formRef.value
+    .validate()
+    .then(() => {
+      loading.value = true;
+      if (form.priceGift && !form.priceGiftNum)
+        return message.error('请输入会员赠品数量');
+      if (ensureTag.value.length) form.ensureTag = ensureTag.value.join();
+      if (canUseDate.value.length) form.canUseDate = canUseDate.value.join();
+
+      // if (form.dealerGift && !form.dealerGiftNum) return message.error('请输入经销商赠品数量');
+      if (form.commissionRole === 1) {
+        for (let i = 0; i < form.goodsRoleCommission.length; i++) {
+          if (
+            form.goodsRoleCommission[i].amount === undefined ||
+            form.goodsRoleCommission[i].amount === '' ||
+            form.goodsRoleCommission[i].amount === null
+          ) {
+            return message.error(
+              '请输入' + form.goodsRoleCommission[i].roleName + '的分红金额'
+            );
           }
         }
-        const formData = {
-          ...form,
-          content: content.value,
-          category: JSON.stringify(category.value),
-          files: JSON.stringify(files.value),
-          goodsSpec: goodsSpec.value,
-          goodsSkus: skuList.value,
-          type: getMerchantId() ? 1 : 0
-        };
-        if (isUpdate.value) {
-          formData.type = props.data.type;
-        }
-        const saveOrUpdate = isUpdate.value ? updateShopGoods : addShopGoods;
-        saveOrUpdate(formData)
-          .then((msg) => {
-            loading.value = false;
-            message.success(msg);
-            updateVisible(false);
-            emit('done');
-          })
-          .catch((e) => {
-            loading.value = false;
-            message.error(e.message);
-          });
-      })
-      .catch(() => {});
-  };
+      }
+      const formData = {
+        ...form,
+        content: content.value,
+        category: JSON.stringify(category.value),
+        files: JSON.stringify(files.value),
+        goodsSpec: goodsSpec.value,
+        goodsSkus: skuList.value,
+        type: getMerchantId() ? 1 : 0
+      };
+      if (isUpdate.value) {
+        formData.type = props.data.type;
+      }
+      const saveOrUpdate = isUpdate.value ? updateShopGoods : addShopGoods;
+      saveOrUpdate(formData)
+        .then((msg) => {
+          loading.value = false;
+          message.success(msg);
+          updateVisible(false);
+          emit('done');
+        })
+        .catch((e) => {
+          loading.value = false;
+          message.error(e.message);
+        });
+    })
+    .catch(() => {
+    });
+};
 
-  const expressTemplateList = ref<ShopExpressTemplate[]>([]);
-  const getExpressTemplateList = async () => {
-    expressTemplateList.value = await listShopExpressTemplate();
-  };
+const expressTemplateList = ref<ShopExpressTemplate[]>([]);
+const getExpressTemplateList = async () => {
+  expressTemplateList.value = await listShopExpressTemplate();
+};
 
-  const getRoleList = async () => {
-    const roleList = await listShopCommissionRole();
-    form.goodsRoleCommission = [];
-    roleList.forEach((d) => {
-      form.goodsRoleCommission.push({
-        roleId: d.id,
-        roleName: d.title,
-        amount: 0
-      });
+const getRoleList = async () => {
+  const roleList = await listShopCommissionRole();
+  form.goodsRoleCommission = [];
+  roleList.forEach((d) => {
+    form.goodsRoleCommission.push({
+      roleId: d.id,
+      roleName: d.title,
+      amount: 0
     });
-    if (props?.data?.goodsId) {
-      const commissionList = await listShopGoodsRoleCommission({
-        goodsId: props?.data?.goodsId
-      });
-      form.goodsRoleCommission = form.goodsRoleCommission.map((d) => {
-        const find = commissionList.find((c) => c.roleId == d.roleId);
-        return {
-          ...d,
-          amount: find?.amount || 0
-        };
-      });
-    }
-  };
+  });
+  if (props?.data?.goodsId) {
+    const commissionList = await listShopGoodsRoleCommission({
+      goodsId: props?.data?.goodsId
+    });
+    form.goodsRoleCommission = form.goodsRoleCommission.map((d) => {
+      const find = commissionList.find((c) => c.roleId == d.roleId);
+      return {
+        ...d,
+        amount: find?.amount || 0
+      };
+    });
+  }
+};
 
-  const onUploadImage = (item) => {
-    const { file } = item;
-    if (file.size / 1024 / 1024 > 10) {
-      message.error('大小不能超过 10MB');
-      return;
-    }
-    const hide = messageLoading({
-      content: '上传中..',
-      duration: 0,
-      mask: true
+const onUploadImage = (item) => {
+  const {file} = item;
+  if (file.size / 1024 / 1024 > 10) {
+    message.error('大小不能超过 10MB');
+    return;
+  }
+  const hide = messageLoading({
+    content: '上传中..',
+    duration: 0,
+    mask: true
+  });
+  uploadOss(file)
+    .then((res) => {
+      hide();
+      form.image = res.path;
+    })
+    .catch((e) => {
+      message.error(e.message);
+      hide();
     });
-    uploadOss(file)
-      .then((res) => {
-        hide();
-        form.image = res.path;
-      })
-      .catch((e) => {
-        message.error(e.message);
-        hide();
+};
+const onUploadSwiper = (item) => {
+  const {file} = item;
+  if (file.size / 1024 / 1024 > 10) {
+    message.error('大小不能超过 10MB');
+    return;
+  }
+  const hide = messageLoading({
+    content: '上传中..',
+    duration: 0,
+    mask: true
+  });
+  uploadOss(file)
+    .then((data) => {
+      hide();
+      files.value.push({
+        uid: data.id,
+        url: data.path,
+        status: 'done'
       });
-  };
-  const onUploadSwiper = (item) => {
-    const { file } = item;
-    if (file.size / 1024 / 1024 > 10) {
-      message.error('大小不能超过 10MB');
-      return;
-    }
-    const hide = messageLoading({
-      content: '上传中..',
-      duration: 0,
-      mask: true
+      setPicker();
+    })
+    .catch((e) => {
+      message.error(e.message);
+      hide();
     });
-    uploadOss(file)
-      .then((data) => {
-        hide();
-        files.value.push({
-          uid: data.id,
-          url: data.path,
-          status: 'done'
-        });
-        setPicker();
-      })
-      .catch((e) => {
-        message.error(e.message);
-        hide();
-      });
-  };
+};
 
-  const swiperRef = ref();
-  const imageRef = ref();
-  const setPicker = () => {
-    const swiperEl = swiperRef.value?.$el?.querySelector('input[type="file"]');
-    if (swiperEl) {
-      swiperEl.removeAttribute('accept'); // 移除 accept 属性
-      swiperEl.removeAttribute('capture'); // 移除 capture 属性
-      swiperEl.setAttribute('name', 'file'); // 添加 name 属性
-    }
-    const imageEl = imageRef.value?.$el?.querySelector('input[type="file"]');
-    if (imageEl) {
-      imageEl.removeAttribute('accept'); // 移除 accept 属性
-      imageEl.removeAttribute('capture'); // 移除 capture 属性
-      imageEl.setAttribute('name', 'file'); // 添加 name 属性
-    }
-  };
-  watch(
-    () => props.visible,
-    async (visible) => {
-      if (visible) {
-        await getExpressTemplateList();
-
-        images.value = [];
-        category.value = [];
-        files.value = [];
-        videos.value = [];
-        canUseDate.value = [];
-        ensureTag.value = [];
-        ensureTagItem.value = '';
-        if (props.data) {
-          assignObject(form, props.data);
-          if (props.data.image) {
-            images.value.push({
+const swiperRef = ref();
+const imageRef = ref();
+const setPicker = () => {
+  const swiperEl = swiperRef.value?.$el?.querySelector('input[type="file"]');
+  if (swiperEl) {
+    swiperEl.removeAttribute('accept'); // 移除 accept 属性
+    swiperEl.removeAttribute('capture'); // 移除 capture 属性
+    swiperEl.setAttribute('name', 'file'); // 添加 name 属性
+  }
+  const imageEl = imageRef.value?.$el?.querySelector('input[type="file"]');
+  if (imageEl) {
+    imageEl.removeAttribute('accept'); // 移除 accept 属性
+    imageEl.removeAttribute('capture'); // 移除 capture 属性
+    imageEl.setAttribute('name', 'file'); // 添加 name 属性
+  }
+};
+watch(
+  () => props.visible,
+  async (visible) => {
+    if (visible) {
+      await getExpressTemplateList();
+
+      images.value = [];
+      category.value = [];
+      files.value = [];
+      videos.value = [];
+      canUseDate.value = [];
+      ensureTag.value = [];
+      ensureTagItem.value = '';
+      if (props.data) {
+        assignObject(form, props.data);
+        if (props.data.image) {
+          images.value.push({
+            uid: uuid(),
+            url: props.data.image,
+            status: 'done'
+          });
+        }
+        if (props.data.files) {
+          files.value = JSON.parse(props.data.files);
+        }
+        if (props.data.goodsSpecs) {
+          goodsSpec.value = props.data.goodsSpecs[0];
+          if (props.data.specs == 1) {
+            form.specName = props.data.goodsSpecs[0].specName;
+          }
+        }
+        if (props.data.goodsSkus) {
+          skuList.value = props.data.goodsSkus.map((d) => {
+            d.images = [];
+            d.images.push({
               uid: uuid(),
-              url: props.data.image,
+              url: d.image,
               status: 'done'
             });
-          }
-          if (props.data.files) {
-            files.value = JSON.parse(props.data.files);
-          }
-          if (props.data.goodsSpecs) {
-            goodsSpec.value = props.data.goodsSpecs[0];
-            if (props.data.specs == 1) {
-              form.specName = props.data.goodsSpecs[0].specName;
-            }
-          }
-          if (props.data.goodsSkus) {
-            skuList.value = props.data.goodsSkus.map((d) => {
-              d.images = [];
-              d.images.push({
-                uid: uuid(),
-                url: d.image,
-                status: 'done'
-              });
-              return d;
-            });
-          }
-          if (props.data.video) {
-            videos.value = [
-              {
-                uid: uuid(),
-                url: props.data.video,
-                status: 'done'
-              }
-            ];
-          }
-          // 商品分类
-          if (props.data.parentName) {
-            category.value.push(props.data.parentName);
-          }
-          if (props.data.category) {
-            category.value = JSON.parse(props.data.category);
-          }
-          if (props.data.content) {
-            content.value = props.data.content;
-          }
-          // 外卖商品分类
-          listShopGoodsCategory({ merchantId: props.merchantId }).then((list) => {
-            takeaway.value = list;
+            return d;
           });
+        }
+        if (props.data.video) {
+          videos.value = [
+            {
+              uid: uuid(),
+              url: props.data.video,
+              status: 'done'
+            }
+          ];
+        }
+        // 商品分类
+        if (props.data.parentName) {
+          category.value.push(props.data.parentName);
+        }
+        if (props.data.category) {
+          category.value = JSON.parse(props.data.category);
+        }
+        if (props.data.content) {
+          content.value = props.data.content;
+        }
 
-          isUpdate.value = true;
-          if (form.ensureTag) {
-            ensureTag.value = form.ensureTag.split(',');
-          }
-          if (form.canUseDate) {
-            canUseDate.value = form.canUseDate.split(',').map((d) => Number(d));
-          }
-          await getRoleList();
+        isUpdate.value = true;
+        if (form.ensureTag) {
+          ensureTag.value = form.ensureTag.split(',');
+        }
+        // 🎯 优先级设置栏目：
+        // 1. 如果传入了 categoryId（从栏目页面点击添加），使用传入的
+        // 2. 否则使用上次保存的栏目
+        if (props.data.categoryId) {
+          form.categoryId = props.data?.categoryId;
         } else {
-          await getRoleList();
-          spec.value = [];
-          goodsSpec.value = undefined;
-          skuList.value = [];
-          isUpdate.value = false;
+          const lastCategory = getLastCategory();
+          if (lastCategory) {
+            form.categoryId = lastCategory;
+          }
         }
-        setPicker();
+        await getRoleList();
       } else {
-        resetFields();
+        await getRoleList();
+        spec.value = [];
+        goodsSpec.value = undefined;
+        skuList.value = [];
+        isUpdate.value = false;
       }
-    },
-    { immediate: true }
-  );
+      setPicker();
+    } else {
+      resetFields();
+    }
+  },
+  {immediate: true}
+);
 </script>
diff --git a/src/views/shop/shopGoods/index.vue b/src/views/shop/shopGoods/index.vue
index 3973646..6f9fbec 100644
--- a/src/views/shop/shopGoods/index.vue
+++ b/src/views/shop/shopGoods/index.vue
@@ -1,7 +1,7 @@
 <template>
   <a-page-header :title="getPageTitle()" @back="() => $router.go(-1)">
     <template #extra>
-      <Extra />
+      <Extra/>
     </template>
     <a-card :bordered="false" :body-style="{ padding: '16px' }">
       <ele-pro-table
@@ -17,6 +17,7 @@
           <search
             @search="reload"
             :selection="selection"
+            :navigationList="navigationList"
             @add="openEdit"
             @remove="removeBatch"
             @batchMove="openMove"
@@ -25,7 +26,7 @@
         <template #bodyCell="{ column, record }">
           <template v-if="column.key === 'name'">
             <a-space class="flex items-center">
-              <a-image :src="record.image" v-if="record.image" :width="50" />
+              <a-image :src="record.image" v-if="record.image" :width="50"/>
               <span class="text-gray-700 font-bold">{{ record.name }}</span>
             </a-space>
           </template>
@@ -38,7 +39,7 @@
           <template v-if="column.key === 'action'">
             <a-space>
               <a @click="openEdit(record)">修改</a>
-              <a-divider type="vertical" />
+              <a-divider type="vertical"/>
               <a-popconfirm
                 title="确定要删除此记录吗？"
                 @confirm="remove(record)"
@@ -52,230 +53,249 @@
     </a-card>
 
     <!-- 编辑弹窗 -->
-    <ShopGoodsEdit v-model:visible="showEdit" :data="current" @done="reload" />
+    <ShopGoodsEdit v-model:visible="showEdit" :navigationList="navigationList" :data="current" @done="reload"/>
   </a-page-header>
 </template>
 
 <script lang="ts" setup>
-  import { createVNode, ref } from 'vue';
-  import { message, Modal } from 'ant-design-vue';
-  import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
-  import type { EleProTable } from 'ele-admin-pro';
-  import { toDateString } from 'ele-admin-pro';
-  import type {
-    DatasourceFunction,
-    ColumnItem
-  } from 'ele-admin-pro/es/ele-pro-table/types';
-  import Search from './components/search.vue';
-  import ShopGoodsEdit from './components/shopGoodsEdit.vue';
-  import {
-    pageShopGoods,
-    removeShopGoods,
-    removeBatchShopGoods
-  } from '@/api/shop/shopGoods';
-  import type { ShopGoods, ShopGoodsParam } from '@/api/shop/shopGoods/model';
-  import { getPageTitle } from '@/utils/common';
-  import Extra from '@/views/shop/shopGoods/components/extra.vue';
+import {createVNode, ref} from 'vue';
+import {message, Modal} from 'ant-design-vue';
+import {ExclamationCircleOutlined} from '@ant-design/icons-vue';
+import type {EleProTable} from 'ele-admin-pro';
+import {toTreeData} from 'ele-admin-pro';
+import {toDateString} from 'ele-admin-pro';
+import type {
+  DatasourceFunction,
+  ColumnItem
+} from 'ele-admin-pro/es/ele-pro-table/types';
+import Search from './components/search.vue';
+import ShopGoodsEdit from './components/shopGoodsEdit.vue';
+import Extra from '@/views/shop/shopGoods/components/extra.vue';
+import {
+  pageShopGoods,
+  removeShopGoods,
+  removeBatchShopGoods
+} from '@/api/shop/shopGoods';
+import type {ShopGoods, ShopGoodsParam} from '@/api/shop/shopGoods/model';
+import {getPageTitle} from '@/utils/common';
+import {CmsNavigation} from "@/api/cms/cmsNavigation/model";
+import {listCmsNavigation} from "@/api/cms/cmsNavigation";
 
-  // 表格实例
-  const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
+// 表格实例
+const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
 
-  // 表格选中数据
-  const selection = ref<ShopGoods[]>([]);
-  // 当前编辑数据
-  const current = ref<ShopGoods | null>(null);
-  // 是否显示编辑弹窗
-  const showEdit = ref(false);
-  // 是否显示批量移动弹窗
-  const showMove = ref(false);
-  // 加载状态
-  const loading = ref(true);
+// 表格选中数据
+const selection = ref<ShopGoods[]>([]);
+// 当前编辑数据
+const current = ref<ShopGoods | null>(null);
+// 栏目数据
+const navigationList = ref<CmsNavigation[]>();
+// 是否显示编辑弹窗
+const showEdit = ref(false);
+// 是否显示批量移动弹窗
+const showMove = ref(false);
+// 加载状态
+const loading = ref(true);
 
-  // 表格数据源
-  const datasource: DatasourceFunction = ({
+// 表格数据源
+const datasource: DatasourceFunction = ({
+                                          page,
+                                          limit,
+                                          where,
+                                          orders,
+                                          filters
+                                        }) => {
+  if (filters) {
+    where.status = filters.status;
+  }
+  return pageShopGoods({
+    ...where,
+    ...orders,
     page,
-    limit,
-    where,
-    orders,
-    filters
-  }) => {
-    if (filters) {
-      where.status = filters.status;
-    }
-    return pageShopGoods({
-      ...where,
-      ...orders,
-      page,
-      limit
-    });
-  };
+    limit
+  });
+};
 
-  // 表格列配置
-  const columns = ref<ColumnItem[]>([
-    {
-      title: 'ID',
-      dataIndex: 'goodsId',
-      key: 'goodsId',
-      align: 'center',
-      width: 90
-    },
-    {
-      title: '商品',
-      dataIndex: 'name',
-      key: 'name',
-      width: 280
-    },
-    // {
-    //   title: '编号',
-    //   dataIndex: 'code',
-    //   key: 'code',
-    //   align: 'center',
-    // },
-    {
-      title: '价格',
-      dataIndex: 'price',
-      key: 'price',
-      align: 'center'
-    },
-    {
-      title: '销量',
-      dataIndex: 'sales',
-      key: 'sales',
-      align: 'center'
-    },
-    {
-      title: '库存',
-      dataIndex: 'stock',
-      key: 'stock',
-      align: 'center'
-    },
-    {
-      title: '推荐',
-      dataIndex: 'recommend',
-      key: 'recommend',
-      align: 'center'
-    },
-    {
-      title: '状态',
-      dataIndex: 'status',
-      key: 'status',
-      align: 'center'
-    },
-    // {
-    //   title: '备注',
-    //   dataIndex: 'comments',
-    //   key: 'comments',
-    //   align: 'center',
-    // },
-    {
-      title: '排序号',
-      dataIndex: 'sortNumber',
-      key: 'sortNumber',
-      align: 'center'
-    },
-    {
-      title: '创建时间',
-      dataIndex: 'createTime',
-      key: 'createTime',
-      align: 'center',
-      sorter: true,
-      ellipsis: true,
-      customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd')
-    },
-    {
-      title: '操作',
-      key: 'action',
-      width: 180,
-      fixed: 'right',
-      align: 'center',
-      hideInSetting: true
-    }
-  ]);
+// 表格列配置
+const columns = ref<ColumnItem[]>([
+  {
+    title: 'ID',
+    dataIndex: 'goodsId',
+    key: 'goodsId',
+    align: 'center',
+    width: 90
+  },
+  {
+    title: '商品',
+    dataIndex: 'name',
+    key: 'name',
+    width: 280
+  },
+  // {
+  //   title: '编号',
+  //   dataIndex: 'code',
+  //   key: 'code',
+  //   align: 'center',
+  // },
+  {
+    title: '价格',
+    dataIndex: 'price',
+    key: 'price',
+    align: 'center'
+  },
+  {
+    title: '销量',
+    dataIndex: 'sales',
+    key: 'sales',
+    align: 'center'
+  },
+  {
+    title: '库存',
+    dataIndex: 'stock',
+    key: 'stock',
+    align: 'center'
+  },
+  {
+    title: '推荐',
+    dataIndex: 'recommend',
+    key: 'recommend',
+    align: 'center'
+  },
+  {
+    title: '状态',
+    dataIndex: 'status',
+    key: 'status',
+    align: 'center'
+  },
+  // {
+  //   title: '备注',
+  //   dataIndex: 'comments',
+  //   key: 'comments',
+  //   align: 'center',
+  // },
+  {
+    title: '排序号',
+    dataIndex: 'sortNumber',
+    key: 'sortNumber',
+    align: 'center'
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    key: 'createTime',
+    align: 'center',
+    sorter: true,
+    ellipsis: true,
+    customRender: ({text}) => toDateString(text, 'yyyy-MM-dd')
+  },
+  {
+    title: '操作',
+    key: 'action',
+    width: 180,
+    fixed: 'right',
+    align: 'center',
+    hideInSetting: true
+  }
+]);
 
-  /* 搜索 */
-  const reload = (where?: ShopGoodsParam) => {
-    selection.value = [];
-    tableRef?.value?.reload({ where: where });
-  };
+/* 搜索 */
+const reload = (where?: ShopGoodsParam) => {
+  selection.value = [];
+  tableRef?.value?.reload({where: where});
+};
 
-  /* 打开编辑弹窗 */
-  const openEdit = (row?: ShopGoods) => {
-    current.value = row ?? null;
-    showEdit.value = true;
-  };
+/* 打开编辑弹窗 */
+const openEdit = (row?: ShopGoods) => {
+  current.value = row ?? null;
+  showEdit.value = true;
+};
 
-  /* 打开批量移动弹窗 */
-  const openMove = () => {
-    showMove.value = true;
-  };
+/* 打开批量移动弹窗 */
+const openMove = () => {
+  showMove.value = true;
+};
 
-  /* 删除单个 */
-  const remove = (row: ShopGoods) => {
-    const hide = message.loading('请求中..', 0);
-    removeShopGoods(row.shopGoodsId)
-      .then((msg) => {
-        hide();
-        message.success(msg);
-        reload();
-      })
-      .catch((e) => {
-        hide();
-        message.error(e.message);
-      });
-  };
+/* 删除单个 */
+const remove = (row: ShopGoods) => {
+  const hide = message.loading('请求中..', 0);
+  removeShopGoods(row.goodsId)
+    .then((msg) => {
+      hide();
+      message.success(msg);
+      reload();
+    })
+    .catch((e) => {
+      hide();
+      message.error(e.message);
+    });
+};
 
-  /* 批量删除 */
-  const removeBatch = () => {
-    if (!selection.value.length) {
-      message.error('请至少选择一条数据');
-      return;
+/* 批量删除 */
+const removeBatch = () => {
+  if (!selection.value.length) {
+    message.error('请至少选择一条数据');
+    return;
+  }
+  Modal.confirm({
+    title: '提示',
+    content: '确定要删除选中的记录吗?',
+    icon: createVNode(ExclamationCircleOutlined),
+    maskClosable: true,
+    onOk: () => {
+      const hide = message.loading('请求中..', 0);
+      removeBatchShopGoods(selection.value.map((d) => d.goodsId))
+        .then((msg) => {
+          hide();
+          message.success(msg);
+          reload();
+        })
+        .catch((e) => {
+          hide();
+          message.error(e.message);
+        });
     }
-    Modal.confirm({
-      title: '提示',
-      content: '确定要删除选中的记录吗?',
-      icon: createVNode(ExclamationCircleOutlined),
-      maskClosable: true,
-      onOk: () => {
-        const hide = message.loading('请求中..', 0);
-        removeBatchShopGoods(selection.value.map((d) => d.shopGoodsId))
-          .then((msg) => {
-            hide();
-            message.success(msg);
-            reload();
-          })
-          .catch((e) => {
-            hide();
-            message.error(e.message);
-          });
-      }
-    });
-  };
+  });
+};
 
-  /* 查询 */
-  const query = () => {
-    loading.value = true;
-  };
+/* 查询 */
+const query = () => {
+  loading.value = true;
+  // 加载栏目数据
+  if (!navigationList.value) {
+    listCmsNavigation({}).then((res) => {
+      navigationList.value = toTreeData({
+        data: res?.map((d) => {
+          d.value = d.navigationId;
+          d.label = d.title;
+          return d;
+        }),
+        idField: 'navigationId',
+        parentIdField: 'parentId'
+      });
+    });
+  }
+};
 
-  /* 自定义行属性 */
-  const customRow = (record: ShopGoods) => {
-    return {
-      // 行点击事件
-      onClick: () => {
-        // console.log(record);
-      },
-      // 行双击事件
-      onDblclick: () => {
-        openEdit(record);
-      }
-    };
+/* 自定义行属性 */
+const customRow = (record: ShopGoods) => {
+  return {
+    // 行点击事件
+    onClick: () => {
+      // console.log(record);
+    },
+    // 行双击事件
+    onDblclick: () => {
+      openEdit(record);
+    }
   };
-  query();
+};
+query();
 </script>
 
 <script lang="ts">
-  export default {
-    name: 'ShopGoods'
-  };
+export default {
+  name: 'ShopGoods'
+};
 </script>
 
 <style lang="less" scoped></style>
diff --git a/src/views/system/setting/components/privacy.vue b/src/views/system/setting/components/privacy.vue
new file mode 100644
index 0000000..a3cd93d
--- /dev/null
+++ b/src/views/system/setting/components/privacy.vue
@@ -0,0 +1,102 @@
+<template>
+  <a-card :bordered="false">
+    <a-form
+      ref="formRef"
+      :model="form"
+      :label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
+      :wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
+    >
+      <a-form-item label="允许被搜索" name="name" extra="关闭后，用户无法通过名称搜索到此网站">
+        <a-switch v-model:checked="form.searched" checked-children="允许" un-checked-children="不允许" @change="save" />
+      </a-form-item>
+      <a-form-item label="文章发布审核" name="articleReview" extra="开启需要审核后发布，关闭则直接发布">
+        <a-switch v-model:checked="form.articleReview" checked-children="需要" un-checked-children="不需要" @change="save" />
+      </a-form-item>
+      <a-form-item label="开发者模式" name="plugin" extra="开启开发者模式">
+        <a-switch v-model:checked="form.plugin" checked-children="启用" un-checked-children="禁用" @change="save" />
+      </a-form-item>
+      <a-form-item label="隐藏底部版权信息" name="showAdminCopyright">
+        <a-switch v-model:checked="form.showAdminCopyright" checked-children="显示" un-checked-children="隐藏" @change="save" />
+      </a-form-item>
+    </a-form>
+  </a-card>
+</template>
+
+<script lang="ts" setup>
+import {ref, watch} from 'vue';
+import {message} from 'ant-design-vue';
+import {useThemeStore} from '@/store/modules/theme';
+import {storeToRefs} from 'pinia';
+import {FormInstance} from 'ant-design-vue/es/form';
+import useFormData from '@/utils/use-form-data';
+import {addSetting, updateSettingByKey} from "@/api/system/setting";
+import {useWebsiteSettingStore} from "@/store/modules/setting";
+
+const props = defineProps<{
+  value?: string;
+  // 修改回显的数据
+  data?: any | null;
+}>();
+
+// 是否开启响应式布局
+const themeStore = useThemeStore();
+const settingStore = useWebsiteSettingStore();
+const {styleResponsive} = storeToRefs(themeStore);
+// 提交状态
+const loading = ref(false);
+// 是否是修改
+const isUpdate = ref(false);
+//
+const formRef = ref<FormInstance | null>(null);
+// 表单数据
+const {form, resetFields, assignFields} = useFormData<any>({
+  settingId: undefined,
+  settingKey: 'privacy',
+  searched:  undefined,
+  showAdminCopyright: ''
+});
+
+/* 保存编辑 */
+const save = () => {
+  if (!formRef.value) {
+    return;
+  }
+  formRef.value
+    .validate()
+    .then(() => {
+      loading.value = true;
+      // 更新状态
+      settingStore.setSetting(form)
+      const appForm = {
+        ...form,
+        content: JSON.stringify(form)
+      };
+      const saveOrUpdate = isUpdate.value ? updateSettingByKey : addSetting;
+      saveOrUpdate(appForm)
+        .then(() => {
+          message.success('保存成功');
+        })
+        .catch((e) => {
+          message.error(e.message);
+        });
+    })
+    .catch(() => {
+    });
+};
+
+watch(
+  () => props.data,
+  (data) => {
+    console.log(data,'propss')
+    if (data?.settingKey) {
+      isUpdate.value = true
+      // 表单赋值
+      assignFields(data);
+    } else {
+      // 新增
+      isUpdate.value = false
+      resetFields();
+    }
+  }
+);
+</script>
diff --git a/src/views/system/setting/components/website.vue b/src/views/system/setting/components/website.vue
new file mode 100644
index 0000000..7f51719
--- /dev/null
+++ b/src/views/system/setting/components/website.vue
@@ -0,0 +1,187 @@
+<template>
+  <a-card :bordered="false">
+    <a-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      :label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }"
+      :wrapper-col="styleResponsive ? { md: 9, sm: 19, xs: 24 } : { flex: '1' }"
+    >
+      <a-form-item label="悬浮工具栏" name="floatTool" extra="显示网站悬浮客服工具栏">
+        <a-switch v-model:checked="form.floatTool" checked-children="显示" un-checked-children="隐藏" @change="save" />
+      </a-form-item>
+      <a-form-item label="显示站内搜索" name="searchBtn">
+        <a-switch v-model:checked="form.searchBtn" checked-children="显示" un-checked-children="隐藏" @change="save" />
+      </a-form-item>
+      <a-form-item label="启用登录注册" name="loginBtn">
+        <a-switch v-model:checked="form.loginBtn" checked-children="启用" un-checked-children="不启用" @change="save" />
+      </a-form-item>
+      <a-form-item label="默认编辑器" name="editor" extra="设置默认编辑器">
+        <a-select v-model:value="form.editor" placeholder="请选择编辑器" class="max-w-xs" @change="save">
+          <a-select-option :value="1">富文本编辑器</a-select-option>
+          <a-select-option :value="2">Markdown编辑器</a-select-option>
+        </a-select>
+      </a-form-item>
+    </a-form>
+  </a-card>
+</template>
+
+<script lang="ts" setup>
+import {reactive, ref, watch} from 'vue';
+import {message} from 'ant-design-vue';
+import {Setting} from '@/api/system/setting/model';
+import {useThemeStore} from '@/store/modules/theme';
+import {storeToRefs} from 'pinia';
+import {FormInstance} from 'ant-design-vue/es/form';
+import useFormData from '@/utils/use-form-data';
+import {addSetting, updateSetting} from "@/api/system/setting";
+import {ItemType} from "ele-admin-pro/es/ele-image-upload/types";
+import {uploadFile} from "@/api/system/file";
+
+const props = defineProps<{
+  value?: string;
+  // 修改回显的数据
+  data?: Setting | null;
+}>();
+
+// 保存字段信息(设定好key和描述,content里的字段是随意加的会自动转为json保存到数据库)
+const settingKey = ref('website');
+
+// 是否开启响应式布局
+const themeStore = useThemeStore();
+const {styleResponsive} = storeToRefs(themeStore);
+// 提交状态
+const loading = ref(false);
+// 是否是修改
+const isUpdate = ref(false);
+//
+const formRef = ref<FormInstance | null>(null);
+// 表单数据
+const {form, resetFields, assignFields} = useFormData<Setting>({
+  settingKey: 'website',
+  type: 1,
+  roleId: undefined,
+  openWxAuth: 1,
+  openWxBindPhone: 1,
+  openWxofficialAuth: 1,
+  openWxofficialBindPhone: 1,
+  tokenExpireTime: 86400,
+  comments: '',
+  tenantId: localStorage.getItem('TenantId')
+});
+
+// 表单验证规则
+const rules = reactive({
+  type: [
+    {
+      required: true,
+      message: '请选择默认注册方式',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  roleId: [
+    {
+      required: true,
+      message: '请选择默认角色',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  openWxAuth: [
+    {
+      required: true,
+      message: '请输入系统名称',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  openWxBindPhone: [
+    {
+      required: true,
+      message: '请输入系统名称',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  openWxofficialAuth: [
+    {
+      required: true,
+      message: '请输入系统名称',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ],
+  openWxofficialBindPhone: [
+    {
+      required: true,
+      message: '请输入系统名称',
+      type: 'number',
+      trigger: 'blur'
+    }
+  ]
+});
+
+const onUpload = (d: ItemType) => {
+  uploadFile(<File>d.file)
+    .then((result) => {
+      form.logo = result.path;
+      message.success('上传成功');
+    })
+    .catch((e) => {
+      message.error(e.message);
+    });
+};
+
+const onClose = () => {
+  form.logo = undefined
+}
+
+/* 保存编辑 */
+const save = () => {
+  if (!formRef.value) {
+    return;
+  }
+  formRef.value
+    .validate()
+    .then(() => {
+      loading.value = true;
+      const appForm = {
+        ...form,
+        content: JSON.stringify(form)
+      };
+      const saveOrUpdate = isUpdate.value ? updateSetting : addSetting;
+      saveOrUpdate(appForm)
+        .then((msg) => {
+          message.success('保存成功');
+        })
+        .catch((e) => {
+          message.error(e.message);
+        });
+    })
+    .catch(() => {
+    });
+};
+
+watch(
+  () => props.data,
+  (data) => {
+    if (data?.settingId) {
+      isUpdate.value = true
+      // 表单赋值
+      if (data.content) {
+        const jsonData = JSON.parse(data.content);
+        assignFields(jsonData);
+      }
+      // 其他必要参数
+      form.settingId = data.settingId
+      form.settingKey = data.settingKey
+    } else {
+      // 新增
+      isUpdate.value = false
+      resetFields();
+      form.settingKey = settingKey.value
+    }
+  }
+);
+</script>
diff --git a/src/views/system/setting/index.vue b/src/views/system/setting/index.vue
index df70372..a5201bd 100644
--- a/src/views/system/setting/index.vue
+++ b/src/views/system/setting/index.vue
@@ -5,32 +5,35 @@
       :body-style="{ paddingTop: '0px', minHeight: '800px' }"
     >
       <a-tabs v-model:active-key="active">
+        <a-tab-pane tab="网站设置" key="website">
+          <Website v-model:value="active" :data="data"/>
+        </a-tab-pane>
         <a-tab-pane tab="上传设置" key="upload">
-          <Upload v-model:value="active" :data="data" />
+          <Upload v-model:value="active" :data="data"/>
         </a-tab-pane>
         <a-tab-pane tab="短信设置" key="sms">
-          <Sms v-model:value="active" :data="data" />
+          <Sms v-model:value="active" :data="data"/>
         </a-tab-pane>
-        <!--        <a-tab-pane tab="支付设置" key="payment">-->
-        <!--          <Payment :value="active" :data="data" />-->
-        <!--        </a-tab-pane>-->
         <a-tab-pane tab="注册设置" key="register">
-          <Register :value="active" :data="data" />
+          <Register :value="active" :data="data"/>
+        </a-tab-pane>
+        <a-tab-pane tab="微信小程序" key="mp-weixin">
+          <MpWeixin :value="active" :data="data"/>
         </a-tab-pane>
         <a-tab-pane tab="企业微信" key="wx-work">
-          <WxWork :value="active" :data="data" />
+          <WxWork :value="active" :data="data"/>
         </a-tab-pane>
         <a-tab-pane tab="微信公众号" key="wx-official">
-          <WxOfficial :value="active" :data="data" />
+          <WxOfficial :value="active" :data="data"/>
         </a-tab-pane>
-        <a-tab-pane tab="微信小程序" key="mp-weixin">
-          <MpWeixin :value="active" :data="data" />
+        <a-tab-pane tab="隐私与安全" key="privacy">
+          <Privacy :value="active" :data="data"/>
         </a-tab-pane>
         <a-tab-pane tab="打印设置" key="printer">
-          <Printer :value="active" :data="data" />
+          <Printer :value="active" :data="data"/>
         </a-tab-pane>
         <a-tab-pane tab="更新缓存" key="clear">
-          <Clear :value="active" :data="data" />
+          <Clear :value="active" :data="data"/>
         </a-tab-pane>
       </a-tabs>
     </a-card>
@@ -38,46 +41,44 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, watch } from 'vue';
-  import { Setting } from '@/api/system/setting/model';
-  import Upload from './components/upload.vue';
-  import Register from './components/register.vue';
-  import WxWork from './components/wx-work.vue';
-  import WxOfficial from './components/wx-official.vue';
-  import MpWeixin from './components/mp-weixin.vue';
-  // import Payment from './components/payment.vue';
-  import Sms from './components/sms.vue';
-  import Printer from './components/printer.vue';
-  import Clear from './components/clear.vue';
-  import { listSetting } from '@/api/system/setting';
+import {ref, watch} from 'vue';
+import {Setting} from '@/api/system/setting/model';
+import Website from './components/website.vue';
+import Upload from './components/upload.vue';
+import Register from './components/register.vue';
+import WxWork from './components/wx-work.vue';
+import WxOfficial from './components/wx-official.vue';
+import MpWeixin from './components/mp-weixin.vue';
+import Privacy from './components/privacy.vue';
+// import Payment from './components/payment.vue';
+import Sms from './components/sms.vue';
+import Printer from './components/printer.vue';
+import Clear from './components/clear.vue';
+import {getSettingByKey} from '@/api/system/setting';
 
-  // tab页选中
-  const active = ref('upload');
+// tab页选中
+const active = ref('privacy');
 
-  const data = ref<Setting>();
+const data = ref<Setting>();
 
-  const reload = () => {
-    listSetting({ settingKey: active.value }).then((res) => {
-      if (res.length > 0) {
-        data.value = res[0];
-      } else {
-        data.value = {};
-      }
-    });
-  };
+const reload = () => {
+  getSettingByKey(active.value).then(res => {
+    data.value = res;
+  })
+};
 
-  reload();
+reload();
 
-  watch(
-    () => active.value,
-    (value) => {
-      reload();
-    }
-  );
+watch(
+  () => active.value,
+  () => {
+    reload();
+  }
+);
 </script>
 
 <script lang="ts">
-  export default {
-    name: 'Setting'
-  };
+export default {
+  name: 'Setting'
+};
 </script>