🐛 Fix: url uploader bug

package.json

@@ -42,7 +42,7 @@
     "keycode": "^2.2.0",
     "lodash-id": "^0.14.0",
     "lowdb": "^1.0.0",
-    "picgo": "^1.4.5",
+    "picgo": "^1.4.6",
     "vue": "^2.6.10",
     "vue-gallery": "^2.0.1",
     "vue-lazyload": "^1.2.6",

src/renderer/components/InputBoxDialog.vue

@@ -39,15 +39,15 @@ export default class extends Vue {
     this.initInputBoxValue(options)
   }
   initInputBoxValue (options: IShowInputBoxOption) {
-    this.inputBoxValue = ''
+    this.inputBoxValue = options.value || ''
     this.inputBoxOptions.title = options.title || ''
     this.inputBoxOptions.placeholder = options.placeholder || ''
     this.showInputBoxVisible = true
   }
   handleInputBoxClose () {
     // TODO: RPCServer
-    ipcRenderer.send(SHOW_INPUT_BOX, this.inputBoxValue)
+    ipcRenderer.send(SHOW_INPUT_BOX, '')
-    this.$bus.$emit(SHOW_INPUT_BOX_RESPONSE, this.inputBoxValue)
+    this.$bus.$emit(SHOW_INPUT_BOX_RESPONSE, '')
   }
   beforeDestroy () {
     ipcRenderer.removeListener(SHOW_INPUT_BOX, this.ipcEventHandler)

src/renderer/pages/Upload.vue

@@ -48,8 +48,8 @@
             <div class="paste-style__text">
               快捷上传
             </div>
-            <el-button type="primary" round size="mini" @click="uploadClipboardFiles" class="quick-upload">剪贴板</el-button>
+            <el-button type="primary" round size="mini" @click="uploadClipboardFiles" class="quick-upload" style="width: 50%">剪贴板图片</el-button>
-            <el-button type="primary" round size="mini" @click="uploadURLFiles" class="quick-upload">URL</el-button>
+            <el-button type="primary" round size="mini" @click="uploadURLFiles" class="quick-upload" style="width: 46%; margin-left: 6px">URL</el-button>
           </div>
         </div>
       </el-col>
@@ -67,6 +67,9 @@ import {
   SHOW_INPUT_BOX,
   SHOW_INPUT_BOX_RESPONSE
 } from '~/universal/events/constants'
+import {
+  isUrl
+} from '~/universal/utils/common'
 const { Menu } = remote
 @Component({
   name: 'upload'
@@ -118,7 +121,34 @@ export default class extends Vue {
   }
   onDrop (e: DragEvent) {
     this.dragover = false
-    this.ipcSendFiles(e.dataTransfer!.files)
+    const items = e.dataTransfer!.items
+    if (items.length === 2 && items[0].type === 'text/uri-list') {
+      this.handleURLDrag(items, e.dataTransfer!)
+    } else if (items[0].type === 'text/plain') {
+      const str = e.dataTransfer!.getData(items[0].type)
+      if (isUrl(str)) {
+        ipcRenderer.send('uploadChoosedFiles', [{ path: str }])
+      } else {
+        this.$message.error('请拖入合法的图片文件或者图片URL地址')
+      }
+    } else {
+      this.ipcSendFiles(e.dataTransfer!.files)
+    }
+  }
+  handleURLDrag (items: DataTransferItemList, dataTransfer: DataTransfer) {
+    // text/html
+    // Use this data to get a more precise URL
+    const urlString = dataTransfer.getData(items[1].type)
+    const urlMatch = urlString.match(/<img.*src="(.*?)"/)
+    if (urlMatch) {
+      ipcRenderer.send('uploadChoosedFiles', [
+        {
+          path: urlMatch[1]
+        }
+      ])
+    } else {
+      this.$message.error('请拖入合法的图片文件或者图片URL地址')
+    }
   }
   openUplodWindow () {
     document.getElementById('file-uploader')!.click()
@@ -147,15 +177,17 @@ export default class extends Vue {
   uploadClipboardFiles () {
     ipcRenderer.send('uploadClipboardFilesFromUploadPage')
   }
-  uploadURLFiles () {
+  async uploadURLFiles () {
+    const str = await navigator.clipboard.readText()
     this.$bus.$emit(SHOW_INPUT_BOX, {
+      value: isUrl(str) ? str : '',
       title: '请输入URL',
       placeholder: 'http://或者https://开头'
     })
   }
   handleInputBoxValue (val: string) {
     if (val === '') return false
-    if (val.startsWith('http://') || val.startsWith('https://')) {
+    if (isUrl(val)) {
       ipcRenderer.send('uploadChoosedFiles', [{
         path: val
       }])
@@ -261,8 +293,6 @@ export default class extends Vue {
     .el-radio-button__inner
       border-left none
       border-radius 0 14px 14px 0
-  .quick-upload
-    width 46%
   .el-icon-caret-bottom
     cursor pointer
 </style>

src/universal/types/types.d.ts

@@ -179,6 +179,7 @@ interface IGuiApi {
   showMessageBox: (options?: IShowMessageBoxOption) => Promise<IShowMessageBoxResult>
 }
 interface IShowInputBoxOption {
+  value?: string
   title: string
   placeholder: string
 }

src/universal/utils/common.ts

@@ -0,0 +1 @@
+export const isUrl = (url: string): boolean => (url.startsWith('http://') || url.startsWith('https://'))

yarn.lock

@@ -8292,10 +8292,10 @@ performance-now@^2.1.0:
   resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b"
   integrity sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=
 
-picgo@^1.4.5:
+picgo@^1.4.6:
-  version "1.4.5"
+  version "1.4.6"
-  resolved "https://registry.yarnpkg.com/picgo/-/picgo-1.4.5.tgz#3579aea9017a68c4b1e80e7af9060eb70ab98a9a"
+  resolved "https://registry.yarnpkg.com/picgo/-/picgo-1.4.6.tgz#aa90439a253c5a07068b136a0d1426f63236735b"
-  integrity sha512-uef5tkOsswj6XJX2kYlUkuIPhaUS4PNSCMZ3IYgSCZvvxC4e1o8Qro4PIYlMAIEDPqP30OrKNab/wmaJxizv+g==
+  integrity sha512-VNh5el0hkh0OrxqTPGkRAUtGmncr7cdKrjdvp6yf2Iwx+O+uJ4IHgKMmzAj+siJGTBENL0eWoujmzX07zAt30g==
   dependencies:
     chalk "^2.4.1"
     commander "^2.17.0"