From b8ec879e238eea6efb5371d7264b7a5c47ecea5d Mon Sep 17 00:00:00 2001
From: Molunerfinn <marksz@teamsz.xyz>
Date: Sat, 21 Dec 2019 17:28:29 +0800
Subject: [PATCH] :hammer: Refactor: change vue-js -> vue-ts && add typos

---
 src/background.ts                        | 14 ++---
 src/main/migrate/shortKeyUpdateHelper.ts |  2 +-
 src/main/utils/getPicBeds.ts             |  4 +-
 src/main/utils/shortKeyHandler.ts        |  4 +-
 src/main/utils/uploader.ts               |  2 +-
 src/renderer/layouts/SettingPage.vue     |  4 +-
 src/renderer/pages/Gallery.vue           |  4 +-
 src/renderer/pages/MiniPage.vue          |  4 +-
 src/renderer/pages/PicGoSetting.vue      |  4 +-
 src/renderer/pages/ShortCut.vue          |  6 +-
 src/renderer/pages/Upload.vue            |  6 +-
 src/renderer/pages/picbeds/AliYun.vue    | 66 ++++++++++----------
 src/renderer/pages/picbeds/GitHub.vue    | 64 +++++++++----------
 src/renderer/pages/picbeds/Imgur.vue     | 58 ++++++++----------
 src/renderer/pages/picbeds/Others.vue    | 78 +++++++++++++-----------
 src/renderer/pages/picbeds/Qiniu.vue     | 68 ++++++++++-----------
 src/renderer/pages/picbeds/SMMS.vue      | 33 +++++-----
 src/renderer/pages/picbeds/TcYun.vue     | 77 +++++++++++------------
 src/renderer/pages/picbeds/UpYun.vue     | 64 +++++++++----------
 src/renderer/pages/picbeds/Weibo.vue     |  2 +-
 src/universal/types/types.d.ts           | 69 ++++++++++++++++++---
 21 files changed, 333 insertions(+), 300 deletions(-)

diff --git a/src/background.ts b/src/background.ts
index 772fe28..908fe60 100644
--- a/src/background.ts
+++ b/src/background.ts
@@ -252,7 +252,7 @@ const createMiniWidow = () => {
   if (miniWindow) {
     return false
   }
-  let obj: BrowserWindowOptions = {
+  let obj: IBrowserWindowOptions = {
     height: 64,
     width: 64,
     show: process.platform === 'linux',
@@ -284,7 +284,7 @@ const createMiniWidow = () => {
 }
 
 const createSettingWindow = () => {
-  const options: BrowserWindowOptions = {
+  const options: IBrowserWindowOptions = {
     height: 450,
     width: 800,
     show: false,
@@ -355,7 +355,7 @@ const createMenu = () => {
   }
 }
 
-const toggleWindow = (bounds: Bounds) => {
+const toggleWindow = (bounds: IBounds) => {
   if (window!.isVisible()) {
     window!.hide()
   } else {
@@ -363,7 +363,7 @@ const toggleWindow = (bounds: Bounds) => {
   }
 }
 
-const showWindow = (bounds: Bounds) => {
+const showWindow = (bounds: IBounds) => {
   window!.setPosition(bounds.x - 98 + 11, bounds.y, false)
   window!.webContents.send('updateFiles')
   window!.show()
@@ -404,7 +404,7 @@ const uploadClipboardFiles = async () => {
   }
 }
 
-const uploadChoosedFiles = async (webContents: WebContents, files: FileWithPath[]) => {
+const uploadChoosedFiles = async (webContents: WebContents, files: IFileWithPath[]) => {
   const input = files.map(item => item.path)
   const imgs = await new Uploader(input, webContents).upload()
   if (imgs !== false) {
@@ -458,11 +458,11 @@ ipcMain.on('uploadClipboardFilesFromUploadPage', () => {
   uploadClipboardFiles()
 })
 
-ipcMain.on('uploadChoosedFiles', async (evt: IpcMainEvent, files: FileWithPath[]) => {
+ipcMain.on('uploadChoosedFiles', async (evt: IpcMainEvent, files: IFileWithPath[]) => {
   return uploadChoosedFiles(evt.sender, files)
 })
 
-ipcMain.on('updateShortKey', (evt: IpcMainEvent, item: ShortKeyConfig, oldKey: string) => {
+ipcMain.on('updateShortKey', (evt: IpcMainEvent, item: IShortKeyConfig, oldKey: string) => {
   shortKeyUpdater(globalShortcut, item, oldKey)
   const notification = new Notification({
     title: '操作成功',
diff --git a/src/main/migrate/shortKeyUpdateHelper.ts b/src/main/migrate/shortKeyUpdateHelper.ts
index f4981a2..5786ce7 100644
--- a/src/main/migrate/shortKeyUpdateHelper.ts
+++ b/src/main/migrate/shortKeyUpdateHelper.ts
@@ -1,6 +1,6 @@
 import DB from '#/datastore'
 // from v2.1.2
-const updateShortKeyFromVersion212 = (db: typeof DB, shortKeyConfig: ShortKeyConfigs | OldShortKeyConfigs) => {
+const updateShortKeyFromVersion212 = (db: typeof DB, shortKeyConfig: IShortKeyConfigs | IOldShortKeyConfigs) => {
   let needUpgrade = false
   if (shortKeyConfig.upload) {
     needUpgrade = true
diff --git a/src/main/utils/getPicBeds.ts b/src/main/utils/getPicBeds.ts
index b7c5ae6..35c2dec 100644
--- a/src/main/utils/getPicBeds.ts
+++ b/src/main/utils/getPicBeds.ts
@@ -12,13 +12,13 @@ const getPicBeds = (app: App) => {
   const picBedTypes = picgo.helper.uploader.getIdList()
   const picBedFromDB = db.get('picBed.list') || []
   const picBeds = picBedTypes.map((item: string) => {
-    const visible = picBedFromDB.find((i: PicBedType) => i.type === item) // object or undefined
+    const visible = picBedFromDB.find((i: IPicBedType) => i.type === item) // object or undefined
     return {
       type: item,
       name: picgo.helper.uploader.get(item).name || item,
       visible: visible ? visible.visible : true
     }
-  }) as PicBedType[]
+  }) as IPicBedType[]
   picgo.cmd.program.removeAllListeners()
   return picBeds
 }
diff --git a/src/main/utils/shortKeyHandler.ts b/src/main/utils/shortKeyHandler.ts
index 2588950..ef120f2 100644
--- a/src/main/utils/shortKeyHandler.ts
+++ b/src/main/utils/shortKeyHandler.ts
@@ -24,7 +24,7 @@ const shortKeyHandler = (name: string) => {
 /**
  * 用于更新快捷键绑定
  */
-const shortKeyUpdater = (globalShortcut: GlobalShortcut, item: ShortKeyConfig, oldKey: string) => {
+const shortKeyUpdater = (globalShortcut: GlobalShortcut, item: IShortKeyConfig, oldKey: string) => {
   // 如果提供了旧key，则解绑
   if (oldKey) {
     globalShortcut.unregister(oldKey)
@@ -39,7 +39,7 @@ const shortKeyUpdater = (globalShortcut: GlobalShortcut, item: ShortKeyConfig, o
 }
 
 // 初始化阶段的注册
-const initShortKeyRegister = (globalShortcut: GlobalShortcut, shortKeys: ShortKeyConfig[]) => {
+const initShortKeyRegister = (globalShortcut: GlobalShortcut, shortKeys: IShortKeyConfig[]) => {
   let errorList = []
   for (let i in shortKeys) {
     try {
diff --git a/src/main/utils/uploader.ts b/src/main/utils/uploader.ts
index 86c3b4a..c7d9019 100644
--- a/src/main/utils/uploader.ts
+++ b/src/main/utils/uploader.ts
@@ -36,7 +36,7 @@ const renameURL = process.env.NODE_ENV === 'development'
 // }
 
 const createRenameWindow = (win: BrowserWindow) => {
-  let options: BrowserWindowOptions = {
+  let options: IBrowserWindowOptions = {
     height: 175,
     width: 300,
     show: true,
diff --git a/src/renderer/layouts/SettingPage.vue b/src/renderer/layouts/SettingPage.vue
index 40cff5f..dbc0fe1 100644
--- a/src/renderer/layouts/SettingPage.vue
+++ b/src/renderer/layouts/SettingPage.vue
@@ -174,7 +174,7 @@ export default class extends Vue {
   shortKey: ShortKeyMap = {
     upload: db.get('shortKey.upload')
   }
-  picBed: PicBedType[] = []
+  picBed: IPicBedType[] = []
   // for showInputBox
   showInputBoxVisible = false
   inputBoxValue = ''
@@ -276,7 +276,7 @@ export default class extends Vue {
   openMiniWindow () {
     ipcRenderer.send('openMiniWindow')
   }
-  getPicBeds (event: IpcRendererEvent, picBeds: PicBedType[]) {
+  getPicBeds (event: IpcRendererEvent, picBeds: IPicBedType[]) {
     this.picBed = picBeds
   }
   handleInputBoxClose () {
diff --git a/src/renderer/pages/Gallery.vue b/src/renderer/pages/Gallery.vue
index 93c1568..7131444 100644
--- a/src/renderer/pages/Gallery.vue
+++ b/src/renderer/pages/Gallery.vue
@@ -143,7 +143,7 @@ export default class extends Vue {
     UBB: 'UBB',
     Custom: 'Custom'
   }
-  picBed: PicBedType[] = []
+  picBed: IPicBedType[] = []
   beforeRouteEnter (to: any, from: any, next: any) {
     next((vm: any) => {
       vm.getGallery()
@@ -166,7 +166,7 @@ export default class extends Vue {
   set filterList (val) {
     this.images = val
   }
-  getPicBeds (event: IpcRendererEvent, picBeds: PicBedType[]) {
+  getPicBeds (event: IpcRendererEvent, picBeds: IPicBedType[]) {
     this.picBed = picBeds
   }
   getGallery () {
diff --git a/src/renderer/pages/MiniPage.vue b/src/renderer/pages/MiniPage.vue
index 0d516da..50bf7ce 100644
--- a/src/renderer/pages/MiniPage.vue
+++ b/src/renderer/pages/MiniPage.vue
@@ -40,7 +40,7 @@ export default class extends Vue {
   screenY: number = -1
   menu: Electron.Menu | null = null
   os = ''
-  picBed: PicBedType[] = []
+  picBed: IPicBedType[] = []
   created () {
     this.os = process.platform
     ipcRenderer.on('uploadProgress', (event: IpcRendererEvent, progress: number) => {
@@ -90,7 +90,7 @@ export default class extends Vue {
     document.getElementById('file-uploader').value = ''
   }
   ipcSendFiles (files: FileList) {
-    let sendFiles: FileWithPath[] = []
+    let sendFiles: IFileWithPath[] = []
     Array.from(files).forEach((item, index) => {
       let obj = {
         name: item.name,
diff --git a/src/renderer/pages/PicGoSetting.vue b/src/renderer/pages/PicGoSetting.vue
index ed60d1a..ee0966e 100644
--- a/src/renderer/pages/PicGoSetting.vue
+++ b/src/renderer/pages/PicGoSetting.vue
@@ -283,7 +283,7 @@ export default class extends Vue {
     miniWindowOntop: db.get('settings.miniWindowOntop') || false,
     logLevel
   }
-  picBed: PicBedType[] = []
+  picBed: IPicBedType[] = []
   logFileVisible = false
   keyBindingVisible = false
   customLinkVisible = false
@@ -325,7 +325,7 @@ export default class extends Vue {
     ipcRenderer.send('getPicBeds')
     ipcRenderer.on('getPicBeds', this.getPicBeds)
   }
-  getPicBeds (event: Event, picBeds: PicBedType[]) {
+  getPicBeds (event: Event, picBeds: IPicBedType[]) {
     this.picBed = picBeds
     this.form.showPicBedList = this.picBed.map(item => {
       if (item.visible) {
diff --git a/src/renderer/pages/ShortCut.vue b/src/renderer/pages/ShortCut.vue
index 48d1c11..8ad4c79 100644
--- a/src/renderer/pages/ShortCut.vue
+++ b/src/renderer/pages/ShortCut.vue
@@ -102,13 +102,13 @@ import { ipcRenderer } from 'electron'
   name: 'shortcut-page'
 })
 export default class extends Vue {
-  list: ShortKeyConfig[] = []
+  list: IShortKeyConfig[] = []
   keyBindingVisible = false
   shortKeyName = ''
   shortKey = ''
   currentIndex = 0
   created () {
-    const shortKeyConfig = this.$db.get('settings.shortKey') as ShortKeyConfigs
+    const shortKeyConfig = this.$db.get('settings.shortKey') as IShortKeyConfigs
     this.list = Object.keys(shortKeyConfig).map(item => shortKeyConfig[item])
   }
   @Watch('keyBindingVisible')
@@ -119,7 +119,7 @@ export default class extends Vue {
     const [origin] = item.split(':')
     return origin
   }
-  toggleEnable (item: ShortKeyConfig) {
+  toggleEnable (item: IShortKeyConfig) {
     const status = !item.enable
     item.enable = status
     this.$db.set(`settings.shortKey.${item.name}.enable`, status)
diff --git a/src/renderer/pages/Upload.vue b/src/renderer/pages/Upload.vue
index 4020a34..5511043 100644
--- a/src/renderer/pages/Upload.vue
+++ b/src/renderer/pages/Upload.vue
@@ -72,7 +72,7 @@ export default class extends Vue {
   showProgress = false
   showError = false
   pasteStyle = ''
-  picBed: PicBedType[] = []
+  picBed: IPicBedType[] = []
   picBedName = ''
   menu: Electron.Menu | null= null
   mounted () {
@@ -122,7 +122,7 @@ export default class extends Vue {
     (document.getElementById('file-uploader') as HTMLInputElement).value = ''
   }
   ipcSendFiles (files: FileList) {
-    let sendFiles: FileWithPath[] = []
+    let sendFiles: IFileWithPath[] = []
     Array.from(files).forEach((item, index) => {
       let obj = {
         name: item.name,
@@ -149,7 +149,7 @@ export default class extends Vue {
       }
     })
   }
-  getPicBeds (event: Event, picBeds: PicBedType[]) {
+  getPicBeds (event: Event, picBeds: IPicBedType[]) {
     this.picBed = picBeds
     this.getDefaultPicBed()
   }
diff --git a/src/renderer/pages/picbeds/AliYun.vue b/src/renderer/pages/picbeds/AliYun.vue
index b0f1bf4..6597b46 100644
--- a/src/renderer/pages/picbeds/AliYun.vue
+++ b/src/renderer/pages/picbeds/AliYun.vue
@@ -64,47 +64,43 @@
     </el-row>
   </div>
 </template>
-<script>
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/ConfirmButtonMixin'
-export default {
-  mixins: [mixin],
+@Component({
   name: 'aliyun',
-  data () {
-    return {
-      form: {
-        accessKeyId: '',
-        accessKeySecret: '',
-        bucket: '',
-        area: '',
-        path: '',
-        customUrl: ''
-      }
-    }
-  },
+  mixins: [mixin]
+})
+export default class extends Vue {
+  form: IAliYunConfig = {
+    accessKeyId: '',
+    accessKeySecret: '',
+    bucket: '',
+    area: '',
+    path: '',
+    customUrl: ''
+  }
   created () {
-    const config = this.$db.get('picBed.aliyun')
+    const config = this.$db.get('picBed.aliyun') as IAliYunConfig
     if (config) {
-      for (let i in config) {
-        this.form[i] = config[i]
-      }
+      this.form = Object.assign({}, config)
     }
-  },
-  methods: {
-    confirm () {
-      this.$refs.aliyun.validate((valid) => {
-        if (valid) {
-          this.$db.set('picBed.aliyun', this.form).write()
-          const successNotification = new window.Notification('设置结果', {
-            body: '设置成功'
-          })
-          successNotification.onclick = () => {
-            return true
-          }
-        } else {
-          return false
+  }
+  confirm () {
+    // @ts-ignore
+    this.$refs.aliyun.validate((valid) => {
+      if (valid) {
+        this.$db.set('picBed.aliyun', this.form)
+        const successNotification = new window.Notification('设置结果', {
+          body: '设置成功'
+        })
+        successNotification.onclick = () => {
+          return true
         }
-      })
-    }
+      } else {
+        return false
+      }
+    })
   }
 }
 </script>
diff --git a/src/renderer/pages/picbeds/GitHub.vue b/src/renderer/pages/picbeds/GitHub.vue
index 816c516..723a6a3 100644
--- a/src/renderer/pages/picbeds/GitHub.vue
+++ b/src/renderer/pages/picbeds/GitHub.vue
@@ -56,46 +56,42 @@
     </el-row>
   </div>
 </template>
-<script>
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/ConfirmButtonMixin'
-export default {
+@Component({
   name: 'github',
-  mixins: [mixin],
-  data () {
-    return {
-      form: {
-        repo: '',
-        token: '',
-        path: '',
-        customUrl: '',
-        branch: ''
-      }
-    }
-  },
+  mixins: [mixin]
+})
+export default class extends Vue {
+  form: IGitHubConfig = {
+    repo: '',
+    token: '',
+    path: '',
+    customUrl: '',
+    branch: ''
+  }
   created () {
-    const config = this.$db.get('picBed.github')
+    const config = this.$db.get('picBed.github') as IGitHubConfig
     if (config) {
-      for (let i in config) {
-        this.form[i] = config[i]
-      }
+      this.form = Object.assign({}, config)
     }
-  },
-  methods: {
-    confirm () {
-      this.$refs.github.validate((valid) => {
-        if (valid) {
-          this.$db.set('picBed.github', this.form).write()
-          const successNotification = new window.Notification('设置结果', {
-            body: '设置成功'
-          })
-          successNotification.onclick = () => {
-            return true
-          }
-        } else {
-          return false
+  }
+  confirm () {
+    // @ts-ignore
+    this.$refs.github.validate((valid) => {
+      if (valid) {
+        this.$db.set('picBed.github', this.form)
+        const successNotification = new Notification('设置结果', {
+          body: '设置成功'
+        })
+        successNotification.onclick = () => {
+          return true
         }
-      })
-    }
+      } else {
+        return false
+      }
+    })
   }
 }
 </script>
diff --git a/src/renderer/pages/picbeds/Imgur.vue b/src/renderer/pages/picbeds/Imgur.vue
index 77e57cc..7a4db8a 100644
--- a/src/renderer/pages/picbeds/Imgur.vue
+++ b/src/renderer/pages/picbeds/Imgur.vue
@@ -36,43 +36,39 @@
     </el-row>
   </div>
 </template>
-<script>
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/ConfirmButtonMixin'
-export default {
+@Component({
   name: 'imgur',
-  mixins: [mixin],
-  data () {
-    return {
-      form: {
-        clientId: '',
-        proxy: ''
-      }
-    }
-  },
+  mixins: [mixin]
+})
+export default class extends Vue {
+  form: IImgurConfig = {
+    clientId: '',
+    proxy: ''
+  }
   created () {
-    const config = this.$db.get('picBed.imgur')
+    const config = this.$db.get('picBed.imgur') as IImgurConfig
     if (config) {
-      for (let i in config) {
-        this.form[i] = config[i]
-      }
+      this.form = Object.assign({}, config)
     }
-  },
-  methods: {
-    confirm () {
-      this.$refs.imgur.validate((valid) => {
-        if (valid) {
-          this.$db.set('picBed.imgur', this.form).write()
-          const successNotification = new window.Notification('设置结果', {
-            body: '设置成功'
-          })
-          successNotification.onclick = () => {
-            return true
-          }
-        } else {
-          return false
+  }
+  confirm () {
+    // @ts-ignore
+    this.$refs.imgur.validate((valid) => {
+      if (valid) {
+        this.$db.set('picBed.imgur', this.form)
+        const successNotification = new Notification('设置结果', {
+          body: '设置成功'
+        })
+        successNotification.onclick = () => {
+          return true
         }
-      })
-    }
+      } else {
+        return false
+      }
+    })
   }
 }
 </script>
diff --git a/src/renderer/pages/picbeds/Others.vue b/src/renderer/pages/picbeds/Others.vue
index bdf5c4b..ad2ae40 100644
--- a/src/renderer/pages/picbeds/Others.vue
+++ b/src/renderer/pages/picbeds/Others.vue
@@ -27,57 +27,61 @@
     </el-row>
   </div>
 </template>
-<script>
-import ConfigForm from '@/components/ConfigForm'
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
+import ConfigForm from '@/components/ConfigForm.vue'
 import mixin from '@/utils/ConfirmButtonMixin'
-export default {
+import {
+  ipcRenderer,
+  IpcRendererEvent
+} from 'electron'
+
+@Component({
   name: 'OtherPicBed',
   mixins: [mixin],
   components: {
     ConfigForm
-  },
-  data () {
-    return {
-      type: '',
-      config: [],
-      picBedName: ''
-    }
-  },
+  }
+})
+export default class extends Vue {
+  type: string = ''
+  config: any[] = []
+  picBedName: string = ''
   created () {
     this.type = this.$route.params.type
-    this.$electron.ipcRenderer.send('getPicBedConfig', this.$route.params.type)
-    this.$electron.ipcRenderer.on('getPicBedConfig', this.getPicBeds)
-  },
-  methods: {
-    async handleConfirm () {
-      const result = await this.$refs.configForm.validate()
-      if (result !== false) {
-        this.$db.set(`picBed.${this.type}`, result)
-        const successNotification = new window.Notification('设置结果', {
-          body: '设置成功'
-        })
-        successNotification.onclick = () => {
-          return true
-        }
-      }
-    },
-    setDefaultPicBed (type) {
-      this.$db.set('picBed.current', type)
-      this.defaultPicBed = type
-      const successNotification = new window.Notification('设置默认图床', {
+    ipcRenderer.send('getPicBedConfig', this.$route.params.type)
+    ipcRenderer.on('getPicBedConfig', this.getPicBeds)
+  }
+  async handleConfirm () {
+    // @ts-ignore
+    const result = await this.$refs.configForm.validate()
+    if (result !== false) {
+      this.$db.set(`picBed.${this.type}`, result)
+      const successNotification = new Notification('设置结果', {
         body: '设置成功'
       })
       successNotification.onclick = () => {
         return true
       }
-    },
-    getPicBeds (event, config, name) {
-      this.config = config
-      this.picBedName = name
     }
-  },
+  }
+  setDefaultPicBed (type: string) {
+    this.$db.set('picBed.current', type)
+    // @ts-ignore 来自mixin的数据
+    this.defaultPicBed = type
+    const successNotification = new Notification('设置默认图床', {
+      body: '设置成功'
+    })
+    successNotification.onclick = () => {
+      return true
+    }
+  }
+  getPicBeds (event: IpcRendererEvent, config: any[], name: string) {
+    this.config = config
+    this.picBedName = name
+  }
   beforeDestroy () {
-    this.$electron.ipcRenderer.removeListener('getPicBedConfig', this.getPicBeds)
+    ipcRenderer.removeListener('getPicBedConfig', this.getPicBeds)
   }
 }
 </script>
diff --git a/src/renderer/pages/picbeds/Qiniu.vue b/src/renderer/pages/picbeds/Qiniu.vue
index b76e007..821a8d6 100644
--- a/src/renderer/pages/picbeds/Qiniu.vue
+++ b/src/renderer/pages/picbeds/Qiniu.vue
@@ -71,48 +71,44 @@
     </el-row>
   </div>
 </template>
-<script>
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/ConfirmButtonMixin'
-export default {
-  mixins: [mixin],
+@Component({
   name: 'qiniu',
-  data () {
-    return {
-      form: {
-        accessKey: '',
-        secretKey: '',
-        bucket: '',
-        url: '',
-        area: '',
-        options: '',
-        path: ''
-      }
-    }
-  },
+  mixins: [mixin]
+})
+export default class extends Vue {
+  form: IQiniuConfig = {
+    accessKey: '',
+    secretKey: '',
+    bucket: '',
+    url: '',
+    area: '',
+    options: '',
+    path: ''
+  }
   created () {
-    const config = this.$db.get('picBed.qiniu')
+    const config = this.$db.get('picBed.qiniu') as IQiniuConfig
     if (config) {
-      for (let i in config) {
-        this.form[i] = config[i]
-      }
+      this.form = Object.assign({}, config)
     }
-  },
-  methods: {
-    confirm () {
-      this.$refs.qiniu.validate((valid) => {
-        if (valid) {
-          this.$db.set('picBed.qiniu', this.form).write()
-          const successNotification = new window.Notification('设置结果', {
-            body: '设置成功'
-          })
-          successNotification.onclick = () => {
-            return true
-          }
-        } else {
-          return false
+  }
+  confirm () {
+    // @ts-ignore
+    this.$refs.qiniu.validate((valid) => {
+      if (valid) {
+        this.$db.set('picBed.qiniu', this.form)
+        const successNotification = new Notification('设置结果', {
+          body: '设置成功'
+        })
+        successNotification.onclick = () => {
+          return true
         }
-      })
-    }
+      } else {
+        return false
+      }
+    })
   }
 }
 </script>
diff --git a/src/renderer/pages/picbeds/SMMS.vue b/src/renderer/pages/picbeds/SMMS.vue
index 6ae8ab9..7a2e40e 100644
--- a/src/renderer/pages/picbeds/SMMS.vue
+++ b/src/renderer/pages/picbeds/SMMS.vue
@@ -15,24 +15,23 @@
     </el-row>
   </div>
 </template>
-<script>
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/ConfirmButtonMixin'
-export default {
-  mixins: [mixin],
-  name: 'upyun',
-  data () {
-    return {}
-  },
-  methods: {
-    confirm () {
-      this.$db.set('picBed.smms', true).write()
-      this.setDefaultPicBed('smms')
-      const successNotification = new window.Notification('设置结果', {
-        body: '设置成功'
-      })
-      successNotification.onclick = () => {
-        return true
-      }
+@Component({
+  name: 'smms',
+  mixins: [mixin]
+})
+export default class extends Vue {
+  confirm () {
+    this.$db.set('picBed.smms', true)
+    // @ts-ignore 来自mixin
+    this.setDefaultPicBed('smms')
+    const successNotification = new window.Notification('设置结果', {
+      body: '设置成功'
+    })
+    successNotification.onclick = () => {
+      return true
     }
   }
 }
diff --git a/src/renderer/pages/picbeds/TcYun.vue b/src/renderer/pages/picbeds/TcYun.vue
index c3c4e1a..794775e 100644
--- a/src/renderer/pages/picbeds/TcYun.vue
+++ b/src/renderer/pages/picbeds/TcYun.vue
@@ -85,52 +85,49 @@
     </el-row>
   </div>
 </template>
-<script>
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/ConfirmButtonMixin'
-export default {
-  mixins: [mixin],
+import { remote } from 'electron'
+@Component({
   name: 'tcyun',
-  data () {
-    return {
-      form: {
-        secretId: '',
-        secretKey: '',
-        bucket: '',
-        appId: '',
-        area: '',
-        path: '',
-        customUrl: '',
-        version: 'v4'
-      }
-    }
-  },
+  mixins: [mixin]
+})
+export default class extends Vue {
+  form: ITcYunConfig = {
+    secretId: '',
+    secretKey: '',
+    bucket: '',
+    appId: '',
+    area: '',
+    path: '',
+    customUrl: '',
+    version: 'v4'
+  }
   created () {
-    const config = this.$db.get('picBed.tcyun')
+    const config = this.$db.get('picBed.tcyun') as ITcYunConfig
     if (config) {
-      for (let i in config) {
-        this.form[i] = config[i]
-      }
+      this.form = Object.assign({}, config)
     }
-  },
-  methods: {
-    confirm () {
-      this.$refs.tcyun.validate((valid) => {
-        if (valid) {
-          this.$db.set('picBed.tcyun', this.form).write()
-          const successNotification = new window.Notification('设置结果', {
-            body: '设置成功'
-          })
-          successNotification.onclick = () => {
-            return true
-          }
-        } else {
-          return false
+  }
+  confirm () {
+    // @ts-ignore
+    this.$refs.tcyun.validate((valid) => {
+      if (valid) {
+        this.$db.set('picBed.tcyun', this.form)
+        const successNotification = new window.Notification('设置结果', {
+          body: '设置成功'
+        })
+        successNotification.onclick = () => {
+          return true
         }
-      })
-    },
-    openWiki () {
-      this.$electron.remote.shell.openExternal('https://github.com/Molunerfinn/PicGo/wiki/%E8%AF%A6%E7%BB%86%E7%AA%97%E5%8F%A3%E7%9A%84%E4%BD%BF%E7%94%A8#腾讯云cos')
-    }
+      } else {
+        return false
+      }
+    })
+  }
+  openWiki () {
+    remote.shell.openExternal('https://github.com/Molunerfinn/PicGo/wiki/%E8%AF%A6%E7%BB%86%E7%AA%97%E5%8F%A3%E7%9A%84%E4%BD%BF%E7%94%A8#腾讯云cos')
   }
 }
 </script>
diff --git a/src/renderer/pages/picbeds/UpYun.vue b/src/renderer/pages/picbeds/UpYun.vue
index 4efadb2..c381ebc 100644
--- a/src/renderer/pages/picbeds/UpYun.vue
+++ b/src/renderer/pages/picbeds/UpYun.vue
@@ -64,46 +64,42 @@
     </el-row>
   </div>
 </template>
-<script>
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/ConfirmButtonMixin'
-export default {
+@Component({
   name: 'upyun',
-  mixins: [mixin],
-  data () {
-    return {
-      form: {
-        bucket: '',
-        operator: '',
-        password: '',
-        options: '',
-        path: ''
-      }
-    }
-  },
+  mixins: [mixin]
+})
+export default class extends Vue {
+  form: IUpYunConfig = {
+    bucket: '',
+    operator: '',
+    password: '',
+    options: '',
+    path: ''
+  }
   created () {
-    const config = this.$db.get('picBed.upyun')
+    const config = this.$db.get('picBed.upyun') as IUpYunConfig
     if (config) {
-      for (let i in config) {
-        this.form[i] = config[i]
-      }
+      this.form = Object.assign({}, config)
     }
-  },
-  methods: {
-    confirm () {
-      this.$refs.tcyun.validate((valid) => {
-        if (valid) {
-          this.$db.set('picBed.upyun', this.form).write()
-          const successNotification = new window.Notification('设置结果', {
-            body: '设置成功'
-          })
-          successNotification.onclick = () => {
-            return true
-          }
-        } else {
-          return false
+  }
+  confirm () {
+    // @ts-ignore
+    this.$refs.tcyun.validate((valid) => {
+      if (valid) {
+        this.$db.set('picBed.upyun', this.form)
+        const successNotification = new Notification('设置结果', {
+          body: '设置成功'
+        })
+        successNotification.onclick = () => {
+          return true
         }
-      })
-    }
+      } else {
+        return false
+      }
+    })
   }
 }
 </script>
diff --git a/src/renderer/pages/picbeds/Weibo.vue b/src/renderer/pages/picbeds/Weibo.vue
index acc1ee1..98acb99 100644
--- a/src/renderer/pages/picbeds/Weibo.vue
+++ b/src/renderer/pages/picbeds/Weibo.vue
@@ -3,7 +3,7 @@
     <el-row :gutter="16">
       <el-col :span="16" :offset="4">
         <div class="view-title">
-          微博图床设置
+          微博图床设置[已停止支持]
         </div>
         <el-form
           ref="weiboForm"
diff --git a/src/universal/types/types.d.ts b/src/universal/types/types.d.ts
index 4f54865..f4accbb 100644
--- a/src/universal/types/types.d.ts
+++ b/src/universal/types/types.d.ts
@@ -19,30 +19,30 @@ interface ImgInfo {
   [propName: string]: any
 }
 
-interface PicBedType {
+interface IPicBedType {
   type: string
   name: string
   visible: boolean
 }
 
 // Config Settings
-interface ShortKeyConfig {
+interface IShortKeyConfig {
   enable: boolean
   key: string // 按键
   name: string
   label: string
 }
 
-interface ShortKeyConfigs {
-  [propName: string]: ShortKeyConfig
+interface IShortKeyConfigs {
+  [propName: string]: IShortKeyConfig
 }
 
-interface OldShortKeyConfigs {
+interface IOldShortKeyConfigs {
   upload: string
 }
 
 // Main process
-interface BrowserWindowOptions {
+interface IBrowserWindowOptions {
   height: number,
   width: number,
   show: boolean,
@@ -67,12 +67,12 @@ interface BrowserWindowOptions {
   alwaysOnTop?: boolean
 }
 
-interface FileWithPath {
+interface IFileWithPath {
   path: string
   name?: string
 }
 
-interface Bounds {
+interface IBounds {
   x: number
   y: number
 }
@@ -140,3 +140,56 @@ interface IShowInputBoxOption {
   title: string
   placeholder: string
 }
+
+// PicBeds
+
+interface IAliYunConfig {
+  accessKeyId: string
+  accessKeySecret: string,
+  bucket: string,
+  area: string,
+  path: string,
+  customUrl: string
+}
+
+interface IGitHubConfig {
+  repo: string,
+  token: string,
+  path: string,
+  customUrl: string,
+  branch: string
+}
+
+interface IImgurConfig {
+  clientId: string,
+  proxy: string
+}
+
+interface IQiniuConfig {
+  accessKey: string,
+  secretKey: string,
+  bucket: string,
+  url: string,
+  area: string,
+  options: string,
+  path: string
+}
+
+interface ITcYunConfig {
+  secretId: string,
+  secretKey: string,
+  bucket: string,
+  appId: string,
+  area: string,
+  path: string,
+  customUrl: string,
+  version: 'v4' | 'v5'
+}
+
+interface IUpYunConfig {
+  bucket: string,
+  operator: string,
+  password: string,
+  options: string,
+  path: string
+}