消息修复

web/src/views/NotificationCenterView.vue

@@ -13,15 +13,30 @@ import {
 } from '@element-plus/icons-vue'
 import { Ckeditor } from '@ckeditor/ckeditor5-vue'
 import {
+  AutoLink,
   BlockQuote,
   Bold,
   ClassicEditor,
   Essentials,
   Heading,
+  Image,
+  ImageCaption,
+  ImageInsert,
+  ImageInsertViaUrl,
+  ImageResize,
+  ImageStyle,
+  ImageToolbar,
   Italic,
   Link,
+  LinkImage,
   List,
   Paragraph,
+  Table,
+  TableCaption,
+  TableCellProperties,
+  TableColumnResize,
+  TableProperties,
+  TableToolbar,
   type EditorConfig,
 } from 'ckeditor5'
 import 'ckeditor5/ckeditor5.css'
@@ -84,8 +99,23 @@ const editorConfig: EditorConfig = {
     Bold,
     Italic,
     Link,
+    AutoLink,
     List,
     BlockQuote,
+    Image,
+    ImageCaption,
+    ImageInsert,
+    ImageInsertViaUrl,
+    ImageResize,
+    ImageStyle,
+    ImageToolbar,
+    LinkImage,
+    Table,
+    TableCaption,
+    TableCellProperties,
+    TableColumnResize,
+    TableProperties,
+    TableToolbar,
   ],
   toolbar: {
     items: [
@@ -95,6 +125,9 @@ const editorConfig: EditorConfig = {
       'italic',
       'link',
       '|',
+      'insertTable',
+      'insertImage',
+      '|',
       'bulletedList',
       'numberedList',
       'blockQuote',
@@ -115,6 +148,32 @@ const editorConfig: EditorConfig = {
     addTargetToExternalLinks: true,
     defaultProtocol: 'https://',
   },
+  image: {
+    insert: {
+      integrations: ['insertImageViaUrl'],
+    },
+    toolbar: [
+      'toggleImageCaption',
+      'imageTextAlternative',
+      '|',
+      'imageStyle:inline',
+      'imageStyle:wrapText',
+      'imageStyle:breakText',
+      '|',
+      'resizeImage',
+      'linkImage',
+    ],
+  },
+  table: {
+    contentToolbar: [
+      'tableColumn',
+      'tableRow',
+      'mergeTableCells',
+      'toggleTableCaption',
+      'tableProperties',
+      'tableCellProperties',
+    ],
+  },
 }
 
 const categories: Record<string, { label: string; className: string }> = {
@@ -808,7 +867,7 @@ onMounted(() => load())
               :config="editorConfig"
             />
             <div class="editor-footnote">
-              <span>支持标题、列表、引用和链接；不支持上传附件或图片。</span>
+              <span>支持表格、超链接和外链图片；图片请填写 HTTPS 地址，不上传本地文件。</span>
               <b :class="{ warning: messageForm.content.length > 18000 }">
                 {{ editorTextLength }} 字 · 源码 {{ messageForm.content.length }}/20000
               </b>