feat: quill module MagicUrl

src/components/quill-editor/QuillEditor.vue

@@ -7,6 +7,8 @@ import { QuillEditor } from '@vueup/vue-quill'
 import BlotFormatter from 'quill-blot-formatter'
 // 引入 module: 上传图片
 import ImageUploader from 'quill-image-uploader'
+// 引入 module: URL、邮箱 自动识别
+import MagicUrl from 'quill-magic-url'
 
 // 自定义 quill 的两个主题，第二个主题暂时懒得动
 import '@/styles/editor/editor.snow.scss'
@@ -28,6 +30,7 @@ import { storeToRefs } from 'pinia'
 import DOMPurify from 'dompurify'
 // 导入防抖函数
 import { debounce } from '@/utils/debounce'
+import kungalgame from '@/router/modules/kungalgame'
 
 const { editorHeight, mode, theme, isSave, content } = storeToRefs(
   useKUNGalgameEditStore()
@@ -82,6 +85,21 @@ const modules = [
       },
     },
   },
+  // MagicUrl
+  {
+    name: 'magicUrl',
+    module: MagicUrl,
+    options: {
+      // Regex used to check URLs during typing
+      urlRegularExpression:
+        /(?:https?:\/\/)?(?:www\.)?[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}(?:\/[^\s]*)?/,
+      // Regex used to check URLs on paste
+      globalRegularExpression: /(https?:\/\/|www\.|tel:)[\S]+/g,
+      mailRegularExpression: /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/,
+      globalMailRegularExpression:
+        /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/,
+    },
+  },
 ]
 
 // 编辑器的高度

src/language/en.ts

@@ -143,7 +143,7 @@ export default {
       'Click to select topic categories (multiple selections allowed) : ',
     btnGalgame: 'Visual Novel',
     btnTechnique: 'Technique',
-    others: 'Others',
+    btnOthers: 'Others',
     publish: 'Confirm Publish',
     draft: 'Save Draft',
   },

src/language/zh.ts

@@ -142,7 +142,7 @@ export default {
     categories: '点击选择话题的分区（可多选）:',
     btnGalgame: 'Galgame',
     btnTechnique: '技术交流',
-    others: '其它',
+    btnOthers: '其它',
     publish: '确认发布',
     draft: '保存草稿',
   },

src/views/edit/components/Footer.vue

@@ -59,7 +59,7 @@ const handleClickCategory = (kun: Category) => {
         @click="handleClickCategory(kun)"
         :class="{ active: selectedCategories.includes(kun.name) }"
       >
-        {{ kun.name }}
+        {{ $tm(`edit.${kun.name}`) }}
       </span>
     </div>
   </div>

src/views/edit/components/category.ts

@@ -8,14 +8,14 @@ export interface Category {
 export const category: Category[] = [
   {
     index: 1,
-    name: 'Galgame',
+    name: 'btnGalgame',
   },
   {
     index: 2,
-    name: 'Technique',
+    name: 'btnTechnique',
   },
   {
     index: 3,
-    name: 'Others',
+    name: 'btnOthers',
   },
 ]