diff --git a/package.json b/package.json
index 3f576d3..996ec50 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,9 @@
   "dependencies": {
     "@vitejs/plugin-vue": "^4.6.2",
     "@vueuse/core": "^10.7.2",
+    "@wangeditor/editor": "^5.1.23",
+    "@wangeditor/editor-for-vue": "5.1.10",
+    "@wangeditor/plugin-upload-attachment": "^1.1.0",
     "axios": "^1.6.7",
     "clipboardy": "^4.0.0",
     "crypto-js": "^4.2.0",
@@ -38,7 +41,6 @@
     "vue": "^3.4.19",
     "vue-i18n": "^9.9.1",
     "vue-router": "^4.2.5",
-    "wangeditor": "^4.7.15",
     "xlsx": "^0.18.5"
   },
   "devDependencies": {
diff --git a/src/App.vue b/src/App.vue
index 7329dd8..396eeb6 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,9 +7,15 @@
 <script setup>
 import { useAppStore } from '@/store/modules/app'
 import { useSettingsStore } from '@/store/modules/settings'
+import { Boot } from '@wangeditor/editor'
+import attachmentModule from '@wangeditor/plugin-upload-attachment'
+
 const appStore = useAppStore()
 const settingsStore = useSettingsStore()
 
+// wangEditor：注册。要在创建编辑器之前注册，且只能注册一次，不可重复注册。
+Boot.registerModule(attachmentModule)
+
 onMounted(() => {
   settingsStore.changeSetting({ key: 'layout', value: settingsStore.layout })
   settingsStore.changeSetting({ key: 'theme', value: settingsStore.theme })
diff --git a/src/components/RichEditor/index.vue b/src/components/RichEditor/index.vue
index 94b4db5..1865dd9 100644
--- a/src/components/RichEditor/index.vue
+++ b/src/components/RichEditor/index.vue
@@ -1,7 +1,23 @@
 <template>
-  <div>
+  <div class="editor-wrapper">
+    <!-- 工具栏 -->
+    <el-affix target=".editor-wrapper" :offset="150">
+      <Toolbar
+        id="toolbar-container"
+        :editor="editorRef"
+        :default-config="toolbarConfig"
+        :mode="mode"
+      />
+    </el-affix>
     <!-- 编辑器 -->
-    <div :id="editorId"></div>
+    <Editor
+      id="editor-container"
+      v-model="modelValue"
+      :default-config="editorConfig"
+      :mode="mode"
+      @on-change="handleChange"
+      @on-created="handleCreated"
+    />
     <!-- 文件管理 -->
     <el-dialog
       v-model="fileDialog"
@@ -17,248 +33,116 @@
   </div>
 </template>
 
-<script>
-import E from 'wangeditor'
-import { randomString } from '@/utils'
+<script setup>
+import { useAppStore } from '@/store/modules/app'
+import { i18nChangeLanguage } from '@wangeditor/editor'
+import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
 import FileManage from '@/components/FileManage/index.vue'
 
-export default {
-  name: 'RichEditor',
-  components: { FileManage },
-  model: {
-    prop: 'content',
-    event: 'change'
-  },
-  props: {
-    id: { type: String, default: 'wangeditor' + randomString() },
-    content: { type: String, default: '' },
-    excludeMenus: {
-      type: Array,
-      default() {
-        return ['image', 'video']
+const props = defineProps({
+  modelValue: {
+    type: [String],
+    default: ''
+  }
+})
+const appStore = useAppStore()
+const emit = defineEmits(['update:modelValue'])
+// 切换语言 - 'en' 或者 'zh-CN'
+i18nChangeLanguage(appStore.language == 'zh-cn' ? 'zh-CN' : 'en')
+const modelValue = useVModel(props, 'modelValue', emit)
+// 编辑器实例，必须用 shallowRef
+const editorRef = shallowRef()
+// 编辑器模式
+const mode = ref('default')
+// 工具条配置
+const toolbarConfig = ref({
+  insertKeys: {
+    index: 24, // 自定义插入的位置
+    keys: ['uploadAttachment'] // “上传附件”菜单
+  }
+})
+// 编辑器配置
+const editorConfig = ref({
+  placeholder: '请输入内容...',
+  MENU_CONF: {
+    uploadImage: {
+      // 自定义选择图片
+      customBrowseAndUpload() {
+        fileDialog.value = true
+        fileType.value = 'image'
       }
     },
-    zIndex: { type: Number, default: 5000 },
-    height: { type: Number, default: 500 },
-    focus: { type: Boolean, default: false },
-    placeholder: { type: String, default: '请输入内容' }
-  },
-  data() {
-    return {
-      name: '富文本编辑器',
-      editor: null,
-      editorId: this.id,
-      editorContent: this.content,
-      editorContentNew: '',
-      fileDialog: false,
-      fileTitle: '文件管理',
-      fileType: 'image'
-    }
-  },
-  watch: {
-    content(value) {
-      if (value !== this.editor.txt.html()) {
-        this.editor.txt.html(this.content)
-      }
-    }
-  },
-  mounted() {
-    this.editorCreate()
-  },
-  unmounted() {
-    this.editorDestroy()
-  },
-  methods: {
-    // 编辑器创建
-    editorCreate() {
-      const that = this
-      // 扩展菜单
-      const { BtnMenu } = E
-
-      class upimage extends BtnMenu {
-        constructor(editor) {
-          const $elem = E.$(
-            `<div class="w-e-menu" data-title="上传图片"><el-button>图片</el-button></div>`
-          )
-          super($elem, editor)
-        }
-        clickHandler() {
-          that.fileType = 'image'
-          that.fileTitle = '上传图片'
-          that.fileDialog = true
-        }
-        tryChangeActive() {}
-      }
-
-      class upvideo extends BtnMenu {
-        constructor(editor) {
-          const $elem = E.$(
-            `<div class="w-e-menu" data-title="上传视频"><el-button>视频</el-button></div>`
-          )
-          super($elem, editor)
-        }
-        clickHandler() {
-          that.fileType = 'video'
-          that.fileTitle = '上传视频'
-          that.fileDialog = true
-        }
-        tryChangeActive() {}
-      }
-
-      class upaudio extends BtnMenu {
-        constructor(editor) {
-          const $elem = E.$(
-            `<div class="w-e-menu" data-title="上传音频"><el-button>音频</el-button></div>`
-          )
-          super($elem, editor)
-        }
-        clickHandler() {
-          that.fileType = 'audio'
-          that.fileTitle = '上传音频'
-          that.fileDialog = true
-        }
-        tryChangeActive() {}
-      }
-
-      class upword extends BtnMenu {
-        constructor(editor) {
-          const $elem = E.$(
-            `<div class="w-e-menu" data-title="上传文档"><el-button>文档</el-button></div>`
-          )
-          super($elem, editor)
-        }
-        clickHandler() {
-          that.fileType = 'word'
-          that.fileTitle = '上传文档'
-          that.fileDialog = true
-        }
-        tryChangeActive() {}
-      }
-
-      class upother extends BtnMenu {
-        constructor(editor) {
-          const $elem = E.$(
-            `<div class="w-e-menu" data-title="上传附件"><el-button>附件</el-button></div>`
-          )
-          super($elem, editor)
-        }
-        clickHandler() {
-          that.fileType = 'other'
-          that.fileTitle = '上传附件'
-          that.fileDialog = true
-        }
-        tryChangeActive() {}
-      }
-
-      class clear extends BtnMenu {
-        constructor(editor) {
-          const $elem = E.$(
-            `<div class="w-e-menu" data-title="清空内容"><el-button>清空</el-button></div>`
-          )
-          super($elem, editor)
-        }
-        clickHandler() {
-          that.editor.txt.clear()
-        }
-        tryChangeActive() {}
-      }
-      // 配置
-      that.editor = new E('#' + that.editorId)
-      that.editor.config.excludeMenus = that.excludeMenus
-      that.editor.menus.extend('upimageKey', upimage)
-      that.editor.config.menus = that.editor.config.menus.concat('upimageKey')
-      that.editor.menus.extend('upvideoKey', upvideo)
-      that.editor.config.menus = that.editor.config.menus.concat('upvideoKey')
-      that.editor.menus.extend('upaudioKey', upaudio)
-      that.editor.config.menus = that.editor.config.menus.concat('upaudioKey')
-      that.editor.menus.extend('upwordKey', upword)
-      that.editor.config.menus = that.editor.config.menus.concat('upwordKey')
-      that.editor.menus.extend('upotherKey', upother)
-      that.editor.config.menus = that.editor.config.menus.concat('upotherKey')
-      that.editor.menus.extend('clearKey', clear)
-      that.editor.config.menus = that.editor.config.menus.concat('clearKey')
-
-      that.editor.config.zIndex = that.zIndex
-      that.editor.config.height = that.height
-      that.editor.config.focus = that.focus
-      that.editor.config.placeholder = that.placeholder
-
-      that.editor.config.onchange = (newHtml) => {
-        that.editorContentNew = newHtml
-        this.$emit('change', that.editorContentNew)
-      }
-
-      console.log(that.editor.textElemId)
-      console.log(that.editor.toolbarElemId)
-
-      that.editor.create()
-      that.editor.txt.clear()
-      that.editor.txt.html(that.editorContent)
-    },
-    // 编辑器销毁
-    editorDestroy() {
-      this.editorContent = ''
-      this.editorContentNew = ''
-      if (this.editor) {
-        this.editor.txt.html('')
-        this.editor.destroy()
-        this.editor = null
+    uploadVideo: {
+      // 自定义选择视频
+      customBrowseAndUpload() {
+        fileDialog.value = true
+        fileType.value = 'video'
       }
     },
-    // 文件管理
-    fileCancel() {
-      this.fileDialog = false
-    },
-    fileSubmit(filelist, filetype) {
-      this.fileDialog = false
-      this.fileTitle = ''
-      const fileLength = filelist.length
-      if (fileLength) {
-        for (let i = 0; i < fileLength; i++) {
-          if (filetype === 'image') {
-            this.editor.cmd.do(
-              'insertHTML',
-              `<img file-id="${filelist[i]['file_id']}" src="${filelist[i]['file_url']}" style="max-width:50%;"/>`
-            )
-          } else if (filetype === 'video') {
-            this.editor.cmd.do(
-              'insertHTML',
-              `<video width="50%" height="50%" controls>
-                <source file-id="${filelist[i]['file_id']}" src="${filelist[i]['file_url']}" type="video/mp4">
-                <object file-id="${filelist[i]['file_id']}" data="${filelist[i]['file_url']}" width="50%" height="50%">
-                  <embed file-id="${filelist[i]['file_id']}" src="${filelist[i]['file_url']}" width="50%" height="50%">
-                </object>
-              </video>`
-            )
-          } else if (filetype === 'audio') {
-            this.editor.cmd.do(
-              'insertHTML',
-              `<audio width="50%" height="50%" controls>
-                <source file-id="${filelist[i]['file_id']}" src="${filelist[i]['file_url']}" type="audio/mp3">
-                <embed file-id="${filelist[i]['file_id']}" src="${filelist[i]['file_url']}" width="50%" height="50%">
-              </audio>`
-            )
-          } else {
-            this.editor.cmd.do(
-              'insertHTML',
-              `<a file-id="${filelist[i]['file_id']}" href="${filelist[i]['file_url']}" download="${filelist[i]['file_url']}" target="_blank">${filelist[i]['file_name']}.${filelist[i]['file_ext']}</a>`
-            )
-          }
-        }
+    uploadAttachment: {
+      // 自定义选择附件
+      customBrowseAndUpload() {
+        fileDialog.value = true
+        fileType.value = 'word'
       }
     }
   }
+})
+
+const handleCreated = (editor) => {
+  // 记录 editor 实例，重要！
+  editorRef.value = editor
 }
+
+function handleChange(editor) {
+  modelValue.value = editor.getHtml()
+}
+
+// 文件管理
+const fileDialog = ref(false)
+const fileTitle = ref('文件管理')
+const fileType = ref('image')
+function fileCancel() {
+  fileDialog.value = false
+}
+function fileSubmit(files) {
+  fileDialog.value = false
+  var htmls = ''
+  const length = files.length
+  for (let i = 0; i < length; i++) {
+    if (files[i]['file_type'] === 'image') {
+      htmls += `<img file-id="${files[i]['file_id']}" src="${files[i]['file_url']}" style="width:640px;"/>`
+    } else if (files[i]['file_type'] === 'video') {
+      htmls += `<div data-w-e-type="video" data-w-e-is-void><video width="640" height="480" controls>
+                <source file-id="${files[i]['file_id']}" src="${files[i]['file_url']}" type="video/mp4">
+                <object file-id="${files[i]['file_id']}" data="${files[i]['file_url']}">
+                  <embed file-id="${files[i]['file_id']}" src="${files[i]['file_url']}" width="640" height="480">
+                </object>
+              </video></div>`
+    } else if (files[i]['file_type'] === 'audio') {
+      htmls += `<div data-w-e-type="audio" data-w-e-is-void data-w-e-is-inline><audio controls>
+                <source file-id="${files[i]['file_id']}" src="${files[i]['file_url']}" type="audio/mp3">
+                <embed file-id="${files[i]['file_id']}" src="${files[i]['file_url']}">
+              </audio></div>`
+    } else {
+      htmls += `<div data-w-e-type="attachment" data-w-e-is-void data-w-e-is-inline><a file-id="${files[i]['file_id']}" href="${files[i]['file_url']}" download="${files[i]['file_url']}" target="_blank">${files[i]['file_name']}.${files[i]['file_ext']}</a></div>`
+    }
+  }
+  const editor = editorRef.value
+  editor.dangerouslyInsertHtml(htmls)
+}
+
+// 组件销毁时，也及时销毁编辑器
+onBeforeUnmount(() => {
+  const editor = editorRef.value
+  if (editor == null) return
+  editor.destroy()
+})
 </script>
 
-<style lang="scss">
-.w-e-toolbar {
-  border: 1px solid var(--el-border-color) !important;
-  background-color: var(--el-bg-color) !important;
-  border-bottom: 0 !important;
-}
-.w-e-text-container {
-  border: 1px solid var(--el-border-color) !important;
-  background-color: var(--el-bg-color) !important;
+<style src="@wangeditor/editor/dist/css/style.css"></style>
+<style>
+.editor-wrapper {
+  border: 1px solid #cfd3dc;
 }
 </style>
diff --git a/src/settings.js b/src/settings.js
index f90de82..66c4854 100644
--- a/src/settings.js
+++ b/src/settings.js
@@ -9,14 +9,14 @@ const defaultSettings = {
   sidebarName: true,
   fixedHeader: true,
   tagsView: true,
-  layout: 'left',
-  theme: 'light',
-  themeColor: '#409EFF',
+  layout: 'left', // 导航模式：left、top、mix
+  theme: 'light', // 主题：light明亮，dark暗黑
+  themeColor: '#409EFF', // 主题颜色
   tokenType: 'header', // token方式，header、param
   tokenName: 'AdminToken', // token名称，前后端必须一致
   pageLimit: 20, // 分页每页默认数量
-  size: 'default',
-  language: 'zh-cn'
+  size: 'default', // 组件大小：large、default、small
+  language: 'zh-cn' //语言：zh-cn中文，en英文
 }
 
 export default defaultSettings
diff --git a/src/styles/dark.scss b/src/styles/dark.scss
index d8a27e7..38a0c09 100644
--- a/src/styles/dark.scss
+++ b/src/styles/dark.scss
@@ -9,6 +9,12 @@ html.dark {
   --subMenuHover: rgb(0 0 0 / 20%);
   --subMenuActiveText: var(--el-menu-active-color);
 
+  // wangEditor
+  --w-e-textarea-bg-color: var(--el-bg-color-overlay);
+  --w-e-toolbar-bg-color: var(--el-bg-color-overlay);
+  --w-e-modal-button-bg-color: var(--el-bg-color-overlay);
+  --w-e-toolbar-border-color: var(--el-button-border-color);
+
   .navbar {
     background-color: var(--el-bg-color);
     .setting-container .setting-item:hover {
diff --git a/src/views/content/content.vue b/src/views/content/content.vue
index be9acd6..8840122 100644
--- a/src/views/content/content.vue
+++ b/src/views/content/content.vue
@@ -359,7 +359,7 @@
           <el-tab-pane label="内容">
             <el-scrollbar native :height="height - 80">
               <el-form-item label="内容" prop="content">
-                <RichEditor :content="model.content" />
+                <RichEditor v-model="model.content" />
               </el-form-item>
             </el-scrollbar>
           </el-tab-pane>
diff --git a/src/views/file/setting.vue b/src/views/file/setting.vue
index eeaf93d..ac62162 100644
--- a/src/views/file/setting.vue
+++ b/src/views/file/setting.vue
@@ -332,7 +332,8 @@
                   </el-input>
                 </el-col>
                 <el-col class="line" :span="13">
-                  官方域名 在 [ 百度云 > 对象存储 > 发布管理 ] 获取。如：yyladmin.gz.bcebos.com
+                  官方域名 在 [ 百度云 > 对象存储 > Bucket列表 > 发布管理 ]
+                  获取。如：yyladmin.gz.bcebos.com
                 </el-col>
               </el-form-item>
               <el-form-item label="所属地域" prop="baidu_endpoint">
@@ -502,7 +503,12 @@
               <el-col :span="11">
                 <el-input v-model="model.image_ext" clearable />
               </el-col>
-              <el-col class="line" :span="13"> 允许上传的图片后缀，逗号,隔开 </el-col>
+              <el-col class="line" :span="13">
+                <el-tooltip :content="model.image_exts">
+                  <svg-icon icon-class="question-filled" />
+                </el-tooltip>
+                允许上传的图片后缀，逗号,隔开
+              </el-col>
             </el-form-item>
             <el-form-item label="图片大小" prop="image_size">
               <el-col :span="11">
@@ -517,7 +523,12 @@
               <el-col :span="11">
                 <el-input v-model="model.video_ext" clearable />
               </el-col>
-              <el-col class="line" :span="13"> 允许上传的视频后缀，逗号,隔开 </el-col>
+              <el-col class="line" :span="13">
+                <el-tooltip :content="model.video_exts">
+                  <svg-icon icon-class="question-filled" />
+                </el-tooltip>
+                允许上传的视频后缀，逗号,隔开
+              </el-col>
             </el-form-item>
             <el-form-item label="视频大小" prop="video_size">
               <el-col :span="11">
@@ -532,7 +543,12 @@
               <el-col :span="11">
                 <el-input v-model="model.audio_ext" clearable />
               </el-col>
-              <el-col class="line" :span="13"> 允许上传的音频后缀，逗号,隔开 </el-col>
+              <el-col class="line" :span="13">
+                <el-tooltip :content="model.audio_exts">
+                  <svg-icon icon-class="question-filled" />
+                </el-tooltip>
+                允许上传的音频后缀，逗号,隔开
+              </el-col>
             </el-form-item>
             <el-form-item label="音频大小" prop="audio_size">
               <el-col :span="11">
@@ -547,7 +563,12 @@
               <el-col :span="11">
                 <el-input v-model="model.word_ext" clearable />
               </el-col>
-              <el-col class="line" :span="13"> 允许上传的文档后缀，逗号,隔开 </el-col>
+              <el-col class="line" :span="13">
+                <el-tooltip :content="model.word_exts">
+                  <svg-icon icon-class="question-filled" />
+                </el-tooltip>
+                允许上传的文档后缀，逗号,隔开
+              </el-col>
             </el-form-item>
             <el-form-item label="文档大小" prop="word_size">
               <el-col :span="11">
@@ -562,7 +583,12 @@
               <el-col :span="11">
                 <el-input v-model="model.other_ext" clearable />
               </el-col>
-              <el-col class="line" :span="13"> 允许上传的其它文件后缀，逗号,隔开 </el-col>
+              <el-col class="line" :span="13">
+                <el-tooltip :content="model.other_exts">
+                  <svg-icon icon-class="question-filled" />
+                </el-tooltip>
+                允许上传的其它文件后缀，逗号,隔开
+              </el-col>
             </el-form-item>
             <el-form-item label="其它大小" prop="other_size">
               <el-col :span="11">
@@ -640,14 +666,19 @@ export default {
         aws_region: '',
         aws_domain: '',
         image_ext: '',
+        image_exts: '',
         image_size: 0,
         video_ext: '',
+        video_exts: '',
         video_size: 0,
         audio_ext: '',
+        audio_exts: '',
         audio_size: 0,
         word_ext: '',
+        word_exts: '',
         word_size: 0,
         other_ext: '',
+        other_exts: '',
         other_size: 0
       },
       rules: {
diff --git a/src/views/setting/accord.vue b/src/views/setting/accord.vue
index 2b2c5d8..eb85513 100644
--- a/src/views/setting/accord.vue
+++ b/src/views/setting/accord.vue
@@ -149,49 +149,57 @@
       top="5vh"
       destroy-on-close
     >
-      <el-scrollbar native :height="height - 30">
-        <el-form ref="ref" :rules="rules" :model="model" label-width="100px">
-          <el-form-item label="标识" prop="unique">
-            <el-input v-model="model.unique" placeholder="请输入标识（唯一）" clearable>
-              <template #append>
-                <el-button title="复制" @click="copy(model.unique)">
-                  <svg-icon icon-class="copy-document" />
-                </el-button>
-              </template>
-            </el-input>
-          </el-form-item>
-          <el-form-item label="名称" prop="name">
-            <el-input v-model="model.name" placeholder="请输入名称" clearable>
-              <template #append>
-                <el-button title="复制" @click="copy(model.name)">
-                  <svg-icon icon-class="copy-document" />
-                </el-button>
-              </template>
-            </el-input>
-          </el-form-item>
-          <el-form-item label="描述" prop="desc">
-            <el-input v-model="model.desc" type="textarea" autosize placeholder="请输入描述" />
-          </el-form-item>
-          <el-form-item label="备注" prop="remark">
-            <el-input v-model="model.remark" placeholder="请输入备注" clearable />
-          </el-form-item>
-          <el-form-item label="排序" prop="sort">
-            <el-input v-model="model.sort" type="number" />
-          </el-form-item>
-          <el-form-item label="内容" prop="content">
-            <RichEditor :content="model.content" />
-          </el-form-item>
-          <el-form-item v-if="model[idkey]" label="添加时间" prop="create_time">
-            <el-input v-model="model.create_time" disabled />
-          </el-form-item>
-          <el-form-item v-if="model[idkey]" label="修改时间" prop="update_time">
-            <el-input v-model="model.update_time" disabled />
-          </el-form-item>
-          <el-form-item v-if="model.delete_time" label="删除时间" prop="delete_time">
-            <el-input v-model="model.delete_time" disabled />
-          </el-form-item>
-        </el-form>
-      </el-scrollbar>
+      <el-form ref="ref" :rules="rules" :model="model" label-width="100px">
+        <el-tabs>
+          <el-tab-pane label="信息">
+            <el-scrollbar native :height="height - 80">
+              <el-form-item label="标识" prop="unique">
+                <el-input v-model="model.unique" placeholder="请输入标识（唯一）" clearable>
+                  <template #append>
+                    <el-button title="复制" @click="copy(model.unique)">
+                      <svg-icon icon-class="copy-document" />
+                    </el-button>
+                  </template>
+                </el-input>
+              </el-form-item>
+              <el-form-item label="名称" prop="name">
+                <el-input v-model="model.name" placeholder="请输入名称" clearable>
+                  <template #append>
+                    <el-button title="复制" @click="copy(model.name)">
+                      <svg-icon icon-class="copy-document" />
+                    </el-button>
+                  </template>
+                </el-input>
+              </el-form-item>
+              <el-form-item label="描述" prop="desc">
+                <el-input v-model="model.desc" type="textarea" autosize placeholder="请输入描述" />
+              </el-form-item>
+              <el-form-item label="备注" prop="remark">
+                <el-input v-model="model.remark" placeholder="请输入备注" clearable />
+              </el-form-item>
+              <el-form-item label="排序" prop="sort">
+                <el-input v-model="model.sort" type="number" />
+              </el-form-item>
+              <el-form-item v-if="model[idkey]" label="添加时间" prop="create_time">
+                <el-input v-model="model.create_time" disabled />
+              </el-form-item>
+              <el-form-item v-if="model[idkey]" label="修改时间" prop="update_time">
+                <el-input v-model="model.update_time" disabled />
+              </el-form-item>
+              <el-form-item v-if="model.delete_time" label="删除时间" prop="delete_time">
+                <el-input v-model="model.delete_time" disabled />
+              </el-form-item>
+            </el-scrollbar>
+          </el-tab-pane>
+          <el-tab-pane label="内容">
+            <el-scrollbar native :height="height - 80">
+              <el-form-item label="内容" prop="content">
+                <RichEditor v-model="model.content" />
+              </el-form-item>
+            </el-scrollbar>
+          </el-tab-pane>
+        </el-tabs>
+      </el-form>
       <template #footer>
         <el-button :loading="loading" @click="cancel">取消</el-button>
         <el-button :loading="loading" type="primary" @click="submit">提交</el-button>
@@ -316,6 +324,8 @@ export default {
                 this.loading = false
               })
           }
+        } else {
+          ElMessage.error('请完善必填项（带红色星号*）')
         }
       })
     },
diff --git a/src/views/setting/notice.vue b/src/views/setting/notice.vue
index fb99bbf..bf38a63 100644
--- a/src/views/setting/notice.vue
+++ b/src/views/setting/notice.vue
@@ -177,66 +177,84 @@
       :before-close="cancel"
       top="5vh"
     >
-      <el-scrollbar native :height="height - 30">
-        <el-form ref="ref" :model="model" :rules="rules" label-width="100px">
-          <el-form-item label="图片" prop="image_id">
-            <FileImage v-model="model.image_id" :file-url="model.image_url" :height="100" upload />
-          </el-form-item>
-          <el-form-item label="类型" prop="type">
-            <el-select v-model="model.type">
-              <el-option v-for="(item, index) in types" :key="index" :value="index" :label="item" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="标题" prop="title">
-            <el-col :span="18">
-              <el-input v-model="model.title" placeholder="请输入标题" clearable />
-            </el-col>
-            <el-col :span="3" class="text-center">标题颜色</el-col>
-            <el-col :span="3">
-              <el-color-picker v-model="model.title_color" />
-            </el-col>
-          </el-form-item>
-          <el-form-item label="描述" prop="desc">
-            <el-input v-model="model.desc" type="textarea" autosize placeholder="请输入描述" />
-          </el-form-item>
-          <el-form-item label="开始时间" prop="start_time">
-            <el-date-picker
-              v-model="model.start_time"
-              type="datetime"
-              value-format="YYYY-MM-DD HH:mm:ss"
-              placeholder="开始时间"
-              :default-time="new Date(2024, 1, 1, 0, 0, 0)"
-            />
-          </el-form-item>
-          <el-form-item label="结束时间" prop="end_time">
-            <el-date-picker
-              v-model="model.end_time"
-              type="datetime"
-              value-format="YYYY-MM-DD HH:mm:ss"
-              placeholder="结束时间"
-              :default-time="new Date(2024, 1, 1, 23, 59, 59)"
-            />
-          </el-form-item>
-          <el-form-item label="备注" prop="remark">
-            <el-input v-model="model.remark" placeholder="请输入备注" clearable />
-          </el-form-item>
-          <el-form-item label="排序" prop="sort">
-            <el-input v-model="model.sort" type="number" placeholder="请输入排序" />
-          </el-form-item>
-          <el-form-item label="内容" prop="content">
-            <RichEditor :content="model.content" />
-          </el-form-item>
-          <el-form-item v-if="model[idkey]" label="添加时间" prop="create_time">
-            <el-input v-model="model.create_time" disabled />
-          </el-form-item>
-          <el-form-item v-if="model[idkey]" label="修改时间" prop="update_time">
-            <el-input v-model="model.update_time" disabled />
-          </el-form-item>
-          <el-form-item v-if="model.delete_time" label="删除时间" prop="delete_time">
-            <el-input v-model="model.delete_time" disabled />
-          </el-form-item>
-        </el-form>
-      </el-scrollbar>
+      <el-form ref="ref" :model="model" :rules="rules" label-width="100px">
+        <el-tabs>
+          <el-tab-pane label="信息">
+            <el-scrollbar native :height="height - 80">
+              <el-form-item label="图片" prop="image_id">
+                <FileImage
+                  v-model="model.image_id"
+                  :file-url="model.image_url"
+                  :height="100"
+                  upload
+                />
+              </el-form-item>
+              <el-form-item label="类型" prop="type">
+                <el-select v-model="model.type">
+                  <el-option
+                    v-for="(item, index) in types"
+                    :key="index"
+                    :value="index"
+                    :label="item"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="标题" prop="title">
+                <el-col :span="18">
+                  <el-input v-model="model.title" placeholder="请输入标题" clearable />
+                </el-col>
+                <el-col :span="3" class="text-center">标题颜色</el-col>
+                <el-col :span="3">
+                  <el-color-picker v-model="model.title_color" />
+                </el-col>
+              </el-form-item>
+              <el-form-item label="描述" prop="desc">
+                <el-input v-model="model.desc" type="textarea" autosize placeholder="请输入描述" />
+              </el-form-item>
+              <el-form-item label="开始时间" prop="start_time">
+                <el-date-picker
+                  v-model="model.start_time"
+                  type="datetime"
+                  value-format="YYYY-MM-DD HH:mm:ss"
+                  placeholder="开始时间"
+                  :default-time="new Date(2024, 1, 1, 0, 0, 0)"
+                />
+              </el-form-item>
+              <el-form-item label="结束时间" prop="end_time">
+                <el-date-picker
+                  v-model="model.end_time"
+                  type="datetime"
+                  value-format="YYYY-MM-DD HH:mm:ss"
+                  placeholder="结束时间"
+                  :default-time="new Date(2024, 1, 1, 23, 59, 59)"
+                />
+              </el-form-item>
+              <el-form-item label="备注" prop="remark">
+                <el-input v-model="model.remark" placeholder="请输入备注" clearable />
+              </el-form-item>
+              <el-form-item label="排序" prop="sort">
+                <el-input v-model="model.sort" type="number" placeholder="请输入排序" />
+              </el-form-item>
+              <el-form-item v-if="model[idkey]" label="添加时间" prop="create_time">
+                <el-input v-model="model.create_time" disabled />
+              </el-form-item>
+              <el-form-item v-if="model[idkey]" label="修改时间" prop="update_time">
+                <el-input v-model="model.update_time" disabled />
+              </el-form-item>
+              <el-form-item v-if="model.delete_time" label="删除时间" prop="delete_time">
+                <el-input v-model="model.delete_time" disabled />
+              </el-form-item>
+            </el-scrollbar>
+          </el-tab-pane>
+          <el-tab-pane label="内容">
+            <el-scrollbar native :height="height - 80">
+              <el-form-item label="内容" prop="content">
+                <RichEditor v-model="model.content" />
+              </el-form-item>
+            </el-scrollbar>
+          </el-tab-pane>
+        </el-tabs>
+      </el-form>
       <template #footer>
         <el-button :loading="loading" @click="cancel">取消</el-button>
         <el-button :loading="loading" type="primary" @click="submit">提交</el-button>
diff --git a/src/views/system/notice.vue b/src/views/system/notice.vue
index 327ba06..20b53f0 100644
--- a/src/views/system/notice.vue
+++ b/src/views/system/notice.vue
@@ -162,61 +162,74 @@
       :before-close="cancel"
       top="5vh"
     >
-      <el-scrollbar native :height="height - 30">
-        <el-form ref="ref" :model="model" :rules="rules" label-width="100px">
-          <el-form-item label="图片" prop="image_id">
-            <FileImage v-model="model.image_id" :file-url="model.image_url" :height="100" upload />
-          </el-form-item>
-          <el-form-item label="标题" prop="title">
-            <el-col :span="18">
-              <el-input v-model="model.title" placeholder="请输入标题" clearable />
-            </el-col>
-            <el-col :span="3" style="text-align: center">标题颜色</el-col>
-            <el-col :span="3">
-              <el-color-picker v-model="model.title_color" />
-            </el-col>
-          </el-form-item>
-          <el-form-item label="简介" prop="desc">
-            <el-input v-model="model.desc" type="textarea" autosize placeholder="请输入简介" />
-          </el-form-item>
-          <el-form-item label="开始时间" prop="start_time">
-            <el-date-picker
-              v-model="model.start_time"
-              type="datetime"
-              value-format="YYYY-MM-DD HH:mm:ss"
-              :default-time="new Date(2024, 1, 1, 0, 0, 0)"
-              placeholder="开始时间"
-            />
-          </el-form-item>
-          <el-form-item label="结束时间" prop="end_time">
-            <el-date-picker
-              v-model="model.end_time"
-              type="datetime"
-              value-format="YYYY-MM-DD HH:mm:ss"
-              :default-time="new Date(2024, 1, 1, 23, 59, 59)"
-              placeholder="结束时间"
-            />
-          </el-form-item>
-          <el-form-item label="备注" prop="remark">
-            <el-input v-model="model.remark" placeholder="请输入备注" clearable />
-          </el-form-item>
-          <el-form-item label="排序" prop="sort">
-            <el-input v-model="model.sort" type="number" />
-          </el-form-item>
-          <el-form-item label="内容" prop="content">
-            <RichEditor :content="model.content" />
-          </el-form-item>
-          <el-form-item v-if="model[idkey]" label="添加时间" prop="create_time">
-            <el-input v-model="model.create_time" disabled />
-          </el-form-item>
-          <el-form-item v-if="model[idkey]" label="修改时间" prop="update_time">
-            <el-input v-model="model.update_time" disabled />
-          </el-form-item>
-          <el-form-item v-if="model.delete_time" label="删除时间" prop="delete_time">
-            <el-input v-model="model.delete_time" disabled />
-          </el-form-item>
-        </el-form>
-      </el-scrollbar>
+      <el-form ref="ref" :model="model" :rules="rules" label-width="100px">
+        <el-tabs>
+          <el-tab-pane label="信息">
+            <el-scrollbar native :height="height - 80">
+              <el-form-item label="图片" prop="image_id">
+                <FileImage
+                  v-model="model.image_id"
+                  :file-url="model.image_url"
+                  :height="100"
+                  upload
+                />
+              </el-form-item>
+              <el-form-item label="标题" prop="title">
+                <el-col :span="18">
+                  <el-input v-model="model.title" placeholder="请输入标题" clearable />
+                </el-col>
+                <el-col :span="3" style="text-align: center">标题颜色</el-col>
+                <el-col :span="3">
+                  <el-color-picker v-model="model.title_color" />
+                </el-col>
+              </el-form-item>
+              <el-form-item label="简介" prop="desc">
+                <el-input v-model="model.desc" type="textarea" autosize placeholder="请输入简介" />
+              </el-form-item>
+              <el-form-item label="开始时间" prop="start_time">
+                <el-date-picker
+                  v-model="model.start_time"
+                  type="datetime"
+                  value-format="YYYY-MM-DD HH:mm:ss"
+                  :default-time="new Date(2024, 1, 1, 0, 0, 0)"
+                  placeholder="开始时间"
+                />
+              </el-form-item>
+              <el-form-item label="结束时间" prop="end_time">
+                <el-date-picker
+                  v-model="model.end_time"
+                  type="datetime"
+                  value-format="YYYY-MM-DD HH:mm:ss"
+                  :default-time="new Date(2024, 1, 1, 23, 59, 59)"
+                  placeholder="结束时间"
+                />
+              </el-form-item>
+              <el-form-item label="备注" prop="remark">
+                <el-input v-model="model.remark" placeholder="请输入备注" clearable />
+              </el-form-item>
+              <el-form-item label="排序" prop="sort">
+                <el-input v-model="model.sort" type="number" />
+              </el-form-item>
+              <el-form-item v-if="model[idkey]" label="添加时间" prop="create_time">
+                <el-input v-model="model.create_time" disabled />
+              </el-form-item>
+              <el-form-item v-if="model[idkey]" label="修改时间" prop="update_time">
+                <el-input v-model="model.update_time" disabled />
+              </el-form-item>
+              <el-form-item v-if="model.delete_time" label="删除时间" prop="delete_time">
+                <el-input v-model="model.delete_time" disabled />
+              </el-form-item>
+            </el-scrollbar>
+          </el-tab-pane>
+          <el-tab-pane label="内容">
+            <el-scrollbar native :height="height - 80">
+              <el-form-item label="内容" prop="content">
+                <RichEditor v-model="model.content" />
+              </el-form-item>
+            </el-scrollbar>
+          </el-tab-pane>
+        </el-tabs>
+      </el-form>
       <template #footer>
         <el-button :loading="loading" @click="cancel">取消</el-button>
         <el-button :loading="loading" type="primary" @click="submit">提交</el-button>
@@ -348,6 +361,8 @@ export default {
                 this.loading = false
               })
           }
+        } else {
+          ElMessage.error('请完善必填项（带红色星号*）')
         }
       })
     },
diff --git a/vite.config.js b/vite.config.js
index e196f9d..4a13f26 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -84,6 +84,7 @@ export default defineConfig(({ mode }) => {
         'echarts/charts',
         'echarts/components',
         'echarts/renderers',
+        'element-plus/es/components/affix/style/css',
         'element-plus/es/components/alert/style/css',
         'element-plus/es/components/avatar/style/css',
         'element-plus/es/components/breadcrumb-item/style/css',