增加图片 Base64 粘贴

frontend/src/components/Editor.vue

@@ -183,10 +183,16 @@ export default {
         console.error(error)
       }
     },
-    async pasteImg (file) {
-      const { relativePath } = await File.upload(this.currentFile.repo, this.currentFile.path, file)
-      this.$bus.emit('file-uploaded', relativePath)
-      this.$refs.editor.insert(`![图片](${encodeMarkdownLink(relativePath)})\n`)
+    async pasteImg (file, asBase64) {
+      console.log(file, asBase64)
+      if (asBase64) {
+        const uri = await File.toBase64URL(file)
+        this.$refs.editor.insert(`![图片](${uri})\n`)
+      } else {
+        const { relativePath } = await File.upload(this.currentFile.repo, this.currentFile.path, file)
+        this.$bus.emit('file-uploaded', relativePath)
+        this.$refs.editor.insert(`![图片](${encodeMarkdownLink(relativePath)})\n`)
+      }
     },
     async uploadFile (file) {
       const filename = `${dayjs().format('YYYYMMDDHHmmss')}.${file.name}`

frontend/src/components/MonacoEditor.vue

@@ -195,7 +195,7 @@ export default {
     paste (e) {
       if (this.editor.hasTextFocus()) {
         const items = e.clipboardData.items
-        if (keys['b'] || keys['B']) { // 粘贴 HTML 转为 markdown
+        if (keys['m'] || keys['M']) { // 粘贴 HTML 转为 markdown
           for (let i = 0; i < items.length; i++) {
             if (items[i].type.match(/^text\/html$/i)) {
               items[i].getAsString(str => {
@@ -209,8 +209,10 @@ export default {
           e.stopPropagation()
         } else {
           for (let i = 0; i < items.length; i++) {
-            if (items[i].type.match(/^image\/(png|jpg|jpeg|gif)$/i)) {
-              this.$emit('paste-img', items[i].getAsFile())
+            const fileType = items[i].type
+            if (fileType.match(/^image\/(png|jpg|jpeg|gif)$/i)) {
+              const asBase64 = keys['b'] || keys['B'] // Ctrl + v 粘贴的同时 按下了 B 键，就粘贴 base64 图像
+              this.$emit('paste-img', items[i].getAsFile(), asBase64)
             }
           }
         }

frontend/src/lib/file.js

@@ -157,6 +157,13 @@ const openInOS = async ({ repo, path }) => {
   return fetchHttp(`/api/open?repo=${encodeURIComponent(repo)}&path=${encodeURIComponent(path)}`)
 }
 
+const toBase64URL = async file => new Promise((resolve, reject) => {
+  const fr = new FileReader()
+  fr.readAsDataURL(file)
+  fr.onload = () => resolve(fr.result)
+  fr.onerror = error => reject(error)
+})
+
 export default {
   isBelongTo,
   isSameFile,
@@ -180,4 +187,5 @@ export default {
   mark,
   unmark,
   markedFiles,
+  toBase64URL,
 }