🎉 Release: v2.3.1-beta.3

ISSUES CLOSED: #862, #863, #865, #524, #845, #732

.eslintrc.js

@@ -6,18 +6,32 @@ module.exports = {
   env: {
     node: true
   },
-  parser: "vue-eslint-parser",
-  'extends': [
+  parser: 'vue-eslint-parser',
+  extends: [
     'plugin:vue/essential',
     '@vue/standard',
     '@vue/typescript'
   ],
-  'plugins': ['@typescript-eslint'],
+  plugins: ['@typescript-eslint'],
   rules: {
     'no-console': process.env.NODE_ENV === 'production' ? 'off' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    indent: 'off',
+    'no-async-promise-executor': 'off',
+    'no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': 'error',
+    '@typescript-eslint/indent': ['error', 2]
   },
   parserOptions: {
     parser: '@typescript-eslint/parser'
-  }
+  },
+  overrides: [
+    {
+      files: ['*.ts', '*.vue'],
+      rules: {
+        'no-undef': 'off' // https://typescript-eslint.io/docs/linting/troubleshooting/#i-get-errors-from-the-no-undef-rule-about-global-variables-not-being-defined-even-though-there-are-no-typescript-errors
+      }
+    }
+  ],
+  ignorePatterns: ['src/**/*.d.ts']
 }

.github/FUNDING.yml

@@ -0,0 +1 @@
+custom: ["https://paypal.me/Molunerfinn"]

.github/ISSUE_TEMPLATE.md

@@ -1,30 +1,34 @@
 <!--
 PicGo Issue 模板
 请依照该模板来提交，否则将会被关闭。
-**提问之前请注意你看过FAQ、配置手册以及那些被关闭的issues。否则同样的提问也会被关闭！**
+**提问之前请注意你看过 FAQ、配置手册以及那些被关闭的 issues。否则同样的提问也会被关闭！**
 -->
 
+**声明：我已经仔细看过 [文档](https://picgo.github.io/PicGo-Doc/)、[FAQ](https://github.com/Molunerfinn/PicGo/blob/dev/FAQ.md)、和搜索过已经关闭的 [issues](https://github.com/Molunerfinn/PicGo/issues?q=is%3Aissue+sort%3Aupdated-desc+is%3Aclosed) 后依然没有找到答案，所以才发了一个新的 issue。**
+
 ## 问题类型
 
-<!-- 你要提交的是Bug Report还是Feature Request？-->
+<!-- 你要提交的是 Bug Report 还是 Feature Request？-->
 
-## PicGo的相关信息
+## PicGo 的相关信息
 
-<!-- 版本、所在平台（Mac或者Windows） -->
+<!-- PicGo 的版本、所在平台（Mac 或者 Windows 或者 Linux） -->
 
 ## 问题重现
 
-<!-- 如果是Bug Report请填写本项 -->
+<!-- 如果是 Bug Report 请填写本项 -->
 <!-- 请附上相关截图 -->
+<!-- 请附上 PicGo 的相关报错日志（用文本的形式）否则无法判断原因-->
+<!-- 报错日志可以在 PicGo 设置 -> 设置日志文件 -> 点击打开 后找到 -->
 
 ## 功能请求
 
-<!-- 如果是Feature Request请填写本项 -->
+<!-- 如果是 Feature Request 请填写本项 -->
 <!-- 详细描述你所预想的功能或者是现有功能的改进。 -->
 
 ---
 
 <!-- 
-  最后，喜欢PicGo的话不妨给它点个star~
+  最后，喜欢 PicGo 的话不妨给它点个 star~
   如果可以的话，请我喝杯咖啡？首页有赞助二维码，谢谢你的支持！ 
  -->

.github/workflows/main.yml

@@ -0,0 +1,55 @@
+# main.yml
+
+# Workflow's name
+name: Build
+
+# Workflow's trigger
+on:
+  push:
+    branches:
+      - master
+
+# Workflow's jobs
+jobs:
+  # job's id
+  release:
+    # job's name
+    name: build and release electron app
+
+    # the type of machine to run the job on
+    runs-on: ${{ matrix.os }}
+
+    # create a build matrix for jobs
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest, macos-11]
+
+    # create steps
+    steps:
+      # step1: check out repository
+      - name: Check out git repository
+        uses: actions/checkout@v2
+
+      # step2: install node env
+      - name: Install Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: ${{ matrix.node }}
+
+      - name: Install system deps
+        if: matrix.os == 'ubuntu-latest'
+        run: |
+          sudo apt-get install --no-install-recommends -y icnsutils graphicsmagick xz-utils
+
+      # step3: yarn
+      - name: Yarn install
+        run: |
+          yarn
+          yarn global add xvfb-maybe
+
+      - name: Build  & release app
+        run: |
+          yarn release
+        env:
+          GH_TOKEN: ${{ secrets.GH_TOKEN }}

.github/workflows/manually.yml

@@ -0,0 +1,52 @@
+# main.yml
+
+# Workflow's name
+name: Build
+
+# Workflow's trigger
+on: workflow_dispatch
+
+# Workflow's jobs
+jobs:
+  # job's id
+  release:
+    # job's name
+    name: build and release electron app
+
+    # the type of machine to run the job on
+    runs-on: ${{ matrix.os }}
+
+    # create a build matrix for jobs
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest, macos-11]
+
+    # create steps
+    steps:
+      # step1: check out repository
+      - name: Check out git repository
+        uses: actions/checkout@v2
+
+      # step2: install node env
+      - name: Install Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: ${{ matrix.node }}
+
+      - name: Install system deps
+        if: matrix.os == 'ubuntu-latest'
+        run: |
+          sudo apt-get install --no-install-recommends -y icnsutils graphicsmagick xz-utils
+
+      # step3: yarn
+      - name: Yarn install
+        run: |
+          yarn
+          yarn global add xvfb-maybe
+
+      - name: Build  & release app
+        run: |
+          yarn release
+        env:
+          GH_TOKEN: ${{ secrets.GH_TOKEN }}

.gitignore

@@ -16,3 +16,4 @@ docs/dist/
 .env.local
 .env.*.local
 dist_electron/
+test.js

.travis.deprecated.yml

@@ -22,9 +22,7 @@ addons:
     - icnsutils
     #- xvfb
 before_install:
-- mkdir -p /tmp/git-lfs && curl -L https://github.com/github/git-lfs/releases/download/v1.2.1/git-lfs-$([
-  "$TRAVIS_OS_NAME" == "linux" ] && echo "linux" || echo "darwin")-amd64-1.2.1.tar.gz
-  | tar -xz -C /tmp/git-lfs --strip-components 1 && /tmp/git-lfs/git-lfs pull
+- if [[ "$TRAVIS_OS_NAME" == "osx" ]]; then brew install git-lfs; fi
 - if [[ "$TRAVIS_OS_NAME" == "linux" ]]; then sudo apt-get install --no-install-recommends -y icnsutils graphicsmagick xz-utils; fi
 install:
 #- export DISPLAY=':99.0'
@@ -39,6 +37,8 @@ script:
 #- yarn run pack && xvfb-maybe node_modules/.bin/mocha test/e2e
 - npm run release
 # - yarn run build:docs
+before_script:
+- git lfs pull
 branches:
   only:
   - master

CHANGELOG.md

@@ -1,3 +1,280 @@
+## :tada: 2.3.1-beta.3 (2022-04-04)
+
+
+### :sparkles: Features
+
+* add i18n for en ([1936ccf](https://github.com/Molunerfinn/PicGo/commit/1936ccf))
+* add tencent-cos options for url ([af291e4](https://github.com/Molunerfinn/PicGo/commit/af291e4)), closes [#862](https://github.com/Molunerfinn/PicGo/issues/862) [#863](https://github.com/Molunerfinn/PicGo/issues/863) [#865](https://github.com/Molunerfinn/PicGo/issues/865) [#524](https://github.com/Molunerfinn/PicGo/issues/524) [#845](https://github.com/Molunerfinn/PicGo/issues/845) [#732](https://github.com/Molunerfinn/PicGo/issues/732)
+* add upload-clipboard-image from electron' clipboard ([27628da](https://github.com/Molunerfinn/PicGo/commit/27628da)), closes [#822](https://github.com/Molunerfinn/PicGo/issues/822)
+* add wayland support for linux ([f1c8507](https://github.com/Molunerfinn/PicGo/commit/f1c8507))
+* click cancel in rename-window will use origin filename now ([04701d4](https://github.com/Molunerfinn/PicGo/commit/04701d4)), closes [#791](https://github.com/Molunerfinn/PicGo/issues/791)
+
+
+### :bug: Bug Fixes
+
+* fix mini-page can't upload image from dragging browser image ([6bcd019](https://github.com/Molunerfinn/PicGo/commit/6bcd019)), closes [#822](https://github.com/Molunerfinn/PicGo/issues/822)
+* mini window not always on top after reopen ([c79a286](https://github.com/Molunerfinn/PicGo/commit/c79a286))
+* notification freeze the main-process after uploading with clipboard ([3a50315](https://github.com/Molunerfinn/PicGo/commit/3a50315)), closes [#824](https://github.com/Molunerfinn/PicGo/issues/824)
+* picgo.log path error ([6b6ae27](https://github.com/Molunerfinn/PicGo/commit/6b6ae27)), closes [#819](https://github.com/Molunerfinn/PicGo/issues/819)
+
+
+### :pencil: Documentation
+
+* update readme ([6bcda9b](https://github.com/Molunerfinn/PicGo/commit/6bcda9b)), closes [#849](https://github.com/Molunerfinn/PicGo/issues/849) [#850](https://github.com/Molunerfinn/PicGo/issues/850)
+
+
+### :package: Chore
+
+* types change ([43d2a8e](https://github.com/Molunerfinn/PicGo/commit/43d2a8e))
+* update fix-path ([bcaf255](https://github.com/Molunerfinn/PicGo/commit/bcaf255)), closes [#774](https://github.com/Molunerfinn/PicGo/issues/774)
+
+
+
+## :tada: 2.3.1-beta.2 (2022-01-06)
+
+
+### :bug: Bug Fixes
+
+* electron builder actions bug ([5dd6e72](https://github.com/Molunerfinn/PicGo/commit/5dd6e72))
+* linux github actions workflow bug ([5cb8151](https://github.com/Molunerfinn/PicGo/commit/5cb8151))
+
+
+
+## :tada: 2.3.1-beta.1 (2022-01-05)
+
+
+### :package: Chore
+
+* update ci build scripts ([56e814a](https://github.com/Molunerfinn/PicGo/commit/56e814a))
+
+
+
+## :tada: 2.3.1-beta.0 (2022-01-05)
+
+
+### :bug: Bug Fixes
+
+* mini window drag bug ([34b3656](https://github.com/Molunerfinn/PicGo/commit/34b3656))
+
+
+### :package: Chore
+
+* add mac-arm64 build support ([f2a4197](https://github.com/Molunerfinn/PicGo/commit/f2a4197))
+* update electron from v6 -> v16 ([ea20d3b](https://github.com/Molunerfinn/PicGo/commit/ea20d3b))
+
+
+
+# :tada: 2.3.0 (2021-09-11)
+
+
+### :sparkles: Features
+
+* add open devtool option ([75e3edc](https://github.com/Molunerfinn/PicGo/commit/75e3edc))
+
+
+### :bug: Bug Fixes
+
+* shift key function in gallery page ([5895889](https://github.com/Molunerfinn/PicGo/commit/5895889))
+* some bugs ([a676c08](https://github.com/Molunerfinn/PicGo/commit/a676c08)), closes [#722](https://github.com/Molunerfinn/PicGo/issues/722)
+* urlEncode bug when copy ([6c6f847](https://github.com/Molunerfinn/PicGo/commit/6c6f847)), closes [#731](https://github.com/Molunerfinn/PicGo/issues/731)
+
+
+### :pencil: Documentation
+
+* update FAQ ([58420c8](https://github.com/Molunerfinn/PicGo/commit/58420c8))
+
+
+
+# :tada: 2.3.0-beta.8 (2021-08-13)
+
+
+### :bug: Bug Fixes
+
+* settings bug ([20d3cf9](https://github.com/Molunerfinn/PicGo/commit/20d3cf9)), closes [#710](https://github.com/Molunerfinn/PicGo/issues/710)
+* upload clipboard images via http should return list ([ae69263](https://github.com/Molunerfinn/PicGo/commit/ae69263)), closes [#721](https://github.com/Molunerfinn/PicGo/issues/721)
+
+
+
+# :tada: 2.3.0-beta.7 (2021-08-01)
+
+
+### :sparkles: Features
+
+* add gallery db ([6ddd660](https://github.com/Molunerfinn/PicGo/commit/6ddd660))
+* add win32 support ([1657542](https://github.com/Molunerfinn/PicGo/commit/1657542)), closes [#632](https://github.com/Molunerfinn/PicGo/issues/632)
+* finish custom config path ([7030f7a](https://github.com/Molunerfinn/PicGo/commit/7030f7a)), closes [#255](https://github.com/Molunerfinn/PicGo/issues/255)
+
+
+### :bug: Bug Fixes
+
+* bug of gallery db for plugin ([96a63ea](https://github.com/Molunerfinn/PicGo/commit/96a63ea))
+* enable plugin should reload ([49e5f34](https://github.com/Molunerfinn/PicGo/commit/49e5f34)), closes [#659](https://github.com/Molunerfinn/PicGo/issues/659)
+* gallery db bug ([f1eb7f4](https://github.com/Molunerfinn/PicGo/commit/f1eb7f4))
+* multiple uploading in the same time will cause output conflict ([06b67e5](https://github.com/Molunerfinn/PicGo/commit/06b67e5)), closes [#666](https://github.com/Molunerfinn/PicGo/issues/666)
+* multiple uploading in the same time will cause rename failed ([12cecc2](https://github.com/Molunerfinn/PicGo/commit/12cecc2))
+* uploader error in linux ([ab762ef](https://github.com/Molunerfinn/PicGo/commit/ab762ef)), closes [#627](https://github.com/Molunerfinn/PicGo/issues/627)
+* use uploader first ([92022a6](https://github.com/Molunerfinn/PicGo/commit/92022a6))
+* windows ia32 && x64 build options ([bdf523a](https://github.com/Molunerfinn/PicGo/commit/bdf523a))
+
+
+
+# :tada: 2.3.0-beta.6 (2021-04-24)
+
+
+### :sparkles: Features
+
+* add baidu tongji for analytics ([f536391](https://github.com/Molunerfinn/PicGo/commit/f536391))
+* add logs for picgo-server ([2d9e9c0](https://github.com/Molunerfinn/PicGo/commit/2d9e9c0)), closes [#627](https://github.com/Molunerfinn/PicGo/issues/627)
+* add privacy policy ([992ff35](https://github.com/Molunerfinn/PicGo/commit/992ff35))
+
+
+### :bug: Bug Fixes
+
+* add plugin install failed notice ([b05139f](https://github.com/Molunerfinn/PicGo/commit/b05139f))
+* default picBed using picBed.uploader instead of picBed.current ([0a986c8](https://github.com/Molunerfinn/PicGo/commit/0a986c8))
+* dev error with install vue-devtools ([a657c51](https://github.com/Molunerfinn/PicGo/commit/a657c51)), closes [#653](https://github.com/Molunerfinn/PicGo/issues/653) [#658](https://github.com/Molunerfinn/PicGo/issues/658)
+* disable plugin need reload app ([a1b70b4](https://github.com/Molunerfinn/PicGo/commit/a1b70b4))
+* fix analytics value ([06d40ef](https://github.com/Molunerfinn/PicGo/commit/06d40ef))
+* windows cli uploading bug ([321e339](https://github.com/Molunerfinn/PicGo/commit/321e339)), closes [#657](https://github.com/Molunerfinn/PicGo/issues/657)
+
+
+### :package: Chore
+
+* add main process hot reload ([3fd6e4e](https://github.com/Molunerfinn/PicGo/commit/3fd6e4e))
+* fix eslint error notice in indent ([69e1dc8](https://github.com/Molunerfinn/PicGo/commit/69e1dc8))
+
+
+
+# :tada: 2.3.0-beta.5 (2021-04-04)
+
+
+### :sparkles: Features
+
+* add local plugin support && npm registry/proxy support ([f0e1fa1](https://github.com/Molunerfinn/PicGo/commit/f0e1fa1))
+* 为Linux系统适配桌面图标栏（Tray） ([#603](https://github.com/Molunerfinn/PicGo/issues/603)) ([0fe3ade](https://github.com/Molunerfinn/PicGo/commit/0fe3ade))
+
+
+### :bug: Bug Fixes
+
+* default github placeholder ([51d80a6](https://github.com/Molunerfinn/PicGo/commit/51d80a6))
+
+
+### :package: Chore
+
+* change travis-ci -> GitHub Actions ([064f37d](https://github.com/Molunerfinn/PicGo/commit/064f37d))
+
+
+
+# :tada: 2.3.0-beta.4 (2020-12-19)
+
+
+### :sparkles: Features
+
+* add global value for PicGo get GUI_VERSION & CORE_VERSION ([eab014d](https://github.com/Molunerfinn/PicGo/commit/eab014d))
+* **config:** auto configuration backup & fallback to avoid main process crash ([32b8b97](https://github.com/Molunerfinn/PicGo/commit/32b8b97)), closes [#568](https://github.com/Molunerfinn/PicGo/issues/568)
+
+
+### :bug: Bug Fixes
+
+* disabled plugin won't be shown in plugin page ([33fdb16](https://github.com/Molunerfinn/PicGo/commit/33fdb16))
+* shortKeyConfig maybe undefined ([7b5e5ef](https://github.com/Molunerfinn/PicGo/commit/7b5e5ef)), closes [#557](https://github.com/Molunerfinn/PicGo/issues/557)
+* url encode before uploading by url ([ce2b5cd](https://github.com/Molunerfinn/PicGo/commit/ce2b5cd)), closes [#581](https://github.com/Molunerfinn/PicGo/issues/581)
+
+
+### :pencil: Documentation
+
+* add flutter-picgo ([92ff282](https://github.com/Molunerfinn/PicGo/commit/92ff282))
+* add gitads ([2d42381](https://github.com/Molunerfinn/PicGo/commit/2d42381))
+* rm gitads ([bb90e17](https://github.com/Molunerfinn/PicGo/commit/bb90e17))
+* update discussions in doc ([e793599](https://github.com/Molunerfinn/PicGo/commit/e793599))
+* update install command by Homebrew ([#599](https://github.com/Molunerfinn/PicGo/issues/599)) ([bd2311b](https://github.com/Molunerfinn/PicGo/commit/bd2311b))
+* update README.md ([#555](https://github.com/Molunerfinn/PicGo/issues/555)) ([2151857](https://github.com/Molunerfinn/PicGo/commit/2151857))
+
+
+
+# :tada: 2.3.0-beta.3 (2020-07-12)
+
+
+### :bug: Bug Fixes
+
+* choose default picBed failure ([21d3942](https://github.com/Molunerfinn/PicGo/commit/21d3942)), closes [#537](https://github.com/Molunerfinn/PicGo/issues/537)
+* shortkey disabled failure ([4f0809e](https://github.com/Molunerfinn/PicGo/commit/4f0809e)), closes [#534](https://github.com/Molunerfinn/PicGo/issues/534)
+
+
+
+# :tada: 2.3.0-beta.2 (2020-07-12)
+
+
+### :sparkles: Features
+
+* add qrcode for picbeds' config ([7fabc47](https://github.com/Molunerfinn/PicGo/commit/7fabc47))
+
+
+### :bug: Bug Fixes
+
+* encoding the result of picgo-server ([db71139](https://github.com/Molunerfinn/PicGo/commit/db71139))
+* initialize db bugs ([5f87018](https://github.com/Molunerfinn/PicGo/commit/5f87018))
+
+
+### :pencil: Documentation
+
+* update readme ([1c5880a](https://github.com/Molunerfinn/PicGo/commit/1c5880a))
+
+
+
+# :tada: 2.3.0-beta.1 (2020-06-28)
+
+
+### :bug: Bug Fixes
+
+* auto-copy option && copy style ([b6e3adb](https://github.com/Molunerfinn/PicGo/commit/b6e3adb))
+* beta version update bug ([18ad542](https://github.com/Molunerfinn/PicGo/commit/18ad542))
+* paste url encoding bug ([59d3eba](https://github.com/Molunerfinn/PicGo/commit/59d3eba)), closes [#454](https://github.com/Molunerfinn/PicGo/issues/454)
+
+
+### :pencil: Documentation
+
+* update FAQ && ISSUE_TEMPLATE ([2c57a27](https://github.com/Molunerfinn/PicGo/commit/2c57a27))
+* update readme ([2adff1e](https://github.com/Molunerfinn/PicGo/commit/2adff1e))
+
+
+
+# :tada: 2.3.0-beta.0 (2020-04-30)
+
+
+### :sparkles: Features
+
+* add autoCopy option for users to use or not ([67e526f](https://github.com/Molunerfinn/PicGo/commit/67e526f))
+* add beta-version update support ([ad6acd8](https://github.com/Molunerfinn/PicGo/commit/ad6acd8))
+* add smms-v2 support ([3f3ea69](https://github.com/Molunerfinn/PicGo/commit/3f3ea69))
+* add uploading image from URL support ([a28c678](https://github.com/Molunerfinn/PicGo/commit/a28c678))
+* finish all-select && shift multi-select ([2aeca50](https://github.com/Molunerfinn/PicGo/commit/2aeca50)), closes [#342](https://github.com/Molunerfinn/PicGo/issues/342)
+
+
+### :bug: Bug Fixes
+
+* confused port number auto increasing when opening a new PicGo app ([cd70a1a](https://github.com/Molunerfinn/PicGo/commit/cd70a1a))
+* correct inputbox value && remove listener ([32334e9](https://github.com/Molunerfinn/PicGo/commit/32334e9))
+* give a hint when node.js is not installed ([7e86618](https://github.com/Molunerfinn/PicGo/commit/7e86618))
+* right-click menu upload fails with PicGo open ([96cdfea](https://github.com/Molunerfinn/PicGo/commit/96cdfea)), closes [#415](https://github.com/Molunerfinn/PicGo/issues/415)
+* some win10 upload clipboard image crash ([cc182b0](https://github.com/Molunerfinn/PicGo/commit/cc182b0))
+* travis-ci bug ([b357dfb](https://github.com/Molunerfinn/PicGo/commit/b357dfb))
+* url uploader bug ([96544f5](https://github.com/Molunerfinn/PicGo/commit/96544f5))
+
+
+### :pencil: Documentation
+
+* update choco install picgo ([f357557](https://github.com/Molunerfinn/PicGo/commit/f357557))
+* update docs ([fd7673e](https://github.com/Molunerfinn/PicGo/commit/fd7673e))
+* update readme ([fb014dd](https://github.com/Molunerfinn/PicGo/commit/fb014dd))
+
+
+### :package: Chore
+
+* update funding url ([024d9cf](https://github.com/Molunerfinn/PicGo/commit/024d9cf))
+
+
+
 ## :tada: 2.2.2 (2020-01-20)
 
 

FAQ.md

@@ -1,58 +1,63 @@
 ## 常见问题
 
-> 在使用PicGo期间你会遇到很多问题，不过很多问题其实之前就有人提问过，也被解决，所以你可以先看看[使用文档](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#%E8%87%AA%E5%AE%9A%E4%B9%89%E5%BF%AB%E6%8D%B7%E9%94%AE)，这份FAQ，以及那些被关闭的[issues](https://github.com/Molunerfinn/PicGo/issues?q=is%3Aissue+is%3Aclosed)，应该能找到答案。
+> 在使用 PicGo 期间你会遇到很多问题，不过很多问题其实之前就有人提问过，也被解决，所以你可以先看看 [使用文档](https://picgo.github.io/PicGo-Doc/zh/guide/getting-started.html#%E5%BF%AB%E9%80%9F%E4%B8%8A%E6%89%8B)，这份 FAQ，以及那些被关闭的 [issues](https://github.com/Molunerfinn/PicGo/issues?q=is%3Aissue+is%3Aclosed)，应该能找到答案。
 
-## 1.七牛图床上传图片成功后无法显示或图片无`http://`前缀
+## 1. 七牛图床上传图片成功后，相册里无法显示或图片无`http://`前缀
 
 通常是你的七牛图床配置里的`设定访问网址`没有加上`http://`或者`https//`头。
 
 参考：[issue#79](https://github.com/Molunerfinn/PicGo/issues/79)
 
-## 2.能否支持图床远端同步删除
+## 2. 能否支持图床远端同步删除
 
-不能。有些图床（比如微博图床、SM.MS、Imgur等）不支持后台管理，为了架构统一不支持远端删除。
+不能。有些图床（比如微博图床、SM.MS、Imgur 等）不支持后台管理，为了架构统一不支持远端删除。
 
-## 3.能否支持上传视频文件
+## 3. 能否支持上传视频文件
 
-目前不能。2.0版本出来后将会支持插件系统，届时如果有人开发了相应的插件理论可以支持任意文件上传。
+目前不能。如果有人开发了相应的插件理论可以支持任意文件上传。
 
-## 4.微博图床上传之后无法显示预览图
+## 4. 微博图床上传之后无法显示预览图
 
 通常是挂了全局代理导致的。
 
 参考：[issue36](https://github.com/Molunerfinn/PicGo/issues/36)
 
-## 5.能否支持某某某图床
+## 5. 能否支持某某某图床
 
-截止v1.6，PicGo支持了如下图床：
+截止 v1.6，PicGo 支持了如下图床：
 
 - `微博图床` v1.0
 - `七牛图床` v1.0
-- `腾讯云COS v4\v5版本` v1.1 & v1.5.0
+- `腾讯云 COS v4\v5 版本` v1.1 & v1.5.0
 - `又拍云` v1.2.0
 - `GitHub` v1.5.0
 - `SM.MS` v1.5.1
-- `阿里云OSS` v1.6.0
+- `阿里云 OSS` v1.6.0
 - `Imgur` v1.6.0
 
-所以本体内将不会再支持其他图床。待2.0版本出来支持插件系统后可以由其他开发者开发相应的图床插件用以支持其他图床。
+所以本体内将不会再支持其他图床。需要其他图床支持可以参考目前已有的三方 [插件](https://github.com/PicGo/Awesome-PicGo)，如果还是没有你所需要的图床欢迎开发一个插件供大家使用。
 
-## 6.一个图床设置多个信息
+## 6. 一个图床设置多个信息
 
 不能。因为目前的架构只支持一个图床一份信息。
 
-## 7.v2.0版本有什么新功能
+## 7. GitHub 图床有时能上传，有时上传失败
 
-在不改变PicGo现有使用界面和使用习惯的基础上，将会重构整个底层`传输->转换->上传`的架构，使其能够支持插件系统，方便其他开发者基于PicGo的底层进行二次开发。
+1. GitHub 图床不支持上传同名文件，如果有同名文件上传，会报错。建议开启 `时间戳重命名` 避免同名文件。
+2. GitHub 服务器和国内 GFW 的问题会导致有时上传成功，有时上传失败，无解。想要稳定请使用付费云存储，如阿里云、腾讯云等，价格也不会贵。
 
-理论上有了插件系统之后，其他开发者能够支持如下功能：
+## 8. Mac 上无法打开 PicGo 的主窗口界面
 
-1. 能够实现上传前图片压缩
-2. 能够通过图片url实现上传图片 -> 更深入地可以批量地实现图床的迁移
-3. 能够支持其他图床甚至是自己的图床
+PicGo 在 Mac 上是一个顶部栏应用，在 dock 栏是不会有图标的。要打开主窗口，请右键或者双指点按顶部栏 PicGo 图标，选择「打开详细窗口」即可打开主窗口。
 
-等等。
+## 9. 上传失败，或者是服务器出错
 
-届时底层架构将会独立出来成为一个独立的npm包，能够直接在命令行里调用。
+1. PicGo 自带的图床都经过测试，上传出错一般都不是 PicGo 自身的原因。如果你用的是 GitHub 图床请参考上面的第 7 点。
+2. 检查 PicGo 的日志（报错日志可以在 PicGo 设置 -> 设置日志文件 -> 点击打开 后找到），看看 `[PicGo Error]` 的报错信息里有什么关键信息
+   1. 先自行搜索 error 里的报错信息，往往你能百度或者谷歌出问题原因，不必开 issue。
+   2. 如果有带有 `401` 、`403` 等 `40X` 状态码字样的，不用怀疑，就是你配置写错了，仔细检查配置，看看是否多了空格之类的。
+   3. 如果带有 `HttpError`、`RequestError` 、 `socket hang up` 等字样的说明这是网络问题，我无法帮你解决网络问题，请检查你自己的网络，是否有代理，DNS 设置是否正常等。
 
-目前开发进度可以参考[PicGo-Core](https://github.com/Molunerfinn/PicGo-Core)。
+## 10. macOS版本安装完之后没有主界面
+
+请找到PicGo在顶部栏的图标，然后右键（触摸板双指点按，或者鼠标右键），即可找到「打开详细窗口」的菜单。

README.md

@@ -2,11 +2,11 @@
   <img src="https://raw.githubusercontent.com/Molunerfinn/test/master/picgo/New%20LOGO-150.png" alt="">
   <h1>PicGo</h1>
   <blockquote>图片上传+管理新体验 </blockquote>
-  <a href="https://github.com/feross/standard">
+  <a href="https://github.com/Molunerfinn/PicGo/actions">
     <img src="https://img.shields.io/badge/code%20style-standard-green.svg?style=flat-square" alt="">
   </a>
-  <a href="https://travis-ci.org/Molunerfinn/PicGo/builds">
-    <img src="https://img.shields.io/travis/Molunerfinn/PicGo.svg?style=flat-square" alt="">
+  <a href="https://github.com/Molunerfinn/PicGo/actions">
+    <img src="https://github.com/Molunerfinn/PicGo/workflows/Build/badge.svg" alt="">
   </a>
   <a href="https://github.com/Molunerfinn/PicGo/releases">
     <img src="https://img.shields.io/github/downloads/Molunerfinn/PicGo/total.svg?style=flat-square" alt="">
@@ -17,47 +17,69 @@
   <a href="https://github.com/PicGo/bump-version">
     <img src="https://img.shields.io/badge/picgo-convention-blue.svg?style=flat-square" alt="">
   </a>
+  <a href="https://gitter.im/picgo-all/PicGo?utm_source=share-link&utm_medium=link&utm_campaign=share-link">
+    <img src="https://img.shields.io/badge/gitter-join%20chat%20%E2%86%92-66ae93.svg?style=flat-square" alt="">
+  </a>
 </div>
 
-## 应用说明
+## 应用概述
 
-**PicGo 在上传图片之后自动会将图片链接复制到你的剪贴板里，可选 5 种复制的链接格式。**
+**PicGo: 一个用于快速上传图片并获取图片 URL 链接的工具**
 
-PicGo 目前支持了
+PicGo 本体支持如下图床：
 
-- ~~`微博图床` v1.0~~ **微博图床从 2019 年 4 月开始进行防盗链，不建议继续使用**
 - `七牛图床` v1.0
-- `腾讯云 COS v4\v5版本` v1.1 & v1.5.0
+- `腾讯云 COS v4\v5 版本` v1.1 & v1.5.0
 - `又拍云` v1.2.0
 - `GitHub` v1.5.0
-- `SM.MS` v1.5.1
+- `SM.MS V2` v2.3.0-beta.0
 - `阿里云 OSS` v1.6.0
 - `Imgur` v1.6.0
 
 **本体不再增加默认的图床支持。你可以自行开发第三方图床插件。详见 [PicGo-Core](https://picgo.github.io/PicGo-Core-Doc/)**。
 
-第三方插件以及使用了 PicGo 底层的应用可以在 [Awesome-PicGo](https://github.com/PicGo/Awesome-PicGo) 找到。欢迎贡献！
+## 特色功能
 
-PicGo 支持 macOS、Windows 64位（>= v1.3.1），Linux（>= v1.6.0）。
+- 支持拖拽图片上传
+- 支持快捷键上传剪贴板里第一张图片
+- Windows 和 macOS 支持右键图片文件通过菜单上传 (v2.1.0+)
+- 上传图片后自动复制链接到剪贴板
+- 支持自定义复制到剪贴板的链接格式
+- 支持修改快捷键，默认快速上传快捷键：`command+shift+p`（macOS）| `control+shift+p`（Windows\Linux)
+- 支持插件系统，已有插件支持 Gitee、青云等第三方图床
+  - 更多第三方插件以及使用了 PicGo 底层的应用可以在 [Awesome-PicGo](https://github.com/PicGo/Awesome-PicGo) 找到。欢迎贡献！
+- 支持通过发送 HTTP 请求调用 PicGo 上传（v2.2.0+)
+- 更多功能等你自己去发现，同时也会不断开发新功能
+  - 开发进度可以查看 [Projects](https://github.com/Molunerfinn/PicGo/projects)，会同步更新开发进度
+  - 欢迎加入 [官方讨论区](https://github.com/Molunerfinn/PicGo/discussions) 与我交流
 
-支持快捷键`command+shift+p`（macOS）或者`control+shift+p`（Windows\Linux）用以支持快捷上传剪贴板里的图片（第一张）。
-PicGo 支持自定义快捷键，使用方法见[配置手册](https://picgo.github.io/PicGo-Doc/zh/guide/config.html)。
-
-开发进度可以查看 [Projects](https://github.com/Molunerfinn/PicGo/projects)，会同步更新开发进度。
-
-**如果第一次使用，请参考应用使用[快速上手](https://picgo.github.io/PicGo-Doc/zh/guide/getting-started.html)。遇到问题了还可以看看 [FAQ](https://github.com/Molunerfinn/PicGo/blob/dev/FAQ.md) 以及被关闭的 [issues](https://github.com/Molunerfinn/PicGo/issues?q=is%3Aissue+is%3Aclosed)。**
+**如果第一次使用，请参考应用 [使用文档](https://picgo.github.io/PicGo-Doc/zh/guide/getting-started.html)。遇到问题了还可以看看 [FAQ](https://github.com/Molunerfinn/PicGo/blob/dev/FAQ.md) 以及被关闭的 [issues](https://github.com/Molunerfinn/PicGo/issues?q=is%3Aissue+is%3Aclosed)。**
 
 ## 下载安装
 
-点击此处下载[应用](https://github.com/Molunerfinn/PicGo/releases)。
+点击此处下载 [应用](https://github.com/Molunerfinn/PicGo/releases)。
 
-macOS 用户请下载最新版本的 `dmg` 文件，Windows 用户请下载最新版本的 `exe` 文件，Linux用户请下载 `AppImage` 文件。
+还可以通过山东大学镜像站提供的镜像地址下载 [应用](https://mirrors.sdu.edu.cn/github-release/Molunerfinn_PicGo)。感谢山东大学镜像站提供的镜像服务！
 
-**如果你是 Arch 类的 Linux 用户，可以直接通过 `aurman -S picgo-appimage` 来安装 PicGo。感谢 @houbaron 的贡献！**
+### Windows
 
-**如果你是 macOS 用户，可以使用 `brew cask` 来安装 PicGo: `brew cask install picgo`。感谢 @womeimingzi11 的贡献！**
+Windows 用户请下载最新版本的 `exe` 文件。
 
-**如果你是 Windows 用户，还可以使用 [Scoop](https://scoop.sh/) 来安装 PicGo: `scoop bucket add helbing https://github.com/helbing/scoop-bucket` & `scoop install picgo`。 感谢 @helbing 的贡献！**
+**还可以使用 [Scoop](https://scoop.sh/) 来安装 PicGo: `scoop bucket add helbing https://github.com/helbing/scoop-bucket` & `scoop install picgo`。 感谢 @helbing 的贡献！**
+
+**还可以使用 [Chocolatey](https://chocolatey.org/) 来安装 PicGo: `choco install picgo`。 感谢 @iYato 的贡献！**
+
+### macOS
+
+macOS 用户请下载最新版本的 `dmg` 文件。
+
+**还可以使用 [Homebrew](https://brew.sh/) 来安装 PicGo: `brew install picgo --cask`。感谢 @womeimingzi11 的贡献！**
+
+### Linux
+
+Linux 用户请下载 `AppImage` 文件。
+
+**如果你是 Arch 类的 Linux 用户，可以直接通过 `yay -S picgo-appimage` 来安装 PicGo （若是没有则先安装 yay ，是 aur 仓库助手）。感谢 @houbaron 的贡献！**
 
 ## 应用截图
 
@@ -73,9 +95,9 @@ macOS 用户请下载最新版本的 `dmg` 文件，Windows 用户请下载最
 
 > 如果想学习 Electron-vue 的开发，可以查看我写的系列教程——[Electron-vue 开发实战](https://molunerfinn.com/tags/Electron-vue/)
 
-1. 你需要有 Node、Git环境，了解 npm 的相关知识。
-2. `git clone https://github.com/Molunerfinn/PicGo.git` 并进入项目
-3. `npm install` 下载依赖
+1. 你需要有 Node、Git 环境，了解 npm 的相关知识。
+2. `git clone https://github.com/Molunerfinn/PicGo.git` 并进入项目。
+3. `yarn` 下载依赖。注意如果你没有 `yarn`，请去 [官网](https://classic.yarnpkg.com/en/docs/install) 下载安装后再使用。 **用 `npm install` 将导致未知错误！**
 4. Mac 需要有 Xcode 环境，Windows 需要有 VS 环境。
 
 ### 开发模式
@@ -84,26 +106,29 @@ macOS 用户请下载最新版本的 `dmg` 文件，Windows 用户请下载最
 
 ```bash
 ctrl+c # 退出开发模式
-npm run dev # 重新进入开发模式
+npm run electron:serve # 重新进入开发模式
 ```
 
+**注：Windows 开发模式运行之后会在底部任务栏的右下角应用区出现 PicGo 的应用图标。**
+
 ### 生产模式
 
 如果你需要自行构建，可以 `npm run electron:build` 开始进行构建。构建成功后，会在 `dist_electron` 目录里出现构建成功的相应安装文件。
 
-**注意**：如果你的网络环境不太好，可能会出现 `electron-builder` 下载 `electron` 二进制文件失败的情况。这个时候需要在 `npm run build` 之前指定一下 `electron` 的源为国内源：
+**注意**：如果你的网络环境不太好，可能会出现 `electron-builder` 下载 `electron` 二进制文件失败的情况。这个时候需要在 `npm run electron:build` 之前指定一下 `electron` 的源为国内源：
 
 ```bash
-export ELECTRON_MIRROR="https://npm.taobao.org/mirrors/electron/"
-# 在 Windows 上，则可以使用 set ELECTRON_MIRROR=https://npm.taobao.org/mirrors/electron/ （无需引号）
-npm run build
+export ELECTRON_MIRROR="https://registry.npmmirror.com/binary.html?path=electron/"
+# 在 Windows 上，则可以使用 set ELECTRON_MIRROR=https://registry.npmmirror.com/binary.html?path=electron/ （无需引号）
+npm run electron:build
 ```
 
 只需第一次构建的时候指定一下国内源即可。后续构建不需要特地指定。二进制文件下载在 `~/.electron/` 目录下。如果想要更新 `electron` 构建版本，可以删除 `~/.electron/` 目录，然后重新运行上一步，让 `electron-builder `去下载最新的 `electron` 二进制文件。
 
 ## 其他相关
 
-- [vs-picgo](https://github.com/Spades-S/vs-picgo)：PicGo 的 VS Code 版。
+- [vs-picgo](https://github.com/PicGo/vs-picgo)：PicGo 的 VS Code 版。
+- [flutter-picgo](https://github.com/PicGo/flutter-picgo)：PicGo 的手机版（支持 Android 和 iOS ）。
 
 ## 赞助
 
@@ -121,4 +146,4 @@ npm run build
 
 [MIT](http://opensource.org/licenses/MIT)
 
-Copyright (c) 2017 - 2019 Molunerfinn
+Copyright (c) 2017 - 2019 Molunerfinn

appveyor.yml

@@ -19,13 +19,13 @@ init:
   - git config --global core.autocrlf input
 
 install:
-  - ps: Install-Product node 12 x64
+  - ps: Install-Product node 16 x64
   - git reset --hard HEAD
   - yarn
   - node --version
 
 build_script:
   #- yarn test
-  - npm run release
+  - yarn release
 
-test: off
+test: false

babel.config.js

@@ -1,5 +1,6 @@
 module.exports = {
   presets: [
     '@vue/cli-plugin-babel/preset'
-  ]
+  ],
+  plugins: ['@babel/plugin-proposal-optional-chaining']
 }

docs/APP.vue

@@ -22,7 +22,7 @@
           .col-xs-10.col-xs-offset-1.col-md-7.col-md-offset-0
             img(:src="item.url")
           .col-xs-10.col-xs-offset-1.col-md-5.col-md-offset-0.display-list__content
-            .display-list__title {{ item.title }} 
+            .display-list__title {{ item.title }}
             .display-list__desc {{ item.desc }}
       .row.ex-width.info
         .col-xs-10.col-xs-offset-1
@@ -94,7 +94,7 @@ html,
 h1
   margin 0
   padding 0
-  font-family "Source Sans Pro","Helvetica Neue","PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif  
+  font-family "Source Sans Pro","Helvetica Neue","PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif
 #app
   position relative
 .mask
@@ -213,4 +213,4 @@ h1
         font-size 25px
       &__desc
         margin-top 12px
-</style>
+</style>

package.json

@@ -1,11 +1,12 @@
 {
   "name": "picgo",
-  "version": "2.2.2",
+  "version": "2.3.1-beta.3",
   "private": true,
   "scripts": {
-    "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build",
+    "dev": "vue-cli-service electron:serve",
+    "build": "vue-cli-service electron:build",
     "lint": "vue-cli-service lint",
+    "lint:fix": "eslint --fix --ext .js,.jsx,.ts,.tsx,.vue src/",
     "electron:build": "vue-cli-service electron:build",
     "electron:serve": "vue-cli-service electron:serve",
     "postinstall": "electron-builder install-app-deps",
@@ -34,50 +35,61 @@
     ]
   },
   "dependencies": {
+    "@picgo/i18n": "^1.0.0",
+    "@picgo/store": "^1.0.3",
     "axios": "^0.19.0",
     "core-js": "^3.3.2",
     "element-ui": "^2.13.0",
-    "fix-path": "^2.1.0",
-    "fs-extra": "^8.1.0",
+    "fs-extra": "^10.0.0",
     "keycode": "^2.2.0",
     "lodash-id": "^0.14.0",
     "lowdb": "^1.0.0",
-    "picgo": "^1.4.4",
+    "picgo": "^1.5.0-alpha.3",
+    "qrcode.vue": "^1.7.0",
+    "shell-path": "2.1.0",
+    "uuidv4": "^6.2.11",
     "vue": "^2.6.10",
     "vue-gallery": "^2.0.1",
     "vue-lazyload": "^1.2.6",
     "vue-router": "^3.1.3"
   },
   "devDependencies": {
-    "@commitlint/cli": "^8.2.0",
-    "@picgo/bump-version": "^1.0.3",
-    "@types/fs-extra": "^8.0.1",
+    "@babel/plugin-proposal-optional-chaining": "^7.16.7",
+    "@picgo/bump-version": "^1.1.2",
+    "@types/fs-extra": "^9.0.13",
     "@types/inquirer": "^6.5.0",
     "@types/lowdb": "^1.0.9",
-    "@types/node": "10.17.6",
+    "@types/node": "^16.10.2",
     "@types/request-promise-native": "^1.0.17",
+    "@types/semver": "^7.3.8",
+    "@typescript-eslint/eslint-plugin": "^4.33.0",
+    "@typescript-eslint/parser": "^4.33.0",
     "@vue/cli-plugin-babel": "^4.0.0",
     "@vue/cli-plugin-eslint": "^4.0.0",
     "@vue/cli-plugin-router": "^4.0.0",
-    "@vue/cli-plugin-typescript": "^4.0.0",
+    "@vue/cli-plugin-typescript": "^4.5.13",
     "@vue/cli-service": "^4.0.0",
-    "@vue/eslint-config-standard": "^4.0.0",
-    "@vue/eslint-config-typescript": "^4.0.0",
-    "commitizen": "^4.0.3",
+    "@vue/eslint-config-standard": "^6.1.0",
+    "@vue/eslint-config-typescript": "^7.0.0",
     "conventional-changelog": "^3.1.18",
     "cz-customizable": "^6.2.0",
-    "electron": "^6.0.0",
-    "eslint": "^5.16.0",
-    "eslint-plugin-vue": "^5.0.0",
+    "electron": "^16.0.6",
+    "electron-devtools-installer": "^3.2.0",
+    "eslint": "^7.32.0",
+    "eslint-config-standard": ">=16.0.0",
+    "eslint-plugin-import": "^2.24.2",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-promise": "^5.1.0",
+    "eslint-plugin-vue": "^7.0.0",
     "husky": "^3.1.0",
     "stylus": "^0.54.7",
     "stylus-loader": "^3.0.2",
-    "typescript": "~3.7.3",
-    "vue-cli-plugin-electron-builder": "^1.4.2",
+    "typescript": "^4.4.3",
+    "vue-cli-plugin-electron-builder": "^2.1.1",
     "vue-property-decorator": "^8.3.0",
     "vue-template-compiler": "^2.6.10"
   },
   "resolutions": {
-    "@types/node": "12.0.2"
+    "@types/node": "^16.10.2"
   }
 }

public/linux.sh

@@ -1,18 +1,34 @@
 #!/bin/sh
-# require xclip(see http://stackoverflow.com/questions/592620/check-if-a-program-exists-from-a-bash-script/677212#677212)
-command -v xclip >/dev/null 2>&1 || { echo >&1 "no xclip"; exit 1; }
-
-# write image in clipboard to file (see http://unix.stackexchange.com/questions/145131/copy-image-from-clipboard-to-file)
-filePath=`xclip -selection clipboard -o 2>/dev/null | grep ^file:// | cut -c8-`
-if [ ! -n "$filePath" ] ;then
-  if
-      xclip -selection clipboard -target image/png -o >/dev/null 2>&1
-  then
-      xclip -selection clipboard -target image/png -o >$1 2>/dev/null
-      echo $1
+if [ "$XDG_SESSION_TYPE" = "x11" ]; then
+  # require xclip(see http://stackoverflow.com/questions/592620/check-if-a-program-exists-from-a-bash-script/677212#677212)
+  command -v xclip >/dev/null 2>&1 || { echo >&1 "no xclip"; exit 1; }
+  # write image in clipboard to file (see http://unix.stackexchange.com/questions/145131/copy-image-from-clipboard-to-file)
+  filePath=`xclip -selection clipboard -o 2>/dev/null | grep ^file:// | cut -c8-`
+  if [ ! -n "$filePath" ] ;then
+    if
+        xclip -selection clipboard -target image/png -o >/dev/null 2>&1
+    then
+        xclip -selection clipboard -target image/png -o >$1 2>/dev/null
+        echo $1
+    else
+        echo "no image"
+    fi
   else
-      echo "no image"
+    echo $filePath
+  fi
+elif [ "$XDG_SESSION_TYPE" = "wayland" ]; then
+  command -v wl-copy >/dev/null 2>&1 || { echo >&1 "no wl-clipboard"; exit 1; }
+  filePath=`wl-copy -o 2>/dev/null | grep ^file:// | cut -c8-`
+  if [ ! -n "$filePath" ] ;then
+    if
+        wl-copy -t image/png -o >/dev/null 2>&1
+      then
+        wl-copy -t image/png image/png -o >$1 2>/dev/null
+        echo $1
+    else
+        echo "no image"
+    fi
+  else
+    echo $filePath
   fi
-else
-  echo $filePath
 fi

public/windows10.ps1

@@ -27,6 +27,7 @@ function main {
     $stream.Dispose() | out-null
 
     $imagePath
+    Exit 1
 }
 
 try {

public/wsl.sh

@@ -0,0 +1,18 @@
+#!/bin/sh
+# grab the paths
+scriptPath=$(echo $0 | awk '{ print substr( $0, 1, length($0)-6 ) }')"windows10.ps1"
+imagePath=$(echo $1 | awk '{ print substr( $0, 1, length($0)-18 ) }')
+imageName=$(echo $1 | awk '{ print substr( $0, length($0)-17, length($0) ) }')
+
+# run the powershell script
+res=$(powershell.exe -noprofile -noninteractive -nologo -sta -executionpolicy unrestricted -file $(wslpath -w $scriptPath) $(wslpath -w $imagePath)"\\"$imageName)
+
+# note that there is a return symbol in powershell result
+noImage=$(echo "no image\r")
+
+# check whether image exists
+if [ "$res" = "$noImage" ] ;then
+    echo "no image"
+else
+    echo $(wslpath -u $res)
+fi

src/background.ts

@@ -1,158 +1,6 @@
-import {
-  app,
-  globalShortcut,
-  protocol
-} from 'electron'
-import {
-  createProtocol,
-  installVueDevtools
-} from 'vue-cli-plugin-electron-builder/lib'
-import db from '#/datastore'
-import { IWindowList } from '~/main/apis/window/constants'
-import windowManager from '~/main/apis/window/windowManager'
-import {
-  uploadChoosedFiles,
-  uploadClipboardFiles
-} from '~/main/apis/uploader/api'
-import beforeOpen from '~/main/utils/beforeOpen'
-import updateChecker from '~/main/utils/updateChecker'
-import ipcList from '~/main/apis/eventCenter/ipcList'
-import busEventList from '~/main/apis/eventCenter/busEventList'
-import fixPath from 'fix-path'
-import { getUploadFiles } from '~/main/utils/handleArgv'
-import bus from '~/main/utils/eventBus'
-import {
-  updateShortKeyFromVersion212
-} from '~/main/migrate'
-import shortKeyHandler from '~/main/apis/shortKey/shortKeyHandler'
-import server from '~/main/server/index'
-import {
-  createTray
-} from '~/main/apis/app'
+import { bootstrap } from '~/main/lifeCycle'
 
-const isDevelopment = process.env.NODE_ENV !== 'production'
-protocol.registerSchemesAsPrivileged([{ scheme: 'picgo', privileges: { secure: true, standard: true } }])
-
-beforeOpen()
-
-// fix the $PATH in macOS
-fixPath()
-
-ipcList.listen()
-busEventList.listen()
-
-const gotTheLock = app.requestSingleInstanceLock()
-
-if (!gotTheLock) {
-  app.quit()
-} else {
-  app.on('second-instance', (event, commandLine, workingDirectory) => {
-    let files = getUploadFiles(commandLine, workingDirectory)
-    if (files === null || files.length > 0) { // 如果有文件列表作为参数，说明是命令行启动
-      if (files === null) {
-        uploadClipboardFiles()
-      } else {
-        const win = windowManager.getAvailableWindow()
-        uploadChoosedFiles(win.webContents, files)
-      }
-    } else {
-      if (windowManager.has(IWindowList.SETTING_WINDOW)) {
-        const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)!
-        if (settingWindow.isMinimized()) {
-          settingWindow.restore()
-        }
-        settingWindow.focus()
-      }
-    }
-  })
-}
-
-if (process.platform === 'win32') {
-  app.setAppUserModelId('com.molunerfinn.picgo')
-}
-
-if (process.env.XDG_CURRENT_DESKTOP && process.env.XDG_CURRENT_DESKTOP.includes('Unity')) {
-  process.env.XDG_CURRENT_DESKTOP = 'Unity'
-}
-
-app.on('ready', async () => {
-  createProtocol('picgo')
-  if (isDevelopment && !process.env.IS_TEST) {
-    // Install Vue Devtools
-    try {
-      await installVueDevtools()
-    } catch (e) {
-      console.error('Vue Devtools failed to install:', e.toString())
-    }
-  }
-  windowManager.create(IWindowList.TRAY_WINDOW)
-  windowManager.create(IWindowList.SETTING_WINDOW)
-  if (process.platform === 'darwin' || process.platform === 'win32') {
-    createTray()
-  }
-  db.set('needReload', false)
-  updateChecker()
-  // 不需要阻塞
-  process.nextTick(() => {
-    updateShortKeyFromVersion212(db, db.get('settings.shortKey'))
-    shortKeyHandler.init()
-  })
-  server.startup()
-  if (process.env.NODE_ENV !== 'development') {
-    let files = getUploadFiles()
-    if (files === null || files.length > 0) { // 如果有文件列表作为参数，说明是命令行启动
-      if (files === null) {
-        uploadClipboardFiles()
-      } else {
-        const win = windowManager.getAvailableWindow()
-        uploadChoosedFiles(win.webContents, files)
-      }
-    }
-  }
-})
-
-app.on('window-all-closed', () => {
-  if (process.platform !== 'darwin') {
-    app.quit()
-  }
-})
-
-app.on('activate', () => {
-  createProtocol('picgo')
-  if (!windowManager.has(IWindowList.TRAY_WINDOW)) {
-    windowManager.create(IWindowList.TRAY_WINDOW)
-  }
-  if (!windowManager.has(IWindowList.SETTING_WINDOW)) {
-    windowManager.create(IWindowList.SETTING_WINDOW)
-  }
-})
-
-app.on('will-quit', () => {
-  globalShortcut.unregisterAll()
-  bus.removeAllListeners()
-  server.shutdown()
-})
-
-app.setLoginItemSettings({
-  openAtLogin: db.get('settings.autoStart') || false
-})
-
-// Exit cleanly on request from parent process in development mode.
-if (isDevelopment) {
-  if (process.platform === 'win32') {
-    process.on('message', data => {
-      if (data === 'graceful-exit') {
-        app.quit()
-        server.shutdown()
-      }
-    })
-  } else {
-    process.on('SIGTERM', () => {
-      app.quit()
-      server.shutdown()
-    })
-  }
-}
+bootstrap.launchApp()
 
 /**
  * Auto Updater

src/main.ts

@@ -1,21 +1,26 @@
 import Vue from 'vue'
 import App from './renderer/App.vue'
 import router from './renderer/router'
-import db from '#/datastore/index'
 import ElementUI from 'element-ui'
 import { webFrame } from 'electron'
 import 'element-ui/lib/theme-chalk/index.css'
 import VueLazyLoad from 'vue-lazyload'
 import axios from 'axios'
 import mainMixin from './renderer/utils/mainMixin'
+import bus from '@/utils/bus'
+import { initTalkingData } from './renderer/utils/analytics'
+import db from './renderer/utils/db'
+import { T, i18n } from '#/i18n/index'
+import { handleURLParams } from '@/utils/beforeOpen'
 
 webFrame.setVisualZoomLevelLimits(1, 1)
-webFrame.setLayoutZoomLevelLimits(0, 0)
+
+// do here before vue init
+handleURLParams()
 
 Vue.config.productionTip = false
 Vue.prototype.$builtInPicBed = [
   'smms',
-  'weibo',
   'imgur',
   'qiniu',
   'tcyun',
@@ -23,8 +28,11 @@ Vue.prototype.$builtInPicBed = [
   'aliyun',
   'github'
 ]
-Vue.prototype.$db = db
+Vue.prototype.$$db = db
 Vue.prototype.$http = axios
+Vue.prototype.$bus = bus
+Vue.prototype.$T = T
+Vue.prototype.$i18n = i18n
 
 Vue.use(ElementUI)
 Vue.use(VueLazyLoad)
@@ -34,3 +42,5 @@ new Vue({
   router,
   render: h => h(App)
 }).$mount('#app')
+
+initTalkingData()

src/main/apis/README.md

@@ -0,0 +1,13 @@
+# apis folder
+
+## core
+
+The lowest level APIs that are not dependent on each other. The upper APIs depend on them.
+
+## app
+
+Provide key API interfaces for PicGo application, including uploader, window management, shortcut key system, remotes handler, etc
+
+## gui
+
+GuiApi for PicGo plugins.

src/main/apis/app/index.ts

@@ -1,206 +0,0 @@
-import {
-  app,
-  Menu,
-  Tray,
-  dialog,
-  clipboard,
-  systemPreferences,
-  Notification
-} from 'electron'
-import uploader from '~/main/apis/uploader'
-import getPicBeds from '~/main/utils/getPicBeds'
-import db from '#/datastore'
-import windowManager from '~/main/apis/window/windowManager'
-import { IWindowList } from '~/main/apis/window/constants'
-import picgo from '~/main/apis/picgo'
-import pasteTemplate from '#/utils/pasteTemplate'
-import pkg from 'root/package.json'
-let contextMenu: Menu | null
-let menu: Menu | null
-let tray: Tray | null
-export function createContextMenu () {
-  const picBeds = getPicBeds()
-  const submenu = picBeds.filter(item => item.visible).map(item => {
-    return {
-      label: item.name,
-      type: 'radio',
-      checked: db.get('picBed.current') === item.type,
-      click () {
-        picgo.saveConfig({
-          'picBed.current': item.type
-        })
-        if (windowManager.has(IWindowList.SETTING_WINDOW)) {
-          windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('syncPicBed')
-        }
-      }
-    }
-  })
-  contextMenu = Menu.buildFromTemplate([
-    {
-      label: '关于',
-      click () {
-        dialog.showMessageBox({
-          title: 'PicGo',
-          message: 'PicGo',
-          detail: `Version: ${pkg.version}\nAuthor: Molunerfinn\nGithub: https://github.com/Molunerfinn/PicGo`
-        })
-      }
-    },
-    {
-      label: '打开详细窗口',
-      click () {
-        const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)
-        settingWindow!.show()
-        settingWindow!.focus()
-        if (windowManager.has(IWindowList.MINI_WINDOW)) {
-          windowManager.get(IWindowList.MINI_WINDOW)!.hide()
-        }
-      }
-    },
-    {
-      label: '选择默认图床',
-      type: 'submenu',
-      // @ts-ignore
-      submenu
-    },
-    // @ts-ignore
-    {
-      label: '打开更新助手',
-      type: 'checkbox',
-      checked: db.get('settings.showUpdateTip'),
-      click () {
-        const value = db.get('settings.showUpdateTip')
-        db.set('settings.showUpdateTip', !value)
-      }
-    },
-    {
-      label: '重启应用',
-      click () {
-        app.relaunch()
-        app.exit(0)
-      }
-    },
-    // @ts-ignore
-    {
-      role: 'quit',
-      label: '退出'
-    }
-  ])
-}
-
-export function createTray () {
-  const menubarPic = process.platform === 'darwin' ? `${__static}/menubar.png` : `${__static}/menubar-nodarwin.png`
-  tray = new Tray(menubarPic)
-  tray.on('right-click', () => {
-    if (windowManager.has(IWindowList.TRAY_WINDOW)) {
-      windowManager.get(IWindowList.TRAY_WINDOW)!.hide()
-    }
-    createContextMenu()
-    tray!.popUpContextMenu(contextMenu!)
-  })
-  tray.on('click', (event, bounds) => {
-    if (process.platform === 'darwin') {
-      toggleWindow(bounds)
-      setTimeout(() => {
-        let img = clipboard.readImage()
-        let obj: ImgInfo[] = []
-        if (!img.isEmpty()) {
-          // 从剪贴板来的图片默认转为png
-          // @ts-ignore
-          const imgUrl = 'data:image/png;base64,' + Buffer.from(img.toPNG(), 'binary').toString('base64')
-          obj.push({
-            width: img.getSize().width,
-            height: img.getSize().height,
-            imgUrl
-          })
-        }
-        windowManager.get(IWindowList.TRAY_WINDOW)!.webContents.send('clipboardFiles', obj)
-      }, 0)
-    } else {
-      if (windowManager.has(IWindowList.TRAY_WINDOW)) {
-        windowManager.get(IWindowList.TRAY_WINDOW)!.hide()
-      }
-      const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)
-      settingWindow!.show()
-      settingWindow!.focus()
-      if (windowManager.has(IWindowList.MINI_WINDOW)) {
-        windowManager.get(IWindowList.MINI_WINDOW)!.hide()
-      }
-    }
-  })
-
-  tray.on('drag-enter', () => {
-    if (systemPreferences.isDarkMode()) {
-      tray!.setImage(`${__static}/upload-dark.png`)
-    } else {
-      tray!.setImage(`${__static}/upload.png`)
-    }
-  })
-
-  tray.on('drag-end', () => {
-    tray!.setImage(`${__static}/menubar.png`)
-  })
-
-  tray.on('drop-files', async (event: Event, files: string[]) => {
-    const pasteStyle = db.get('settings.pasteStyle') || 'markdown'
-    const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)!
-    const imgs = await uploader
-      .setWebContents(trayWindow.webContents)
-      .upload(files)
-    if (imgs !== false) {
-      for (let i = 0; i < imgs.length; i++) {
-        clipboard.writeText(pasteTemplate(pasteStyle, imgs[i]))
-        const notification = new Notification({
-          title: '上传成功',
-          body: imgs[i].imgUrl!,
-          icon: files[i]
-        })
-        setTimeout(() => {
-          notification.show()
-        }, i * 100)
-        db.insert('uploaded', imgs[i])
-      }
-      trayWindow.webContents.send('dragFiles', imgs)
-    }
-  })
-  // toggleWindow()
-}
-
-export function createMenu () {
-  if (process.env.NODE_ENV !== 'development') {
-    const template = [{
-      label: 'Edit',
-      submenu: [
-        { label: 'Undo', accelerator: 'CmdOrCtrl+Z', selector: 'undo:' },
-        { label: 'Redo', accelerator: 'Shift+CmdOrCtrl+Z', selector: 'redo:' },
-        { type: 'separator' },
-        { label: 'Cut', accelerator: 'CmdOrCtrl+X', selector: 'cut:' },
-        { label: 'Copy', accelerator: 'CmdOrCtrl+C', selector: 'copy:' },
-        { label: 'Paste', accelerator: 'CmdOrCtrl+V', selector: 'paste:' },
-        { label: 'Select All', accelerator: 'CmdOrCtrl+A', selector: 'selectAll:' },
-        {
-          label: 'Quit',
-          accelerator: 'CmdOrCtrl+Q',
-          click () {
-            app.quit()
-          }
-        }
-      ]
-    }]
-    // @ts-ignore
-    menu = Menu.buildFromTemplate(template)
-    Menu.setApplicationMenu(menu)
-  }
-}
-
-const toggleWindow = (bounds: IBounds) => {
-  const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)!
-  if (trayWindow.isVisible()) {
-    trayWindow.hide()
-  } else {
-    trayWindow.setPosition(bounds.x - 98 + 11, bounds.y, false)
-    trayWindow.webContents.send('updateFiles')
-    trayWindow.show()
-    trayWindow.focus()
-  }
-}

src/main/apis/app/shortKey/shortKeyHandler.ts

@@ -1,42 +1,46 @@
-import bus from '../../utils/eventBus'
-import PicGoCore from '~/universal/types/picgo'
-import path from 'path'
+import bus from '@core/bus'
 import {
-  app,
-  globalShortcut,
-  BrowserWindow
+  globalShortcut
 } from 'electron'
-import logger from '../../utils/logger'
-import GuiApi from '../gui'
-import db from '#/datastore'
+import logger from '@core/picgo/logger'
+import GuiApi from '../../gui'
+import db from '~/main/apis/core/datastore'
+import { TOGGLE_SHORTKEY_MODIFIED_MODE } from '#/events/constants'
 import shortKeyService from './shortKeyService'
-import picgo from '../picgo'
+import picgo from '@core/picgo'
 
 class ShortKeyHandler {
   private isInModifiedMode: boolean = false
   constructor () {
-    bus.on('toggleShortKeyModifiedMode', flag => {
+    bus.on(TOGGLE_SHORTKEY_MODIFIED_MODE, flag => {
       this.isInModifiedMode = flag
     })
   }
+
   init () {
     this.initBuiltInShortKey()
     this.initPluginsShortKey()
   }
+
   private initBuiltInShortKey () {
     const commands = db.get('settings.shortKey') as IShortKeyConfigs
     Object.keys(commands)
       .filter(item => item.includes('picgo:'))
-      .map(command => {
+      .forEach(command => {
         const config = commands[command]
-        globalShortcut.register(config.key, () => {
-          this.handler(command)
-        })
+        // if disabled, don't register #534
+        if (config.enable) {
+          globalShortcut.register(config.key, () => {
+            this.handler(command)
+          })
+        }
       })
   }
+
   private initPluginsShortKey () {
+    // get enabled plugin
     const pluginList = picgo.pluginLoader.getList()
-    for (let item of pluginList) {
+    for (const item of pluginList) {
       const plugin = picgo.pluginLoader.getPlugin(item)
       // if a plugin has commands
       if (plugin && plugin.commands) {
@@ -45,11 +49,14 @@ class ShortKeyHandler {
           continue
         }
         const commands = plugin.commands(picgo) as IPluginShortKeyConfig[]
-        for (let cmd of commands) {
+        for (const cmd of commands) {
           const command = `${item}:${cmd.name}`
           if (db.has(`settings.shortKey[${command}]`)) {
             const commandConfig = db.get(`settings.shortKey.${command}`) as IShortKeyConfig
-            this.registerShortKey(commandConfig, command, cmd.handle, false)
+            // if disabled, don't register #534
+            if (commandConfig.enable) {
+              this.registerShortKey(commandConfig, command, cmd.handle, false)
+            }
           } else {
             this.registerShortKey(cmd, command, cmd.handle, true)
           }
@@ -59,6 +66,7 @@ class ShortKeyHandler {
       }
     }
   }
+
   private registerShortKey (config: IShortKeyConfig | IPluginShortKeyConfig, command: string, handler: IShortKeyHandler, writeFlag: boolean) {
     shortKeyService.registerCommand(command, handler)
     if (config.key) {
@@ -68,6 +76,8 @@ class ShortKeyHandler {
     } else {
       logger.warn(`${command} do not provide a key to bind`)
     }
+    // if the configfile already had this command
+    // then writeFlag -> false
     if (writeFlag) {
       picgo.saveConfig({
         [`settings.shortKey.${command}`]: {
@@ -79,6 +89,7 @@ class ShortKeyHandler {
       })
     }
   }
+
   // enable or disable shortKey
   bindOrUnbindShortKey (item: IShortKeyConfig, from: string): boolean {
     const command = `${from}:${item.name}`
@@ -102,6 +113,7 @@ class ShortKeyHandler {
       }
     }
   }
+
   // update shortKey bindings
   updateShortKey (item: IShortKeyConfig, oldKey: string, from: string): boolean {
     const command = `${from}:${item.name}`
@@ -115,6 +127,7 @@ class ShortKeyHandler {
     })
     return true
   }
+
   private async handler (command: string) {
     if (this.isInModifiedMode) {
       return
@@ -124,13 +137,13 @@ class ShortKeyHandler {
     } else if (command.includes('picgo-plugin-')) {
       const handler = shortKeyService.getShortKeyHandler(command)
       if (handler) {
-        const guiApi = new GuiApi()
-        return handler(picgo, guiApi)
+        return handler(picgo, GuiApi.getInstance())
       }
     } else {
       logger.warn(`can not find command: ${command}`)
     }
   }
+
   registerPluginShortKey (pluginName: string) {
     const plugin = picgo.pluginLoader.getPlugin(pluginName)
     if (plugin && plugin.commands) {
@@ -139,7 +152,7 @@ class ShortKeyHandler {
         return
       }
       const commands = plugin.commands(picgo) as IPluginShortKeyConfig[]
-      for (let cmd of commands) {
+      for (const cmd of commands) {
         const command = `${pluginName}:${cmd.name}`
         if (db.has(`settings.shortKey[${command}]`)) {
           const commandConfig = db.get(`settings.shortKey[${command}]`) as IShortKeyConfig
@@ -150,6 +163,7 @@ class ShortKeyHandler {
       }
     }
   }
+
   unregisterPluginShortKey (pluginName: string) {
     const commands = db.get('settings.shortKey') as IShortKeyConfigs
     const keyList = Object.keys(commands)

src/main/apis/app/shortKey/shortKeyService.ts

@@ -1,18 +1,21 @@
-import logger from '../../utils/logger'
+import logger from '@core/picgo/logger'
 class ShortKeyService {
   private commandList: Map<string, IShortKeyHandler> = new Map()
   registerCommand (command: string, handler: IShortKeyHandler) {
     this.commandList.set(command, handler)
   }
+
   unregisterCommand (command: string) {
     this.commandList.delete(command)
   }
+
   getShortKeyHandler (command: string): IShortKeyHandler | null {
     const handler = this.commandList.get(command)
     if (handler) return handler
     logger.warn(`cannot find command: ${command}`)
     return null
   }
+
   getCommandList () {
     return [...this.commandList.keys()]
   }

src/main/apis/app/system/index.ts

@@ -0,0 +1,277 @@
+import {
+  app,
+  Menu,
+  Tray,
+  dialog,
+  clipboard,
+  systemPreferences,
+  Notification
+} from 'electron'
+import uploader from 'apis/app/uploader'
+import getPicBeds from '~/main/utils/getPicBeds'
+import db, { GalleryDB } from '~/main/apis/core/datastore'
+import windowManager from 'apis/app/window/windowManager'
+import { IWindowList } from '#/types/enum'
+import picgo from '@core/picgo'
+import pasteTemplate from '~/main/utils/pasteTemplate'
+import pkg from 'root/package.json'
+import { handleCopyUrl } from '~/main/utils/common'
+import { privacyManager } from '~/main/utils/privacyManager'
+import { T } from '#/i18n'
+let contextMenu: Menu | null
+let menu: Menu | null
+let tray: Tray | null
+export function createContextMenu () {
+  const picBeds = getPicBeds()
+  if (process.platform === 'darwin' || process.platform === 'win32') {
+    const submenu = picBeds.filter(item => item.visible).map(item => {
+      return {
+        label: item.name,
+        type: 'radio',
+        checked: db.get('picBed.current') === item.type,
+        click () {
+          picgo.saveConfig({
+            'picBed.current': item.type,
+            'picBed.uploader': item.type
+          })
+          if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+            windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('syncPicBed')
+          }
+        }
+      }
+    })
+    contextMenu = Menu.buildFromTemplate([
+      {
+        label: T('ABOUT'),
+        click () {
+          dialog.showMessageBox({
+            title: 'PicGo',
+            message: 'PicGo',
+            detail: `Version: ${pkg.version}\nAuthor: Molunerfinn\nGithub: https://github.com/Molunerfinn/PicGo`
+          })
+        }
+      },
+      {
+        label: T('OPEN_MAIN_WINDOW'),
+        click () {
+          const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)
+          settingWindow!.show()
+          settingWindow!.focus()
+          if (windowManager.has(IWindowList.MINI_WINDOW)) {
+            windowManager.get(IWindowList.MINI_WINDOW)!.hide()
+          }
+        }
+      },
+      {
+        label: T('CHOOSE_DEFAULT_PICBED'),
+        type: 'submenu',
+        // @ts-ignore
+        submenu
+      },
+      // @ts-ignore
+      {
+        label: T('OPEN_UPDATE_HELPER'),
+        type: 'checkbox',
+        checked: db.get('settings.showUpdateTip'),
+        click () {
+          const value = db.get('settings.showUpdateTip')
+          db.set('settings.showUpdateTip', !value)
+        }
+      },
+      {
+        label: T('PRIVACY_AGREEMENT'),
+        click () {
+          privacyManager.show(false)
+        }
+      },
+      {
+        label: T('RELOAD_APP'),
+        click () {
+          app.relaunch()
+          app.exit(0)
+        }
+      },
+      // @ts-ignore
+      {
+        role: 'quit',
+        label: T('QUIT')
+      }
+    ])
+  } else if (process.platform === 'linux') {
+    // TODO 图床选择功能
+    // 由于在Linux难以像在Mac和Windows上那样在点击时构造ContextMenu，
+    // 暂时取消这个选单，避免引起和设置中启用的图床不一致
+
+    // TODO 重启应用功能
+    // 目前的实现无法正常工作
+
+    contextMenu = Menu.buildFromTemplate([
+      {
+        label: T('OPEN_MAIN_WINDOW'),
+        click () {
+          const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)
+          settingWindow!.show()
+          settingWindow!.focus()
+          if (windowManager.has(IWindowList.MINI_WINDOW)) {
+            windowManager.get(IWindowList.MINI_WINDOW)!.hide()
+          }
+        }
+      },
+      // @ts-ignore
+      {
+        label: T('OPEN_UPDATE_HELPER'),
+        type: 'checkbox',
+        checked: db.get('settings.showUpdateTip'),
+        click () {
+          const value = db.get('settings.showUpdateTip')
+          db.set('settings.showUpdateTip', !value)
+        }
+      },
+      {
+        label: T('ABOUT'),
+        click () {
+          dialog.showMessageBox({
+            title: 'PicGo',
+            message: 'PicGo',
+            buttons: ['Ok'],
+            detail: `Version: ${pkg.version}\nAuthor: Molunerfinn\nGithub: https://github.com/Molunerfinn/PicGo`
+          })
+        }
+      },
+      // @ts-ignore
+      {
+        role: 'quit',
+        label: T('QUIT')
+      }
+    ])
+  }
+}
+
+export function createTray () {
+  const menubarPic = process.platform === 'darwin' ? `${__static}/menubar.png` : `${__static}/menubar-nodarwin.png`
+  tray = new Tray(menubarPic)
+  // click事件在Mac和Windows上可以触发（在Ubuntu上无法触发，Unity不支持）
+  if (process.platform === 'darwin' || process.platform === 'win32') {
+    tray.on('right-click', () => {
+      if (windowManager.has(IWindowList.TRAY_WINDOW)) {
+        windowManager.get(IWindowList.TRAY_WINDOW)!.hide()
+      }
+      createContextMenu()
+      tray!.popUpContextMenu(contextMenu!)
+    })
+    tray.on('click', (event, bounds) => {
+      if (process.platform === 'darwin') {
+        toggleWindow(bounds)
+        setTimeout(() => {
+          const img = clipboard.readImage()
+          const obj: ImgInfo[] = []
+          if (!img.isEmpty()) {
+            // 从剪贴板来的图片默认转为png
+            // @ts-ignore
+            const imgUrl = 'data:image/png;base64,' + Buffer.from(img.toPNG(), 'binary').toString('base64')
+            obj.push({
+              width: img.getSize().width,
+              height: img.getSize().height,
+              imgUrl
+            })
+          }
+          windowManager.get(IWindowList.TRAY_WINDOW)!.webContents.send('clipboardFiles', obj)
+        }, 0)
+      } else {
+        if (windowManager.has(IWindowList.TRAY_WINDOW)) {
+          windowManager.get(IWindowList.TRAY_WINDOW)!.hide()
+        }
+        const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)
+        settingWindow!.show()
+        settingWindow!.focus()
+        if (windowManager.has(IWindowList.MINI_WINDOW)) {
+          windowManager.get(IWindowList.MINI_WINDOW)!.hide()
+        }
+      }
+    })
+
+    tray.on('drag-enter', () => {
+      if (systemPreferences.isDarkMode()) {
+        tray!.setImage(`${__static}/upload-dark.png`)
+      } else {
+        tray!.setImage(`${__static}/upload.png`)
+      }
+    })
+
+    tray.on('drag-end', () => {
+      tray!.setImage(`${__static}/menubar.png`)
+    })
+
+    // drop-files only be supported in macOS
+    // so the tray window must be available
+    tray.on('drop-files', async (event: Event, files: string[]) => {
+      const pasteStyle = db.get('settings.pasteStyle') || 'markdown'
+      const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)!
+      const imgs = await uploader
+        .setWebContents(trayWindow.webContents)
+        .upload(files)
+      if (imgs !== false) {
+        const pasteText: string[] = []
+        for (let i = 0; i < imgs.length; i++) {
+          pasteText.push(pasteTemplate(pasteStyle, imgs[i], db.get('settings.customLink')))
+          const notification = new Notification({
+            title: T('UPLOAD_SUCCEED'),
+            body: imgs[i].imgUrl!,
+            icon: files[i]
+          })
+          setTimeout(() => {
+            notification.show()
+          }, i * 100)
+          await GalleryDB.getInstance().insert(imgs[i])
+        }
+        handleCopyUrl(pasteText.join('\n'))
+        trayWindow.webContents.send('dragFiles', imgs)
+      }
+    })
+    // toggleWindow()
+  } else if (process.platform === 'linux') {
+  // click事件在Ubuntu上无法触发，Unity不支持（在Mac和Windows上可以触发）
+  // 需要使用 setContextMenu 设置菜单
+    createContextMenu()
+    tray!.setContextMenu(contextMenu)
+  }
+}
+
+export function createMenu () {
+  if (process.env.NODE_ENV !== 'development') {
+    const template = [{
+      label: 'Edit',
+      submenu: [
+        { label: 'Undo', accelerator: 'CmdOrCtrl+Z', selector: 'undo:' },
+        { label: 'Redo', accelerator: 'Shift+CmdOrCtrl+Z', selector: 'redo:' },
+        { type: 'separator' },
+        { label: 'Cut', accelerator: 'CmdOrCtrl+X', selector: 'cut:' },
+        { label: 'Copy', accelerator: 'CmdOrCtrl+C', selector: 'copy:' },
+        { label: 'Paste', accelerator: 'CmdOrCtrl+V', selector: 'paste:' },
+        { label: 'Select All', accelerator: 'CmdOrCtrl+A', selector: 'selectAll:' },
+        {
+          label: 'Quit',
+          accelerator: 'CmdOrCtrl+Q',
+          click () {
+            app.quit()
+          }
+        }
+      ]
+    }]
+    // @ts-ignore
+    menu = Menu.buildFromTemplate(template)
+    Menu.setApplicationMenu(menu)
+  }
+}
+
+const toggleWindow = (bounds: IBounds) => {
+  const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)!
+  if (trayWindow.isVisible()) {
+    trayWindow.hide()
+  } else {
+    trayWindow.setPosition(bounds.x - 98 + 11, bounds.y, false)
+    trayWindow.webContents.send('updateFiles')
+    trayWindow.show()
+    trayWindow.focus()
+  }
+}

src/main/apis/app/uploader/apis.ts

@@ -0,0 +1,90 @@
+import {
+  Notification,
+  WebContents
+} from 'electron'
+import windowManager from 'apis/app/window/windowManager'
+import { IWindowList } from '#/types/enum'
+import uploader from '.'
+import pasteTemplate from '~/main/utils/pasteTemplate'
+import db, { GalleryDB } from '~/main/apis/core/datastore'
+import { handleCopyUrl } from '~/main/utils/common'
+import { handleUrlEncode } from '#/utils/common'
+import { T } from '#/i18n/index'
+// import dayjs from 'dayjs'
+
+const handleClipboardUploading = async (): Promise<false | ImgInfo[]> => {
+  const useBuiltinClipboard = !!db.get('settings.useBuiltinClipboard')
+  const win = windowManager.getAvailableWindow()
+  if (useBuiltinClipboard) {
+    return await uploader.setWebContents(win!.webContents).uploadWithBuildInClipboard()
+  }
+  return await uploader.setWebContents(win!.webContents).upload()
+}
+
+export const uploadClipboardFiles = async (): Promise<string> => {
+  const img = await handleClipboardUploading()
+  if (img !== false) {
+    if (img.length > 0) {
+      const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)
+      const pasteStyle = db.get('settings.pasteStyle') || 'markdown'
+      handleCopyUrl(pasteTemplate(pasteStyle, img[0], db.get('settings.customLink')))
+      const notification = new Notification({
+        title: T('UPLOAD_SUCCEED'),
+        body: img[0].imgUrl!,
+        icon: img[0].imgUrl
+      })
+      setTimeout(() => {
+        notification.show()
+      }, 100)
+      await GalleryDB.getInstance().insert(img[0])
+      // trayWindow just be created in mac/windows, not in linux
+      trayWindow?.webContents?.send('clipboardFiles', [])
+      trayWindow?.webContents?.send('uploadFiles', img)
+      if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+        windowManager.get(IWindowList.SETTING_WINDOW)!.webContents?.send('updateGallery')
+      }
+      return handleUrlEncode(img[0].imgUrl as string)
+    } else {
+      const notification = new Notification({
+        title: T('UPLOAD_FAILED'),
+        body: T('TIPS_UPLOAD_NOT_PICTURES')
+      })
+      notification.show()
+      return ''
+    }
+  } else {
+    return ''
+  }
+}
+
+export const uploadChoosedFiles = async (webContents: WebContents, files: IFileWithPath[]): Promise<string[]> => {
+  const input = files.map(item => item.path)
+  const imgs = await uploader.setWebContents(webContents).upload(input)
+  const result = []
+  if (imgs !== false) {
+    const pasteStyle = db.get('settings.pasteStyle') || 'markdown'
+    const pasteText: string[] = []
+    for (let i = 0; i < imgs.length; i++) {
+      pasteText.push(pasteTemplate(pasteStyle, imgs[i], db.get('settings.customLink')))
+      const notification = new Notification({
+        title: T('UPLOAD_SUCCEED'),
+        body: imgs[i].imgUrl!,
+        icon: files[i].path
+      })
+      setTimeout(() => {
+        notification.show()
+      }, i * 100)
+      await GalleryDB.getInstance().insert(imgs[i])
+      result.push(handleUrlEncode(imgs[i].imgUrl!))
+    }
+    handleCopyUrl(pasteText.join('\n'))
+    // trayWindow just be created in mac/windows, not in linux
+    windowManager.get(IWindowList.TRAY_WINDOW)?.webContents?.send('uploadFiles', imgs)
+    if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+      windowManager.get(IWindowList.SETTING_WINDOW)!.webContents?.send('updateGallery')
+    }
+    return result
+  } else {
+    return []
+  }
+}

src/main/apis/app/uploader/index.ts

@@ -0,0 +1,172 @@
+import {
+  Notification,
+  BrowserWindow,
+  ipcMain,
+  WebContents,
+  clipboard
+} from 'electron'
+import dayjs from 'dayjs'
+import picgo from '@core/picgo'
+import db from '~/main/apis/core/datastore'
+import windowManager from 'apis/app/window/windowManager'
+import { IWindowList } from '#/types/enum'
+import util from 'util'
+import { IPicGo } from 'picgo'
+import { showNotification, calcDurationRange } from '~/main/utils/common'
+import { RENAME_FILE_NAME, TALKING_DATA_EVENT } from '~/universal/events/constants'
+import logger from '@core/picgo/logger'
+import { T } from '~/universal/i18n'
+import fse from 'fs-extra'
+import path from 'path'
+
+const waitForShow = (webcontent: WebContents) => {
+  return new Promise<void>((resolve) => {
+    webcontent.on('did-finish-load', () => {
+      resolve()
+    })
+  })
+}
+
+const waitForRename = (window: BrowserWindow, id: number): Promise<string|null> => {
+  return new Promise((resolve) => {
+    const windowId = window.id
+    ipcMain.once(`${RENAME_FILE_NAME}${id}`, (evt: Event, newName: string) => {
+      resolve(newName)
+      window.close()
+    })
+    window.on('close', () => {
+      resolve(null)
+      ipcMain.removeAllListeners(`${RENAME_FILE_NAME}${id}`)
+      windowManager.deleteById(windowId)
+    })
+  })
+}
+
+const handleTalkingData = (webContents: WebContents, options: IAnalyticsData) => {
+  const data: ITalkingDataOptions = {
+    EventId: 'upload',
+    Label: options.type,
+    MapKv: {
+      by: options.fromClipboard ? 'clipboard' : 'files', // 上传剪贴板图片还是选择的文文件
+      count: options.count, // 上传的数量
+      duration: calcDurationRange(options.duration || 0), // 上传耗时
+      type: options.type
+    }
+  }
+  webContents.send(TALKING_DATA_EVENT, data)
+}
+
+class Uploader {
+  private webContents: WebContents | null = null
+  // private uploading: boolean = false
+  constructor () {
+    this.init()
+  }
+
+  init () {
+    picgo.on('notification', (message: Electron.NotificationConstructorOptions | undefined) => {
+      const notification = new Notification(message)
+      notification.show()
+    })
+
+    picgo.on('uploadProgress', (progress: any) => {
+      this.webContents?.send('uploadProgress', progress)
+    })
+    picgo.on('beforeTransform', () => {
+      if (db.get('settings.uploadNotification')) {
+        const notification = new Notification({
+          title: T('UPLOAD_PROGRESS'),
+          body: T('UPLOADING')
+        })
+        notification.show()
+      }
+    })
+    picgo.helper.beforeUploadPlugins.register('renameFn', {
+      handle: async (ctx: IPicGo) => {
+        const rename = db.get('settings.rename')
+        const autoRename = db.get('settings.autoRename')
+        if (autoRename || rename) {
+          await Promise.all(ctx.output.map(async (item, index) => {
+            let name: undefined | string | null
+            let fileName: string | undefined
+            if (autoRename) {
+              fileName = dayjs().add(index, 'ms').format('YYYYMMDDHHmmSSS') + item.extname
+            } else {
+              fileName = item.fileName
+            }
+            if (rename) {
+              const window = windowManager.create(IWindowList.RENAME_WINDOW)!
+              await waitForShow(window.webContents)
+              window.webContents.send(RENAME_FILE_NAME, fileName, item.fileName, window.webContents.id)
+              name = await waitForRename(window, window.webContents.id)
+            }
+            item.fileName = name || fileName
+          }))
+        }
+      }
+    })
+  }
+
+  setWebContents (webContents: WebContents) {
+    this.webContents = webContents
+    return this
+  }
+
+  /**
+   * use electron's clipboard image to upload
+   */
+  async uploadWithBuildInClipboard (): Promise<ImgInfo[]|false> {
+    let filePath = ''
+    try {
+      const nativeImage = clipboard.readImage()
+      if (nativeImage.isEmpty()) {
+        return false
+      }
+      const buffer = nativeImage.toPNG()
+      const baseDir = picgo.baseDir
+      const fileName = `${dayjs().format('YYYYMMDDHHmmSSS')}.png`
+      filePath = path.join(baseDir, fileName)
+      await fse.writeFile(filePath, buffer)
+      return await this.upload([filePath])
+    } catch (e: any) {
+      logger.error(e)
+      return false
+    } finally {
+      if (filePath) {
+        fse.unlink(filePath)
+      }
+    }
+  }
+
+  async upload (img?: IUploadOption): Promise<ImgInfo[]|false> {
+    try {
+      const startTime = Date.now()
+      const output = await picgo.upload(img)
+      if (Array.isArray(output) && output.some((item: ImgInfo) => item.imgUrl)) {
+        if (this.webContents) {
+          handleTalkingData(this.webContents, {
+            fromClipboard: !img,
+            type: db.get('picBed.uploader') || db.get('picBed.current') || 'smms',
+            count: img ? img.length : 1,
+            duration: Date.now() - startTime
+          } as IAnalyticsData)
+        }
+        return output.filter(item => item.imgUrl)
+      } else {
+        return false
+      }
+    } catch (e: any) {
+      logger.error(e)
+      setTimeout(() => {
+        showNotification({
+          title: T('UPLOAD_FAILED'),
+          body: util.format(e.stack),
+          clickToCopy: true
+        })
+      }, 500)
+      return false
+    }
+  }
+}
+
+export default new Uploader()

src/main/apis/app/window/constants.ts

@@ -0,0 +1,17 @@
+const isDevelopment = process.env.NODE_ENV !== 'production'
+
+export const TRAY_WINDOW_URL = isDevelopment
+  ? (process.env.WEBPACK_DEV_SERVER_URL as string)
+  : 'picgo://./index.html'
+
+export const SETTING_WINDOW_URL = isDevelopment
+  ? `${(process.env.WEBPACK_DEV_SERVER_URL as string)}#main-page/upload`
+  : 'picgo://./index.html#main-page/upload'
+
+export const MINI_WINDOW_URL = isDevelopment
+  ? `${(process.env.WEBPACK_DEV_SERVER_URL as string)}#mini-page`
+  : 'picgo://./index.html#mini-page'
+
+export const RENAME_WINDOW_URL = process.env.NODE_ENV === 'development'
+  ? `${(process.env.WEBPACK_DEV_SERVER_URL as string)}#rename-page`
+  : 'picgo://./index.html#rename-page'

src/main/apis/app/window/windowList.ts

@@ -1,21 +1,28 @@
 import {
-  IWindowList,
-  DELETE_WINDOW_EVENT,
-  CREATE_WINDOW_EVENT,
   SETTING_WINDOW_URL,
   TRAY_WINDOW_URL,
   MINI_WINDOW_URL,
   RENAME_WINDOW_URL
 } from './constants'
-import { IWindowListItem } from '#/types/electron'
-import bus from '~/main/utils/eventBus'
-import db from '#/datastore'
-import { getWindowId } from '~/main/apis/bus'
-import { BrowserWindow, app } from 'electron'
-import { CREATE_APP_MENU } from '~/main/apis/bus/constants'
+import { IWindowList } from '#/types/enum'
+import bus from '@core/bus'
+import { CREATE_APP_MENU } from '@core/bus/constants'
+import db from '~/main/apis/core/datastore'
+import { TOGGLE_SHORTKEY_MODIFIED_MODE } from '#/events/constants'
+import { app } from 'electron'
+import { i18n } from '~/universal/i18n'
+import { URLSearchParams } from 'url'
 
 const windowList = new Map<IWindowList, IWindowListItem>()
 
+const handleWindowParams = (windowURL: string) => {
+  const [baseURL, hash = ''] = windowURL.split('#')
+  const search = new URLSearchParams()
+  const lang = i18n.getLanguage()
+  search.append('lang', lang)
+  return `${baseURL}?${search.toString()}#${hash}`
+}
+
 windowList.set(IWindowList.TRAY_WINDOW, {
   isValid: process.platform !== 'linux',
   multiple: false,
@@ -30,21 +37,17 @@ windowList.set(IWindowList.TRAY_WINDOW, {
       transparent: true,
       vibrancy: 'ultra-dark',
       webPreferences: {
-        nodeIntegration: true,
+        nodeIntegration: !!process.env.ELECTRON_NODE_INTEGRATION,
+        contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,
         nodeIntegrationInWorker: true,
         backgroundThrottling: false
       }
     }
   },
   callback (window) {
-    const id = window!.id
-    window!.loadURL(TRAY_WINDOW_URL)
-    window!.on('closed', () => {
-      bus.emit(DELETE_WINDOW_EVENT, id)
-    })
-
-    window!.on('blur', () => {
-      window!.hide()
+    window.loadURL(handleWindowParams(TRAY_WINDOW_URL))
+    window.on('blur', () => {
+      window.hide()
     })
   }
 })
@@ -67,7 +70,8 @@ windowList.set(IWindowList.SETTING_WINDOW, {
       titleBarStyle: 'hidden',
       webPreferences: {
         backgroundThrottling: false,
-        nodeIntegration: true,
+        nodeIntegration: !!process.env.ELECTRON_NODE_INTEGRATION,
+        contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,
         nodeIntegrationInWorker: true,
         webSecurity: false
       }
@@ -81,12 +85,10 @@ windowList.set(IWindowList.SETTING_WINDOW, {
     }
     return options
   },
-  callback (window) {
-    const id = window!.id
-    window!.loadURL(SETTING_WINDOW_URL)
-    window!.on('closed', () => {
-      bus.emit('toggleShortKeyModifiedMode', false)
-      bus.emit(DELETE_WINDOW_EVENT, id)
+  callback (window, windowManager) {
+    window.loadURL(handleWindowParams(SETTING_WINDOW_URL))
+    window.on('closed', () => {
+      bus.emit(TOGGLE_SHORTKEY_MODIFIED_MODE, false)
       if (process.platform === 'linux') {
         process.nextTick(() => {
           app.quit()
@@ -94,7 +96,7 @@ windowList.set(IWindowList.SETTING_WINDOW, {
       }
     })
     bus.emit(CREATE_APP_MENU)
-    bus.emit(CREATE_WINDOW_EVENT, IWindowList.MINI_WINDOW)
+    windowManager.create(IWindowList.MINI_WINDOW)
   }
 })
 
@@ -102,7 +104,7 @@ windowList.set(IWindowList.MINI_WINDOW, {
   isValid: process.platform !== 'darwin',
   multiple: false,
   options () {
-    let obj: IBrowserWindowOptions = {
+    const obj: IBrowserWindowOptions = {
       height: 64,
       width: 64,
       show: process.platform === 'linux',
@@ -114,7 +116,8 @@ windowList.set(IWindowList.MINI_WINDOW, {
       icon: `${__static}/logo.png`,
       webPreferences: {
         backgroundThrottling: false,
-        nodeIntegration: true,
+        nodeIntegration: !!process.env.ELECTRON_NODE_INTEGRATION,
+        contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,
         nodeIntegrationInWorker: true
       }
     }
@@ -125,11 +128,7 @@ windowList.set(IWindowList.MINI_WINDOW, {
     return obj
   },
   callback (window) {
-    const id = window!.id
-    window!.loadURL(MINI_WINDOW_URL)
-    window!.on('closed', () => {
-      bus.emit(DELETE_WINDOW_EVENT, id)
-    })
+    window.loadURL(handleWindowParams(MINI_WINDOW_URL))
   }
 })
 
@@ -137,7 +136,7 @@ windowList.set(IWindowList.RENAME_WINDOW, {
   isValid: true,
   multiple: true,
   options () {
-    let options: IBrowserWindowOptions = {
+    const options: IBrowserWindowOptions = {
       height: 175,
       width: 300,
       show: true,
@@ -145,7 +144,8 @@ windowList.set(IWindowList.RENAME_WINDOW, {
       resizable: false,
       vibrancy: 'ultra-dark',
       webPreferences: {
-        nodeIntegration: true,
+        nodeIntegration: !!process.env.ELECTRON_NODE_INTEGRATION,
+        contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,
         nodeIntegrationInWorker: true,
         backgroundThrottling: false
       }
@@ -158,10 +158,9 @@ windowList.set(IWindowList.RENAME_WINDOW, {
     }
     return options
   },
-  async callback (window) {
-    window!.loadURL(RENAME_WINDOW_URL)
-    const currentWindowId = await getWindowId()
-    const currentWindow = BrowserWindow.fromId(currentWindowId)
+  async callback (window, windowManager) {
+    window.loadURL(handleWindowParams(RENAME_WINDOW_URL))
+    const currentWindow = windowManager.getAvailableWindow()
     if (currentWindow && currentWindow.isVisible()) {
     // bounds: { x: 821, y: 75, width: 800, height: 450 }
       const bounds = currentWindow.getBounds()
@@ -173,7 +172,7 @@ windowList.set(IWindowList.RENAME_WINDOW, {
       } else { // if is the miniWindow
         positionY = bounds.y + bounds.height / 2
       }
-      window!.setPosition(positionX, positionY, false)
+      window.setPosition(positionX, positionY, false)
     }
   }
 })

src/main/apis/app/window/windowManager.ts

@@ -1,29 +1,20 @@
 import {
   BrowserWindow
 } from 'electron'
-import { IWindowManager, IWindowListItem } from '#/types/electron'
 import windowList from './windowList'
-import {
-  IWindowList,
-  DELETE_WINDOW_EVENT,
-  CREATE_WINDOW_EVENT
-} from './constants'
-import bus from '~/main/utils/eventBus'
+import { IWindowList } from '#/types/enum'
 
 class WindowManager implements IWindowManager {
   private windowMap: Map<IWindowList | string, BrowserWindow> = new Map()
   private windowIdMap: Map<number, IWindowList | string> = new Map()
-  constructor () {
-    bus.on(DELETE_WINDOW_EVENT, this.deleteById)
-    bus.on(CREATE_WINDOW_EVENT, this.create)
-  }
-  create = (name: IWindowList) => {
+  create (name: IWindowList) {
     const windowConfig: IWindowListItem = windowList.get(name)!
     if (windowConfig.isValid) {
       if (!windowConfig.multiple) {
-        if (this.windowMap.has(name)) return this.windowMap.get(name)!
+        if (this.has(name)) return this.windowMap.get(name)!
       }
       const window = new BrowserWindow(windowConfig.options())
+      const id = window.id
       if (windowConfig.multiple) {
         this.windowMap.set(`${name}_${window.id}`, window)
         this.windowIdMap.set(window.id, `${name}_${window.id}`)
@@ -31,30 +22,37 @@ class WindowManager implements IWindowManager {
         this.windowMap.set(name, window)
         this.windowIdMap.set(window.id, name)
       }
-      windowConfig.callback(window)
+      windowConfig.callback(window, this)
+      window.on('close', () => {
+        this.deleteById(id)
+      })
       return window
     } else {
       return null
     }
   }
+
   get (name: IWindowList) {
-    if (this.windowMap.has(name)) {
+    if (this.has(name)) {
       return this.windowMap.get(name)!
     } else {
       const window = this.create(name)
       return window
     }
   }
+
   has (name: IWindowList) {
     return this.windowMap.has(name)
   }
-  delete = (name: IWindowList) => {
-    const window = this.windowMap.get(name)
-    if (window) {
-      this.windowIdMap.delete(window.id)
-      this.windowMap.delete(name)
-    }
-  }
+
+  // useless
+  // delete (name: IWindowList) {
+  //   const window = this.windowMap.get(name)
+  //   if (window) {
+  //     this.windowIdMap.delete(window.id)
+  //     this.windowMap.delete(name)
+  //   }
+  // }
   deleteById = (id: number) => {
     const name = this.windowIdMap.get(id)
     if (name) {
@@ -62,6 +60,7 @@ class WindowManager implements IWindowManager {
       this.windowIdMap.delete(id)
     }
   }
+
   getAvailableWindow () {
     const miniWindow = this.windowMap.get(IWindowList.MINI_WINDOW)
     if (miniWindow && miniWindow.isVisible()) {

src/main/apis/core/bus/apis.ts

@@ -1,4 +1,4 @@
-import bus from '../../utils/eventBus'
+import bus from '.'
 import {
   UPLOAD_WITH_FILES,
   UPLOAD_WITH_FILES_RESPONSE,
@@ -14,7 +14,7 @@ export const uploadWithClipboardFiles = (): Promise<{
   success: boolean,
   result?: string[]
 }> => {
-  return new Promise((resolve, reject) => {
+  return new Promise((resolve) => {
     bus.once(UPLOAD_WITH_CLIPBOARD_FILES_RESPONSE, (result: string) => {
       if (result) {
         return resolve({
@@ -35,7 +35,7 @@ export const uploadWithFiles = (pathList: IFileWithPath[]): Promise<{
   success: boolean,
   result?: string[]
 }> => {
-  return new Promise((resolve, reject) => {
+  return new Promise((resolve) => {
     bus.once(UPLOAD_WITH_FILES_RESPONSE, (result: string[]) => {
       if (result.length) {
         return resolve({
@@ -55,7 +55,7 @@ export const uploadWithFiles = (pathList: IFileWithPath[]): Promise<{
 // get available window id:
 // miniWindow or settingWindow or trayWindow
 export const getWindowId = (): Promise<number> => {
-  return new Promise((resolve, reject) => {
+  return new Promise((resolve) => {
     bus.once(GET_WINDOW_ID_REPONSE, (id: number) => {
       resolve(id)
     })
@@ -65,7 +65,7 @@ export const getWindowId = (): Promise<number> => {
 
 // get settingWindow id:
 export const getSettingWindowId = (): Promise<number> => {
-  return new Promise((resolve, reject) => {
+  return new Promise((resolve) => {
     bus.once(GET_SETTING_WINDOW_ID_RESPONSE, (id: number) => {
       resolve(id)
     })

src/main/apis/core/datastore/dbChecker.ts

@@ -0,0 +1,139 @@
+import fs from 'fs-extra'
+import path from 'path'
+import { app as APP } from 'electron'
+import { getLogger } from '@core/utils/localLogger'
+import dayjs from 'dayjs'
+import { T } from '~/universal/i18n'
+const STORE_PATH = APP.getPath('userData')
+const configFilePath = path.join(STORE_PATH, 'data.json')
+const configFileBackupPath = path.join(STORE_PATH, 'data.bak.json')
+export const defaultConfigPath = configFilePath
+let _configFilePath = ''
+let hasCheckPath = false
+
+const errorMsg = {
+  broken: T('TIPS_PICGO_CONFIG_FILE_BROKEN_WITH_DEFAULT'),
+  brokenButBackup: T('TIPS_PICGO_CONFIG_FILE_BROKEN_WITH_BACKUP')
+}
+
+/** ensure notification list */
+if (!global.notificationList) global.notificationList = []
+
+function dbChecker () {
+  if (process.type !== 'renderer') {
+    // db save bak
+    try {
+      const { dbPath, dbBackupPath } = getGalleryDBPath()
+      if (fs.existsSync(dbPath)) {
+        fs.copyFileSync(dbPath, dbBackupPath)
+      }
+    } catch (e) {
+      console.error(e)
+    }
+
+    const configFilePath = dbPathChecker()
+    if (!fs.existsSync(configFilePath)) {
+      return
+    }
+    let configFile: string = '{}'
+    const optionsTpl = {
+      title: T('TIPS_NOTICE'),
+      body: ''
+    }
+    // config save bak
+    try {
+      configFile = fs.readFileSync(configFilePath, { encoding: 'utf-8' })
+      JSON.parse(configFile)
+    } catch (e) {
+      fs.unlinkSync(configFilePath)
+      if (fs.existsSync(configFileBackupPath)) {
+        try {
+          configFile = fs.readFileSync(configFileBackupPath, { encoding: 'utf-8' })
+          JSON.parse(configFile)
+          fs.writeFileSync(configFilePath, configFile, { encoding: 'utf-8' })
+          const stats = fs.statSync(configFileBackupPath)
+          optionsTpl.body = `${errorMsg.brokenButBackup}\n${T('TIPS_PICGO_BACKUP_FILE_VERSION', {
+            v: dayjs(stats.mtime).format('YYYY-MM-DD HH:mm:ss')
+          })}`
+          global.notificationList?.push(optionsTpl)
+          return
+        } catch (e) {
+          optionsTpl.body = errorMsg.broken
+          global.notificationList?.push(optionsTpl)
+          return
+        }
+      }
+      optionsTpl.body = errorMsg.broken
+      global.notificationList?.push(optionsTpl)
+      return
+    }
+    fs.writeFileSync(configFileBackupPath, configFile, { encoding: 'utf-8' })
+  }
+}
+
+/**
+ * Get config path
+ */
+function dbPathChecker (): string {
+  if (_configFilePath) {
+    return _configFilePath
+  }
+  // defaultConfigPath
+  _configFilePath = defaultConfigPath
+  // if defaultConfig path is not exit
+  // do not parse the content of config
+  if (!fs.existsSync(defaultConfigPath)) {
+    return _configFilePath
+  }
+  try {
+    const configString = fs.readFileSync(defaultConfigPath, { encoding: 'utf-8' })
+    const config = JSON.parse(configString)
+    const userConfigPath: string = config.configPath || ''
+    if (userConfigPath) {
+      if (fs.existsSync(userConfigPath) && userConfigPath.endsWith('.json')) {
+        _configFilePath = userConfigPath
+        return _configFilePath
+      }
+    }
+    return _configFilePath
+  } catch (e) {
+    const picgoLogPath = path.join(STORE_PATH, 'picgo.log')
+    const logger = getLogger(picgoLogPath)
+    if (!hasCheckPath) {
+      const optionsTpl = {
+        title: T('TIPS_NOTICE'),
+        body: T('TIPS_CUSTOM_CONFIG_FILE_PATH_ERROR')
+      }
+      global.notificationList?.push(optionsTpl)
+      hasCheckPath = true
+    }
+    logger('error', e)
+    console.error(e)
+    _configFilePath = defaultConfigPath
+    return _configFilePath
+  }
+}
+
+function dbPathDir () {
+  return path.dirname(dbPathChecker())
+}
+
+function getGalleryDBPath (): {
+  dbPath: string
+  dbBackupPath: string
+} {
+  const configPath = dbPathChecker()
+  const dbPath = path.join(path.dirname(configPath), 'picgo.db')
+  const dbBackupPath = path.join(path.dirname(dbPath), 'picgo.bak.db')
+  return {
+    dbPath,
+    dbBackupPath
+  }
+}
+
+export {
+  dbChecker,
+  dbPathChecker,
+  dbPathDir,
+  getGalleryDBPath
+}

src/main/apis/core/datastore/index.ts

@@ -2,34 +2,35 @@ import Datastore from 'lowdb'
 // @ts-ignore
 import LodashId from 'lodash-id'
 import FileSync from 'lowdb/adapters/FileSync'
-import path from 'path'
 import fs from 'fs-extra'
-import { remote, app } from 'electron'
+import { dbPathChecker, dbPathDir, getGalleryDBPath } from './dbChecker'
+import { DBStore } from '@picgo/store'
+import { T } from '~/universal/i18n'
 
-const APP = process.type === 'renderer' ? remote.app : app
-const STORE_PATH = APP.getPath('userData')
+const STORE_PATH = dbPathDir()
 
-if (process.type !== 'renderer') {
-  if (!fs.pathExistsSync(STORE_PATH)) {
-    fs.mkdirpSync(STORE_PATH)
-  }
+if (!fs.pathExistsSync(STORE_PATH)) {
+  fs.mkdirpSync(STORE_PATH)
 }
+const CONFIG_PATH: string = dbPathChecker()
+const DB_PATH: string = getGalleryDBPath().dbPath
 
-class DB {
+// TODO: use JSONStore with @picgo/store
+class ConfigStore {
   private db: Datastore.LowdbSync<Datastore.AdapterSync>
   constructor () {
-    const adapter = new FileSync(path.join(STORE_PATH, '/data.json'))
+    const adapter = new FileSync(CONFIG_PATH)
 
     this.db = Datastore(adapter)
     this.db._.mixin(LodashId)
 
-    if (!this.db.has('uploaded').value()) {
-      this.db.set('uploaded', []).write()
-    }
-
     if (!this.db.has('picBed').value()) {
       this.db.set('picBed', {
-        current: 'weibo'
+        current: 'smms', // deprecated
+        uploader: 'smms',
+        smms: {
+          token: ''
+        }
       }).write()
     }
 
@@ -38,37 +39,68 @@ class DB {
         enable: true,
         key: 'CommandOrControl+Shift+P',
         name: 'upload',
-        label: '快捷上传'
+        label: T('QUICK_UPLOAD')
       }).write()
     }
   }
+
   read () {
     return this.db.read()
   }
+
   get (key = '') {
     return this.read().get(key).value()
   }
+
   set (key: string, value: any) {
     return this.read().set(key, value).write()
   }
+
   has (key: string) {
     return this.read().has(key).value()
   }
+
   insert (key: string, value: any): void {
     // @ts-ignore
     return this.read().get(key).insert(value).write()
   }
+
   unset (key: string, value: any): boolean {
     return this.read().get(key).unset(value).value()
   }
+
   getById (key: string, id: string) {
     // @ts-ignore
     return this.read().get(key).getById(id).value()
   }
+
   removeById (key: string, id: string) {
     // @ts-ignore
     return this.read().get(key).removeById(id).write()
   }
+
+  getConfigPath () {
+    return CONFIG_PATH
+  }
 }
 
-export default new DB()
+export default new ConfigStore()
+
+// v2.3.0 add gallery db
+class GalleryDB {
+  private static instance: DBStore
+  private constructor () {
+    console.log('init gallery db')
+  }
+
+  public static getInstance (): DBStore {
+    if (!GalleryDB.instance) {
+      GalleryDB.instance = new DBStore(DB_PATH, 'gallery')
+    }
+    return GalleryDB.instance
+  }
+}
+
+export {
+  GalleryDB
+}

src/main/apis/core/picgo/index.ts

@@ -0,0 +1,18 @@
+import { dbChecker, dbPathChecker } from 'apis/core/datastore/dbChecker'
+import pkg from 'root/package.json'
+import { PicGo } from 'picgo'
+
+const CONFIG_PATH = dbPathChecker()
+
+dbChecker()
+
+const picgo = new PicGo(CONFIG_PATH)
+picgo.saveConfig({
+  debug: true,
+  PICGO_ENV: 'GUI'
+})
+
+global.PICGO_GUI_VERSION = pkg.version
+picgo.GUI_VERSION = global.PICGO_GUI_VERSION
+
+export default picgo

src/main/apis/core/picgo/logger.ts

@@ -0,0 +1,5 @@
+import picgo from '.'
+
+const logger = picgo.log
+
+export default logger

src/main/apis/core/utils/localLogger.ts

@@ -0,0 +1,32 @@
+import fs from 'fs-extra'
+import dayjs from 'dayjs'
+import util from 'util'
+
+/**
+ * for local log before picgo inited
+ */
+const getLogger = (logPath: string) => {
+  if (!fs.existsSync(logPath)) {
+    fs.ensureFileSync(logPath)
+  }
+  return (type: string, ...msg: any[]) => {
+    let log = `${dayjs().format('YYYY-MM-DD HH:mm:ss')} [PicGo ${type.toUpperCase()}] `
+    msg.forEach((item: ILogArgvTypeWithError) => {
+      if (typeof item === 'object' && type === 'error') {
+        log += `\n------Error Stack Begin------\n${util.format(item.stack)}\n-------Error Stack End------- `
+      } else {
+        if (typeof item === 'object') {
+          item = JSON.stringify(item)
+        }
+        log += `${item} `
+      }
+    })
+    log += '\n'
+    // A synchronized approach to avoid log msg sequence errors
+    fs.appendFileSync(logPath, log)
+  }
+}
+
+export {
+  getLogger
+}

src/main/apis/eventCenter/ipcList.ts

@@ -1,143 +0,0 @@
-import {
-  app,
-  ipcMain,
-  clipboard,
-  Notification,
-  IpcMainEvent
-} from 'electron'
-import windowManager from '~/main/apis/window/windowManager'
-import { IWindowList } from '~/main/apis/window/constants'
-import uploader from '~/main/apis/uploader'
-import pasteTemplate from '#/utils/pasteTemplate'
-import db from '#/datastore'
-import server from '~/main/server'
-import getPicBeds from '~/main/utils/getPicBeds'
-import shortKeyHandler from '~/main/apis/shortKey/shortKeyHandler'
-import bus from '~/main/utils/eventBus'
-import {
-  uploadClipboardFiles,
-  uploadChoosedFiles
-} from '~/main/apis/uploader/api'
-import picgoCoreIPC from './picgoCoreIPC'
-
-export default {
-  listen () {
-    picgoCoreIPC.listen()
-    // from macOS tray
-    ipcMain.on('uploadClipboardFiles', async () => {
-      const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)!
-      const img = await uploader.setWebContents(trayWindow.webContents).upload()
-      if (img !== false) {
-        const pasteStyle = db.get('settings.pasteStyle') || 'markdown'
-        clipboard.writeText(pasteTemplate(pasteStyle, img[0]))
-        const notification = new Notification({
-          title: '上传成功',
-          body: img[0].imgUrl!,
-          // icon: file[0]
-          icon: img[0].imgUrl
-        })
-        notification.show()
-        db.insert('uploaded', img[0])
-        trayWindow.webContents.send('clipboardFiles', [])
-        if (windowManager.has(IWindowList.SETTING_WINDOW)) {
-          windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('updateGallery')
-        }
-      }
-      trayWindow.webContents.send('uploadFiles')
-    })
-
-    ipcMain.on('uploadClipboardFilesFromUploadPage', () => {
-      uploadClipboardFiles()
-    })
-
-    ipcMain.on('uploadChoosedFiles', async (evt: IpcMainEvent, files: IFileWithPath[]) => {
-      return uploadChoosedFiles(evt.sender, files)
-    })
-
-    ipcMain.on('updateShortKey', (evt: IpcMainEvent, item: IShortKeyConfig, oldKey: string, from: string) => {
-      const result = shortKeyHandler.updateShortKey(item, oldKey, from)
-      evt.sender.send('updateShortKeyResponse', result)
-      if (result) {
-        const notification = new Notification({
-          title: '操作成功',
-          body: '你的快捷键已经修改成功'
-        })
-        notification.show()
-      } else {
-        const notification = new Notification({
-          title: '操作失败',
-          body: '快捷键冲突，请重新设置'
-        })
-        notification.show()
-      }
-    })
-
-    ipcMain.on('bindOrUnbindShortKey', (evt: IpcMainEvent, item: IShortKeyConfig, from: string) => {
-      const result = shortKeyHandler.bindOrUnbindShortKey(item, from)
-      if (result) {
-        const notification = new Notification({
-          title: '操作成功',
-          body: '你的快捷键已经修改成功'
-        })
-        notification.show()
-      } else {
-        const notification = new Notification({
-          title: '操作失败',
-          body: '快捷键冲突，请重新设置'
-        })
-        notification.show()
-      }
-    })
-
-    ipcMain.on('updateCustomLink', () => {
-      const notification = new Notification({
-        title: '操作成功',
-        body: '你的自定义链接格式已经修改成功'
-      })
-      notification.show()
-    })
-
-    ipcMain.on('autoStart', (evt: IpcMainEvent, val: boolean) => {
-      app.setLoginItemSettings({
-        openAtLogin: val
-      })
-    })
-
-    ipcMain.on('openSettingWindow', () => {
-      windowManager.get(IWindowList.SETTING_WINDOW)!.show()
-      if (windowManager.has(IWindowList.MINI_WINDOW)) {
-        windowManager.get(IWindowList.MINI_WINDOW)!.hide()
-      }
-    })
-
-    ipcMain.on('openMiniWindow', () => {
-      const miniWindow = windowManager.get(IWindowList.MINI_WINDOW)!
-      const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)!
-      miniWindow.show()
-      miniWindow.focus()
-      settingWindow.hide()
-    })
-
-    //  from mini window
-    ipcMain.on('syncPicBed', () => {
-      if (windowManager.has(IWindowList.SETTING_WINDOW)) {
-        windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('syncPicBed')
-      }
-    })
-
-    ipcMain.on('getPicBeds', (evt: IpcMainEvent) => {
-      const picBeds = getPicBeds()
-      evt.sender.send('getPicBeds', picBeds)
-      evt.returnValue = picBeds
-    })
-
-    ipcMain.on('toggleShortKeyModifiedMode', (evt: IpcMainEvent, val: boolean) => {
-      bus.emit('toggleShortKeyModifiedMode', val)
-    })
-
-    ipcMain.on('updateServer', () => {
-      server.restart()
-    })
-  },
-  dispose () {}
-}

src/main/apis/eventCenter/picgoCoreIPC.ts

@@ -1,225 +0,0 @@
-import path from 'path'
-import GuiApi from '../gui'
-import {
-  dialog,
-  shell,
-  IpcMainEvent,
-  ipcMain,
-  app
-} from 'electron'
-import PicGoCore from '~/universal/types/picgo'
-import { IPicGoHelperType } from '#/types/enum'
-import shortKeyHandler from '../shortKey/shortKeyHandler'
-import picgo from '~/main/apis/picgo'
-
-// eslint-disable-next-line
-const requireFunc = typeof __webpack_require__ === 'function' ? __non_webpack_require__ : require
-// const PluginHandler = requireFunc('picgo/dist/lib/PluginHandler').default
-const STORE_PATH = app.getPath('userData')
-// const CONFIG_PATH = path.join(STORE_PATH, '/data.json')
-
-type PicGoNotice = {
-  title: string,
-  body: string[]
-}
-
-interface GuiMenuItem {
-  label: string
-  handle: (arg0: PicGoCore, arg1: GuiApi) => Promise<void>
-}
-
-// get uploader or transformer config
-const getConfig = (name: string, type: IPicGoHelperType, ctx: PicGoCore) => {
-  let config: any[] = []
-  if (name === '') {
-    return config
-  } else {
-    const handler = ctx.helper[type].get(name)
-    if (handler) {
-      if (handler.config) {
-        config = handler.config(ctx)
-      }
-    }
-    return config
-  }
-}
-
-const handleConfigWithFunction = (config: any[]) => {
-  for (let i in config) {
-    if (typeof config[i].default === 'function') {
-      config[i].default = config[i].default()
-    }
-    if (typeof config[i].choices === 'function') {
-      config[i].choices = config[i].choices()
-    }
-  }
-  return config
-}
-
-const handleGetPluginList = () => {
-  ipcMain.on('getPluginList', (event: IpcMainEvent) => {
-    const pluginList = picgo.pluginLoader.getList()
-    const list = []
-    for (let i in pluginList) {
-      const plugin = picgo.pluginLoader.getPlugin(pluginList[i])
-      const pluginPath = path.join(STORE_PATH, `/node_modules/${pluginList[i]}`)
-      const pluginPKG = requireFunc(path.join(pluginPath, 'package.json'))
-      const uploaderName = plugin.uploader || ''
-      const transformerName = plugin.transformer || ''
-      let menu = []
-      if (plugin.guiMenu) {
-        menu = plugin.guiMenu(picgo)
-      }
-      let gui = false
-      if (pluginPKG.keywords && pluginPKG.keywords.length > 0) {
-        if (pluginPKG.keywords.includes('picgo-gui-plugin')) {
-          gui = true
-        }
-      }
-      const obj: IPicGoPlugin = {
-        name: pluginList[i].replace(/picgo-plugin-/, ''),
-        author: pluginPKG.author.name || pluginPKG.author,
-        description: pluginPKG.description,
-        logo: 'file://' + path.join(pluginPath, 'logo.png').split(path.sep).join('/'),
-        version: pluginPKG.version,
-        gui,
-        config: {
-          plugin: {
-            name: pluginList[i].replace(/picgo-plugin-/, ''),
-            config: plugin.config ? handleConfigWithFunction(plugin.config(picgo)) : []
-          },
-          uploader: {
-            name: uploaderName,
-            config: handleConfigWithFunction(getConfig(uploaderName, IPicGoHelperType.uploader, picgo))
-          },
-          transformer: {
-            name: transformerName,
-            config: handleConfigWithFunction(getConfig(uploaderName, IPicGoHelperType.transformer, picgo))
-          }
-        },
-        enabled: picgo.getConfig(`picgoPlugins.${pluginList[i]}`),
-        homepage: pluginPKG.homepage ? pluginPKG.homepage : '',
-        guiMenu: menu,
-        ing: false
-      }
-      list.push(obj)
-    }
-    event.sender.send('pluginList', list)
-    picgo.cmd.program.removeAllListeners()
-  })
-}
-
-const handlePluginInstall = () => {
-  ipcMain.on('installPlugin', async (event: IpcMainEvent, msg: string) => {
-    picgo.once('installSuccess', (notice: PicGoNotice) => {
-      event.sender.send('installSuccess', notice.body[0].replace(/picgo-plugin-/, ''))
-      shortKeyHandler.registerPluginShortKey(notice.body[0])
-      picgo.removeAllListeners('installFailed')
-    })
-    picgo.once('installFailed', () => {
-      handleNPMError()
-      picgo.removeAllListeners('installSuccess')
-    })
-    await picgo.pluginHandler.install([msg])
-    picgo.cmd.program.removeAllListeners()
-  })
-}
-
-const handlePluginUninstall = () => {
-  ipcMain.on('uninstallPlugin', async (event: IpcMainEvent, msg: string) => {
-    picgo.once('uninstallSuccess', (notice: PicGoNotice) => {
-      event.sender.send('uninstallSuccess', notice.body[0].replace(/picgo-plugin-/, ''))
-      shortKeyHandler.unregisterPluginShortKey(notice.body[0])
-      picgo.removeAllListeners('uninstallFailed')
-    })
-    picgo.once('uninstallFailed', () => {
-      handleNPMError()
-      picgo.removeAllListeners('uninstallSuccess')
-    })
-    await picgo.pluginHandler.uninstall([msg])
-    picgo.cmd.program.removeAllListeners()
-  })
-}
-
-const handlePluginUpdate = () => {
-  ipcMain.on('updatePlugin', async (event: IpcMainEvent, msg: string) => {
-    picgo.once('updateSuccess', (notice: { body: string[], title: string }) => {
-      event.sender.send('updateSuccess', notice.body[0].replace(/picgo-plugin-/, ''))
-      picgo.removeAllListeners('updateFailed')
-    })
-    picgo.once('updateFailed', () => {
-      handleNPMError()
-      picgo.removeAllListeners('updateSuccess')
-    })
-    await picgo.pluginHandler.update([msg])
-    picgo.cmd.program.removeAllListeners()
-  })
-}
-
-const handleNPMError = () => {
-  dialog.showMessageBox({
-    title: '发生错误',
-    message: '请安装Node.js并重启PicGo再继续操作',
-    buttons: ['Yes']
-  }).then((res) => {
-    if (res.response === 0) {
-      shell.openExternal('https://nodejs.org/')
-    }
-  })
-}
-
-const handleGetPicBedConfig = () => {
-  ipcMain.on('getPicBedConfig', (event: IpcMainEvent, type: string) => {
-    const name = picgo.helper.uploader.get(type).name || type
-    if (picgo.helper.uploader.get(type).config) {
-      const config = handleConfigWithFunction(picgo.helper.uploader.get(type).config(picgo))
-      event.sender.send('getPicBedConfig', config, name)
-    } else {
-      event.sender.send('getPicBedConfig', [], name)
-    }
-    picgo.cmd.program.removeAllListeners()
-  })
-}
-
-const handlePluginActions = () => {
-  ipcMain.on('pluginActions', (event: IpcMainEvent, name: string, label: string) => {
-    const plugin = picgo.pluginLoader.getPlugin(`picgo-plugin-${name}`)
-    const guiApi = new GuiApi()
-    if (plugin.guiMenu && plugin.guiMenu(picgo).length > 0) {
-      const menu: GuiMenuItem[] = plugin.guiMenu(picgo)
-      menu.forEach(item => {
-        if (item.label === label) {
-          item.handle(picgo, guiApi)
-        }
-      })
-    }
-  })
-}
-
-const handleRemoveFiles = () => {
-  ipcMain.on('removeFiles', (event: IpcMainEvent, files: ImgInfo[]) => {
-    const guiApi = new GuiApi()
-    setTimeout(() => {
-      picgo.emit('remove', files, guiApi)
-    }, 500)
-  })
-}
-
-const handlePicGoSaveData = () => {
-  ipcMain.on('picgoSaveData', (event: IpcMainEvent, data: IObj) => {
-    picgo.saveConfig(data)
-  })
-}
-
-export default {
-  listen () {
-    handleGetPluginList()
-    handlePluginInstall()
-    handlePluginUninstall()
-    handlePluginUpdate()
-    handleGetPicBedConfig()
-    handlePluginActions()
-    handleRemoveFiles()
-    handlePicGoSaveData()
-  }
-}

src/main/apis/gui/index.ts

@@ -1,29 +1,48 @@
 import {
   dialog,
   BrowserWindow,
-  clipboard,
   Notification,
   ipcMain
 } from 'electron'
-import db from '#/datastore'
-import uploader from '../uploader'
-import pasteTemplate from '#/utils/pasteTemplate'
+import db, { GalleryDB } from 'apis/core/datastore'
+import { dbPathChecker, defaultConfigPath, getGalleryDBPath } from 'apis/core/datastore/dbChecker'
+import uploader from 'apis/app/uploader'
+import pasteTemplate from '~/main/utils/pasteTemplate'
+import { handleCopyUrl } from '~/main/utils/common'
 import {
   getWindowId,
   getSettingWindowId
-} from '~/main/apis/bus'
+} from '@core/bus/apis'
+import {
+  SHOW_INPUT_BOX
+} from '~/universal/events/constants'
+import { DBStore } from '@picgo/store'
+import { T } from '~/universal/i18n'
 
+// Cross-process support may be required in the future
 class GuiApi implements IGuiApi {
+  private static instance: GuiApi
   private windowId: number = -1
   private settingWindowId: number = -1
+  private constructor () {
+    console.log('init guiapi')
+  }
+
+  public static getInstance (): GuiApi {
+    if (!GuiApi.instance) {
+      GuiApi.instance = new GuiApi()
+    }
+    return GuiApi.instance
+  }
+
   private async showSettingWindow () {
     this.settingWindowId = await getSettingWindowId()
     const settingWindow = BrowserWindow.fromId(this.settingWindowId)
-    if (settingWindow.isVisible()) {
+    if (settingWindow?.isVisible()) {
       return true
     }
-    settingWindow.show()
-    return new Promise((resolve, reject) => {
+    settingWindow?.show()
+    return new Promise<void>((resolve) => {
       setTimeout(() => {
         resolve()
       }, 1000) // TODO: a better way to wait page loaded.
@@ -31,7 +50,7 @@ class GuiApi implements IGuiApi {
   }
 
   private getWebcontentsByWindowId (id: number) {
-    return BrowserWindow.fromId(id).webContents
+    return BrowserWindow.fromId(id)?.webContents
   }
 
   async showInputBox (options: IShowInputBoxOption = {
@@ -39,46 +58,42 @@ class GuiApi implements IGuiApi {
     placeholder: ''
   }) {
     await this.showSettingWindow()
-    this.getWebcontentsByWindowId(this.settingWindowId)
-      .send('showInputBox', options)
-    return new Promise<string>((resolve, reject) => {
-      ipcMain.once('showInputBox', (event: Event, value: string) => {
+    this.getWebcontentsByWindowId(this.settingWindowId)?.send(SHOW_INPUT_BOX, options)
+    return new Promise<string>((resolve) => {
+      ipcMain.once(SHOW_INPUT_BOX, (event: Event, value: string) => {
         resolve(value)
       })
     })
   }
 
-  showFileExplorer (options: IShowFileExplorerOption = {}) {
-    return new Promise<string>(async (resolve, reject) => {
-      this.windowId = await getWindowId()
-      dialog.showOpenDialog(BrowserWindow.fromId(this.windowId), options, (filename: string) => {
-        resolve(filename)
-      })
-    })
+  async showFileExplorer (options: IShowFileExplorerOption = {}) {
+    this.windowId = await getWindowId()
+    const res = await dialog.showOpenDialog(BrowserWindow.fromId(this.windowId)!, options)
+    return res.filePaths?.[0]
   }
 
   async upload (input: IUploadOption) {
     this.windowId = await getWindowId()
     const webContents = this.getWebcontentsByWindowId(this.windowId)
-    const imgs = await uploader.setWebContents(webContents).upload(input)
+    const imgs = await uploader.setWebContents(webContents!).upload(input)
     if (imgs !== false) {
       const pasteStyle = db.get('settings.pasteStyle') || 'markdown'
-      let pasteText = ''
+      const pasteText: string[] = []
       for (let i = 0; i < imgs.length; i++) {
-        pasteText += pasteTemplate(pasteStyle, imgs[i]) + '\r\n'
+        pasteText.push(pasteTemplate(pasteStyle, imgs[i], db.get('settings.customLink')))
         const notification = new Notification({
-          title: '上传成功',
+          title: T('UPLOAD_SUCCEED'),
           body: imgs[i].imgUrl as string,
           icon: imgs[i].imgUrl
         })
         setTimeout(() => {
           notification.show()
         }, i * 100)
-        db.insert('uploaded', imgs[i])
+        await GalleryDB.getInstance().insert(imgs[i])
       }
-      clipboard.writeText(pasteText)
-      webContents.send('uploadFiles', imgs)
-      webContents.send('updateGallery')
+      handleCopyUrl(pasteText.join('\n'))
+      webContents?.send('uploadFiles', imgs)
+      webContents?.send('updateGallery')
       return imgs
     }
     return []
@@ -101,10 +116,10 @@ class GuiApi implements IGuiApi {
     type: 'info',
     buttons: ['Yes', 'No']
   }) {
-    return new Promise<IShowMessageBoxResult>(async (resolve, reject) => {
+    return new Promise<IShowMessageBoxResult>(async (resolve) => {
       this.windowId = await getWindowId()
       dialog.showMessageBox(
-        BrowserWindow.fromId(this.windowId),
+        BrowserWindow.fromId(this.windowId)!,
         options
       ).then((res) => {
         resolve({
@@ -114,6 +129,48 @@ class GuiApi implements IGuiApi {
       })
     })
   }
+
+  /**
+   * get picgo config/data path
+   */
+  async getConfigPath () {
+    const currentConfigPath = dbPathChecker()
+    const galleryDBPath = getGalleryDBPath().dbPath
+    return {
+      defaultConfigPath,
+      currentConfigPath,
+      galleryDBPath
+    }
+  }
+
+  get galleryDB (): DBStore {
+    return new Proxy<DBStore>(GalleryDB.getInstance(), {
+      get (target, prop: keyof DBStore) {
+        if (prop === 'removeById') {
+          return new Proxy(GalleryDB.getInstance().removeById, {
+            apply (target, ctx, args) {
+              return new Promise((resolve) => {
+                const guiApi = GuiApi.getInstance()
+                guiApi.showMessageBox({
+                  title: T('TIPS_WARNING'),
+                  message: T('TIPS_PLUGIN_REMOVE_GALLERY_ITEM'),
+                  type: 'info',
+                  buttons: ['Yes', 'No']
+                }).then(res => {
+                  if (res.result === 0) {
+                    resolve(Reflect.apply(target, ctx, args))
+                  } else {
+                    resolve(undefined)
+                  }
+                })
+              })
+            }
+          })
+        }
+        return Reflect.get(target, prop)
+      }
+    })
+  }
 }
 
 export default GuiApi

src/main/apis/picgo/index.ts

@@ -1,19 +0,0 @@
-import PicGoCore from '~/universal/types/picgo'
-import {
-  app
-} from 'electron'
-import path from 'path'
-// eslint-disable-next-line
-const requireFunc = typeof __webpack_require__ === 'function' ? __non_webpack_require__ : require
-const PicGo = requireFunc('picgo') as typeof PicGoCore
-const STORE_PATH = app.getPath('userData')
-
-const CONFIG_PATH = path.join(STORE_PATH, '/data.json')
-
-const picgo = new PicGo(CONFIG_PATH)
-picgo.saveConfig({
-  debug: true,
-  PICGO_ENV: 'GUI'
-})
-
-export default picgo as PicGoCore

src/main/apis/uploader/api.ts

@@ -1,74 +0,0 @@
-import {
-  clipboard,
-  Notification,
-  WebContents
-} from 'electron'
-import windowManager from '~/main/apis/window/windowManager'
-import { IWindowList } from '~/main/apis/window/constants'
-import uploader from './'
-import pasteTemplate from '#/utils/pasteTemplate'
-import db from '#/datastore'
-export const uploadClipboardFiles = async (): Promise<string> => {
-  const win = windowManager.getAvailableWindow()
-  let img = await uploader.setWebContents(win!.webContents).upload()
-  if (img !== false) {
-    if (img.length > 0) {
-      const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)!
-      const pasteStyle = db.get('settings.pasteStyle') || 'markdown'
-      clipboard.writeText(pasteTemplate(pasteStyle, img[0]))
-      const notification = new Notification({
-        title: '上传成功',
-        body: img[0].imgUrl!,
-        icon: img[0].imgUrl
-      })
-      notification.show()
-      db.insert('uploaded', img[0])
-      trayWindow.webContents.send('clipboardFiles', [])
-      trayWindow.webContents.send('uploadFiles', img)
-      if (windowManager.has(IWindowList.SETTING_WINDOW)) {
-        windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('updateGallery')
-      }
-      return img[0].imgUrl as string
-    } else {
-      const notification = new Notification({
-        title: '上传不成功',
-        body: '你剪贴板最新的一条记录不是图片哦'
-      })
-      notification.show()
-      return ''
-    }
-  } else {
-    return ''
-  }
-}
-
-export const uploadChoosedFiles = async (webContents: WebContents, files: IFileWithPath[]): Promise<string[]> => {
-  const input = files.map(item => item.path)
-  const imgs = await uploader.setWebContents(webContents).upload(input)
-  const result = []
-  if (imgs !== false) {
-    const pasteStyle = db.get('settings.pasteStyle') || 'markdown'
-    let pasteText = ''
-    for (let i = 0; i < imgs.length; i++) {
-      pasteText += pasteTemplate(pasteStyle, imgs[i]) + '\r\n'
-      const notification = new Notification({
-        title: '上传成功',
-        body: imgs[i].imgUrl!,
-        icon: files[i].path
-      })
-      setTimeout(() => {
-        notification.show()
-      }, i * 100)
-      db.insert('uploaded', imgs[i])
-      result.push(imgs[i].imgUrl!)
-    }
-    clipboard.writeText(pasteText)
-    windowManager.get(IWindowList.TRAY_WINDOW)!.webContents.send('uploadFiles', imgs)
-    if (windowManager.has(IWindowList.SETTING_WINDOW)) {
-      windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('updateGallery')
-    }
-    return result
-  } else {
-    return []
-  }
-}

src/main/apis/uploader/index.ts

@@ -1,117 +0,0 @@
-import {
-  app,
-  Notification,
-  BrowserWindow,
-  ipcMain,
-  WebContents
-} from 'electron'
-import dayjs from 'dayjs'
-import picgo from '~/main/apis/picgo'
-import db from '#/datastore'
-import windowManager from '~/main/apis/window/windowManager'
-import { IWindowList } from '~/main/apis/window/constants'
-
-const waitForShow = (webcontent: WebContents) => {
-  return new Promise((resolve, reject) => {
-    webcontent.on('did-finish-load', () => {
-      resolve()
-    })
-  })
-}
-
-const waitForRename = (window: BrowserWindow, id: number): Promise<string|null> => {
-  return new Promise((resolve, reject) => {
-    const windowId = window.id
-    ipcMain.once(`rename${id}`, (evt: Event, newName: string) => {
-      resolve(newName)
-      window.close()
-    })
-    window.on('close', () => {
-      resolve(null)
-      ipcMain.removeAllListeners(`rename${id}`)
-      windowManager.deleteById(windowId)
-    })
-  })
-}
-
-class Uploader {
-  private webContents: WebContents | null = null
-  constructor () {
-    this.init()
-  }
-
-  init () {
-    picgo.on('notification', message => {
-      const notification = new Notification(message)
-      notification.show()
-    })
-
-    picgo.on('uploadProgress', progress => {
-      this.webContents?.send('uploadProgress', progress)
-    })
-    picgo.on('beforeTransform', ctx => {
-      if (db.get('settings.uploadNotification')) {
-        const notification = new Notification({
-          title: '上传进度',
-          body: '正在上传'
-        })
-        notification.show()
-      }
-    })
-    picgo.helper.beforeUploadPlugins.register('renameFn', {
-      handle: async ctx => {
-        const rename = db.get('settings.rename')
-        const autoRename = db.get('settings.autoRename')
-        await Promise.all(ctx.output.map(async (item, index) => {
-          let name: undefined | string | null
-          let fileName: string | undefined
-          if (autoRename) {
-            fileName = dayjs().add(index, 'second').format('YYYYMMDDHHmmss') + item.extname
-          } else {
-            fileName = item.fileName
-          }
-          if (rename) {
-            const window = windowManager.create(IWindowList.RENAME_WINDOW)!
-            await waitForShow(window.webContents)
-            window.webContents.send('rename', fileName, window.webContents.id)
-            name = await waitForRename(window, window.webContents.id)
-          }
-          item.fileName = name || fileName
-        }))
-      }
-    })
-  }
-
-  setWebContents (webContents: WebContents) {
-    this.webContents = webContents
-    return this
-  }
-
-  upload (img?: IUploadOption): Promise<ImgInfo[]|false> {
-    picgo.upload(img)
-
-    return new Promise((resolve) => {
-      picgo.once('finished', ctx => {
-        if (ctx.output.every((item: ImgInfo) => item.imgUrl)) {
-          resolve(ctx.output)
-        } else {
-          resolve(false)
-        }
-        picgo.removeAllListeners('failed')
-      })
-      picgo.once('failed', ctx => {
-        setTimeout(() => {
-          const notification = new Notification({
-            title: '上传失败',
-            body: '请检查配置和上传的文件是否符合要求'
-          })
-          notification.show()
-        }, 500)
-        picgo.removeAllListeners('finished')
-        resolve(false)
-      })
-    })
-  }
-}
-
-export default new Uploader()

src/main/apis/window/constants.ts

@@ -1,27 +0,0 @@
-export enum IWindowList {
-  SETTING_WINDOW = 'SETTING_WINDOW',
-  TRAY_WINDOW = 'TRAY_WINDOW',
-  MINI_WINDOW = 'MINI_WINDOW',
-  RENAME_WINDOW = 'RENAME_WINDOW'
-}
-
-const isDevelopment = process.env.NODE_ENV !== 'production'
-
-export const TRAY_WINDOW_URL = isDevelopment
-  ? (process.env.WEBPACK_DEV_SERVER_URL as string)
-  : `picgo://./index.html`
-
-export const SETTING_WINDOW_URL = isDevelopment
-  ? `${(process.env.WEBPACK_DEV_SERVER_URL as string)}#setting/upload`
-  : `picgo://./index.html#setting/upload`
-
-export const MINI_WINDOW_URL = isDevelopment
-  ? `${(process.env.WEBPACK_DEV_SERVER_URL as string)}#mini-page`
-  : `picgo://./index.html#mini-page`
-
-export const RENAME_WINDOW_URL = process.env.NODE_ENV === 'development'
-  ? `${(process.env.WEBPACK_DEV_SERVER_URL as string)}#rename-page`
-  : `picgo://./index.html#rename-page`
-
-export const DELETE_WINDOW_EVENT = 'DELETE_WINDOW_EVENT'
-export const CREATE_WINDOW_EVENT = 'CREATE_WINDOW_EVENT'

src/main/events/busEventList.ts

@@ -1,13 +1,13 @@
-import bus from '~/main/utils/eventBus'
+import bus from '@core/bus'
 import {
   uploadClipboardFiles,
   uploadChoosedFiles
-} from '~/main/apis/uploader/api'
+} from 'apis/app/uploader/apis'
 import {
   createMenu
-} from '~/main/apis/app'
-import { IWindowList } from '~/main/apis/window/constants'
-import windowManager from '~/main/apis/window/windowManager'
+} from 'apis/app/system'
+import { IWindowList } from '#/types/enum'
+import windowManager from 'apis/app/window/windowManager'
 import {
   UPLOAD_WITH_FILES,
   UPLOAD_WITH_FILES_RESPONSE,
@@ -18,7 +18,7 @@ import {
   GET_SETTING_WINDOW_ID,
   GET_SETTING_WINDOW_ID_RESPONSE,
   CREATE_APP_MENU
-} from '~/main/apis/bus/constants'
+} from '@core/bus/constants'
 function initEventCenter () {
   const eventList: any = {
     'picgo:upload': uploadClipboardFiles,
@@ -28,7 +28,7 @@ function initEventCenter () {
     [GET_SETTING_WINDOW_ID]: busCallGetSettingWindowId,
     [CREATE_APP_MENU]: createMenu
   }
-  for (let i in eventList) {
+  for (const i in eventList) {
     bus.on(i, eventList[i])
   }
 }

src/main/events/ipcList.ts

@@ -0,0 +1,233 @@
+import {
+  app,
+  ipcMain,
+  shell,
+  Notification,
+  IpcMainEvent,
+  BrowserWindow
+} from 'electron'
+import windowManager from 'apis/app/window/windowManager'
+import { IWindowList } from '#/types/enum'
+import uploader from 'apis/app/uploader'
+import pasteTemplate from '~/main/utils/pasteTemplate'
+import db, { GalleryDB } from '~/main/apis/core/datastore'
+import server from '~/main/server'
+import getPicBeds from '~/main/utils/getPicBeds'
+import shortKeyHandler from 'apis/app/shortKey/shortKeyHandler'
+import bus from '@core/bus'
+import {
+  TOGGLE_SHORTKEY_MODIFIED_MODE,
+  OPEN_DEVTOOLS,
+  SHOW_MINI_PAGE_MENU,
+  MINIMIZE_WINDOW,
+  CLOSE_WINDOW,
+  SHOW_MAIN_PAGE_MENU,
+  SHOW_UPLOAD_PAGE_MENU,
+  OPEN_USER_STORE_FILE,
+  OPEN_URL,
+  RELOAD_APP,
+  SHOW_PLUGIN_PAGE_MENU,
+  SET_MINI_WINDOW_POS,
+  CHANGE_LANGUAGE
+} from '#/events/constants'
+import {
+  uploadClipboardFiles,
+  uploadChoosedFiles
+} from '~/main/apis/app/uploader/apis'
+import picgoCoreIPC from './picgoCoreIPC'
+import { handleCopyUrl } from '~/main/utils/common'
+import { buildMainPageMenu, buildMiniPageMenu, buildPluginPageMenu, buildUploadPageMenu } from './remotes/menu'
+import path from 'path'
+import { i18n, T } from '~/universal/i18n'
+
+const STORE_PATH = app.getPath('userData')
+
+export default {
+  listen () {
+    picgoCoreIPC.listen()
+    // from macOS tray
+    ipcMain.on('uploadClipboardFiles', async () => {
+      const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)!
+      const img = await uploader.setWebContents(trayWindow.webContents).upload()
+      if (img !== false) {
+        const pasteStyle = db.get('settings.pasteStyle') || 'markdown'
+        handleCopyUrl(pasteTemplate(pasteStyle, img[0], db.get('settings.customLink')))
+        const notification = new Notification({
+          title: T('UPLOAD_SUCCEED'),
+          body: img[0].imgUrl!,
+          // icon: file[0]
+          icon: img[0].imgUrl
+        })
+        notification.show()
+        await GalleryDB.getInstance().insert(img[0])
+        trayWindow.webContents.send('clipboardFiles', [])
+        if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+          windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('updateGallery')
+        }
+      }
+      trayWindow.webContents.send('uploadFiles')
+    })
+
+    ipcMain.on('uploadClipboardFilesFromUploadPage', () => {
+      uploadClipboardFiles()
+    })
+
+    ipcMain.on('uploadChoosedFiles', async (evt: IpcMainEvent, files: IFileWithPath[]) => {
+      return uploadChoosedFiles(evt.sender, files)
+    })
+
+    ipcMain.on('updateShortKey', (evt: IpcMainEvent, item: IShortKeyConfig, oldKey: string, from: string) => {
+      const result = shortKeyHandler.updateShortKey(item, oldKey, from)
+      evt.sender.send('updateShortKeyResponse', result)
+      if (result) {
+        const notification = new Notification({
+          title: T('OPERATION_SUCCEED'),
+          body: T('TIPS_SHORTCUT_MODIFIED_SUCCEED')
+        })
+        notification.show()
+      } else {
+        const notification = new Notification({
+          title: T('OPERATION_FAILED'),
+          body: T('TIPS_SHORTCUT_MODIFIED_CONFLICT')
+        })
+        notification.show()
+      }
+    })
+
+    ipcMain.on('bindOrUnbindShortKey', (evt: IpcMainEvent, item: IShortKeyConfig, from: string) => {
+      const result = shortKeyHandler.bindOrUnbindShortKey(item, from)
+      if (result) {
+        const notification = new Notification({
+          title: T('OPERATION_SUCCEED'),
+          body: T('TIPS_SHORTCUT_MODIFIED_SUCCEED')
+        })
+        notification.show()
+      } else {
+        const notification = new Notification({
+          title: T('OPERATION_FAILED'),
+          body: T('TIPS_SHORTCUT_MODIFIED_CONFLICT')
+        })
+        notification.show()
+      }
+    })
+
+    ipcMain.on('updateCustomLink', () => {
+      const notification = new Notification({
+        title: T('OPERATION_SUCCEED'),
+        body: T('TIPS_CUSTOM_LINK_STYLE_MODIFIED_SUCCEED')
+      })
+      notification.show()
+    })
+
+    ipcMain.on('autoStart', (evt: IpcMainEvent, val: boolean) => {
+      app.setLoginItemSettings({
+        openAtLogin: val
+      })
+    })
+
+    ipcMain.on('openSettingWindow', () => {
+      windowManager.get(IWindowList.SETTING_WINDOW)!.show()
+      if (windowManager.has(IWindowList.MINI_WINDOW)) {
+        windowManager.get(IWindowList.MINI_WINDOW)!.hide()
+      }
+    })
+
+    ipcMain.on('openMiniWindow', () => {
+      const miniWindow = windowManager.get(IWindowList.MINI_WINDOW)!
+      const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)!
+
+      if (db.get('settings.miniWindowOntop')) {
+        miniWindow.setAlwaysOnTop(true)
+      }
+
+      miniWindow.show()
+      miniWindow.focus()
+      settingWindow.hide()
+    })
+
+    //  from mini window
+    ipcMain.on('syncPicBed', () => {
+      if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+        windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('syncPicBed')
+      }
+    })
+
+    ipcMain.on('getPicBeds', (evt: IpcMainEvent) => {
+      const picBeds = getPicBeds()
+      evt.sender.send('getPicBeds', picBeds)
+      evt.returnValue = picBeds
+    })
+
+    ipcMain.on(TOGGLE_SHORTKEY_MODIFIED_MODE, (evt: IpcMainEvent, val: boolean) => {
+      bus.emit(TOGGLE_SHORTKEY_MODIFIED_MODE, val)
+    })
+
+    ipcMain.on('updateServer', () => {
+      server.restart()
+    })
+    ipcMain.on(OPEN_DEVTOOLS, (event: IpcMainEvent) => {
+      event.sender.openDevTools()
+    })
+    // menu & window methods
+    ipcMain.on(SHOW_MINI_PAGE_MENU, () => {
+      const window = windowManager.get(IWindowList.MINI_WINDOW)!
+      const menu = buildMiniPageMenu()
+      menu.popup({
+        window
+      })
+    })
+    ipcMain.on(SHOW_MAIN_PAGE_MENU, () => {
+      const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+      const menu = buildMainPageMenu(window)
+      menu.popup({
+        window
+      })
+    })
+    ipcMain.on(SHOW_UPLOAD_PAGE_MENU, () => {
+      const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+      const menu = buildUploadPageMenu()
+      menu.popup({
+        window
+      })
+    })
+    ipcMain.on(SHOW_PLUGIN_PAGE_MENU, (evt: IpcMainEvent, plugin: IPicGoPlugin) => {
+      const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+      const menu = buildPluginPageMenu(plugin)
+      menu.popup({
+        window
+      })
+    })
+    ipcMain.on(MINIMIZE_WINDOW, () => {
+      const window = BrowserWindow.getFocusedWindow()
+      window?.minimize()
+    })
+    ipcMain.on(CLOSE_WINDOW, () => {
+      const window = BrowserWindow.getFocusedWindow()
+      if (process.platform === 'linux') {
+        window?.hide()
+      } else {
+        window?.close()
+      }
+    })
+    ipcMain.on(OPEN_USER_STORE_FILE, (evt: IpcMainEvent, filePath: string) => {
+      const abFilePath = path.join(STORE_PATH, filePath)
+      shell.openPath(abFilePath)
+    })
+    ipcMain.on(OPEN_URL, (evt: IpcMainEvent, url: string) => {
+      shell.openExternal(url)
+    })
+    ipcMain.on(RELOAD_APP, () => {
+      app.relaunch()
+      app.exit(0)
+    })
+    ipcMain.on(SET_MINI_WINDOW_POS, (evt: IpcMainEvent, pos: IMiniWindowPos) => {
+      const window = BrowserWindow.getFocusedWindow()
+      window?.setBounds(pos)
+    })
+    ipcMain.on(CHANGE_LANGUAGE, (evt: IpcMainEvent, lang: string) => {
+      lang = lang || 'zh-CN'
+      i18n.setLanguage(lang)
+    })
+  },
+  dispose () {}
+}

src/main/events/picgoCoreIPC.ts

@@ -0,0 +1,358 @@
+import path from 'path'
+import GuiApi from 'apis/gui'
+import {
+  dialog,
+  shell,
+  IpcMainEvent,
+  ipcMain,
+  clipboard
+} from 'electron'
+import { IPasteStyle, IPicGoHelperType, IWindowList } from '#/types/enum'
+import shortKeyHandler from 'apis/app/shortKey/shortKeyHandler'
+import picgo from '@core/picgo'
+import { handleStreamlinePluginName } from '~/universal/utils/common'
+import { IGuiMenuItem, PicGo as PicGoCore } from 'picgo'
+import windowManager from 'apis/app/window/windowManager'
+import { showNotification } from '~/main/utils/common'
+import { dbPathChecker } from 'apis/core/datastore/dbChecker'
+import {
+  PICGO_SAVE_CONFIG,
+  PICGO_GET_CONFIG,
+  PICGO_GET_DB,
+  PICGO_INSERT_DB,
+  PICGO_INSERT_MANY_DB,
+  PICGO_UPDATE_BY_ID_DB,
+  PICGO_GET_BY_ID_DB,
+  PICGO_REMOVE_BY_ID_DB,
+  PICGO_OPEN_FILE,
+  PASTE_TEXT
+} from '#/events/constants'
+
+import { GalleryDB } from 'apis/core/datastore'
+import { IObject, IFilter } from '@picgo/store/dist/types'
+import pasteTemplate from '../utils/pasteTemplate'
+import { T } from '~/universal/i18n'
+
+// eslint-disable-next-line
+const requireFunc = typeof __webpack_require__ === 'function' ? __non_webpack_require__ : require
+// const PluginHandler = requireFunc('picgo/lib/PluginHandler').default
+const STORE_PATH = path.dirname(dbPathChecker())
+// const CONFIG_PATH = path.join(STORE_PATH, '/data.json')
+
+interface GuiMenuItem {
+  label: string
+  handle: (arg0: PicGoCore, arg1: GuiApi) => Promise<void>
+}
+
+// get uploader or transformer config
+const getConfig = (name: string, type: IPicGoHelperType, ctx: PicGoCore) => {
+  let config: any[] = []
+  if (name === '') {
+    return config
+  } else {
+    const handler = ctx.helper[type].get(name)
+    if (handler) {
+      if (handler.config) {
+        config = handler.config(ctx)
+      }
+    }
+    return config
+  }
+}
+
+const handleConfigWithFunction = (config: any[]) => {
+  for (const i in config) {
+    if (typeof config[i].default === 'function') {
+      config[i].default = config[i].default()
+    }
+    if (typeof config[i].choices === 'function') {
+      config[i].choices = config[i].choices()
+    }
+  }
+  return config
+}
+
+const getPluginList = (): IPicGoPlugin[] => {
+  const pluginList = picgo.pluginLoader.getFullList()
+  const list = []
+  for (const i in pluginList) {
+    const plugin = picgo.pluginLoader.getPlugin(pluginList[i])!
+    const pluginPath = path.join(STORE_PATH, `/node_modules/${pluginList[i]}`)
+    const pluginPKG = requireFunc(path.join(pluginPath, 'package.json'))
+    const uploaderName = plugin.uploader || ''
+    const transformerName = plugin.transformer || ''
+    let menu: Omit<IGuiMenuItem, 'handle'>[] = []
+    if (plugin.guiMenu) {
+      menu = plugin.guiMenu(picgo).map(item => ({
+        label: item.label
+      }))
+    }
+    let gui = false
+    if (pluginPKG.keywords && pluginPKG.keywords.length > 0) {
+      if (pluginPKG.keywords.includes('picgo-gui-plugin')) {
+        gui = true
+      }
+    }
+    const obj: IPicGoPlugin = {
+      name: handleStreamlinePluginName(pluginList[i]),
+      fullName: pluginList[i],
+      author: pluginPKG.author.name || pluginPKG.author,
+      description: pluginPKG.description,
+      logo: 'file://' + path.join(pluginPath, 'logo.png').split(path.sep).join('/'),
+      version: pluginPKG.version,
+      gui,
+      config: {
+        plugin: {
+          fullName: pluginList[i],
+          name: handleStreamlinePluginName(pluginList[i]),
+          config: plugin.config ? handleConfigWithFunction(plugin.config(picgo)) : []
+        },
+        uploader: {
+          name: uploaderName,
+          config: handleConfigWithFunction(getConfig(uploaderName, IPicGoHelperType.uploader, picgo))
+        },
+        transformer: {
+          name: transformerName,
+          config: handleConfigWithFunction(getConfig(uploaderName, IPicGoHelperType.transformer, picgo))
+        }
+      },
+      enabled: picgo.getConfig(`picgoPlugins.${pluginList[i]}`),
+      homepage: pluginPKG.homepage ? pluginPKG.homepage : '',
+      guiMenu: menu,
+      ing: false
+    }
+    list.push(obj)
+  }
+  return list
+}
+
+const handleGetPluginList = () => {
+  ipcMain.on('getPluginList', (event: IpcMainEvent) => {
+    const list = getPluginList()
+    // here can just send JS Object not function
+    // or will cause [Failed to serialize arguments] error
+    event.sender.send('pluginList', list)
+  })
+}
+
+const handlePluginInstall = () => {
+  ipcMain.on('installPlugin', async (event: IpcMainEvent, fullName: string) => {
+    const dispose = handleNPMError()
+    const res = await picgo.pluginHandler.install([fullName])
+    event.sender.send('installPlugin', {
+      success: res.success,
+      body: fullName,
+      errMsg: res.success ? '' : res.body
+    })
+    if (res.success) {
+      shortKeyHandler.registerPluginShortKey(res.body[0])
+    } else {
+      showNotification({
+        title: T('PLUGIN_INSTALL_FAILED'),
+        body: res.body as string
+      })
+    }
+    event.sender.send('hideLoading')
+    dispose()
+  })
+}
+
+const handlePluginUninstall = async (fullName: string) => {
+  const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+  const dispose = handleNPMError()
+  const res = await picgo.pluginHandler.uninstall([fullName])
+  if (res.success) {
+    window.webContents.send('uninstallSuccess', res.body[0])
+    shortKeyHandler.unregisterPluginShortKey(res.body[0])
+  } else {
+    showNotification({
+      title: T('PLUGIN_UNINSTALL_FAILED'),
+      body: res.body as string
+    })
+  }
+  window.webContents.send('hideLoading')
+  dispose()
+}
+
+const handlePluginUpdate = async (fullName: string) => {
+  const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+  const dispose = handleNPMError()
+  const res = await picgo.pluginHandler.update([fullName])
+  if (res.success) {
+    window.webContents.send('updateSuccess', res.body[0])
+  } else {
+    showNotification({
+      title: T('PLUGIN_UPDATE_FAILED'),
+      body: res.body as string
+    })
+  }
+  window.webContents.send('hideLoading')
+  dispose()
+}
+
+const handleNPMError = (): IDispose => {
+  const handler = (msg: string) => {
+    if (msg === 'NPM is not installed') {
+      dialog.showMessageBox({
+        title: T('TIPS_ERROR'),
+        message: T('TIPS_INSTALL_NODE_AND_RELOAD_PICGO'),
+        buttons: ['Yes']
+      }).then((res) => {
+        if (res.response === 0) {
+          shell.openExternal('https://nodejs.org/')
+        }
+      })
+    }
+  }
+  picgo.once('failed', handler)
+  return () => picgo.off('failed', handler)
+}
+
+const handleGetPicBedConfig = () => {
+  ipcMain.on('getPicBedConfig', (event: IpcMainEvent, type: string) => {
+    const name = picgo.helper.uploader.get(type)?.name || type
+    if (picgo.helper.uploader.get(type)?.config) {
+      const _config = picgo.helper.uploader.get(type)!.config!(picgo)
+      const config = handleConfigWithFunction(_config)
+      event.sender.send('getPicBedConfig', config, name)
+    } else {
+      event.sender.send('getPicBedConfig', [], name)
+    }
+  })
+}
+
+// TODO: remove it
+const handlePluginActions = () => {
+  ipcMain.on('pluginActions', (event: IpcMainEvent, name: string, label: string) => {
+    const plugin = picgo.pluginLoader.getPlugin(name)
+    if (plugin?.guiMenu?.(picgo)?.length) {
+      const menu: GuiMenuItem[] = plugin.guiMenu(picgo)
+      menu.forEach(item => {
+        if (item.label === label) {
+          item.handle(picgo, GuiApi.getInstance())
+        }
+      })
+    }
+  })
+}
+
+const handleRemoveFiles = () => {
+  ipcMain.on('removeFiles', (event: IpcMainEvent, files: ImgInfo[]) => {
+    setTimeout(() => {
+      picgo.emit('remove', files, GuiApi.getInstance())
+    }, 500)
+  })
+}
+
+const handlePicGoSaveConfig = () => {
+  ipcMain.on(PICGO_SAVE_CONFIG, (event: IpcMainEvent, data: IObj) => {
+    picgo.saveConfig(data)
+  })
+}
+
+const handlePicGoGetConfig = () => {
+  ipcMain.on(PICGO_GET_CONFIG, (event: IpcMainEvent, key: string | undefined, callbackId: string) => {
+    const result = picgo.getConfig(key)
+    event.sender.send(PICGO_GET_CONFIG, result, callbackId)
+  })
+}
+
+const handleImportLocalPlugin = () => {
+  ipcMain.on('importLocalPlugin', async (event: IpcMainEvent) => {
+    const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)!
+    const res = await dialog.showOpenDialog(settingWindow, {
+      properties: ['openDirectory']
+    })
+    const filePaths = res.filePaths
+    if (filePaths.length > 0) {
+      const res = await picgo.pluginHandler.install(filePaths)
+      if (res.success) {
+        const list = getPluginList()
+        event.sender.send('pluginList', list)
+        showNotification({
+          title: T('PLUGIN_IMPORT_SUCCEED'),
+          body: ''
+        })
+      } else {
+        showNotification({
+          title: T('PLUGIN_IMPORT_FAILED'),
+          body: res.body as string
+        })
+      }
+    }
+    event.sender.send('hideLoading')
+  })
+}
+
+const handlePicGoGalleryDB = () => {
+  ipcMain.on(PICGO_GET_DB, async (event: IpcMainEvent, filter: IFilter, callbackId: string) => {
+    const dbStore = GalleryDB.getInstance()
+    const res = await dbStore.get(filter)
+    event.sender.send(PICGO_GET_DB, res, callbackId)
+  })
+
+  ipcMain.on(PICGO_INSERT_DB, async (event: IpcMainEvent, value: IObject, callbackId: string) => {
+    const dbStore = GalleryDB.getInstance()
+    const res = await dbStore.insert(value)
+    event.sender.send(PICGO_INSERT_DB, res, callbackId)
+  })
+
+  ipcMain.on(PICGO_INSERT_MANY_DB, async (event: IpcMainEvent, value: IObject[], callbackId: string) => {
+    const dbStore = GalleryDB.getInstance()
+    const res = await dbStore.insertMany(value)
+    event.sender.send(PICGO_INSERT_MANY_DB, res, callbackId)
+  })
+
+  ipcMain.on(PICGO_UPDATE_BY_ID_DB, async (event: IpcMainEvent, id: string, value: IObject[], callbackId: string) => {
+    const dbStore = GalleryDB.getInstance()
+    const res = await dbStore.updateById(id, value)
+    event.sender.send(PICGO_UPDATE_BY_ID_DB, res, callbackId)
+  })
+
+  ipcMain.on(PICGO_GET_BY_ID_DB, async (event: IpcMainEvent, id: string, callbackId: string) => {
+    const dbStore = GalleryDB.getInstance()
+    const res = await dbStore.getById(id)
+    event.sender.send(PICGO_GET_BY_ID_DB, res, callbackId)
+  })
+
+  ipcMain.on(PICGO_REMOVE_BY_ID_DB, async (event: IpcMainEvent, id: string, callbackId: string) => {
+    const dbStore = GalleryDB.getInstance()
+    const res = await dbStore.removeById(id)
+    event.sender.send(PICGO_REMOVE_BY_ID_DB, res, callbackId)
+  })
+
+  ipcMain.handle(PASTE_TEXT, async (item: ImgInfo, copy = true) => {
+    const pasteStyle = picgo.getConfig<IPasteStyle>('settings.pasteStyle') || IPasteStyle.MARKDOWN
+    const customLink = picgo.getConfig<string>('settings.customLink')
+    const txt = pasteTemplate(pasteStyle, item, customLink)
+    if (copy) {
+      clipboard.writeText(txt)
+    }
+    return txt
+  })
+}
+
+const handleOpenFile = () => {
+  ipcMain.on(PICGO_OPEN_FILE, (event: IpcMainEvent, fileName: string) => {
+    const abFilePath = path.join(STORE_PATH, fileName)
+    shell.openPath(abFilePath)
+  })
+}
+
+export default {
+  listen () {
+    handleGetPluginList()
+    handlePluginInstall()
+    handleGetPicBedConfig()
+    handlePluginActions()
+    handleRemoveFiles()
+    handlePicGoSaveConfig()
+    handlePicGoGetConfig()
+    handlePicGoGalleryDB()
+    handleImportLocalPlugin()
+    handleOpenFile()
+  },
+  // TODO: separate to single file
+  handlePluginUninstall,
+  handlePluginUpdate
+}

src/main/events/remotes/menu.ts

@@ -0,0 +1,294 @@
+import windowManager from 'apis/app/window/windowManager'
+import { IWindowList } from '#/types/enum'
+import { Menu, BrowserWindow, app, dialog } from 'electron'
+import getPicBeds from '~/main/utils/getPicBeds'
+import picgo from '@core/picgo'
+import {
+  uploadClipboardFiles
+} from '~/main/apis/app/uploader/apis'
+import { privacyManager } from '~/main/utils/privacyManager'
+import pkg from 'root/package.json'
+import GuiApi from 'apis/gui'
+import { PICGO_CONFIG_PLUGIN, PICGO_HANDLE_PLUGIN_ING, PICGO_TOGGLE_PLUGIN, SHOW_MAIN_PAGE_DONATION, SHOW_MAIN_PAGE_QRCODE } from '~/universal/events/constants'
+import picgoCoreIPC from '~/main/events/picgoCoreIPC'
+import { PicGo as PicGoCore } from 'picgo'
+import { T } from '~/universal/i18n'
+
+interface GuiMenuItem {
+  label: string
+  handle: (arg0: PicGoCore, arg1: GuiApi) => Promise<void>
+}
+
+const buildMiniPageMenu = () => {
+  const picBeds = getPicBeds()
+  const current = picgo.getConfig('picBed.uploader')
+  const submenu = picBeds.filter(item => item.visible).map(item => {
+    return {
+      label: item.name,
+      type: 'radio',
+      checked: current === item.type,
+      click () {
+        picgo.saveConfig({
+          'picBed.current': item.type,
+          'picBed.uploader': item.type
+        })
+        if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+          windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('syncPicBed')
+        }
+      }
+    }
+  })
+  const template = [
+    {
+      label: T('OPEN_MAIN_WINDOW'),
+      click () {
+        windowManager.get(IWindowList.SETTING_WINDOW)!.show()
+        if (windowManager.has(IWindowList.MINI_WINDOW)) {
+          windowManager.get(IWindowList.MINI_WINDOW)!.hide()
+        }
+      }
+    },
+    {
+      label: T('CHOOSE_DEFAULT_PICBED'),
+      type: 'submenu',
+      submenu
+    },
+    {
+      label: T('UPLOAD_BY_CLIPBOARD'),
+      click () {
+        uploadClipboardFiles()
+      }
+    },
+    {
+      label: T('HIDE_WINDOW'),
+      click () {
+        BrowserWindow.getFocusedWindow()!.hide()
+      }
+    },
+    {
+      label: T('PRIVACY_AGREEMENT'),
+      click () {
+        privacyManager.show(false)
+      }
+    },
+    {
+      label: T('RELOAD_APP'),
+      click () {
+        app.relaunch()
+        app.exit(0)
+      }
+    },
+    {
+      role: 'quit',
+      label: T('QUIT')
+    }
+  ]
+  // @ts-ignore
+  return Menu.buildFromTemplate(template)
+}
+
+const buildMainPageMenu = (win: BrowserWindow) => {
+  const template = [
+    {
+      label: T('ABOUT'),
+      click () {
+        dialog.showMessageBox({
+          title: 'PicGo',
+          message: 'PicGo',
+          detail: `Version: ${pkg.version}\nAuthor: Molunerfinn\nGithub: https://github.com/Molunerfinn/PicGo`
+        })
+      }
+    },
+    {
+      label: T('SPONSOR_PICGO'),
+      click () {
+        win?.webContents?.send(SHOW_MAIN_PAGE_DONATION)
+      }
+    },
+    {
+      label: T('SHOW_PICBED_QRCODE'),
+      click () {
+        win?.webContents?.send(SHOW_MAIN_PAGE_QRCODE)
+      }
+    },
+    {
+      label: T('SHOW_DEVTOOLS'),
+      click () {
+        win?.webContents?.openDevTools()
+      }
+    },
+    {
+      label: T('PRIVACY_AGREEMENT'),
+      click () {
+        privacyManager.show(false)
+      }
+    }
+  ]
+  // @ts-ignore
+  return Menu.buildFromTemplate(template)
+}
+
+const buildUploadPageMenu = () => {
+  const picBeds = getPicBeds()
+  const currentPicBed = picgo.getConfig('picBed.uploader')
+  const submenu = picBeds.filter(item => item.visible).map(item => {
+    return {
+      label: item.name,
+      type: 'radio',
+      checked: currentPicBed === item.type,
+      click () {
+        picgo.saveConfig({
+          'picBed.current': item.type,
+          'picBed.uploader': item.type
+        })
+        if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+          windowManager.get(IWindowList.SETTING_WINDOW)!.webContents.send('syncPicBed')
+        }
+      }
+    }
+  })
+  // @ts-ignore
+  return Menu.buildFromTemplate(submenu)
+}
+
+// TODO: separate to single file
+
+const handleRestoreState = (item: string, name: string): void => {
+  if (item === 'uploader') {
+    const current = picgo.getConfig('picBed.current')
+    if (current === name) {
+      picgo.saveConfig({
+        'picBed.current': 'smms',
+        'picBed.uploader': 'smms'
+      })
+    }
+  }
+  if (item === 'transformer') {
+    const current = picgo.getConfig('picBed.transformer')
+    if (current === name) {
+      picgo.saveConfig({
+        'picBed.transformer': 'path'
+      })
+    }
+  }
+}
+
+const buildPluginPageMenu = (plugin: IPicGoPlugin) => {
+  const menu = [{
+    label: T('ENABLE_PLUGIN'),
+    enabled: !plugin.enabled,
+    click () {
+      picgo.saveConfig({
+        [`picgoPlugins.${plugin.fullName}`]: true
+      })
+      const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+      window.webContents.send(PICGO_TOGGLE_PLUGIN, plugin.fullName, true)
+    }
+  }, {
+    label: T('DISABLE_PLUGIN'),
+    enabled: plugin.enabled,
+    click () {
+      picgo.saveConfig({
+        [`picgoPlugins.${plugin.fullName}`]: false
+      })
+      const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+      window.webContents.send(PICGO_HANDLE_PLUGIN_ING, plugin.fullName)
+      window.webContents.send(PICGO_TOGGLE_PLUGIN, plugin.fullName, false)
+      if (plugin.config.transformer.name) {
+        handleRestoreState('transformer', plugin.config.transformer.name)
+      }
+      if (plugin.config.uploader.name) {
+        handleRestoreState('uploader', plugin.config.uploader.name)
+      }
+    }
+  }, {
+    label: T('UNINSTALL_PLUGIN'),
+    click () {
+      const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+      window.webContents.send(PICGO_HANDLE_PLUGIN_ING, plugin.fullName)
+      picgoCoreIPC.handlePluginUninstall(plugin.fullName)
+    }
+  }, {
+    label: T('UPDATE_PLUGIN'),
+    click () {
+      const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+      window.webContents.send(PICGO_HANDLE_PLUGIN_ING, plugin.fullName)
+      picgoCoreIPC.handlePluginUpdate(plugin.fullName)
+    }
+  }]
+  for (const i in plugin.config) {
+    if (plugin.config[i].config.length > 0) {
+      const obj = {
+        label: T('CONFIG_THING', {
+          c: `${i} - ${plugin.config[i].fullName || plugin.config[i].name}`
+        }),
+        click () {
+          const window = windowManager.get(IWindowList.SETTING_WINDOW)!
+          const currentType = i
+          const configName = plugin.config[i].fullName || plugin.config[i].name
+          const config = plugin.config[i].config
+          window.webContents.send(PICGO_CONFIG_PLUGIN, currentType, configName, config)
+        }
+      }
+      menu.push(obj)
+    }
+  }
+
+  // handle transformer
+  if (plugin.config.transformer.name) {
+    const currentTransformer = picgo.getConfig<string>('picBed.transformer') || 'path'
+    const pluginTransformer = plugin.config.transformer.name
+    const obj = {
+      label: `${currentTransformer === pluginTransformer ? T('DISABLE') : T('ENABLE')}transformer - ${plugin.config.transformer.name}`,
+      click () {
+        const transformer = plugin.config.transformer.name
+        const currentTransformer = picgo.getConfig<string>('picBed.transformer') || 'path'
+        if (currentTransformer === transformer) {
+          picgo.saveConfig({
+            'picBed.transformer': 'path'
+          })
+        } else {
+          picgo.saveConfig({
+            'picBed.transformer': transformer
+          })
+        }
+      }
+    }
+    menu.push(obj)
+  }
+
+  // plugin custom menus
+  if (plugin.guiMenu) {
+    menu.push({
+      // @ts-ignore
+      type: 'separator'
+    })
+    for (const i of plugin.guiMenu) {
+      menu.push({
+        label: i.label,
+        click () {
+          // ipcRenderer.send('pluginActions', plugin.fullName, i.label)
+          const picgPlugin = picgo.pluginLoader.getPlugin(plugin.fullName)
+          if (picgPlugin?.guiMenu?.(picgo)?.length) {
+            const menu: GuiMenuItem[] = picgPlugin.guiMenu(picgo)
+            menu.forEach(item => {
+              if (item.label === i.label) {
+                item.handle(picgo, GuiApi.getInstance())
+              }
+            })
+          }
+        }
+      })
+    }
+  }
+
+  // @ts-ignore
+  return Menu.buildFromTemplate(menu)
+}
+
+export {
+  buildMiniPageMenu,
+  buildMainPageMenu,
+  buildUploadPageMenu,
+  buildPluginPageMenu
+}

src/main/lifeCycle/errorHandler.ts

@@ -0,0 +1,42 @@
+import fse from 'fs-extra'
+import path from 'path'
+import dayjs from 'dayjs'
+import util from 'util'
+import { dbPathDir } from 'apis/core/datastore/dbChecker'
+const STORE_PATH = dbPathDir()
+const LOG_PATH = path.join(STORE_PATH, '/picgo.log')
+
+// since the error may occur in picgo-core
+// so we can't use the log from picgo
+export const loggerWriter = (error: Error) => {
+  try {
+    const time = dayjs().format('YYYY-MM-DD HH:mm:ss')
+    let log = `${time} [PicGo ERROR] process error begin`
+    if (error?.stack) {
+      log += `\n------Error Stack Begin------\n${util.format(error.stack)}\n-------Error Stack End-------\n`
+    } else {
+      const msg = JSON.stringify(error)
+      log += `${msg}\n`
+    }
+    log += `${time} [PicGo ERROR] process error end`
+    if (!fse.existsSync(LOG_PATH)) {
+      fse.ensureFileSync(LOG_PATH)
+    }
+    fse.appendFileSync(LOG_PATH, log)
+  } catch (e) {
+    console.error(e)
+  }
+}
+
+const handleProcessError = (error: Error) => {
+  console.error(error)
+  loggerWriter(error)
+}
+
+process.on('uncaughtException', error => {
+  handleProcessError(error)
+})
+
+process.on('unhandledRejection', (error: any) => {
+  handleProcessError(error)
+})

src/main/lifeCycle/fixPath.ts

@@ -0,0 +1,18 @@
+// TODO: so how to import pure esm module in electron main process????? help wanted
+
+// just copy the fix-path because I can't import pure ESM module in electron main process
+
+const shellPath = require('shell-path')
+
+export default function fixPath () {
+  if (process.platform === 'win32') {
+    return
+  }
+
+  process.env.PATH = shellPath.sync() || [
+    './node_modules/.bin',
+    '/.nodebrew/current/bin',
+    '/usr/local/bin',
+    process.env.PATH
+  ].join(':')
+}

src/main/lifeCycle/index.ts

@@ -0,0 +1,197 @@
+import './errorHandler'
+import {
+  app,
+  globalShortcut,
+  protocol,
+  Notification
+} from 'electron'
+import {
+  createProtocol
+} from 'vue-cli-plugin-electron-builder/lib'
+import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
+import beforeOpen from '~/main/utils/beforeOpen'
+import ipcList from '~/main/events/ipcList'
+import busEventList from '~/main/events/busEventList'
+import { IWindowList } from '#/types/enum'
+import windowManager from 'apis/app/window/windowManager'
+import {
+  updateShortKeyFromVersion212,
+  migrateGalleryFromVersion230
+} from '~/main/migrate'
+import {
+  uploadChoosedFiles,
+  uploadClipboardFiles
+} from 'apis/app/uploader/apis'
+import {
+  createTray
+} from 'apis/app/system'
+import server from '~/main/server/index'
+import updateChecker from '~/main/utils/updateChecker'
+import shortKeyHandler from 'apis/app/shortKey/shortKeyHandler'
+import { getUploadFiles } from '~/main/utils/handleArgv'
+import db, { GalleryDB } from '~/main/apis/core/datastore'
+import bus from '@core/bus'
+import { privacyManager } from '~/main/utils/privacyManager'
+import logger from 'apis/core/picgo/logger'
+import picgo from 'apis/core/picgo'
+import fixPath from './fixPath'
+import { initI18n } from '~/main/utils/handleI18n'
+
+const isDevelopment = process.env.NODE_ENV !== 'production'
+
+const handleStartUpFiles = (argv: string[], cwd: string) => {
+  const files = getUploadFiles(argv, cwd, logger)
+  if (files === null || files.length > 0) { // 如果有文件列表作为参数，说明是命令行启动
+    if (files === null) {
+      logger.info('cli -> uploading file from clipboard')
+      uploadClipboardFiles()
+    } else {
+      logger.info('cli -> uploading files from cli', ...files.map(item => item.path))
+      const win = windowManager.getAvailableWindow()
+      uploadChoosedFiles(win.webContents, files)
+    }
+    return true
+  } else {
+    return false
+  }
+}
+
+class LifeCycle {
+  private async beforeReady () {
+    protocol.registerSchemesAsPrivileged([{ scheme: 'picgo', privileges: { secure: true, standard: true } }])
+    // fix the $PATH in macOS & linux
+    fixPath()
+    beforeOpen()
+    initI18n()
+    ipcList.listen()
+    busEventList.listen()
+    updateShortKeyFromVersion212(db, db.get('settings.shortKey'))
+    await migrateGalleryFromVersion230(db, GalleryDB.getInstance(), picgo)
+  }
+
+  private onReady () {
+    const readyFunction = async () => {
+      console.log('on ready')
+      createProtocol('picgo')
+      if (isDevelopment && !process.env.IS_TEST) {
+        // Install Vue Devtools
+        try {
+          await installExtension(VUEJS_DEVTOOLS)
+        } catch (e: any) {
+          console.error('Vue Devtools failed to install:', e.toString())
+        }
+      }
+      const res = await privacyManager.init()
+      if (!res) {
+        return app.quit()
+      }
+      windowManager.create(IWindowList.TRAY_WINDOW)
+      windowManager.create(IWindowList.SETTING_WINDOW)
+      createTray()
+      db.set('needReload', false)
+      updateChecker()
+      // 不需要阻塞
+      process.nextTick(() => {
+        shortKeyHandler.init()
+      })
+      server.startup()
+      if (process.env.NODE_ENV !== 'development') {
+        handleStartUpFiles(process.argv, process.cwd())
+      }
+
+      if (global.notificationList && global.notificationList?.length > 0) {
+        while (global.notificationList?.length) {
+          const option = global.notificationList.pop()
+          const notice = new Notification(option!)
+          notice.show()
+        }
+      }
+    }
+    if (!app.isReady()) {
+      app.on('ready', readyFunction)
+    } else {
+      readyFunction()
+    }
+  }
+
+  private onRunning () {
+    app.on('second-instance', (event, commandLine, workingDirectory) => {
+      logger.info('detect second instance')
+      const result = handleStartUpFiles(commandLine, workingDirectory)
+      if (!result) {
+        if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+          const settingWindow = windowManager.get(IWindowList.SETTING_WINDOW)!
+          if (settingWindow.isMinimized()) {
+            settingWindow.restore()
+          }
+          settingWindow.focus()
+        }
+      }
+    })
+    app.on('activate', () => {
+      createProtocol('picgo')
+      if (!windowManager.has(IWindowList.TRAY_WINDOW)) {
+        windowManager.create(IWindowList.TRAY_WINDOW)
+      }
+      if (!windowManager.has(IWindowList.SETTING_WINDOW)) {
+        windowManager.create(IWindowList.SETTING_WINDOW)
+      }
+    })
+    app.setLoginItemSettings({
+      openAtLogin: db.get('settings.autoStart') || false
+    })
+    if (process.platform === 'win32') {
+      app.setAppUserModelId('com.molunerfinn.picgo')
+    }
+
+    if (process.env.XDG_CURRENT_DESKTOP && process.env.XDG_CURRENT_DESKTOP.includes('Unity')) {
+      process.env.XDG_CURRENT_DESKTOP = 'Unity'
+    }
+  }
+
+  private onQuit () {
+    app.on('window-all-closed', () => {
+      if (process.platform !== 'darwin') {
+        app.quit()
+      }
+    })
+
+    app.on('will-quit', () => {
+      globalShortcut.unregisterAll()
+      bus.removeAllListeners()
+      server.shutdown()
+    })
+    // Exit cleanly on request from parent process in development mode.
+    if (isDevelopment) {
+      if (process.platform === 'win32') {
+        process.on('message', data => {
+          if (data === 'graceful-exit') {
+            app.quit()
+          }
+        })
+      } else {
+        process.on('SIGTERM', () => {
+          app.quit()
+        })
+      }
+    }
+  }
+
+  async launchApp () {
+    const gotTheLock = app.requestSingleInstanceLock()
+    if (!gotTheLock) {
+      app.quit()
+    } else {
+      await this.beforeReady()
+      this.onReady()
+      this.onRunning()
+      this.onQuit()
+    }
+  }
+}
+
+const bootstrap = new LifeCycle()
+
+export {
+  bootstrap
+}

src/main/migrate/index.ts

@@ -1,26 +1,61 @@
-import DB from '#/datastore'
+import { DBStore } from '@picgo/store'
+import ConfigStore from '~/main/apis/core/datastore'
+import path from 'path'
+import fse from 'fs-extra'
+import { PicGo as PicGoCore } from 'picgo'
+import { T } from '~/universal/i18n'
 // from v2.1.2
-const updateShortKeyFromVersion212 = (db: typeof DB, shortKeyConfig: IShortKeyConfigs | IOldShortKeyConfigs) => {
-  let needUpgrade = false
+const updateShortKeyFromVersion212 = (db: typeof ConfigStore, shortKeyConfig: IShortKeyConfigs | IOldShortKeyConfigs) => {
+  // #557 极端情况可能会出现配置不存在，需要重新写入
+  if (shortKeyConfig === undefined) {
+    const defaultShortKeyConfig = {
+      enable: true,
+      key: 'CommandOrControl+Shift+P',
+      name: 'upload',
+      label: T('QUICK_UPLOAD')
+    }
+    db.set('settings.shortKey[picgo:upload]', defaultShortKeyConfig)
+    return true
+  }
   if (shortKeyConfig.upload) {
-    needUpgrade = true
     // @ts-ignore
     shortKeyConfig['picgo:upload'] = {
       enable: true,
       key: shortKeyConfig.upload,
       name: 'upload',
-      label: '快捷上传'
+      label: T('QUICK_UPLOAD')
     }
+    // @ts-ignore
     delete shortKeyConfig.upload
-  }
-  if (needUpgrade) {
     db.set('settings.shortKey', shortKeyConfig)
-    return shortKeyConfig
-  } else {
-    return false
+    return true
+  }
+  return false
+}
+
+const migrateGalleryFromVersion230 = async (configDB: typeof ConfigStore, galleryDB: DBStore, picgo: PicGoCore) => {
+  const originGallery: ImgInfo[] = configDB.get('uploaded')
+  // if hasMigrate, we don't need to migrate
+  const hasMigrate: boolean = configDB.get('__migrateUploaded')
+  if (hasMigrate) {
+    return
+  }
+  const configPath = configDB.getConfigPath()
+  const configBakPath = path.join(path.dirname(configPath), 'config.bak.json')
+  // migrate gallery from config to gallery db
+  if (originGallery && Array.isArray(originGallery) && originGallery?.length > 0) {
+    if (fse.existsSync(configBakPath)) {
+      fse.copyFileSync(configPath, configBakPath)
+    }
+    await galleryDB.insertMany(originGallery)
+    picgo.saveConfig({
+      uploaded: [],
+      __migrateUploaded: true
+    })
   }
 }
 
 export {
-  updateShortKeyFromVersion212
+  updateShortKeyFromVersion212,
+  migrateGalleryFromVersion230
 }

src/main/server/index.ts

@@ -1,16 +1,18 @@
 import http from 'http'
 import routers from './routerManager'
 import {
-  handleResponse
+  handleResponse,
+  ensureHTTPLink
 } from './utils'
-import picgo from '~/main/apis/picgo'
-import logger from '~/main/utils/logger'
+import picgo from '@core/picgo'
+import logger from '@core/picgo/logger'
+import axios from 'axios'
 
 class Server {
   private httpServer: http.Server
   private config: IServerConfig
   constructor () {
-    let config = picgo.getConfig('settings.server')
+    let config = picgo.getConfig<IServerConfig>('settings.server')
     const result = this.checkIfConfigIsValid(config)
     if (result) {
       this.config = config
@@ -27,6 +29,7 @@ class Server {
     }
     this.httpServer = http.createServer(this.handleRequest)
   }
+
   private checkIfConfigIsValid (config: IObj | undefined) {
     if (config && config.port && config.host && (config.enable !== undefined)) {
       return true
@@ -34,9 +37,11 @@ class Server {
       return false
     }
   }
+
   private handleRequest = (request: http.IncomingMessage, response: http.ServerResponse) => {
     if (request.method === 'POST') {
       if (!routers.getHandler(request.url!)) {
+        logger.warn(`[PicGo Server] don't support [${request.url}] url`)
         handleResponse({
           response,
           statusCode: 404,
@@ -54,7 +59,8 @@ class Server {
         request.on('end', () => {
           try {
             postObj = (body === '') ? {} : JSON.parse(body)
-          } catch (err) {
+          } catch (err: any) {
+            logger.error('[PicGo Server]', err)
             return handleResponse({
               response,
               body: {
@@ -63,6 +69,7 @@ class Server {
               }
             })
           }
+          logger.info('[PicGo Server] get the request', body)
           const handler = routers.getHandler(request.url!)
           handler!({
             ...postObj,
@@ -71,32 +78,48 @@ class Server {
         })
       }
     } else {
+      logger.warn(`[PicGo Server] don't support [${request.method}] method`)
       response.statusCode = 404
       response.end()
     }
   }
-  private listen = (port: number) => {
+
+  // port as string is a bug
+  private listen = (port: number | string) => {
     logger.info(`[PicGo Server] is listening at ${port}`)
-    this.httpServer.listen(port, this.config.host).on('error', (err: ErrnoException) => {
+    if (typeof port === 'string') {
+      port = parseInt(port, 10)
+    }
+    this.httpServer.listen(port, this.config.host).on('error', async (err: ErrnoException) => {
       if (err.errno === 'EADDRINUSE') {
-        logger.warn(`[PicGo Server] ${port} is busy, trying with port ${port + 1}`)
-        this.config.port += 1
-        picgo.saveConfig({
-          'settings.server': this.config
-        })
-        this.listen(this.config.port)
+        try {
+          // make sure the system has a PicGo Server instance
+          await axios.post(ensureHTTPLink(`${this.config.host}:${port}/heartbeat`))
+          this.shutdown(true)
+        } catch (e) {
+          logger.warn(`[PicGo Server] ${port} is busy, trying with port ${(port as number) + 1}`)
+          // fix a bug: not write an increase number to config file
+          // to solve the auto number problem
+          this.listen((port as number) + 1)
+        }
       }
     })
   }
+
   startup () {
+    console.log('startup', this.config.enable)
     if (this.config.enable) {
       this.listen(this.config.port)
     }
   }
-  shutdown () {
+
+  shutdown (hasStarted?: boolean) {
     this.httpServer.close()
-    logger.info('[PicGo Server] shutdown')
+    if (!hasStarted) {
+      logger.info('[PicGo Server] shutdown')
+    }
   }
+
   restart () {
     this.config = picgo.getConfig('settings.server')
     this.shutdown()

src/main/server/router.ts

@@ -4,6 +4,7 @@ class Router {
   get (url: string, callback: routeHandler): void {
     this.router.set(url, callback)
   }
+
   post (url: string, callback: routeHandler): void {
     this.router.set(url, callback)
   }

src/main/server/routerManager.ts

@@ -1,14 +1,18 @@
 import router from './router'
-import {
-  uploadWithClipboardFiles,
-  uploadWithFiles
-} from '~/main/apis/bus/index'
 import {
   handleResponse
 } from './utils'
-import logger from '../utils/logger'
+import logger from '@core/picgo/logger'
+import windowManager from 'apis/app/window/windowManager'
+import { uploadChoosedFiles, uploadClipboardFiles } from 'apis/app/uploader/apis'
+import path from 'path'
+import { dbPathDir } from 'apis/core/datastore/dbChecker'
+const STORE_PATH = dbPathDir()
+const LOG_PATH = path.join(STORE_PATH, 'picgo.log')
 
-router.get('/upload', async ({
+const errorMessage = `upload error. see ${LOG_PATH} for more detail.`
+
+router.post('/upload', async ({
   response,
   list = []
 } : {
@@ -18,52 +22,79 @@ router.get('/upload', async ({
   try {
     if (list.length === 0) {
       // upload with clipboard
-      const res = await uploadWithClipboardFiles()
-      if (res.success) {
+      logger.info('[PicGo Server] upload clipboard file')
+      const res = await uploadClipboardFiles()
+      logger.info('[PicGo Server] upload result:', res)
+      if (res) {
         handleResponse({
           response,
           body: {
             success: true,
-            result: res.result
+            result: [res]
           }
         })
       } else {
         handleResponse({
-          response
+          response,
+          body: {
+            success: false,
+            message: errorMessage
+          }
         })
       }
     } else {
+      logger.info('[PicGo Server] upload files in list')
       //  upload with files
       const pathList = list.map(item => {
         return {
           path: item
         }
       })
-      const res = await uploadWithFiles(pathList)
-      if (res.success) {
+      const win = windowManager.getAvailableWindow()
+      const res = await uploadChoosedFiles(win.webContents, pathList)
+      logger.info('[PicGo Server] upload result', res.join(' ; '))
+      if (res.length) {
         handleResponse({
           response,
           body: {
             success: true,
-            result: res.result
+            result: res
           }
         })
       } else {
         handleResponse({
-          response
+          response,
+          body: {
+            success: false,
+            message: errorMessage
+          }
         })
       }
     }
-  } catch (err) {
+  } catch (err: any) {
     logger.error(err)
     handleResponse({
       response,
       body: {
         success: false,
-        message: err
+        message: errorMessage
       }
     })
   }
 })
 
+router.post('/heartbeat', async ({
+  response
+} : {
+  response: IHttpResponse,
+}) => {
+  handleResponse({
+    response,
+    body: {
+      success: true,
+      result: 'alive'
+    }
+  })
+})
+
 export default router

src/main/server/utils.ts

@@ -1,3 +1,5 @@
+import logger from '@core/picgo/logger'
+
 export const handleResponse = ({
   response,
   statusCode = 200,
@@ -13,7 +15,16 @@ export const handleResponse = ({
   header?: IObj,
   body?: any
 }) => {
+  if (body?.success === false) {
+    logger.warn('[PicGo Server] upload failed, see picgo.log for more detail ↑')
+  }
   response.writeHead(statusCode, header)
   response.write(JSON.stringify(body))
   response.end()
 }
+
+export const ensureHTTPLink = (url: string): string => {
+  return url.startsWith('http')
+    ? url
+    : `http://${url}`
+}

src/main/utils/beforeOpen.ts

@@ -1,10 +1,10 @@
 import fs from 'fs-extra'
 import path from 'path'
 import os from 'os'
-import { remote, app } from 'electron'
+import { dbPathChecker } from 'apis/core/datastore/dbChecker'
 
-const APP = process.type === 'renderer' ? remote.app : app
-const STORE_PATH = APP.getPath('userData')
+const configPath = dbPathChecker()
+const CONFIG_DIR = path.dirname(configPath)
 
 function beforeOpen () {
   if (process.platform === 'darwin') {
@@ -33,8 +33,8 @@ function resolveMacWorkFlow () {
  * 初始化剪贴板生成图片的脚本
  */
 function resolveClipboardImageGenerator () {
-  let clipboardFiles = getClipboardFiles()
-  if (!fs.pathExistsSync(path.join(STORE_PATH, 'windows10.ps1'))) {
+  const clipboardFiles = getClipboardFiles()
+  if (!fs.pathExistsSync(path.join(CONFIG_DIR, 'windows10.ps1'))) {
     clipboardFiles.forEach(item => {
       fs.copyFileSync(item.origin, item.dest)
     })
@@ -45,26 +45,32 @@ function resolveClipboardImageGenerator () {
   }
 
   function diffFilesAndUpdate (filePath1: string, filePath2: string) {
-    let file1 = fs.readFileSync(filePath1)
-    let file2 = fs.readFileSync(filePath2)
+    try {
+      const file1 = fs.existsSync(filePath1) && fs.readFileSync(filePath1)
+      const file2 = fs.existsSync(filePath1) && fs.readFileSync(filePath2)
 
-    if (!file1.equals(file2)) {
+      if (!file1 || !file2 || !file1.equals(file2)) {
+        fs.copyFileSync(filePath1, filePath2)
+      }
+    } catch (e) {
+      console.error(e)
       fs.copyFileSync(filePath1, filePath2)
     }
   }
 
   function getClipboardFiles () {
-    let files = [
+    const files = [
       '/linux.sh',
       '/mac.applescript',
       '/windows.ps1',
-      '/windows10.ps1'
+      '/windows10.ps1',
+      '/wsl.sh'
     ]
 
     return files.map(item => {
       return {
         origin: path.join(__static, item),
-        dest: path.join(STORE_PATH, item)
+        dest: path.join(CONFIG_DIR, item)
       }
     })
   }

src/main/utils/common.ts

@@ -0,0 +1,71 @@
+import db from '~/main/apis/core/datastore'
+import { clipboard, Notification, dialog } from 'electron'
+
+export const handleCopyUrl = (str: string): void => {
+  if (db.get('settings.autoCopy') !== false) {
+    clipboard.writeText(str)
+  }
+}
+
+/**
+ * show notification
+ * @param options
+ */
+export const showNotification = (options: IPrivateShowNotificationOption = {
+  title: '',
+  body: '',
+  clickToCopy: false
+}) => {
+  const notification = new Notification({
+    title: options.title,
+    body: options.body,
+    icon: options.icon || undefined
+  })
+  const handleClick = () => {
+    if (options.clickToCopy) {
+      clipboard.writeText(options.body)
+    }
+  }
+  notification.once('click', handleClick)
+  notification.once('close', () => {
+    notification.removeListener('click', handleClick)
+  })
+  notification.show()
+}
+
+export const showMessageBox = (options: any) => {
+  return new Promise<IShowMessageBoxResult>(async (resolve) => {
+    dialog.showMessageBox(
+      options
+    ).then((res) => {
+      resolve({
+        result: res.response,
+        checkboxChecked: res.checkboxChecked
+      })
+    })
+  })
+}
+
+export const calcDurationRange = (duration: number) => {
+  if (duration < 1000) {
+    return 500
+  } else if (duration < 1500) {
+    return 1000
+  } else if (duration < 3000) {
+    return 2000
+  } else if (duration < 5000) {
+    return 3000
+  } else if (duration < 7000) {
+    return 5000
+  } else if (duration < 10000) {
+    return 8000
+  } else if (duration < 12000) {
+    return 10000
+  } else if (duration < 20000) {
+    return 15000
+  } else if (duration < 30000) {
+    return 20000
+  }
+  // max range
+  return 100000
+}

src/main/utils/getPicBeds.ts

@@ -1,13 +1,13 @@
-import picgo from '../apis/picgo'
+import picgo from '@core/picgo'
 
 const getPicBeds = () => {
   const picBedTypes = picgo.helper.uploader.getIdList()
-  const picBedFromDB = picgo.getConfig('picBed.list') || []
+  const picBedFromDB = picgo.getConfig<IPicBedType[]>('picBed.list') || []
   const picBeds = picBedTypes.map((item: string) => {
     const visible = picBedFromDB.find((i: IPicBedType) => i.type === item) // object or undefined
     return {
       type: item,
-      name: picgo.helper.uploader.get(item).name || item,
+      name: picgo.helper.uploader.get(item)!.name || item,
       visible: visible ? visible.visible : true
     }
   }) as IPicBedType[]

src/main/utils/handleArgv.ts

@@ -1,35 +1,55 @@
 import path from 'path'
 import fs from 'fs-extra'
-type ClipboardFileObject = {
+import { Logger } from 'picgo'
+interface IResultFileObject {
   path: string
 }
-type Result = ClipboardFileObject[]
-const getUploadFiles = (argv = process.argv, cwd = process.cwd()) => {
-  let files = argv.slice(1)
-  if (files.length > 0 && files[0] === 'upload') {
-    if (files.length === 1) {
+type Result = IResultFileObject[]
+
+interface IHandleArgvResult {
+  success: boolean
+  fileList?: string[]
+}
+
+const handleArgv = (argv: string[]): IHandleArgvResult => {
+  const uploadIndex = argv.indexOf('upload')
+  if (uploadIndex !== -1) {
+    const fileList = argv.slice(1 + uploadIndex)
+    return {
+      success: true,
+      fileList
+    }
+  }
+  return {
+    success: false
+  }
+}
+
+const getUploadFiles = (argv = process.argv, cwd = process.cwd(), logger: Logger) => {
+  const { success, fileList } = handleArgv(argv)
+  if (!success) {
+    return []
+  } else {
+    if (fileList?.length === 0) {
       return null // for uploading images in clipboard
-    } else if (files.length > 1) {
-      files = argv.slice(1)
-      let result: Result = []
-      if (files.length > 0) {
-        result = files.map(item => {
-          if (path.isAbsolute(item)) {
+    } else if ((fileList?.length || 0) > 0) {
+      const result = fileList!.map(item => {
+        if (path.isAbsolute(item)) {
+          return {
+            path: item
+          }
+        } else {
+          const tempPath = path.join(cwd, item)
+          if (fs.existsSync(tempPath)) {
             return {
-              path: item
+              path: tempPath
             }
           } else {
-            let tempPath = path.join(cwd, item)
-            if (fs.existsSync(tempPath)) {
-              return {
-                path: tempPath
-              }
-            } else {
-              return null
-            }
+            logger.warn(`cli -> can't get file: ${tempPath}, invalid path`)
+            return null
           }
-        }).filter(item => item !== null) as Result
-      }
+        }
+      }).filter(item => item !== null) as Result
       return result
     }
   }

src/main/utils/handleI18n.ts

@@ -0,0 +1,6 @@
+import db from '~/main/apis/core/datastore'
+import { i18n } from '#/i18n'
+export const initI18n = () => {
+  const currentLanguage = db.get('settings.language') || 'zh-CN'
+  i18n.setLanguage(currentLanguage)
+}

src/main/utils/logger.ts

@@ -1,76 +0,0 @@
-import chalk from 'chalk'
-import dayjs from 'dayjs'
-import fs from 'fs-extra'
-import path from 'path'
-import util from 'util'
-import db from '#/datastore'
-import { app } from 'electron'
-import { IChalkType } from '#/types/enum'
-const baseDir = app.getPath('userData')
-
-class Logger {
-  private level = {
-    success: IChalkType.success,
-    info: IChalkType.info,
-    warn: IChalkType.warn,
-    error: IChalkType.error
-  }
-  protected handleLog (type: ILogType, msg: ILoggerType): ILoggerType {
-    // if configPath is invalid then this.ctx.config === undefined
-    // if not then check config.silent
-    const log = chalk[this.level[type]](`[PicGo ${type.toUpperCase()}]:`)
-    console.log(log, msg)
-    process.nextTick(() => {
-      this.handleWriteLog(type, msg)
-    })
-    return msg
-  }
-
-  protected handleWriteLog (type: string, msg: ILoggerType): void {
-    try {
-      const logLevel = db.get('settings.logLevel')
-      const logPath = db.get('settings.logPath') || path.join(baseDir, './picgo.log')
-      if (this.checkLogLevel(type, logLevel)) {
-        const picgoLog = fs.createWriteStream(logPath, { flags: 'a', encoding: 'utf8' })
-        let log = `${dayjs().format('YYYY-MM-DD HH:mm:ss')} [PicGo ${type.toUpperCase()}] ${msg}`
-        const logger = new console.Console(picgoLog)
-        if (typeof msg === 'object' && type === 'error') {
-          log += `\n------Error Stack Begin------\n${util.format(msg.stack)}\n-------Error Stack End-------`
-        }
-        logger.log(log)
-        picgoLog.destroy()
-      }
-    } catch (e) {
-      console.log(e)
-    }
-  }
-
-  protected checkLogLevel (type: string, level: undefined | string | string[]): boolean {
-    if (level === undefined || level === 'all') {
-      return true
-    }
-    if (Array.isArray(level)) {
-      return level.some((item: string) => (item === type || item === 'all'))
-    } else {
-      return type === level
-    }
-  }
-
-  success (msg: ILoggerType): ILoggerType {
-    return this.handleLog('success', msg)
-  }
-
-  info (msg: ILoggerType): ILoggerType {
-    return this.handleLog('info', msg)
-  }
-
-  error (msg: ILoggerType): ILoggerType {
-    return this.handleLog('error', msg)
-  }
-
-  warn (msg: ILoggerType): ILoggerType {
-    return this.handleLog('warn', msg)
-  }
-}
-
-export default new Logger()

src/main/utils/pasteTemplate.ts

@@ -0,0 +1,31 @@
+import { IPasteStyle } from '#/types/enum'
+
+const formatCustomLink = (customLink: string, item: ImgInfo) => {
+  const fileName = item.fileName!.replace(new RegExp(`\\${item.extname}$`), '')
+  const url = item.url || item.imgUrl
+  const formatObj = {
+    url,
+    fileName
+  }
+  const keys = Object.keys(formatObj) as ['url', 'fileName']
+  keys.forEach(item => {
+    if (customLink.indexOf(`$${item}`) !== -1) {
+      const reg = new RegExp(`\\$${item}`, 'g')
+      customLink = customLink.replace(reg, formatObj[item])
+    }
+  })
+  return customLink
+}
+
+export default (style: IPasteStyle, item: ImgInfo, customLink: string | undefined) => {
+  const url = item.url || item.imgUrl
+  const _customLink = customLink || '$url'
+  const tpl = {
+    markdown: `![](${url})`,
+    HTML: `<img src="${url}"/>`,
+    URL: url,
+    UBB: `[IMG]${url}[/IMG]`,
+    Custom: formatCustomLink(_customLink, item)
+  }
+  return tpl[style]
+}

src/main/utils/privacyManager.ts

@@ -0,0 +1,40 @@
+import db from '~/main/apis/core/datastore'
+import { ipcMain } from 'electron'
+import { showMessageBox } from '~/main/utils/common'
+import { SHOW_PRIVACY_MESSAGE } from '~/universal/events/constants'
+import { T } from '~/universal/i18n'
+
+class PrivacyManager {
+  async init () {
+    ipcMain.on(SHOW_PRIVACY_MESSAGE, () => {
+      this.show(false)
+    })
+    if (db.get('settings.privacyEnsure') !== true) {
+      const res = await this.show(true)
+      // cancel
+      if (res.result === 1) {
+        return false
+      } else {
+        db.set('settings.privacyEnsure', true)
+        return true
+      }
+    }
+    return true
+  }
+
+  async show (showCancel = true) {
+    const res = await showMessageBox({
+      type: 'info',
+      buttons: showCancel ? ['Yes', 'No'] : ['Yes'],
+      title: T('PRIVACY_AGREEMENT'),
+      message: T('PRIVACY')
+    })
+    return res
+  }
+}
+
+const privacyManager = new PrivacyManager()
+
+export {
+  privacyManager
+}

src/main/utils/updateChecker.ts

@@ -1,7 +1,9 @@
 import { dialog, shell } from 'electron'
-import db from '#/datastore'
+import db from '~/main/apis/core/datastore'
 import axios from 'axios'
 import pkg from 'root/package.json'
+import { lt } from 'semver'
+import { T } from '~/universal/i18n'
 const version = pkg.version
 const releaseUrl = 'https://api.github.com/repos/Molunerfinn/PicGo/releases/latest'
 const releaseUrlBackup = 'https://cdn.jsdelivr.net/gh/Molunerfinn/PicGo@latest/package.json'
@@ -29,10 +31,12 @@ const checkVersion = async () => {
       if (result) {
         dialog.showMessageBox({
           type: 'info',
-          title: '发现新版本',
+          title: T('FIND_NEW_VERSION'),
           buttons: ['Yes', 'No'],
-          message: `发现新版本${latest}，更新了很多功能，是否去下载最新的版本？`,
-          checkboxLabel: '以后不再提醒',
+          message: T('TIPS_FIND_NEW_VERSION', {
+            v: latest
+          }),
+          checkboxLabel: T('NO_MORE_NOTICE'),
           checkboxChecked: false
         }).then(res => {
           if (res.response === 0) { // if selected yes
@@ -51,18 +55,17 @@ const checkVersion = async () => {
 
 // if true -> update else return false
 const compareVersion2Update = (current: string, latest: string) => {
-  const currentVersion = current.split('.').map(item => parseInt(item))
-  const latestVersion = latest.split('.').map(item => parseInt(item))
-
-  for (let i = 0; i < 3; i++) {
-    if (currentVersion[i] < latestVersion[i]) {
-      return true
-    }
-    if (currentVersion[i] > latestVersion[i]) {
-      return false
+  try {
+    if (latest.includes('beta')) {
+      const isCheckBetaUpdate = db.get('settings.checkBetaUpdate') !== false
+      if (!isCheckBetaUpdate) {
+        return false
+      }
     }
+    return lt(current, latest)
+  } catch (e) {
+    return false
   }
-  return false
 }
 
 export default checkVersion

src/renderer/components/ChoosePicBed.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="choose-pic-bed">
-    <span>选择 {{ label }} 作为你默认图床：</span>
+    <span>{{ $T('CHOOSE_YOUR_DEFAULT_PICBED', { d: label }) }}</span>
     <el-switch
       v-model="value"
       @change="choosePicBed"
@@ -8,30 +8,28 @@
     </el-switch>
   </div>
 </template>
-<script>
-export default {
-  name: 'choose-pic-bed',
-  props: {
-    type: String,
-    label: String
-  },
-  data () {
-    return {
-      value: false
-    }
-  },
-  created () {
-    if (this.type === this.$db.get('picBed.current')) {
+<script lang="ts">
+import { Component, Vue, Prop } from 'vue-property-decorator'
+@Component({
+  name: 'choose-pic-bed'
+})
+export default class extends Vue {
+  value = false
+  @Prop() type!: string
+  @Prop() label!: string
+  async created () {
+    const current = await this.getConfig<string>('picBed.current')
+    if (this.type === current) {
       this.value = true
     }
-  },
-  methods: {
-    choosePicBed (val) {
-      this.letPicGoSaveData({
-        'picBed.current': this.type
-      })
-      this.$emit('update:choosed', this.type)
-    }
+  }
+
+  choosePicBed () {
+    this.saveConfig({
+      'picBed.current': this.type,
+      'picBed.uploader': this.type
+    })
+    this.$emit('update:choosed', this.type)
   }
 }
 </script>

src/renderer/components/ConfigForm.vue

@@ -72,7 +72,7 @@ import { cloneDeep, union } from 'lodash'
 })
 export default class extends Vue {
   @Prop() private config!: any[]
-  @Prop() readonly type!: string
+  @Prop() readonly type!: 'uploader' | 'transformer' | 'plugin'
   @Prop() readonly id!: string
   configList = []
   ruleForm = {}
@@ -81,13 +81,49 @@ export default class extends Vue {
     immediate: true
   })
   handleConfigChange (val: any) {
+    this.handleConfig(val)
+  }
+
+  async validate () {
+    return new Promise((resolve) => {
+      // @ts-ignore
+      this.$refs.form.validate((valid: boolean) => {
+        if (valid) {
+          resolve(this.ruleForm)
+        } else {
+          resolve(false)
+          return false
+        }
+      })
+    })
+  }
+
+  getConfigType () {
+    switch (this.type) {
+      case 'plugin': {
+        return this.id
+      }
+      case 'uploader': {
+        return `picBed.${this.id}`
+      }
+      case 'transformer': {
+        return `transformer.${this.id}`
+      }
+      default:
+        return 'unknown'
+    }
+  }
+
+  async handleConfig (val: any) {
     this.ruleForm = Object.assign({}, {})
-    const config = this.$db.get(`picBed.${this.id}`)
+    const config = await this.getConfig<IPicGoPluginConfig>(this.getConfigType())
     if (val.length > 0) {
       this.configList = cloneDeep(val).map((item: any) => {
         let defaultValue = item.default !== undefined
-          ? item.default : item.type === 'checkbox'
-            ? [] : null
+          ? item.default
+          : item.type === 'checkbox'
+            ? []
+            : null
         if (item.type === 'checkbox') {
           const defaults = item.choices.filter((i: any) => {
             return i.checked
@@ -102,19 +138,6 @@ export default class extends Vue {
       })
     }
   }
-  async validate () {
-    return new Promise((resolve, reject) => {
-      // @ts-ignore
-      this.$refs.form.validate((valid: boolean) => {
-        if (valid) {
-          resolve(this.ruleForm)
-        } else {
-          resolve(false)
-          return false
-        }
-      })
-    })
-  }
 }
 </script>
 <style lang='stylus'>

src/renderer/components/InputBoxDialog.vue

@@ -0,0 +1,70 @@
+<template>
+  <el-dialog
+    :title="inputBoxOptions.title || $T('INPUT')"
+    :visible.sync="showInputBoxVisible"
+    :modal-append-to-body="false"
+  >
+    <el-input
+      v-model="inputBoxValue"
+      :placeholder="inputBoxOptions.placeholder"></el-input>
+    <span slot="footer">
+      <el-button @click="handleInputBoxCancel" round>{{ $T('CANCEL') }}</el-button>
+      <el-button type="primary" @click="handleInputBoxConfirm" round>{{ $T('CONFIRM') }}</el-button>
+    </span>
+  </el-dialog>
+</template>
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
+import { ipcRenderer, IpcRendererEvent } from 'electron'
+import {
+  SHOW_INPUT_BOX,
+  SHOW_INPUT_BOX_RESPONSE
+} from '~/universal/events/constants'
+@Component({
+  name: 'input-box-dialog'
+})
+export default class extends Vue {
+  inputBoxValue = ''
+  showInputBoxVisible = false
+  inputBoxOptions = {
+    title: '',
+    placeholder: ''
+  }
+
+  created () {
+    ipcRenderer.on(SHOW_INPUT_BOX, this.ipcEventHandler)
+    this.$bus.$on(SHOW_INPUT_BOX, this.initInputBoxValue)
+  }
+
+  ipcEventHandler (evt: IpcRendererEvent, options: IShowInputBoxOption) {
+    this.initInputBoxValue(options)
+  }
+
+  initInputBoxValue (options: IShowInputBoxOption) {
+    this.inputBoxValue = options.value || ''
+    this.inputBoxOptions.title = options.title || ''
+    this.inputBoxOptions.placeholder = options.placeholder || ''
+    this.showInputBoxVisible = true
+  }
+
+  handleInputBoxCancel () {
+    // TODO: RPCServer
+    this.showInputBoxVisible = false
+    ipcRenderer.send(SHOW_INPUT_BOX, '')
+    this.$bus.$emit(SHOW_INPUT_BOX_RESPONSE, '')
+  }
+
+  handleInputBoxConfirm () {
+    this.showInputBoxVisible = false
+    ipcRenderer.send(SHOW_INPUT_BOX, this.inputBoxValue)
+    this.$bus.$emit(SHOW_INPUT_BOX_RESPONSE, this.inputBoxValue)
+  }
+
+  beforeDestroy () {
+    ipcRenderer.removeListener(SHOW_INPUT_BOX, this.ipcEventHandler)
+    this.$bus.$off(SHOW_INPUT_BOX)
+  }
+}
+</script>
+<style lang='stylus'>
+</style>

src/renderer/layouts/Main.vue

@@ -1,5 +1,5 @@
 <template>
-  <div id="setting-page">
+  <div id="main-page">
     <div class="fake-title-bar" :class="{ 'darwin': os === 'darwin' }">
       <div class="fake-title-bar__title">
         PicGo - {{ version }}
@@ -17,21 +17,22 @@
           :default-active="defaultActive"
           @select="handleSelect"
           :unique-opened="true"
+          @open="handleGetPicPeds"
           >
           <el-menu-item index="upload">
             <i class="el-icon-upload"></i>
-            <span slot="title">上传区</span>
+            <span slot="title">{{ $T('UPLOAD_AREA') }}</span>
           </el-menu-item>
           <el-menu-item index="gallery">
             <i class="el-icon-picture"></i>
-            <span slot="title">相册</span>
+            <span slot="title">{{ $T('GALLERY') }}</span>
           </el-menu-item>
           <el-submenu
             index="sub-menu"
           >
             <template slot="title">
               <i class="el-icon-menu"></i>
-              <span>图床设置</span>
+              <span>{{ $T('PICBEDS_SETTINGS') }}</span>
             </template>
             <template
               v-for="item in picBed"
@@ -48,11 +49,11 @@
           </el-submenu>
           <el-menu-item index="setting">
             <i class="el-icon-setting"></i>
-            <span slot="title">PicGo设置</span>
+            <span slot="title">{{ $T('PICGO_SETTINGS') }}</span>
           </el-menu-item>
           <el-menu-item index="plugin">
             <i class="el-icon-share"></i>
-            <span slot="title">插件设置</span>
+            <span slot="title">{{ $T('PLUGIN_SETTINGS') }}</span>
           </el-menu-item>
         </el-menu>
         <i class="el-icon-info setting-window" @click="openDialog"></i>
@@ -65,135 +66,149 @@
         :class="{ 'darwin': os === 'darwin' }">
         <transition name="picgo-fade" mode="out-in">
           <keep-alive>
-            <router-view v-if="$route.meta.keepAlive"></router-view>
+            <router-view v-if="$route && $route.meta && $route.meta.keepAlive"></router-view>
           </keep-alive>
         </transition>
         <transition name="picgo-fade" mode="out-in">
-          <router-view :key="$route.path" v-if="!$route.meta.keepAlive"></router-view>
+          <router-view :key="$route.path" v-if="!($route && $route.meta && $route.meta.keepAlive)"></router-view>
         </transition>
       </el-col>
     </el-row>
     <el-dialog
-      title="赞助PicGo"
+      :title="$T('SPONSOR_PICGO')"
       :visible.sync="visible"
       width="70%"
       top="10vh"
     >
-      PicGo是免费开源的软件，如果你喜欢它，对你有帮助，不妨请我喝杯咖啡？
+      {{ $T('PICGO_SPONSOR_TEXT') }}
       <el-row class="support">
         <el-col :span="12">
-          <img src="https://user-images.githubusercontent.com/12621342/34188165-e7cdf372-e56f-11e7-8732-1338c88b9bb7.jpg" alt="支付宝">
-          <div class="support-title">支付宝</div>
+          <img src="https://user-images.githubusercontent.com/12621342/34188165-e7cdf372-e56f-11e7-8732-1338c88b9bb7.jpg" :alt="$T('ALIPAY')">
+          <div class="support-title">{{ $T('ALIPAY') }}</div>
         </el-col>
         <el-col :span="12">
-          <img src="https://user-images.githubusercontent.com/12621342/34188201-212cda84-e570-11e7-9b7a-abb298699d85.jpg" alt="支付宝">
-          <div class="support-title">微信</div>
+          <img src="https://user-images.githubusercontent.com/12621342/34188201-212cda84-e570-11e7-9b7a-abb298699d85.jpg" :alt="$T('WECHATPAY')">
+          <div class="support-title">{{ $T('WECHATPAY') }}</div>
         </el-col>
       </el-row>
     </el-dialog>
     <el-dialog
-      title="自定义链接格式"
-      :visible.sync="customLinkVisible"
+      class="qrcode-dialog"
+      top="3vh"
+      width="60%"
+      :title="$T('PICBED_QRCODE')"
+      :visible.sync="qrcodeVisible"
+      :modal-append-to-body="false"
+      lock-scroll
     >
       <el-form
-        label-position="top"
-        :model="customLink"
-        ref="customLink"
-        :rules="rules"
+        label-position="left"
+        label-width="70px"
+        size="mini"
       >
         <el-form-item
-          label="用占位符$url来表示url的位置"
-          prop="value"
+          :label="$T('CHOOSE_PICBED')"
         >
-          <el-input
-            class="align-center"
-            v-model="customLink.value"
-            :autofocus="true"
-          ></el-input>
+          <el-select
+            v-model="choosedPicBedForQRCode"
+            multiple
+            collapse-tags
+          >
+            <el-option
+              v-for="item in picBed"
+              :key="item.type"
+              :label="item.name"
+              :value="item.type"
+            ></el-option>
+          </el-select>
+          <el-button
+            v-show="choosedPicBedForQRCode.length > 0"
+            type="primary"
+            round
+            class="copy-picbed-config"
+            @click="handleCopyPicBedConfig"
+          >
+            {{ $T('COPY_PICBED_CONFIG') }}
+          </el-button>
         </el-form-item>
       </el-form>
-      <div>
-        如[]($url)
+      <div class="qrcode-container">
+        <qrcode-vue
+          v-show="choosedPicBedForQRCode.length > 0"
+          :size="280"
+          :value="picBedConfigString"
+        />
       </div>
-      <span slot="footer">
-        <el-button @click="cancelCustomLink">取消</el-button>
-        <el-button type="primary" @click="confirmCustomLink">确定</el-button>
-      </span>
-    </el-dialog>
-    <el-dialog
-      :title="inputBoxOptions.title || '输入框'"
-      :visible.sync="showInputBoxVisible"
-      :modal-append-to-body="false"
-      @close="handleInputBoxClose"
-    >
-      <el-input
-        v-model="inputBoxValue"
-        :placeholder="inputBoxOptions.placeholder"></el-input>
-      <span slot="footer">
-        <el-button @click="showInputBoxVisible = false" round>取消</el-button>
-        <el-button type="primary" @click="showInputBoxVisible = false" round>确定</el-button>
-      </span>
     </el-dialog>
+    <input-box-dialog />
   </div>
 </template>
 <script lang="ts">
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue, Watch } from 'vue-property-decorator'
+import QrcodeVue from 'qrcode.vue'
+import pick from 'lodash/pick'
 import pkg from 'root/package.json'
-import keyDetect from '@/utils/key-binding'
-import { remote, ipcRenderer, IpcRendererEvent } from 'electron'
-import db from '#/datastore'
+import {
+  ipcRenderer,
+  IpcRendererEvent,
+  clipboard
+} from 'electron'
 import mixin from '@/utils/mixin'
-const { Menu, dialog, BrowserWindow } = remote
-const customLinkRule = (rule: string, value: string, callback: (arg0?: Error) => void) => {
-  if (!/\$url/.test(value)) {
-    return callback(new Error('必须含有$url'))
-  } else {
-    return callback()
-  }
-}
+import InputBoxDialog from '@/components/InputBoxDialog.vue'
+import {
+  MINIMIZE_WINDOW,
+  CLOSE_WINDOW,
+  SHOW_MAIN_PAGE_MENU,
+  SHOW_MAIN_PAGE_QRCODE,
+  SHOW_MAIN_PAGE_DONATION
+} from '~/universal/events/constants'
 @Component({
-  name: 'setting-page',
-  mixins: [mixin]
+  name: 'main-page',
+  mixins: [mixin],
+  components: {
+    InputBoxDialog,
+    QrcodeVue
+  }
 })
 export default class extends Vue {
   version = process.env.NODE_ENV === 'production' ? pkg.version : 'Dev'
   defaultActive = 'upload'
-  menu: Electron.Menu | null = null
   visible = false
   keyBindingVisible = false
   customLinkVisible = false
-  customLink = {
-    value: db.get('customLink') || '$url'
-  }
-  rules = {
-    value: [
-      { validator: customLinkRule, trigger: 'blur' }
-    ]
-  }
   os = ''
-  shortKey: IShortKeyMap = {
-    upload: db.get('shortKey.upload')
-  }
   picBed: IPicBedType[] = []
-  // for showInputBox
-  showInputBoxVisible = false
-  inputBoxValue = ''
-  inputBoxOptions = {
-    title: '',
-    placeholder: ''
-  }
+  qrcodeVisible = false
+  picBedConfigString = ''
+  choosedPicBedForQRCode: string[] = []
   created () {
     this.os = process.platform
-    this.buildMenu()
     ipcRenderer.send('getPicBeds')
     ipcRenderer.on('getPicBeds', this.getPicBeds)
-    ipcRenderer.on('showInputBox', (evt: IpcRendererEvent, options: IShowInputBoxOption) => {
-      this.inputBoxValue = ''
-      this.inputBoxOptions.title = options.title || ''
-      this.inputBoxOptions.placeholder = options.placeholder || ''
-      this.showInputBoxVisible = true
+    this.handleGetPicPeds()
+    ipcRenderer.on(SHOW_MAIN_PAGE_QRCODE, () => {
+      this.qrcodeVisible = true
+    })
+    ipcRenderer.on(SHOW_MAIN_PAGE_DONATION, () => {
+      this.visible = true
     })
   }
+
+  @Watch('choosedPicBedForQRCode')
+  choosedPicBedForQRCodeChange (val: string[]) {
+    if (val.length > 0) {
+      this.$nextTick(async () => {
+        const picBedConfig = await this.getConfig('picBed')
+        const config = pick(picBedConfig, ...this.choosedPicBedForQRCode)
+        this.picBedConfigString = JSON.stringify(config)
+      })
+    }
+  }
+
+  handleGetPicPeds = () => {
+    ipcRenderer.send('getPicBeds')
+  }
+
   handleSelect (index: string) {
     const type = index.match(/picbeds-/)
     if (type === null) {
@@ -216,85 +231,50 @@ export default class extends Vue {
       }
     }
   }
+
   minimizeWindow () {
-    const window = BrowserWindow.getFocusedWindow()
-    window!.minimize()
+    ipcRenderer.send(MINIMIZE_WINDOW)
   }
+
   closeWindow () {
-    const window = BrowserWindow.getFocusedWindow()
-    window!.close()
-  }
-  buildMenu () {
-    const _this = this
-    const template = [
-      {
-        label: '关于',
-        click () {
-          dialog.showMessageBox({
-            title: 'PicGo',
-            message: 'PicGo',
-            detail: `Version: ${pkg.version}\nAuthor: Molunerfinn\nGithub: https://github.com/Molunerfinn/PicGo`
-          })
-        }
-      },
-      {
-        label: '赞助PicGo',
-        click () {
-          _this.visible = true
-        }
-      }
-    ]
-    this.menu = Menu.buildFromTemplate(template)
+    ipcRenderer.send(CLOSE_WINDOW)
   }
+
   openDialog () {
-    // this.menu!.popup(remote.getCurrentWindow())
-    this.menu!.popup()
-  }
-  keyDetect (type: string, event: KeyboardEvent) {
-    this.shortKey[type] = keyDetect(event).join('+')
-  }
-  cancelKeyBinding () {
-    this.keyBindingVisible = false
-    this.shortKey = db.get('shortKey')
-  }
-  cancelCustomLink () {
-    this.customLinkVisible = false
-    this.customLink.value = db.get('customLink') || '$url'
-  }
-  confirmCustomLink () {
-    // @ts-ignore
-    this.$refs.customLink.validate((valid: boolean) => {
-      if (valid) {
-        db.set('customLink', this.customLink.value)
-        this.customLinkVisible = false
-        ipcRenderer.send('updateCustomLink')
-      } else {
-        return false
-      }
-    })
+    ipcRenderer.send(SHOW_MAIN_PAGE_MENU)
   }
+
   openMiniWindow () {
     ipcRenderer.send('openMiniWindow')
   }
+
+  handleCopyPicBedConfig () {
+    clipboard.writeText(this.picBedConfigString)
+    this.$message.success(this.$T('COPY_PICBED_CONFIG_SUCCEED'))
+  }
+
   getPicBeds (event: IpcRendererEvent, picBeds: IPicBedType[]) {
     this.picBed = picBeds
   }
-  handleInputBoxClose () {
-    ipcRenderer.send('showInputBox', this.inputBoxValue)
-  }
-  beforeRouteEnter (to: any, from: any, next: any) {
+
+  beforeRouteEnter (to: any, next: any) {
     next((vm: this) => {
       vm.defaultActive = to.name
     })
   }
+
   beforeDestroy () {
     ipcRenderer.removeListener('getPicBeds', this.getPicBeds)
-    ipcRenderer.removeAllListeners('showInputBox')
   }
 }
 </script>
 <style lang='stylus'>
 $darwinBg = transparentify(#172426, #000, 0.7)
+.setting-list-scroll
+  height 425px
+  overflow-y auto
+  overflow-x hidden
+  margin-right 0!important
 .picgo-fade
   &-enter,
   &-leave,
@@ -308,7 +288,17 @@ $darwinBg = transparentify(#172426, #000, 0.7)
   font-size 20px
   text-align center
   margin 10px auto
-#setting-page
+#main-page
+  .qrcode-dialog
+    .qrcode-container
+      display flex
+      justify-content center
+    .el-dialog__body
+      padding-top 10px
+    .copy-picbed-config
+      margin-left 10px
+    .el-input__inner
+      border-radius 14px
   .fake-title-bar
     -webkit-app-region drag
     height h = 22px

src/renderer/pages/Gallery.vue

@@ -1,7 +1,7 @@
 <template>
   <div id="gallery-view">
     <div class="view-title">
-      相册 - {{ filterList.length }} <i class="el-icon-caret-bottom" @click="toggleHandleBar" :class="{'active': handleBarActive}"></i>
+      {{ $T('GALLERY') }} - {{ filterList.length }} <i class="el-icon-caret-bottom" @click="toggleHandleBar" :class="{'active': handleBarActive}"></i>
     </div>
     <transition name="el-zoom-in-top">
       <el-row v-show="handleBarActive">
@@ -14,7 +14,7 @@
                 collapse-tags
                 size="mini"
                 style="width: 100%"
-                placeholder="请选择显示的图床">
+                :placeholder="$T('CHOOSE_SHOWED_PICBED')">
                 <el-option
                   v-for="item in picBed"
                   :key="item.type"
@@ -29,7 +29,7 @@
                 size="mini"
                 style="width: 100%"
                 @change="handlePasteStyleChange"
-                placeholder="请选择粘贴的格式">
+                :placeholder="$T('CHOOSE_PASTE_FORMAT')">
                 <el-option
                   v-for="(value, key) in pasteStyleMap"
                   :key="key"
@@ -42,20 +42,25 @@
           <el-row class="handle-bar" :gutter="16">
             <el-col :span="12">
               <el-input
-                placeholder="搜索"
+                :placeholder="$T('SEARCH')"
                 size="mini"
                 v-model="searchText">
                 <i slot="suffix" class="el-input__icon el-icon-close" v-if="searchText" @click="cleanSearch" style="cursor: pointer"></i>
               </el-input>
             </el-col>
-            <el-col :span="6">
+            <el-col :span="4">
               <div class="item-base copy round" :class="{ active: isMultiple(choosedList)}" @click="multiCopy">
-                <i class="el-icon-document"></i> 批量复制
+                {{ $T('COPY') }}
               </div>
             </el-col>
-            <el-col :span="6">
+            <el-col :span="4">
               <div class="item-base delete round" :class="{ active: isMultiple(choosedList)}" @click="multiRemove">
-                <i class="el-icon-delete"></i> 批量删除
+                {{ $T('DELETE') }}
+              </div>
+            </el-col>
+            <el-col :span="4">
+              <div class="item-base all-pick round" :class="{ active: filterList.length > 0}" @click="toggleSelectAll">
+                {{ isAllSelected ? $T('CANCEL') : $T('SELECT_ALL') }}
               </div>
             </el-col>
           </el-row>
@@ -66,12 +71,12 @@
       <el-col :span="20" :offset="2">
         <el-row :gutter="16">
           <gallerys
-            :images="images"
+            :images="filterList"
             :index="idx"
             @close="handleClose"
             :options="options"
           ></gallerys>
-          <el-col :span="6" v-for="(item, index) in images" :key="item.id" class="gallery-list__img">
+          <el-col :span="6" v-for="(item, index) in filterList" :key="item.id" class="gallery-list__img">
             <div
               class="gallery-list__item"
               @click="zoomImage(index)"
@@ -82,7 +87,7 @@
               <i class="el-icon-document" @click="copy(item)"></i>
               <i class="el-icon-edit-outline" @click="openDialog(item)"></i>
               <i class="el-icon-delete" @click="remove(item.id)"></i>
-              <el-checkbox v-model="choosedList[item.id]" class="pull-right" @change=" handleBarActive = true"></el-checkbox>
+              <el-checkbox v-model="choosedList[item.id ? item.id : '']" class="pull-right" @change="(val) => handleChooseImage(val, index)"></el-checkbox>
             </div>
           </el-col>
         </el-row>
@@ -90,14 +95,14 @@
     </el-row>
     <el-dialog
       :visible.sync="dialogVisible"
-      title="修改图片URL"
+      :title="$T('CHANGE_IMAGE_URL')"
       width="500px"
       :modal-append-to-body="false"
     >
       <el-input v-model="imgInfo.imgUrl"></el-input>
       <span slot="footer" class="dialog-footer">
-        <el-button @click="dialogVisible = false">取 消</el-button>
-        <el-button type="primary" @click="confirmModify">确 定</el-button>
+        <el-button @click="dialogVisible = false">{{ $T('CANCEL') }}</el-button>
+        <el-button type="primary" @click="confirmModify">{{ $T('CONFIRM') }}</el-button>
       </span>
     </el-dialog>
   </div>
@@ -105,8 +110,9 @@
 <script lang="ts">
 // @ts-ignore
 import gallerys from 'vue-gallery'
-import pasteStyle from '#/utils/pasteTemplate'
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue, Watch } from 'vue-property-decorator'
+import { IResult } from '@picgo/store/dist/types'
+import { PASTE_TEXT } from '#/events/constants'
 import {
   ipcRenderer,
   clipboard,
@@ -126,13 +132,17 @@ export default class extends Vue {
     urlProperty: 'imgUrl',
     closeOnSlideClick: true
   }
+
   dialogVisible = false
   imgInfo = {
-    id: null,
+    id: '',
     imgUrl: ''
   }
+
   choosedList: IObjT<boolean> = {}
   choosedPicBed: string[] = []
+  lastChoosed: number = -1
+  isShiftKeyPress: boolean = false
   searchText = ''
   handleBarActive = false
   pasteStyle = ''
@@ -143,67 +153,120 @@ export default class extends Vue {
     UBB: 'UBB',
     Custom: 'Custom'
   }
+
   picBed: IPicBedType[] = []
-  beforeRouteEnter (to: any, from: any, next: any) {
-    next((vm: any) => {
-      vm.getGallery()
-      vm.getPasteStyle()
-      vm.getPicBeds()
-    })
+  @Watch('$route')
+  handleRouteUpdate (to: any, from: any) {
+    console.log(to, from)
+    if (from.name === 'gallery') {
+      this.clearChoosedList()
+    }
+    if (to.name === 'gallery') {
+      this.updateGallery()
+    }
   }
-  created () {
-    ipcRenderer.on('updateGallery', (event: IpcRendererEvent) => {
-      this.$nextTick(() => {
-        this.filterList = this.getGallery()
+
+  async created () {
+    ipcRenderer.on('updateGallery', () => {
+      this.$nextTick(async () => {
+        this.updateGallery()
       })
     })
     ipcRenderer.send('getPicBeds')
     ipcRenderer.on('getPicBeds', this.getPicBeds)
+    this.updateGallery()
   }
+
+  mounted () {
+    document.addEventListener('keydown', this.handleDetectShiftKey)
+    document.addEventListener('keyup', this.handleDetectShiftKey)
+  }
+
+  handleDetectShiftKey (event: KeyboardEvent) {
+    if (event.key === 'Shift') {
+      if (event.type === 'keydown') {
+        this.isShiftKeyPress = true
+      } else if (event.type === 'keyup') {
+        this.isShiftKeyPress = false
+      }
+    }
+  }
+
   get filterList () {
     return this.getGallery()
   }
-  set filterList (val) {
-    this.images = val
+
+  get isAllSelected () {
+    const values = Object.values(this.choosedList)
+    if (values.length === 0) {
+      return false
+    } else {
+      return this.filterList.every(item => {
+        return this.choosedList[item.id!]
+      })
+    }
   }
+
   getPicBeds (event: IpcRendererEvent, picBeds: IPicBedType[]) {
     this.picBed = picBeds
   }
-  getGallery () {
-    if (this.choosedPicBed.length > 0) {
-      let arr: ImgInfo[] = []
-      this.choosedPicBed.forEach(item => {
-        let obj: IObj = {
-          type: item
-        }
-        if (this.searchText) {
-          obj.fileName = this.searchText
-        }
-        // @ts-ignore
-        arr = arr.concat(this.$db.read().get('uploaded').filter(obj => {
-          return obj.fileName.indexOf(this.searchText) !== -1 && obj.type === item
-        }).reverse().value())
-      })
-      this.images = arr
+
+  getGallery (): ImgInfo[] {
+    if (this.searchText || this.choosedPicBed.length > 0) {
+      return this.images
+        .filter(item => {
+          let isInChoosedPicBed = true
+          let isIncludesSearchText = true
+          if (this.choosedPicBed.length > 0) {
+            isInChoosedPicBed = this.choosedPicBed.some(type => type === item.type)
+          }
+          if (this.searchText) {
+            isIncludesSearchText = item.fileName?.includes(this.searchText) || false
+          }
+          return isIncludesSearchText && isInChoosedPicBed
+        })
     } else {
-      if (this.searchText) {
-        let data = this.$db.read().get('uploaded')
-        // @ts-ignore
-          .filter(item => {
-            return item.fileName.indexOf(this.searchText) !== -1
-          }).reverse().value()
-        this.images = data
-      } else {
-        // @ts-ignore
-        this.images = this.$db.read().get('uploaded').slice().reverse().value()
-      }
+      return this.images
     }
-    return this.images
   }
+
+  async updateGallery () {
+    this.images = (await this.$$db.get({ orderBy: 'desc' })).data
+  }
+
+  @Watch('filterList')
+  handleFilterListChange () {
+    this.clearChoosedList()
+  }
+
+  handleChooseImage (val: boolean, index: number) {
+    if (val === true) {
+      this.handleBarActive = true
+      if (this.lastChoosed !== -1 && this.isShiftKeyPress) {
+        const min = Math.min(this.lastChoosed, index)
+        const max = Math.max(this.lastChoosed, index)
+        for (let i = min + 1; i < max; i++) {
+          const id = this.filterList[i].id!
+          this.$set(this.choosedList, id, true)
+        }
+      }
+      this.lastChoosed = index
+    }
+  }
+
+  clearChoosedList () {
+    this.isShiftKeyPress = false
+    Object.keys(this.choosedList).forEach(key => {
+      this.choosedList[key] = false
+    })
+    this.lastChoosed = -1
+  }
+
   zoomImage (index: number) {
     this.idx = index
     this.changeZIndexForGallery(true)
   }
+
   changeZIndexForGallery (isOpen: boolean) {
     if (isOpen) {
       // @ts-ignore
@@ -213,60 +276,63 @@ export default class extends Vue {
       document.querySelector('.main-content.el-row').style.zIndex = 10
     }
   }
+
   handleClose () {
     this.idx = null
     this.changeZIndexForGallery(false)
   }
-  copy (item: ImgInfo) {
-    const style = this.$db.get('settings.pasteStyle') || 'markdown'
-    const copyLink = pasteStyle(style, item)
+
+  async copy (item: ImgInfo) {
+    const copyLink = await ipcRenderer.invoke(PASTE_TEXT, item)
     const obj = {
-      title: '复制链接成功',
+      title: this.$T('COPY_LINK_SUCCEED'),
       body: copyLink,
       icon: item.url || item.imgUrl
     }
     const myNotification = new Notification(obj.title, obj)
-    clipboard.writeText(copyLink)
     myNotification.onclick = () => {
       return true
     }
   }
-  remove (id: string) {
-    this.$confirm('此操作将把该图片移出相册, 是否继续?', '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning'
-    }).then(() => {
-      const file = this.$db.getById('uploaded', id)
-      this.$db.removeById('uploaded', id)
-      ipcRenderer.send('removeFiles', [file])
-      const obj = {
-        title: '操作结果',
-        body: '删除成功'
-      }
-      const myNotification = new Notification(obj.title, obj)
-      myNotification.onclick = () => {
+
+  remove (id?: string) {
+    if (id) {
+      this.$confirm(this.$T('TIPS_REMOVE_LINK'), this.$T('TIPS_NOTICE'), {
+        confirmButtonText: this.$T('CONFIRM'),
+        cancelButtonText: this.$T('CANCEL'),
+        type: 'warning'
+      }).then(async () => {
+        const file = await this.$$db.getById(id)
+        await this.$$db.removeById(id)
+        ipcRenderer.send('removeFiles', [file])
+        const obj = {
+          title: this.$T('OPERATION_SUCCEED'),
+          body: ''
+        }
+        const myNotification = new Notification(obj.title, obj)
+        myNotification.onclick = () => {
+          return true
+        }
+        this.updateGallery()
+      }).catch((e) => {
+        console.log(e)
         return true
-      }
-      this.getGallery()
-    }).catch((e) => {
-      console.log(e)
-      return true
-    })
+      })
+    }
   }
+
   openDialog (item: ImgInfo) {
-    this.imgInfo.id = item.id
+    this.imgInfo.id = item.id!
     this.imgInfo.imgUrl = item.imgUrl as string
     this.dialogVisible = true
   }
-  confirmModify () {
-    this.$db.read().get('uploaded')
-      // @ts-ignore
-      .getById(this.imgInfo.id)
-      .assign({ imgUrl: this.imgInfo.imgUrl })
-      .write()
+
+  async confirmModify () {
+    await this.$$db.updateById(this.imgInfo.id, {
+      imgUrl: this.imgInfo.imgUrl
+    })
     const obj = {
-      title: '修改图片URL成功',
+      title: this.$T('CHANGE_IMAGE_URL_SUCCEED'),
       body: this.imgInfo.imgUrl,
       icon: this.imgInfo.imgUrl
     }
@@ -275,87 +341,114 @@ export default class extends Vue {
       return true
     }
     this.dialogVisible = false
-    this.getGallery()
+    this.updateGallery()
   }
+
   choosePicBed (type: string) {
-    let idx = this.choosedPicBed.indexOf(type)
+    const idx = this.choosedPicBed.indexOf(type)
     if (idx !== -1) {
       this.choosedPicBed.splice(idx, 1)
     } else {
       this.choosedPicBed.push(type)
     }
   }
+
   cleanSearch () {
     this.searchText = ''
   }
+
   isMultiple (obj: IObj) {
     return Object.values(obj).some(item => item)
   }
+
+  toggleSelectAll () {
+    const result = !this.isAllSelected
+    this.filterList.forEach(item => {
+      this.$set(this.choosedList, item.id!, result)
+    })
+  }
+
   multiRemove () {
     // choosedList -> { [id]: true or false }; true means choosed. false means not choosed.
-    if (Object.values(this.choosedList).some(item => item)) {
-      this.$confirm('将删除刚才选中的图片，是否继续？', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
+    const multiRemoveNumber = Object.values(this.choosedList).filter(item => item).length
+    if (multiRemoveNumber) {
+      this.$confirm(this.$T('TIPS_WILL_REMOVE_CHOOSED_IMAGES', {
+        m: multiRemoveNumber
+      }), this.$T('TIPS_NOTICE'), {
+        confirmButtonText: this.$T('CONFIRM'),
+        cancelButtonText: this.$T('CANCEL'),
         type: 'warning'
-      }).then(() => {
-        let files: ImgInfo[] = []
-        Object.keys(this.choosedList).forEach(key => {
+      }).then(async () => {
+        const files: IResult<ImgInfo>[] = []
+        const imageIDList = Object.keys(this.choosedList)
+        for (let i = 0; i < imageIDList.length; i++) {
+          const key = imageIDList[i]
           if (this.choosedList[key]) {
-            const file = this.$db.getById('uploaded', key)
-            files.push(file)
-            this.$db.removeById('uploaded', key)
+            const file = await this.$$db.getById<ImgInfo>(key)
+            if (file) {
+              files.push(file)
+              await this.$$db.removeById(key)
+            }
           }
-        })
-        this.choosedList = {}
-        this.getGallery()
+        }
+        this.clearChoosedList()
+        this.choosedList = {} // 只有删除才能将这个置空
         const obj = {
-          title: '操作结果',
-          body: '删除成功'
+          title: this.$T('OPERATION_SUCCEED'),
+          body: ''
         }
         ipcRenderer.send('removeFiles', files)
         const myNotification = new Notification(obj.title, obj)
         myNotification.onclick = () => {
           return true
         }
+        this.updateGallery()
       }).catch(() => {
         return true
       })
     }
   }
-  multiCopy () {
+
+  async multiCopy () {
     if (Object.values(this.choosedList).some(item => item)) {
-      let copyString = ''
-      const style = this.$db.get('settings.pasteStyle') || 'markdown'
+      const copyString: string[] = []
       // choosedList -> { [id]: true or false }; true means choosed. false means not choosed.
-      Object.keys(this.choosedList).forEach(key => {
+      const imageIDList = Object.keys(this.choosedList)
+      for (let i = 0; i < imageIDList.length; i++) {
+        const key = imageIDList[i]
         if (this.choosedList[key]) {
-          const item = this.$db.getById('uploaded', key)
-          copyString += pasteStyle(style, item) + '\n'
-          this.choosedList[key] = false
+          const item = await this.$$db.getById<ImgInfo>(key)
+          if (item) {
+            const txt = await ipcRenderer.invoke(PASTE_TEXT, item)
+            copyString.push(txt)
+            this.choosedList[key] = false
+          }
         }
-      })
+      }
       const obj = {
-        title: '批量复制链接成功',
-        body: copyString
+        title: this.$T('BATCH_COPY_LINK_SUCCEED'),
+        body: copyString.join('\n')
       }
       const myNotification = new Notification(obj.title, obj)
-      clipboard.writeText(copyString)
+      clipboard.writeText(copyString.join('\n'))
       myNotification.onclick = () => {
         return true
       }
     }
   }
+
   toggleHandleBar () {
     this.handleBarActive = !this.handleBarActive
   }
-  getPasteStyle () {
-    this.pasteStyle = this.$db.get('settings.pasteStyle') || 'markdown'
-  }
-  handlePasteStyleChange (val: string) {
-    this.$db.set('settings.pasteStyle', val)
+
+  // getPasteStyle () {
+  //   this.pasteStyle = this.$db.get('settings.pasteStyle') || 'markdown'
+  // }
+  async handlePasteStyleChange (val: string) {
+    this.saveConfig('settings.pasteStyle', val)
     this.pasteStyle = val
   }
+
   beforeDestroy () {
     ipcRenderer.removeAllListeners('updateGallery')
     ipcRenderer.removeListener('getPicBeds', this.getPicBeds)
@@ -400,6 +493,13 @@ export default class extends Vue {
       cursor pointer
       background #F15140
       color #fff
+  &.all-pick
+    cursor not-allowed
+    background #69C282
+    &.active
+      cursor pointer
+      background #44B363
+      color #fff
 #gallery-view
   position relative
   .round

src/renderer/pages/MiniPage.vue

@@ -20,10 +20,12 @@ import mixin from '@/utils/mixin'
 import { Component, Vue, Watch } from 'vue-property-decorator'
 import {
   ipcRenderer,
-  IpcRendererEvent,
-  remote
+  IpcRendererEvent
 } from 'electron'
-import path from 'path'
+import { SHOW_MINI_PAGE_MENU, SET_MINI_WINDOW_POS } from '~/universal/events/constants'
+import {
+  isUrl
+} from '~/universal/utils/common'
 @Component({
   name: 'mini-page',
   mixins: [mixin]
@@ -55,6 +57,7 @@ export default class extends Vue {
     })
     this.getPicBeds()
   }
+
   mounted () {
     window.addEventListener('mousedown', this.handleMouseDown, false)
     window.addEventListener('mousemove', this.handleMouseMove, false)
@@ -73,27 +76,59 @@ export default class extends Vue {
       }, 1200)
     }
   }
+
   getPicBeds () {
     this.picBed = ipcRenderer.sendSync('getPicBeds')
-    this.buildMenu()
   }
+
   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(this.$T('TIPS_DRAG_VALID_PICTURE_OR_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(this.$T('TIPS_DRAG_VALID_PICTURE_OR_URL'))
+    }
+  }
+
   openUploadWindow () {
     // @ts-ignore
     document.getElementById('file-uploader').click()
   }
+
   onChange (e: any) {
     this.ipcSendFiles(e.target.files)
     // @ts-ignore
     document.getElementById('file-uploader').value = ''
   }
+
   ipcSendFiles (files: FileList) {
-    let sendFiles: IFileWithPath[] = []
-    Array.from(files).forEach((item, index) => {
-      let obj = {
+    const sendFiles: IFileWithPath[] = []
+    Array.from(files).forEach((item) => {
+      const obj = {
         name: item.name,
         path: item.path
       }
@@ -101,6 +136,7 @@ export default class extends Vue {
     })
     ipcRenderer.send('uploadChoosedFiles', sendFiles)
   }
+
   handleMouseDown (e: MouseEvent) {
     this.dragging = true
     this.wX = e.pageX
@@ -108,20 +144,28 @@ export default class extends Vue {
     this.screenX = e.screenX
     this.screenY = e.screenY
   }
+
   handleMouseMove (e: MouseEvent) {
     e.preventDefault()
     e.stopPropagation()
     if (this.dragging) {
       const xLoc = e.screenX - this.wX
       const yLoc = e.screenY - this.wY
-      remote.BrowserWindow.getFocusedWindow()!.setBounds({
+      ipcRenderer.send(SET_MINI_WINDOW_POS, {
         x: xLoc,
         y: yLoc,
         width: 64,
         height: 64
       })
+      // remote.BrowserWindow.getFocusedWindow()!.setBounds({
+      //   x: xLoc,
+      //   y: yLoc,
+      //   width: 64,
+      //   height: 64
+      // })
     }
   }
+
   handleMouseUp (e: MouseEvent) {
     this.dragging = false
     if (this.screenX === e.screenX && this.screenY === e.screenY) {
@@ -133,63 +177,11 @@ export default class extends Vue {
       }
     }
   }
+
   openContextMenu () {
-    this.menu!.popup()
-  }
-  buildMenu () {
-    const _this = this
-    const submenu = this.picBed.filter(item => item.visible).map(item => {
-      return {
-        label: item.name,
-        type: 'radio',
-        checked: this.$db.get('picBed.current') === item.type,
-        click () {
-          _this.letPicGoSaveData({
-            'picBed.current': item.type
-          })
-          ipcRenderer.send('syncPicBed')
-        }
-      }
-    })
-    const template = [
-      {
-        label: '打开详细窗口',
-        click () {
-          ipcRenderer.send('openSettingWindow')
-        }
-      },
-      {
-        label: '选择默认图床',
-        type: 'submenu',
-        submenu
-      },
-      {
-        label: '剪贴板图片上传',
-        click () {
-          ipcRenderer.send('uploadClipboardFilesFromUploadPage')
-        }
-      },
-      {
-        label: '隐藏窗口',
-        click () {
-          remote.BrowserWindow.getFocusedWindow()!.hide()
-        }
-      },
-      {
-        label: '重启应用',
-        click () {
-          remote.app.relaunch()
-          remote.app.exit(0)
-        }
-      },
-      {
-        role: 'quit',
-        label: '退出'
-      }
-    ]
-    // @ts-ignore
-    this.menu = remote.Menu.buildFromTemplate(template)
+    ipcRenderer.send(SHOW_MINI_PAGE_MENU)
   }
+
   beforeDestroy () {
     ipcRenderer.removeAllListeners('uploadProgress')
     ipcRenderer.removeListener('getPicBeds', this.getPicBeds)

src/renderer/pages/PicGoSetting.vue

@@ -1,114 +1,169 @@
 <template>
   <div id="picgo-setting">
     <div class="view-title">
-      PicGo设置 - <i class="el-icon-document" @click="goConfigPage"></i>
+      {{ $T('PICGO_SETTINGS') }} - <i class="el-icon-document" @click="goConfigPage"></i>
     </div>
     <el-row class="setting-list">
-      <el-col :span="15" :offset="4">
+      <el-col :span="20" :offset="2">
         <el-row>
         <el-form
-          label-width="120px"
-          label-position="right"
+          label-position="left"
+          label-width="10"
           size="small"
         >
           <el-form-item
-            label="打开配置文件"
+            :label="$T('SETTINGS_CHOOSE_LANGUAGE')"
           >
-            <el-button type="primary" round size="mini" @click="openFile('data.json')">点击打开</el-button>
+            <!-- <el-button type="primary" round size="mini" @click="openFile('data.json')">{{ $T('SETTINGS_CLICK_TO_OPEN') }}</el-button> -->
+            <el-select
+              v-model="currentLanguage"
+              size="mini"
+              style="width: 100%"
+              @change="handleLanguageChange"
+              :placeholder="$T('SETTINGS_CHOOSE_LANGUAGE')">
+              <el-option
+                v-for="item in languageList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
           </el-form-item>
           <el-form-item
-            label="设置日志文件"
+            :label="$T('SETTINGS_OPEN_CONFIG_FILE')"
           >
-            <el-button type="primary" round size="mini" @click="openLogSetting">点击设置</el-button>
+            <el-button type="primary" round size="mini" @click="openFile('data.json')">{{ $T('SETTINGS_CLICK_TO_OPEN') }}</el-button>
           </el-form-item>
           <el-form-item
-            label="修改快捷键"
+            :label="$T('SETTINGS_SET_LOG_FILE')"
           >
-            <el-button type="primary" round size="mini" @click="goShortCutPage">点击设置</el-button>
+            <el-button type="primary" round size="mini" @click="openLogSetting">{{ $T('SETTINGS_CLICK_TO_SET') }}</el-button>
           </el-form-item>
           <el-form-item
-            label="自定义链接格式"
+            :label="$T('SETTINGS_SET_SHORTCUT')"
           >
-            <el-button type="primary" round size="mini" @click="customLinkVisible = true">点击设置</el-button>
+            <el-button type="primary" round size="mini" @click="goShortCutPage">{{ $T('SETTINGS_CLICK_TO_SET') }}</el-button>
           </el-form-item>
           <el-form-item
-            label="设置代理"
+            :label="$T('SETTINGS_CUSTOM_LINK_FORMAT')"
           >
-            <el-button type="primary" round size="mini" @click="proxyVisible = true">点击设置</el-button>
+            <el-button type="primary" round size="mini" @click="customLinkVisible = true">{{ $T('SETTINGS_CLICK_TO_SET') }}</el-button>
           </el-form-item>
           <el-form-item
-            label="设置Server"
+            :label="$T('SETTINGS_SET_PROXY_AND_MIRROR')"
           >
-            <el-button type="primary" round size="mini" @click="serverVisible = true">点击设置</el-button>
+            <el-button type="primary" round size="mini" @click="proxyVisible = true">{{ $T('SETTINGS_CLICK_TO_SET') }}</el-button>
           </el-form-item>
           <el-form-item
-            label="检查更新"
+            :label="$T('SETTINGS_SET_SERVER')"
           >
-            <el-button type="primary" round size="mini" @click="checkUpdate">点击检查</el-button>
+            <el-button type="primary" round size="mini" @click="serverVisible = true">{{ $T('SETTINGS_CLICK_TO_SET') }}</el-button>
           </el-form-item>
           <el-form-item
-            label="打开更新助手"
+            :label="$T('SETTINGS_CHECK_UPDATE')"
+          >
+            <el-button type="primary" round size="mini" @click="checkUpdate">{{ $T('SETTINGS_CLICK_TO_CHECK') }}</el-button>
+          </el-form-item>
+          <el-form-item
+            :label="$T('SETTINGS_OPEN_UPDATE_HELPER')"
           >
             <el-switch
               v-model="form.updateHelper"
-              active-text="开"
-              inactive-text="关"
+              :active-text="$T('SETTINGS_OPEN')"
+              :inactive-text="$T('SETTINGS_CLOSE')"
               @change="updateHelperChange"
             ></el-switch>
           </el-form-item>
           <el-form-item
-            label="开机自启"
+            v-show="form.updateHelper"
+            :label="$T('SETTINGS_ACCEPT_BETA_UPDATE')"
+          >
+            <el-switch
+              v-model="form.checkBetaUpdate"
+              :active-text="$T('SETTINGS_OPEN')"
+              :inactive-text="$T('SETTINGS_CLOSE')"
+              @change="checkBetaUpdateChange"
+            ></el-switch>
+          </el-form-item>
+          <el-form-item
+            :label="$T('SETTINGS_LAUNCH_ON_BOOT')"
           >
             <el-switch
               v-model="form.autoStart"
-              active-text="开"
-              inactive-text="关"
+              :active-text="$T('SETTINGS_OPEN')"
+              :inactive-text="$T('SETTINGS_CLOSE')"
               @change="handleAutoStartChange"
             ></el-switch>
           </el-form-item>
           <el-form-item
-            label="上传前重命名"
+            :label="$T('SETTINGS_RENAME_BEFORE_UPLOAD')"
           >
             <el-switch
               v-model="form.rename"
-              active-text="开"
-              inactive-text="关"
+              :active-text="$T('SETTINGS_OPEN')"
+              :inactive-text="$T('SETTINGS_CLOSE')"
               @change="handleRename"
             ></el-switch>
           </el-form-item>
           <el-form-item
-            label="时间戳重命名"
+            :label="$T('SETTINGS_TIMESTAMP_RENAME')"
           >
             <el-switch
               v-model="form.autoRename"
-              active-text="开"
-              inactive-text="关"
+              :active-text="$T('SETTINGS_OPEN')"
+              :inactive-text="$T('SETTINGS_CLOSE')"
               @change="handleAutoRename"
             ></el-switch>
           </el-form-item>
           <el-form-item
-            label="开启上传提示"
+            :label="$T('SETTINGS_OPEN_UPLOAD_TIPS')"
           >
             <el-switch
               v-model="form.uploadNotification"
-              active-text="开"
-              inactive-text="关"
+              :active-text="$T('SETTINGS_OPEN')"
+              :inactive-text="$T('SETTINGS_CLOSE')"
               @change="handleUploadNotification"
             ></el-switch>
           </el-form-item>
           <el-form-item
             v-if="os !== 'darwin'"
-            label="Mini窗口置顶"
+            :label="$T('SETTINGS_MINI_WINDOW_ON_TOP')"
           >
             <el-switch
               v-model="form.miniWindowOntop"
-              active-text="开"
-              inactive-text="关"
+              :active-text="$T('SETTINGS_OPEN')"
+              :inactive-text="$T('SETTINGS_CLOSE')"
               @change="handleMiniWindowOntop"
             ></el-switch>
           </el-form-item>
           <el-form-item
-            label="选择显示的图床"
+            :label="$T('SETTINGS_AUTO_COPY_URL_AFTER_UPLOAD')"
+          >
+            <el-switch
+              v-model="form.autoCopyUrl"
+              :active-text="$T('SETTINGS_OPEN')"
+              :inactive-text="$T('SETTINGS_CLOSE')"
+              @change="handleAutoCopyUrl"
+            ></el-switch>
+          </el-form-item>
+          <el-form-item
+          >
+            <div class="el-form-item__custom-label" slot="label">
+             {{ $T('SETTINGS_USE_BUILTIN_CLIPBOARD_UPLOAD') }}
+            <el-tooltip class="item" effect="dark" :content="$T('BUILTIN_CLIPBOARD_TIPS')" placement="right">
+              <i class="el-icon-question"></i>
+            </el-tooltip>
+            </div>
+            <el-switch
+              v-model="form.useBuiltinClipboard"
+              :active-text="$T('SETTINGS_OPEN')"
+              :inactive-text="$T('SETTINGS_CLOSE')"
+              @change="useBuiltinClipboardChange"
+            ></el-switch>
+          </el-form-item>
+          <el-form-item
+            :style="{ marginRight: '-64px' }"
+            :label="$T('CHOOSE_SHOWED_PICBED')"
           >
             <el-checkbox-group
               v-model="form.showPicBedList"
@@ -126,7 +181,7 @@
       </el-col>
     </el-row>
     <el-dialog
-      title="自定义链接格式"
+      :title="$T('SETTINGS_CUSTOM_LINK_FORMAT')"
       :visible.sync="customLinkVisible"
       :modal-append-to-body="false"
     >
@@ -141,10 +196,10 @@
           prop="value"
         >
           <div class="custom-title">
-            用占位符 <b>$url</b> 来表示url的位置
+            {{ $T('SETTINGS_TIPS_PLACEHOLDER_URL') }}
           </div>
           <div class="custom-title">
-            用占位符 <b>$fileName</b> 来表示文件名的位置
+            {{ $T('SETTINGS_TIPS_PLACEHOLDER_FILENAME') }}
           </div>
           <el-input
             class="align-center"
@@ -154,61 +209,80 @@
         </el-form-item>
       </el-form>
       <div>
-        如[$fileName]($url)
+        {{ $T('SETTINGS_TIPS_SUCH_AS') }}[$fileName]($url)
       </div>
       <span slot="footer">
-        <el-button @click="cancelCustomLink" round>取消</el-button>
-        <el-button type="primary" @click="confirmCustomLink" round>确定</el-button>
+        <el-button @click="cancelCustomLink" round>{{ $T('CANCEL') }}</el-button>
+        <el-button type="primary" @click="confirmCustomLink" round>{{ $T('CONFIRM') }}</el-button>
       </span>
     </el-dialog>
     <el-dialog
-      title="设置代理"
+      :title="$T('SETTINGS_SET_PROXY_AND_MIRROR')"
       :visible.sync="proxyVisible"
       :modal-append-to-body="false"
+      width="70%"
     >
       <el-form
         label-position="right"
         :model="customLink"
         ref="customLink"
         :rules="rules"
-        label-width="80px"
+        label-width="120px"
       >
         <el-form-item
-          label="代理地址"
+          :label="$T('SETTINGS_UPLOAD_PROXY')"
         >
           <el-input
             v-model="proxy"
             :autofocus="true"
-            placeholder="例如：http://127.0.0.1:1080"
+            :placeholder="`${$T('SETTINGS_TIPS_SUCH_AS')}：http://127.0.0.1:1080`"
+          ></el-input>
+        </el-form-item>
+        <el-form-item
+          :label="$T('SETTINGS_PLUGIN_INSTALL_PROXY')"
+        >
+          <el-input
+            v-model="npmProxy"
+            :autofocus="true"
+            :placeholder="`${$T('SETTINGS_TIPS_SUCH_AS')}：http://127.0.0.1:1080`"
+          ></el-input>
+        </el-form-item>
+        <el-form-item
+          :label="$T('SETTINGS_PLUGIN_INSTALL_MIRROR')"
+        >
+          <el-input
+            v-model="npmRegistry"
+            :autofocus="true"
+            :placeholder="`${$T('SETTINGS_TIPS_SUCH_AS')}：https://registry.npm.taobao.org/`"
           ></el-input>
         </el-form-item>
       </el-form>
       <span slot="footer">
-        <el-button @click="cancelProxy" round>取消</el-button>
-        <el-button type="primary" @click="confirmProxy" round>确定</el-button>
+        <el-button @click="cancelProxy" round>{{ $T('CANCEL') }}</el-button>
+        <el-button type="primary" @click="confirmProxy" round>{{ $T('CONFIRM') }}</el-button>
       </span>
     </el-dialog>
     <el-dialog
-      title="检查更新"
+      :title="$T('SETTINGS_CHECK_UPDATE')"
       :visible.sync="checkUpdateVisible"
       :modal-append-to-body="false"
     >
       <div>
-        当前版本：{{ version }}
+        {{ $T('SETTINGS_CURRENT_VERSION') }}: {{ version }}
       </div>
       <div>
-        最新版本：{{ latestVersion ? latestVersion : '正在获取中...' }}
+        {{ $T('SETTINGS_NEWEST_VERSION') }}: {{ latestVersion ? latestVersion : `${$T('SETTINGS_GETING')}...` }}
       </div>
       <div v-if="needUpdate">
-        PicGo更新啦，请点击确定打开下载页面
+        {{ $T('SETTINGS_TIPS_HAS_NEW_VERSION') }}
       </div>
       <span slot="footer">
-        <el-button @click="cancelCheckVersion" round>取消</el-button>
-        <el-button type="primary" @click="confirmCheckVersion" round>确定</el-button>
+        <el-button @click="cancelCheckVersion" round>{{ $T('CANCEL') }}</el-button>
+        <el-button type="primary" @click="confirmCheckVersion" round>{{ $T('CONFIRM') }}</el-button>
       </span>
     </el-dialog>
     <el-dialog
-      title="设置日志文件"
+      :title="$T('SETTINGS_SET_LOG_FILE')"
       :visible.sync="logFileVisible"
       :modal-append-to-body="false"
     >
@@ -217,12 +291,12 @@
         label-width="100px"
       >
         <el-form-item
-          label="日志文件"
+          :label="$T('SETTINGS_LOG_FILE')"
         >
-          <el-button type="primary" round size="mini" @click="openFile('picgo.log')">点击打开</el-button>
+          <el-button type="primary" round size="mini" @click="openFile('picgo.log')">{{ $T('SETTINGS_CLICK_TO_OPEN') }}</el-button>
         </el-form-item>
         <el-form-item
-          label="日志记录等级"
+          :label="$T('SETTINGS_LOG_LEVEL')"
         >
           <el-select
             v-model="form.logLevel"
@@ -240,57 +314,57 @@
         </el-form-item>
       </el-form>
       <span slot="footer">
-        <el-button @click="cancelLogLevelSetting" round>取消</el-button>
-        <el-button type="primary" @click="confirmLogLevelSetting" round>确定</el-button>
+        <el-button @click="cancelLogLevelSetting" round>{{ $T('CANCEL') }}</el-button>
+        <el-button type="primary" @click="confirmLogLevelSetting" round>{{ $T('CONFIRM') }}</el-button>
       </span>
     </el-dialog>
     <el-dialog
       class="server-dialog"
       width="60%"
-      title="设置PicGo-Server"
+      :title="$T('SETTINGS_SET_PICGO_SERVER')"
       :visible.sync="serverVisible"
       :modal-append-to-body="false"
     >
       <div class="notice-text">
-        如果你不知道Server的作用，请阅读文档，或者不用修改配置。
+        {{ $T('SETTINGS_TIPS_SERVER_NOTICE') }}
       </div>
       <el-form
         label-position="right"
         label-width="120px"
       >
         <el-form-item
-          label="是否开启Server"
+          :label="$T('SETTINGS_ENABLE_SERVER')"
         >
           <el-switch
             v-model="server.enable"
-            active-text="开"
-            inactive-text="关"
+            :active-text="$T('SETTINGS_OPEN')"
+            :inactive-text="$T('SETTINGS_CLOSE')"
           ></el-switch>
         </el-form-item>
         <template v-if="server.enable">
           <el-form-item
-            label="设置监听地址"
+            :label="$T('SETTINGS_SET_SERVER_HOST')"
           >
             <el-input
               type="input"
               v-model="server.host"
-              placeholder="推荐默认地址:127.0.0.1"
+              :placeholder="$T('SETTINGS_TIP_PLACEHOLDER_HOST')"
             ></el-input>
           </el-form-item>
           <el-form-item
-            label="设置监听端口"
+            :label="$T('SETTINGS_SET_SERVER_PORT')"
           >
             <el-input
               type="number"
               v-model="server.port"
-              placeholder="推荐默认端口:36677"
+              :placeholder="$T('SETTINGS_TIP_PLACEHOLDER_PORT')"
             ></el-input>
           </el-form-item>
         </template>
       </el-form>
       <span slot="footer">
-        <el-button @click="cancelServerSetting" round>取消</el-button>
-        <el-button type="primary" @click="confirmServerSetting" round>确定</el-button>
+        <el-button @click="cancelServerSetting" round>{{ $T('CANCEL') }}</el-button>
+        <el-button type="primary" @click="confirmServerSetting" round>{{ $T('CONFIRM') }}</el-button>
       </span>
     </el-dialog>
   </div>
@@ -298,46 +372,50 @@
 <script lang="ts">
 import keyDetect from '@/utils/key-binding'
 import pkg from 'root/package.json'
-import path from 'path'
+import { IConfig } from 'picgo'
+import { PICGO_OPEN_FILE, OPEN_URL, CHANGE_LANGUAGE } from '#/events/constants'
 import {
-  ipcRenderer,
-  remote
+  ipcRenderer
 } from 'electron'
 import { Component, Vue } from 'vue-property-decorator'
-import db from '#/datastore'
+import { T, languageList } from '~/universal/i18n'
+// import db from '#/datastore'
 const releaseUrl = 'https://api.github.com/repos/Molunerfinn/PicGo/releases/latest'
 const releaseUrlBackup = 'https://cdn.jsdelivr.net/gh/Molunerfinn/PicGo@latest/package.json'
 const downloadUrl = 'https://github.com/Molunerfinn/PicGo/releases/latest'
 const customLinkRule = (rule: string, value: string, callback: (arg0?: Error) => void) => {
   if (!/\$url/.test(value)) {
-    return callback(new Error('必须含有$url'))
+    return callback(new Error(T('TIPS_MUST_CONTAINS_URL')))
   } else {
     return callback()
   }
 }
-let logLevel = db.get('settings.logLevel')
-if (!Array.isArray(logLevel)) {
-  if (logLevel && logLevel.length > 0) {
-    logLevel = [logLevel]
-  } else {
-    logLevel = ['all']
-  }
-}
 
 @Component({
   name: 'picgo-setting'
 })
 export default class extends Vue {
   form: ISettingForm = {
-    updateHelper: db.get('settings.showUpdateTip'),
+    updateHelper: false,
     showPicBedList: [],
-    autoStart: db.get('settings.autoStart') || false,
-    rename: db.get('settings.rename') || false,
-    autoRename: db.get('settings.autoRename') || false,
-    uploadNotification: db.get('settings.uploadNotification') || false,
-    miniWindowOntop: db.get('settings.miniWindowOntop') || false,
-    logLevel
+    autoStart: false,
+    rename: false,
+    autoRename: false,
+    uploadNotification: false,
+    miniWindowOntop: false,
+    logLevel: ['all'],
+    autoCopyUrl: true,
+    checkBetaUpdate: true,
+    useBuiltinClipboard: false,
+    language: 'zh-CN'
   }
+
+  languageList = languageList.map(item => ({
+    label: item,
+    value: item
+  }))
+
+  currentLanguage = 'zh-CN'
   picBed: IPicBedType[] = []
   logFileVisible = false
   keyBindingVisible = false
@@ -346,30 +424,37 @@ export default class extends Vue {
   serverVisible = false
   proxyVisible = false
   customLink = {
-    value: db.get('settings.customLink') || '$url'
+    value: '$url'
   }
+
   shortKey: IShortKeyMap = {
-    upload: db.get('settings.shortKey.upload')
+    upload: ''
   }
-  proxy = db.get('picBed.proxy') || ''
+
+  proxy = ''
+  npmRegistry = ''
+  npmProxy = ''
   rules = {
     value: [
       { validator: customLinkRule, trigger: 'blur' }
     ]
   }
+
   logLevel = {
-    all: '全部-All',
-    success: '成功-Success',
-    error: '错误-Error',
-    info: '普通-Info',
-    warn: '提醒-Warn',
-    none: '不记录日志-None'
+    all: this.$T('SETTINGS_LOG_LEVEL_ALL'),
+    success: this.$T('SETTINGS_LOG_LEVEL_SUCCESS'),
+    error: this.$T('SETTINGS_LOG_LEVEL_ERROR'),
+    info: this.$T('SETTINGS_LOG_LEVEL_INFO'),
+    warn: this.$T('SETTINGS_LOG_LEVEL_WARN'),
+    none: this.$T('SETTINGS_LOG_LEVEL_NONE')
   }
-  server = db.get('settings.server') || {
+
+  server = {
     port: 36677,
     host: '127.0.0.1',
     enable: true
   }
+
   version = pkg.version
   latestVersion = ''
   os = ''
@@ -381,40 +466,87 @@ export default class extends Vue {
       return false
     }
   }
+
   created () {
     this.os = process.platform
     ipcRenderer.send('getPicBeds')
     ipcRenderer.on('getPicBeds', this.getPicBeds)
+    this.initData()
   }
+
+  async initData () {
+    const config = (await this.getConfig<IConfig>())!
+    if (config !== undefined) {
+      const settings = config.settings || {}
+      const picBed = config.picBed
+      this.form.updateHelper = settings.showUpdateTip || false
+      this.form.autoStart = settings.autoStart || false
+      this.form.rename = settings.rename || false
+      this.form.autoRename = settings.autoRename || false
+      this.form.uploadNotification = settings.uploadNotification || false
+      this.form.miniWindowOntop = settings.miniWindowOntop || false
+      this.form.logLevel = this.initLogLevel(settings.logLevel || [])
+      this.form.autoCopyUrl = settings.autoCopy === undefined ? true : settings.autoCopy
+      this.form.checkBetaUpdate = settings.checkBetaUpdate === undefined ? true : settings.checkBetaUpdate
+      this.form.useBuiltinClipboard = settings.useBuiltinClipboard === undefined ? false : settings.useBuiltinClipboard
+      this.form.language = settings.language ?? 'zh-CN'
+      this.currentLanguage = settings.language ?? 'zh-CN'
+      this.customLink.value = settings.customLink || '$url'
+      this.shortKey.upload = settings.shortKey.upload
+      this.proxy = picBed.proxy || ''
+      this.npmRegistry = settings.registry || ''
+      this.npmProxy = settings.proxy || ''
+      this.server = settings.server || {
+        port: 36677,
+        host: '127.0.0.1',
+        enable: true
+      }
+    }
+  }
+
+  initLogLevel (logLevel: string | string[]) {
+    if (!Array.isArray(logLevel)) {
+      if (logLevel && logLevel.length > 0) {
+        logLevel = [logLevel]
+      } else {
+        logLevel = ['all']
+      }
+    }
+    return logLevel
+  }
+
   getPicBeds (event: Event, picBeds: IPicBedType[]) {
     this.picBed = picBeds
     this.form.showPicBedList = this.picBed.map(item => {
       if (item.visible) {
         return item.name
       }
-    }) as string[]
+      return null
+    }).filter(item => item) as string[]
   }
+
   openFile (file: string) {
-    const { app, shell } = remote
-    const STORE_PATH = app.getPath('userData')
-    const FILE = path.join(STORE_PATH, `/${file}`)
-    shell.openItem(FILE)
+    ipcRenderer.send(PICGO_OPEN_FILE, file)
   }
+
   openLogSetting () {
     this.logFileVisible = true
   }
+
   keyDetect (type: string, event: KeyboardEvent) {
     this.shortKey[type] = keyDetect(event).join('+')
   }
-  cancelCustomLink () {
+
+  async cancelCustomLink () {
     this.customLinkVisible = false
-    this.customLink.value = db.get('settings.customLink') || '$url'
+    this.customLink.value = await this.getConfig<string>('settings.customLink') || '$url'
   }
+
   confirmCustomLink () {
     // @ts-ignore
     this.$refs.customLink.validate((valid: boolean) => {
       if (valid) {
-        db.set('settings.customLink', this.customLink.value)
+        this.saveConfig('settings.customLink', this.customLink.value)
         this.customLinkVisible = false
         ipcRenderer.send('updateCustomLink')
       } else {
@@ -422,25 +554,39 @@ export default class extends Vue {
       }
     })
   }
-  cancelProxy () {
+
+  async cancelProxy () {
     this.proxyVisible = false
-    this.proxy = db.get('picBed.proxy') || undefined
+    this.proxy = await this.getConfig<string>('picBed.proxy') || ''
   }
+
   confirmProxy () {
     this.proxyVisible = false
-    this.letPicGoSaveData({
-      'picBed.proxy': this.proxy
+    this.saveConfig({
+      'picBed.proxy': this.proxy,
+      'settings.proxy': this.npmProxy,
+      'settings.registry': this.npmRegistry
     })
-    const successNotification = new Notification('设置代理', {
-      body: '设置成功'
+    const successNotification = new Notification(this.$T('SETTINGS_SET_PROXY_AND_MIRROR'), {
+      body: this.$T('TIPS_SET_SUCCEED')
     })
     successNotification.onclick = () => {
       return true
     }
   }
+
   updateHelperChange (val: boolean) {
-    db.set('settings.showUpdateTip', val)
+    this.saveConfig('settings.showUpdateTip', val)
   }
+
+  checkBetaUpdateChange (val: boolean) {
+    this.saveConfig('settings.checkBetaUpdate', val)
+  }
+
+  useBuiltinClipboardChange (val: boolean) {
+    this.saveConfig('settings.useBuiltinClipboard', val)
+  }
+
   handleShowPicBedListChange (val: string[]) {
     const list = this.picBed.map(item => {
       if (!val.includes(item.name)) {
@@ -450,25 +596,29 @@ export default class extends Vue {
       }
       return item
     })
-    this.letPicGoSaveData({
+    this.saveConfig({
       'picBed.list': list
     })
     ipcRenderer.send('getPicBeds')
   }
+
   handleAutoStartChange (val: boolean) {
-    db.set('settings.autoStart', val)
+    this.saveConfig('settings.autoStart', val)
     ipcRenderer.send('autoStart', val)
   }
+
   handleRename (val: boolean) {
-    this.letPicGoSaveData({
+    this.saveConfig({
       'settings.rename': val
     })
   }
+
   handleAutoRename (val: boolean) {
-    this.letPicGoSaveData({
+    this.saveConfig({
       'settings.autoRename': val
     })
   }
+
   compareVersion2Update (current: string, latest: string) {
     const currentVersion = current.split('.').map(item => parseInt(item))
     const latestVersion = latest.split('.').map(item => parseInt(item))
@@ -483,6 +633,7 @@ export default class extends Vue {
     }
     return false
   }
+
   checkUpdate () {
     this.checkUpdateVisible = true
     this.$http.get(releaseUrl)
@@ -493,44 +644,62 @@ export default class extends Vue {
           .then(res => {
             this.latestVersion = res.data.version
           }).catch(() => {
-            this.latestVersion = '网络错误暂时无法获取'
+            this.latestVersion = this.$T('TIPS_NETWORK_ERROR')
           })
       })
   }
+
   confirmCheckVersion () {
     if (this.needUpdate) {
-      remote.shell.openExternal(downloadUrl)
+      ipcRenderer.send(OPEN_URL, downloadUrl)
     }
     this.checkUpdateVisible = false
   }
+
   cancelCheckVersion () {
     this.checkUpdateVisible = false
   }
+
   handleUploadNotification (val: boolean) {
-    db.set('settings.uploadNotification', val)
+    this.saveConfig({
+      'settings.uploadNotification': val
+    })
   }
+
   handleMiniWindowOntop (val: boolean) {
-    db.set('settings.miniWindowOntop', val)
-    this.$message.info('需要重启生效')
+    this.saveConfig('settings.miniWindowOntop', val)
+    this.$message.info(this.$T('TIPS_NEED_RELOAD'))
   }
+
+  handleAutoCopyUrl (val: boolean) {
+    this.saveConfig('settings.autoCopy', val)
+    const successNotification = new Notification(this.$T('SETTINGS_AUTO_COPY_URL_AFTER_UPLOAD'), {
+      body: this.$T('TIPS_SET_SUCCEED')
+    })
+    successNotification.onclick = () => {
+      return true
+    }
+  }
+
   confirmLogLevelSetting () {
     if (this.form.logLevel.length === 0) {
-      return this.$message.error('请选择日志记录等级')
+      return this.$message.error(this.$T('TIPS_PLEASE_CHOOSE_LOG_LEVEL'))
     }
-    this.letPicGoSaveData({
+    this.saveConfig({
       'settings.logLevel': this.form.logLevel
     })
-    const successNotification = new Notification('设置日志', {
-      body: '设置成功'
+    const successNotification = new Notification(this.$T('SETTINGS_SET_LOG_FILE'), {
+      body: this.$T('TIPS_SET_SUCCEED')
     })
     successNotification.onclick = () => {
       return true
     }
     this.logFileVisible = false
   }
-  cancelLogLevelSetting () {
+
+  async cancelLogLevelSetting () {
     this.logFileVisible = false
-    let logLevel = db.get('settings.logLevel')
+    let logLevel = await this.getConfig<string | string[]>('settings.logLevel')
     if (!Array.isArray(logLevel)) {
       if (logLevel && logLevel.length > 0) {
         logLevel = [logLevel]
@@ -540,12 +709,15 @@ export default class extends Vue {
     }
     this.form.logLevel = logLevel
   }
+
   confirmServerSetting () {
-    this.letPicGoSaveData({
+    // @ts-ignore
+    this.server.port = parseInt(this.server.port, 10)
+    this.saveConfig({
       'settings.server': this.server
     })
-    const successNotification = new Notification('设置PicGo-Server', {
-      body: '设置成功'
+    const successNotification = new Notification(this.$T('SETTINGS_SET_PICGO_SERVER'), {
+      body: this.$T('TIPS_SET_SUCCEED')
     })
     successNotification.onclick = () => {
       return true
@@ -553,18 +725,20 @@ export default class extends Vue {
     this.serverVisible = false
     ipcRenderer.send('updateServer')
   }
-  cancelServerSetting () {
+
+  async cancelServerSetting () {
     this.serverVisible = false
-    this.server = db.get('settings.server') || {
+    this.server = await this.getConfig('settings.server') || {
       port: 36677,
       host: '127.0.0.1',
       enable: true
     }
   }
+
   handleLevelDisabled (val: string) {
-    let currentLevel = val
+    const currentLevel = val
     let flagLevel
-    let result = this.form.logLevel.some(item => {
+    const result = this.form.logLevel.some(item => {
       if (item === 'all' || item === 'none') {
         flagLevel = item
       }
@@ -581,12 +755,24 @@ export default class extends Vue {
     }
     return false
   }
-  goConfigPage () {
-    remote.shell.openExternal('https://picgo.github.io/PicGo-Doc/zh/guide/config.html#picgo设置')
+
+  handleLanguageChange (val: string) {
+    this.$i18n.setLanguage(val)
+    this.forceUpdate()
+    ipcRenderer.send(CHANGE_LANGUAGE, val)
+    this.saveConfig({
+      'settings.language': val
+    })
   }
+
+  goConfigPage () {
+    ipcRenderer.send(OPEN_URL, 'https://picgo.github.io/PicGo-Doc/zh/guide/config.html#picgo设置')
+  }
+
   goShortCutPage () {
     this.$router.push('shortKey')
   }
+
   beforeDestroy () {
     ipcRenderer.removeListener('getPicBeds', this.getPicBeds)
   }
@@ -611,10 +797,28 @@ export default class extends Vue {
     overflow-x hidden
   .setting-list
     .el-form
+      &-item
+        display: flex
+        justify-content space-between
+        padding-top 8px
+        padding-bottom 8px
+        border-bottom 1px solid darken(#eee, 50%)
+        margin-bottom 0
+        &:last-child
+          border-bottom none
+        &::after
+          display none
+        &::before
+          display none
       label
         line-height 32px
         padding-bottom 0
         color #eee
+        flex-basis: 50%
+        flex-shrink: 0
+      .el-form-item__custom-label
+        display flex
+        align-items center
       .el-button-group
         width 100%
         .el-button
@@ -628,9 +832,7 @@ export default class extends Vue {
         &.is-active
           color #409EFF
       .el-icon-question
-        font-size 20px
-        float right
-        margin-top 9px
+        margin-left 4px
         color #eee
         cursor pointer
         transition .2s color ease-in-out

src/renderer/pages/Plugin.vue

@@ -1,19 +1,25 @@
 <template>
   <div id="plugin-view">
     <div class="view-title">
-      插件设置 - <i class="el-icon-goods" @click="goAwesomeList"></i>
+      {{ $T('PLUGIN_SETTINGS') }} -
+      <el-tooltip :content="pluginListToolTip" placement="right">
+        <i class="el-icon-goods" @click="goAwesomeList"></i>
+      </el-tooltip>
+      <el-tooltip :content="importLocalPluginToolTip" placement="left">
+        <i class="el-icon-download" @click="handleImportLocalPlugin"/>
+      </el-tooltip>
     </div>
     <el-row class="handle-bar" :class="{ 'cut-width': pluginList.length > 6 }">
       <el-input
         v-model="searchText"
-        placeholder="搜索npm上的PicGo插件，或者点击上方按钮查看优秀插件列表"
+        :placeholder="$T('PLUGIN_SEARCH_PLACEHOLDER')"
         size="small"
       >
         <i slot="suffix" class="el-input__icon el-icon-close" v-if="searchText" @click="cleanSearch" style="cursor: pointer"></i>
       </el-input>
     </el-row>
     <el-row :gutter="10" class="plugin-list" v-loading="loading">
-      <el-col :span="12" v-for="item in pluginList" :key="item.name">
+      <el-col :span="12" v-for="item in pluginList" :key="item.fullName">
         <div class="plugin-item" :class="{ 'darwin': os === 'darwin' }">
           <div class="cli-only-badge" v-if="!item.gui" title="CLI only">CLI</div>
           <img class="plugin-item__logo" :src="item.logo"
@@ -37,19 +43,19 @@
                 <template v-if="searchText">
                   <template v-if="!item.hasInstall">
                     <span class="config-button install" v-if="!item.ing" @click="installPlugin(item)">
-                      安装
+                      {{ $T('PLUGIN_INSTALL') }}
                     </span>
                     <span v-else-if="item.ing" class="config-button ing">
-                      安装中
+                      {{ $T('PLUGIN_INSTALLING') }}
                     </span>
                   </template>
                   <span v-else class="config-button ing">
-                    已安装
+                    {{ $T('PLUGIN_INSTALLED') }}
                   </span>
                 </template>
                 <template v-else>
                   <span v-if="item.ing" class="config-button ing">
-                    进行中
+                    {{ $T('PLUGIN_DOING_SOMETHING') }}
                   </span>
                   <template v-else>
                     <i
@@ -71,12 +77,14 @@
       </el-col>
     </el-row>
     <el-row v-show="needReload" class="reload-mask" :class="{ 'cut-width': pluginList.length > 6 }">
-      <el-button type="primary" @click="reloadApp" size="mini" round>重启以生效</el-button>
+      <el-button type="primary" @click="reloadApp" size="mini" round>{{ $T('TIPS_NEED_RELOAD') }}</el-button>
     </el-row>
     <el-dialog
       :visible.sync="dialogVisible"
       :modal-append-to-body="false"
-      :title="`配置${configName}`"
+      :title="$T('CONFIG_THING', {
+        c: configName
+      })"
       width="70%"
     >
       <config-form
@@ -87,8 +95,8 @@
       >
       </config-form>
       <span slot="footer">
-        <el-button @click="dialogVisible = false" round>取消</el-button>
-        <el-button type="primary" @click="handleConfirmConfig" round>确定</el-button>
+        <el-button @click="dialogVisible = false" round>{{ $T('CANCEL') }}</el-button>
+        <el-button type="primary" @click="handleConfirmConfig" round>{{ $T('CONFIRM') }}</el-button>
       </span>
     </el-dialog>
   </div>
@@ -103,10 +111,17 @@ import ConfigForm from '@/components/ConfigForm.vue'
 import { debounce } from 'lodash'
 import {
   ipcRenderer,
-  remote,
   IpcRendererEvent
 } from 'electron'
-const { Menu } = remote
+import { handleStreamlinePluginName } from '~/universal/utils/common'
+import {
+  OPEN_URL,
+  RELOAD_APP,
+  PICGO_CONFIG_PLUGIN,
+  PICGO_HANDLE_PLUGIN_ING,
+  PICGO_TOGGLE_PLUGIN,
+  SHOW_PLUGIN_PAGE_MENU
+} from '#/events/constants'
 
 @Component({
   name: 'plugin',
@@ -125,6 +140,7 @@ export default class extends Vue {
   pluginNameList: string[] = []
   loading = true
   needReload = false
+  pluginListToolTip = this.$T('PLUGIN_LIST')importLocalPluginToolTip = this.$T('PLUGIN_IMPORT_LOCAL')
   id = ''
   os = ''
   defaultLogo: string = 'this.src="https://cdn.jsdelivr.net/gh/Molunerfinn/PicGo@dev/public/roundLogo.png"'
@@ -135,6 +151,7 @@ export default class extends Vue {
         ? `picgo-plugin-${this.searchText}`
         : this.searchText
   }
+
   @Watch('npmSearchText')
   onNpmSearchTextChange (val: string) {
     if (val) {
@@ -145,6 +162,7 @@ export default class extends Vue {
       this.getPluginList()
     }
   }
+
   @Watch('dialogVisible')
   onDialogVisible (val: boolean) {
     if (val) {
@@ -155,26 +173,33 @@ export default class extends Vue {
       document.querySelector('.main-content.el-row').style.zIndex = 10
     }
   }
-  created () {
+
+  async created () {
     this.os = process.platform
-    ipcRenderer.on('pluginList', (evt: IpcRendererEvent, list: IPicGoPlugin[]) => {
-      this.pluginList = list
-      this.pluginNameList = list.map(item => item.name)
+    ipcRenderer.on('hideLoading', () => {
       this.loading = false
     })
-    ipcRenderer.on('installSuccess', (evt: IpcRendererEvent, plugin: string) => {
+    ipcRenderer.on('pluginList', (evt: IpcRendererEvent, list: IPicGoPlugin[]) => {
+      this.pluginList = list
+      this.pluginNameList = list.map(item => item.fullName)
+      this.loading = false
+    })
+    ipcRenderer.on('installPlugin', (evt: IpcRendererEvent, { success, body }: {
+      success: boolean,
+      body: string
+    }) => {
       this.loading = false
       this.pluginList.forEach(item => {
-        if (item.name === plugin) {
+        if (item.fullName === body) {
           item.ing = false
-          item.hasInstall = true
+          item.hasInstall = success
         }
       })
     })
     ipcRenderer.on('updateSuccess', (evt: IpcRendererEvent, plugin: string) => {
       this.loading = false
       this.pluginList.forEach(item => {
-        if (item.name === plugin) {
+        if (item.fullName === plugin) {
           item.ing = false
           item.hasInstall = true
         }
@@ -186,7 +211,7 @@ export default class extends Vue {
     ipcRenderer.on('uninstallSuccess', (evt: IpcRendererEvent, plugin: string) => {
       this.loading = false
       this.pluginList = this.pluginList.filter(item => {
-        if (item.name === plugin) { // restore Uploader & Transformer after uninstalling
+        if (item.fullName === plugin) { // restore Uploader & Transformer after uninstalling
           if (item.config.transformer.name) {
             this.handleRestoreState('transformer', item.config.transformer.name)
           }
@@ -195,191 +220,131 @@ export default class extends Vue {
           }
           this.getPicBeds()
         }
-        return item.name !== plugin
+        return item.fullName !== plugin
       })
       this.pluginNameList = this.pluginNameList.filter(item => item !== plugin)
     })
+    ipcRenderer.on(PICGO_CONFIG_PLUGIN, (evt: IpcRendererEvent, currentType: string, configName: string, config: any) => {
+      this.currentType = currentType
+      this.configName = configName
+      this.dialogVisible = true
+      this.config = config
+    })
+    ipcRenderer.on(PICGO_HANDLE_PLUGIN_ING, (evt: IpcRendererEvent, fullName: string) => {
+      this.pluginList.forEach(item => {
+        if (item.fullName === fullName || (item.name === fullName)) {
+          item.ing = true
+        }
+      })
+      this.loading = true
+    })
+    ipcRenderer.on(PICGO_TOGGLE_PLUGIN, (evt: IpcRendererEvent, fullName: string, enabled: boolean) => {
+      const plugin = this.pluginList.find(item => item.fullName === fullName)
+      if (plugin) {
+        plugin.enabled = enabled
+        this.getPicBeds()
+        this.needReload = true
+      }
+    })
     this.getPluginList()
     this.getSearchResult = debounce(this.getSearchResult, 50)
-    this.needReload = this.$db.get('needReload')
+    this.needReload = await this.getConfig<boolean>('needReload') || false
   }
-  buildContextMenu (plugin: IPicGoPlugin) {
-    const _this = this
-    let menu = [{
-      label: '启用插件',
-      enabled: !plugin.enabled,
-      click () {
-        _this.letPicGoSaveData({
-          [`picgoPlugins.picgo-plugin-${plugin.name}`]: true
-        })
-        plugin.enabled = true
-        _this.getPicBeds()
-      }
-    }, {
-      label: '禁用插件',
-      enabled: plugin.enabled,
-      click () {
-        _this.letPicGoSaveData({
-          [`picgoPlugins.picgo-plugin-${plugin.name}`]: false
-        })
-        plugin.enabled = false
-        _this.getPicBeds()
-        if (plugin.config.transformer.name) {
-          _this.handleRestoreState('transformer', plugin.config.transformer.name)
-        }
-        if (plugin.config.uploader.name) {
-          _this.handleRestoreState('uploader', plugin.config.uploader.name)
-        }
-      }
-    }, {
-      label: '卸载插件',
-      click () {
-        _this.uninstallPlugin(plugin.name)
-      }
-    }, {
-      label: '更新插件',
-      click () {
-        _this.updatePlugin(plugin.name)
-      }
-    }]
-    for (let i in plugin.config) {
-      if (plugin.config[i].config.length > 0) {
-        const obj = {
-          label: `配置${i} - ${plugin.config[i].name}`,
-          click () {
-            _this.currentType = i
-            _this.configName = plugin.config[i].name
-            _this.dialogVisible = true
-            _this.config = plugin.config[i].config
-          }
-        }
-        menu.push(obj)
-      }
-    }
 
-    // handle transformer
-    if (plugin.config.transformer.name) {
-      let currentTransformer = this.$db.get('picBed.transformer') || 'path'
-      let pluginTransformer = plugin.config.transformer.name
-      const obj = {
-        label: `${currentTransformer === pluginTransformer ? '禁用' : '启用'}transformer - ${plugin.config.transformer.name}`,
-        click () {
-          _this.toggleTransformer(plugin.config.transformer.name)
-        }
-      }
-      menu.push(obj)
-    }
-
-    // plugin custom menus
-    if (plugin.guiMenu) {
-      menu.push({
-        // @ts-ignore
-        type: 'separator'
-      })
-      for (let i of plugin.guiMenu) {
-        menu.push({
-          label: i.label,
-          click () {
-            ipcRenderer.send('pluginActions', plugin.name, i.label)
-          }
-        })
-      }
-    }
-
-    this.menu = Menu.buildFromTemplate(menu)
-    this.menu.popup()
+  async buildContextMenu (plugin: IPicGoPlugin) {
+    ipcRenderer.send(SHOW_PLUGIN_PAGE_MENU, plugin)
   }
+
   getPluginList () {
     ipcRenderer.send('getPluginList')
   }
+
   getPicBeds () {
     ipcRenderer.send('getPicBeds')
   }
+
   installPlugin (item: IPicGoPlugin) {
     if (!item.gui) {
-      this.$confirm('该插件未对可视化界面进行优化, 是否继续安装?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
+      this.$confirm(this.$T('TIPS_PLUGIN_NOT_GUI_IMPLEMENT'), this.$T('TIPS_NOTICE'), {
+        confirmButtonText: this.$T('CONFIRM'),
+        cancelButtonText: this.$T('CANCEL'),
         type: 'warning'
       }).then(() => {
         item.ing = true
-        ipcRenderer.send('installPlugin', item.name)
+        ipcRenderer.send('installPlugin', item.fullName)
       }).catch(() => {
         console.log('Install canceled')
       })
     } else {
       item.ing = true
-      ipcRenderer.send('installPlugin', item.name)
+      ipcRenderer.send('installPlugin', item.fullName)
     }
   }
+
   uninstallPlugin (val: string) {
     this.pluginList.forEach(item => {
       if (item.name === val) {
         item.ing = true
       }
     })
+    this.loading = true
     ipcRenderer.send('uninstallPlugin', val)
   }
+
   updatePlugin (val: string) {
     this.pluginList.forEach(item => {
-      if (item.name === val) {
+      if (item.fullName === val) {
         item.ing = true
       }
     })
+    this.loading = true
     ipcRenderer.send('updatePlugin', val)
   }
+
   reloadApp () {
-    remote.app.relaunch()
-    remote.app.exit(0)
+    ipcRenderer.send(RELOAD_APP)
   }
-  handleReload () {
-    this.$db.set('needReload', true)
+
+  async handleReload () {
+    this.saveConfig({
+      needReload: true
+    })
     this.needReload = true
-    const successNotification = new Notification('更新成功', {
-      body: '请点击此通知重启应用以生效'
+    const successNotification = new Notification(this.$T('PLUGIN_UPDATE_SUCCEED'), {
+      body: this.$T('TIPS_NEED_RELOAD')
     })
     successNotification.onclick = () => {
       this.reloadApp()
     }
   }
+
   cleanSearch () {
     this.searchText = ''
   }
-  toggleTransformer (transformer: string) {
-    let currentTransformer = this.$db.get('picBed.transformer') || 'path'
-    if (currentTransformer === transformer) {
-      this.letPicGoSaveData({
-        'picBed.transformer': 'path'
-      })
-    } else {
-      this.letPicGoSaveData({
-        'picBed.transformer': transformer
-      })
-    }
-  }
+
   async handleConfirmConfig () {
     // @ts-ignore
     const result = await this.$refs.configForm.validate()
     if (result !== false) {
       switch (this.currentType) {
         case 'plugin':
-          this.letPicGoSaveData({
-            [`picgo-plugin-${this.configName}`]: result
+          this.saveConfig({
+            [`${this.configName}`]: result
           })
           break
         case 'uploader':
-          this.letPicGoSaveData({
+          this.saveConfig({
             [`picBed.${this.configName}`]: result
           })
           break
         case 'transformer':
-          this.letPicGoSaveData({
+          this.saveConfig({
             [`transformer.${this.configName}`]: result
           })
           break
       }
-      const successNotification = new Notification('设置结果', {
-        body: '设置成功'
+      const successNotification = new Notification(this.$T('SETTINGS_RESULT'), {
+        body: this.$T('TIPS_SET_SUCCEED')
       })
       successNotification.onclick = () => {
         return true
@@ -388,6 +353,7 @@ export default class extends Vue {
       this.getPluginList()
     }
   }
+
   getSearchResult (val: string) {
     // this.$http.get(`https://api.npms.io/v2/search?q=${val}`)
     this.$http.get(`https://registry.npmjs.com/-/v1/search?text=${val}`)
@@ -406,8 +372,9 @@ export default class extends Vue {
         this.loading = false
       })
   }
+
   handleSearchResult (item: INPMSearchResultObject) {
-    const name = item.package.name.replace(/picgo-plugin-/, '')
+    const name = handleStreamlinePluginName(item.package.name)
     let gui = false
     if (item.package.keywords && item.package.keywords.length > 0) {
       if (item.package.keywords.includes('picgo-gui-plugin')) {
@@ -416,52 +383,65 @@ export default class extends Vue {
     }
     return {
       name: name,
+      fullName: item.package.name,
       author: item.package.author.name,
       description: item.package.description,
       logo: `https://cdn.jsdelivr.net/npm/${item.package.name}/logo.png`,
       config: {},
       homepage: item.package.links ? item.package.links.homepage : '',
-      hasInstall: this.pluginNameList.some(plugin => plugin === item.package.name.replace(/picgo-plugin-/, '')),
+      hasInstall: this.pluginNameList.some(plugin => plugin === item.package.name),
       version: item.package.version,
       gui,
       ing: false // installing or uninstalling
     }
   }
+
   // restore Uploader & Transformer
-  handleRestoreState (item: string, name: string) {
+  async handleRestoreState (item: string, name: string) {
     if (item === 'uploader') {
-      const current = this.$db.get('picBed.current')
+      const current = await this.getConfig('picBed.current')
       if (current === name) {
-        this.letPicGoSaveData({
-          'picBed.current': 'smms'
+        this.saveConfig({
+          'picBed.current': 'smms',
+          'picBed.uploader': 'smms'
         })
       }
     }
     if (item === 'transformer') {
-      const current = this.$db.get('picBed.transformer')
+      const current = await this.getConfig('picBed.transformer')
       if (current === name) {
-        this.letPicGoSaveData({
+        this.saveConfig({
           'picBed.transformer': 'path'
         })
       }
     }
   }
+
   openHomepage (url: string) {
     if (url) {
-      remote.shell.openExternal(url)
+      ipcRenderer.send(OPEN_URL, url)
     }
   }
+
   goAwesomeList () {
-    remote.shell.openExternal('https://github.com/PicGo/Awesome-PicGo')
+    ipcRenderer.send(OPEN_URL, 'https://github.com/PicGo/Awesome-PicGo')
   }
-  letPicGoSaveData (data: IObj) {
+
+  saveConfig (data: IObj) {
     ipcRenderer.send('picgoSaveData', data)
   }
+
+  handleImportLocalPlugin () {
+    ipcRenderer.send('importLocalPlugin')
+    this.loading = true
+  }
+
   beforeDestroy () {
     ipcRenderer.removeAllListeners('pluginList')
-    ipcRenderer.removeAllListeners('installSuccess')
+    ipcRenderer.removeAllListeners('installPlugin')
     ipcRenderer.removeAllListeners('uninstallSuccess')
     ipcRenderer.removeAllListeners('updateSuccess')
+    ipcRenderer.removeAllListeners('hideLoading')
   }
 }
 </script>
@@ -491,6 +471,7 @@ $darwinBg = #172426
     font-size 20px
     text-align center
     margin 10px auto
+    position relative
     i.el-icon-goods
       font-size 20px
       vertical-align middle
@@ -498,6 +479,16 @@ $darwinBg = #172426
       transition color .2s ease-in-out
       &:hover
         color #49B1F5
+    i.el-icon-download
+      position absolute
+      right 0
+      top 8px
+      font-size 20px
+      vertical-align middle
+      cursor pointer
+      transition color .2s ease-in-out
+      &:hover
+        color #49B1F5
   .handle-bar
     margin-bottom 20px
     &.cut-width

src/renderer/pages/RenamePage.vue

@@ -4,7 +4,7 @@
       @submit.native.prevent
     >
       <el-form-item
-        label="文件改名"
+        :label="$T('FILE_RENAME')"
       >
         <el-input
           v-model="fileName"
@@ -15,13 +15,14 @@
     </el-form>
     <el-row>
       <div class="pull-right">
-        <el-button @click="cancel" round size="mini">取消</el-button>
-        <el-button type="primary" @click="confirmName" round size="mini">确定</el-button>
+        <el-button @click="cancel" round size="mini">{{ $T('CANCEL') }}</el-button>
+        <el-button type="primary" @click="confirmName" round size="mini">{{ $T('CONFIRM') }}</el-button>
       </div>
     </el-row>
   </div>
 </template>
 <script lang="ts">
+import { RENAME_FILE_NAME } from '#/events/constants'
 import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/mixin'
 import {
@@ -34,19 +35,25 @@ import {
 })
 export default class extends Vue {
   fileName: string = ''
+  originName: string = ''
   id: string | null = null
   created () {
-    ipcRenderer.on('rename', (event: IpcRendererEvent, name: string, id: string) => {
-      this.fileName = name
+    ipcRenderer.on(RENAME_FILE_NAME, (event: IpcRendererEvent, newName: string, originName: string, id: string) => {
+      this.fileName = newName
+      this.originName = originName
       this.id = id
     })
   }
+
   confirmName () {
-    ipcRenderer.send(`rename${this.id}`, this.fileName)
+    ipcRenderer.send(`${RENAME_FILE_NAME}${this.id}`, this.fileName)
   }
+
   cancel () {
-    ipcRenderer.send(`rename${this.id}`, null)
+    // if cancel, use origin file name
+    ipcRenderer.send(`${RENAME_FILE_NAME}${this.id}`, this.originName)
   }
+
   beforeDestroy () {
     ipcRenderer.removeAllListeners('rename')
   }

src/renderer/pages/ShortKey.vue

@@ -1,16 +1,19 @@
 <template>
   <div id="shortcut-page">
     <div class="view-title">
-      快捷键设置
+      {{ $T('SETTINGS_SET_SHORTCUT') }}
     </div>
     <el-row>
       <el-col :span="20" :offset="2">
         <el-table
+          class="shortcut-page-table-border"
           :data="list"
           size="mini"
+          header-cell-class-name="shortcut-page-table-border"
+          cell-class-name="shortcut-page-table-border"
         >
           <el-table-column
-            label="快捷键名称"
+            :label="$T('SHORTCUT_NAME')"
           >
             <template slot-scope="scope">
               {{ scope.row.label ? scope.row.label : scope.row.name }}
@@ -18,24 +21,24 @@
           </el-table-column>
           <el-table-column
             width="160px"
-            label="快捷键绑定"
+            :label="$T('SHORTCUT_BIND')"
             prop="key"
           >
           </el-table-column>
           <el-table-column
-            label="状态"
+            :label="$T('SHORTCUT_STATUS')"
           >
             <template slot-scope="scope">
               <el-tag
                 size="mini"
                 :type="scope.row.enable ? 'success' : 'danger'"
               >
-                {{ scope.row.enable ? '已启用' : '已禁用' }}
+                {{ scope.row.enable ? $T('SHORTCUT_ENABLED') : $T('SHORTCUT_DISABLED') }}
               </el-tag>
             </template>
           </el-table-column>
           <el-table-column
-            label="来源"
+            :label="$T('SHORTCUT_SOURCE')"
             width="100px"
           >
             <template slot-scope="scope">
@@ -43,7 +46,7 @@
             </template>
           </el-table-column>
           <el-table-column
-            label="操作"
+            :label="$T('SHORTCUT_HANDLE')"
           >
             <template slot-scope="scope">
               <el-button
@@ -53,14 +56,14 @@
                   disabled: scope.row.enable
                 }"
                 type="text">
-                {{ scope.row.enable ? '禁用' : '启用' }}
+                {{ scope.row.enable ? $T('SHORTCUT_DISABLE') : $T('SHORTCUT_ENABLE') }}
               </el-button>
               <el-button
                 class="edit"
                 size="mini"
                 @click="openKeyBindingDialog(scope.row, scope.$index)"
                 type="text">
-                编辑
+                {{ $T('SHORTCUT_EDIT') }}
               </el-button>
             </template>
           </el-table-column>
@@ -68,7 +71,7 @@
       </el-col>
     </el-row>
     <el-dialog
-      title="修改上传快捷键"
+      :title="$T('SHORTCUT_CHANGE_UPLOAD')"
       :visible.sync="keyBindingVisible"
       :modal-append-to-body="false"
     >
@@ -76,9 +79,7 @@
         label-position="top"
         label-width="80px"
       >
-        <el-form-item
-          label="快捷上传"
-        >
+        <el-form-item>
           <el-input
             class="align-center"
             @keydown.native.prevent="keyDetect($event)"
@@ -88,8 +89,12 @@
         </el-form-item>
       </el-form>
       <span slot="footer">
-        <el-button @click="cancelKeyBinding" round>取消</el-button>
-        <el-button type="primary" @click="confirmKeyBinding" round>确定</el-button>
+        <el-button @click="cancelKeyBinding" round>
+          {{ $T('CANCEL') }}
+        </el-button>
+        <el-button type="primary" @click="confirmKeyBinding" round>
+          {{ $T('CONFIRM') }}
+        </el-button>
       </span>
     </el-dialog>
   </div>
@@ -98,6 +103,7 @@
 import { Component, Vue, Watch } from 'vue-property-decorator'
 import keyDetect from '@/utils/key-binding'
 import { ipcRenderer, IpcRendererEvent } from 'electron'
+import { TOGGLE_SHORTKEY_MODIFIED_MODE } from '#/events/constants'
 
 @Component({
   name: 'shortkey-page'
@@ -108,8 +114,8 @@ export default class extends Vue {
   command = ''
   shortKey = ''
   currentIndex = 0
-  created () {
-    const shortKeyConfig = this.$db.get('settings.shortKey') as IShortKeyConfigs
+  async created () {
+    const shortKeyConfig = (await this.getConfig<IShortKeyConfigs>('settings.shortKey'))!
     this.list = Object.keys(shortKeyConfig).map(item => {
       return {
         ...shortKeyConfig[item],
@@ -117,40 +123,45 @@ export default class extends Vue {
       }
     })
   }
+
   @Watch('keyBindingVisible')
   onKeyBindingVisibleChange (val: boolean) {
-    ipcRenderer.send('toggleShortKeyModifiedMode', val)
+    ipcRenderer.send(TOGGLE_SHORTKEY_MODIFIED_MODE, val)
   }
+
   calcOrigin (item: string) {
     const [origin] = item.split(':')
     return origin
   }
+
   calcOriginShowName (item: string) {
     return item.replace('picgo-plugin-', '')
   }
+
   toggleEnable (item: IShortKeyConfig) {
     const status = !item.enable
     item.enable = status
-    // this.$db.set(`settings.shortKey.${item.name}.enable`, status)
     ipcRenderer.send('bindOrUnbindShortKey', item, item.from)
   }
+
   keyDetect (event: KeyboardEvent) {
     this.shortKey = keyDetect(event).join('+')
   }
-  openKeyBindingDialog (config: IShortKeyConfig, index: number) {
+
+  async openKeyBindingDialog (config: IShortKeyConfig, index: number) {
     this.command = `${config.from}:${config.name}`
-    this.shortKey = this.$db.get(`settings.shortKey.${this.command}.key`)
+    this.shortKey = await this.getConfig(`settings.shortKey.${this.command}.key`) || ''
     this.currentIndex = index
     this.keyBindingVisible = true
   }
-  cancelKeyBinding () {
+
+  async cancelKeyBinding () {
     this.keyBindingVisible = false
-    this.shortKey = this.$db.get(`settings.shortKey.${this.command}.key`)
+    this.shortKey = await this.getConfig<string>(`settings.shortKey.${this.command}.key`) || ''
   }
-  confirmKeyBinding () {
-    const oldKey = this.$db.get(`settings.shortKey.${this.command}.key`)
-    // this.$db.set(`settings.shortKey.${this.command}.key`, this.shortKey)
-    // const newKey = this.$db.get(`settings.shortKey.${this.command}`)
+
+  async confirmKeyBinding () {
+    const oldKey = await this.getConfig<string>(`settings.shortKey.${this.command}.key`)
     const config = Object.assign({}, this.list[this.currentIndex])
     config.key = this.shortKey
     ipcRenderer.send('updateShortKey', config, oldKey, config.from)
@@ -161,13 +172,16 @@ export default class extends Vue {
       }
     })
   }
+
   beforeDestroy () {
-    ipcRenderer.send('toggleShortKeyModifiedMode', false)
+    ipcRenderer.send(TOGGLE_SHORTKEY_MODIFIED_MODE, false)
   }
 }
 </script>
 <style lang='stylus'>
 #shortcut-page
+  .shortcut-page-table-border
+    border-color darken(#eee, 50%)
   .el-dialog__body
     padding 10px 20px
     .el-form-item
@@ -180,6 +194,8 @@ export default class extends Vue {
   .el-table
     background-color: transparent
     color #ddd
+    &::before
+      background-color darken(#eee, 50%)
     thead
       color #bbb
     th,tr

src/renderer/pages/TrayPage.vue

@@ -3,7 +3,7 @@
     <!-- <div class="header-arrow"></div> -->
     <div class="content">
       <div class="wait-upload-img" v-if="clipboardFiles.length > 0">
-        <div class="list-title">等待上传</div>
+        <div class="list-title">{{ $T('WAIT_TO_UPLOAD') }}</div>
         <div v-for="(item, index) in clipboardFiles" :key="index" class="img-list">
           <div
             class="upload-img__container"
@@ -14,7 +14,7 @@
         </div>
       </div>
       <div class="uploaded-img">
-        <div class="list-title">已上传</div>
+        <div class="list-title">{{ $T('ALREADY_UPLOAD') }}</div>
         <div v-for="item in files" :key="item.imgUrl" class="img-list">
           <div class="upload-img__container" @click="copyTheLink(item)">
             <img :src="item.imgUrl" class="upload-img">
@@ -28,41 +28,46 @@
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/mixin'
-import pasteTemplate from '#/utils/pasteTemplate'
-import { ipcRenderer, clipboard } from 'electron'
+import { ipcRenderer } from 'electron'
+import { IResult } from '@picgo/store/dist/types'
+import { PASTE_TEXT } from '#/events/constants'
+
 @Component({
   name: 'tray-page',
   mixins: [mixin]
 })
 export default class extends Vue {
-  files = []
+  files: IResult<ImgInfo>[] = []
   notification = {
-    title: '复制链接成功',
+    title: this.$T('COPY_LINK_SUCCEED'),
     body: '',
     icon: ''
   }
+
   clipboardFiles: ImgInfo[] = []
   uploadFlag = false
   get reverseList () {
     return this.files.slice().reverse()
   }
-  getData () {
-    // @ts-ignore
-    this.files = this.$db.read().get('uploaded').slice().reverse().slice(0, 5).value()
+
+  async getData () {
+    this.files = (await this.$$db.get<ImgInfo>({ orderBy: 'desc', limit: 5 })).data
   }
-  copyTheLink (item: ImgInfo) {
+
+  async copyTheLink (item: ImgInfo) {
     this.notification.body = item.imgUrl!
     this.notification.icon = item.imgUrl!
     const myNotification = new Notification(this.notification.title, this.notification)
-    const pasteStyle = this.$db.get('settings.pasteStyle') || 'markdown'
-    clipboard.writeText(pasteTemplate(pasteStyle, item))
+    ipcRenderer.invoke(PASTE_TEXT, item)
     myNotification.onclick = () => {
       return true
     }
   }
+
   calcHeight (width: number, height: number): number {
     return height * 160 / width
   }
+
   disableDragFile () {
     window.addEventListener('dragover', (e) => {
       e = e || event
@@ -73,6 +78,7 @@ export default class extends Vue {
       e.preventDefault()
     }, false)
   }
+
   uploadClipboardFiles () {
     if (this.uploadFlag) {
       return
@@ -80,29 +86,30 @@ export default class extends Vue {
     this.uploadFlag = true
     ipcRenderer.send('uploadClipboardFiles')
   }
+
   mounted () {
     this.disableDragFile()
     this.getData()
-    ipcRenderer.on('dragFiles', (event: Event, files: string[]) => {
-      files.forEach(item => {
-        this.$db.insert('uploaded', item)
-      })
-      // @ts-ignore
-      this.files = this.$db.read().get('uploaded').slice().reverse().slice(0, 5).value()
+    ipcRenderer.on('dragFiles', async (event: Event, files: string[]) => {
+      for (let i = 0; i < files.length; i++) {
+        const item = files[i]
+        await this.$$db.insert(item)
+      }
+      this.files = (await this.$$db.get<ImgInfo>({ orderBy: 'desc', limit: 5 })).data
     })
     ipcRenderer.on('clipboardFiles', (event: Event, files: ImgInfo[]) => {
       this.clipboardFiles = files
     })
-    ipcRenderer.on('uploadFiles', (event: Event) => {
-      // @ts-ignore
-      this.files = this.$db.read().get('uploaded').slice().reverse().slice(0, 5).value()
+    ipcRenderer.on('uploadFiles', async () => {
+      this.files = (await this.$$db.get<ImgInfo>({ orderBy: 'desc', limit: 5 })).data
       console.log(this.files)
       this.uploadFlag = false
     })
-    ipcRenderer.on('updateFiles', (event: Event) => {
+    ipcRenderer.on('updateFiles', () => {
       this.getData()
     })
   }
+
   beforeDestroy () {
     ipcRenderer.removeAllListeners('dragFiles')
     ipcRenderer.removeAllListeners('clipboardFiles')

src/renderer/pages/Upload.vue

@@ -3,7 +3,7 @@
     <el-row :gutter="16">
       <el-col :span="20" :offset="2">
         <div class="view-title">
-          图片上传 - {{ picBedName }} <i class="el-icon-caret-bottom" @click="handleChangePicBed"></i>
+          {{ $T('PICTURE_UPLOAD') }} - {{ picBedName }} <i class="el-icon-caret-bottom" @click="handleChangePicBed"></i>
         </div>
         <div
           id="upload-area"
@@ -15,7 +15,7 @@
           <div id="upload-dragger" @click="openUplodWindow">
             <i class="el-icon-upload"></i>
             <div class="upload-dragger__text">
-              将文件拖到此处，或 <span>点击上传</span>
+              {{ $T('DRAG_FILE_TO_HERE') }} <span>{{ $T('CLICK_TO_UPLOAD') }}</span>
             </div>
             <input type="file" id="file-uploader" @change="onChange" multiple>
           </div>
@@ -30,7 +30,7 @@
         <div class="paste-style">
           <div class="el-col-16">
             <div class="paste-style__text">
-              链接格式
+              {{ $T('LINK_FORMAT') }}
             </div>
             <el-radio-group v-model="pasteStyle" size="mini"
               @change="handlePasteStyleChange"
@@ -41,14 +41,15 @@
               <el-radio-button label="HTML"></el-radio-button>
               <el-radio-button label="URL"></el-radio-button>
               <el-radio-button label="UBB"></el-radio-button>
-              <el-radio-button label="Custom" title="自定义"></el-radio-button>
+              <el-radio-button label="Custom" :title="$T('CUSTOM')"></el-radio-button>
             </el-radio-group>
           </div>
           <div class="el-col-8">
             <div class="paste-style__text">
-              快捷上传
+              {{ $T('QUICK_UPLOAD') }}
             </div>
-            <el-button type="primary" round size="mini" @click="uploadClipboardFiles" class="paste-upload">剪贴板图片上传</el-button>
+            <el-button type="primary" round size="mini" @click="uploadClipboardFiles" class="quick-upload" style="width: 50%">{{ $T('CLIPBOARD_PICTURE') }}</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>
@@ -59,10 +60,16 @@
 import { Component, Vue, Watch } from 'vue-property-decorator'
 import {
   ipcRenderer,
-  IpcRendererEvent,
-  remote
+  IpcRendererEvent
 } from 'electron'
-const { Menu } = remote
+import {
+  SHOW_INPUT_BOX,
+  SHOW_INPUT_BOX_RESPONSE,
+  SHOW_UPLOAD_PAGE_MENU
+} from '~/universal/events/constants'
+import {
+  isUrl
+} from '~/universal/utils/common'
 @Component({
   name: 'upload'
 })
@@ -74,7 +81,6 @@ export default class extends Vue {
   pasteStyle = ''
   picBed: IPicBedType[] = []
   picBedName = ''
-  menu: Electron.Menu | null= null
   mounted () {
     ipcRenderer.on('uploadProgress', (event: IpcRendererEvent, progress: number) => {
       if (progress !== -1) {
@@ -92,7 +98,9 @@ export default class extends Vue {
     })
     ipcRenderer.send('getPicBeds')
     ipcRenderer.on('getPicBeds', this.getPicBeds)
+    this.$bus.$on(SHOW_INPUT_BOX_RESPONSE, this.handleInputBoxValue)
   }
+
   @Watch('progress')
   onProgressChange (val: number) {
     if (val === 100) {
@@ -105,26 +113,60 @@ export default class extends Vue {
       }, 1200)
     }
   }
+
   beforeDestroy () {
+    this.$bus.$off(SHOW_INPUT_BOX_RESPONSE)
     ipcRenderer.removeAllListeners('uploadProgress')
     ipcRenderer.removeAllListeners('syncPicBed')
     ipcRenderer.removeListener('getPicBeds', this.getPicBeds)
   }
+
   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(this.$T('TIPS_DRAG_VALID_PICTURE_OR_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(this.$T('TIPS_DRAG_VALID_PICTURE_OR_URL'))
+    }
+  }
+
   openUplodWindow () {
     document.getElementById('file-uploader')!.click()
   }
+
   onChange (e: any) {
     this.ipcSendFiles(e.target.files);
     (document.getElementById('file-uploader') as HTMLInputElement).value = ''
   }
+
   ipcSendFiles (files: FileList) {
-    let sendFiles: IFileWithPath[] = []
-    Array.from(files).forEach((item, index) => {
-      let obj = {
+    const sendFiles: IFileWithPath[] = []
+    Array.from(files).forEach((item) => {
+      const obj = {
         name: item.name,
         path: item.path
       }
@@ -132,49 +174,57 @@ export default class extends Vue {
     })
     ipcRenderer.send('uploadChoosedFiles', sendFiles)
   }
-  getPasteStyle () {
-    this.pasteStyle = this.$db.get('settings.pasteStyle') || 'markdown'
+
+  async getPasteStyle () {
+    this.pasteStyle = await this.getConfig('settings.pasteStyle') || 'markdown'
   }
+
   handlePasteStyleChange (val: string) {
-    this.$db.set('settings.pasteStyle', val)
+    this.saveConfig({
+      'settings.pasteStyle': val
+    })
   }
+
   uploadClipboardFiles () {
     ipcRenderer.send('uploadClipboardFilesFromUploadPage')
   }
-  getDefaultPicBed () {
-    const current: string = this.$db.get('picBed.current')
+
+  async uploadURLFiles () {
+    const str = await navigator.clipboard.readText()
+    this.$bus.$emit(SHOW_INPUT_BOX, {
+      value: isUrl(str) ? str : '',
+      title: this.$T('TIPS_INPUT_URL'),
+      placeholder: this.$T('TIPS_HTTP_PREFIX')
+    })
+  }
+
+  handleInputBoxValue (val: string) {
+    if (val === '') return false
+    if (isUrl(val)) {
+      ipcRenderer.send('uploadChoosedFiles', [{
+        path: val
+      }])
+    } else {
+      this.$message.error(this.$T('TIPS_INPUT_VALID_URL'))
+    }
+  }
+
+  async getDefaultPicBed () {
+    const currentPicBed = await this.getConfig<string>('picBed.current')
     this.picBed.forEach(item => {
-      if (item.type === current) {
+      if (item.type === currentPicBed) {
         this.picBedName = item.name
       }
     })
   }
+
   getPicBeds (event: Event, picBeds: IPicBedType[]) {
     this.picBed = picBeds
     this.getDefaultPicBed()
   }
-  handleChangePicBed () {
-    this.buildMenu()
-    // this.menu.popup(remote.getCurrentWindow())
-    this.menu!.popup()
-  }
-  buildMenu () {
-    const _this = this
-    const submenu = this.picBed.filter(item => item.visible).map(item => {
-      return {
-        label: item.name,
-        type: 'radio',
-        checked: this.$db.get('picBed.current') === item.type,
-        click () {
-          _this.letPicGoSaveData({
-            'picBed.current': item.type
-          })
-          ipcRenderer.send('syncPicBed')
-        }
-      }
-    })
-    // @ts-ignore
-    this.menu = Menu.buildFromTemplate(submenu)
+
+  async handleChangePicBed () {
+    ipcRenderer.send(SHOW_UPLOAD_PAGE_MENU)
   }
 }
 </script>
@@ -239,8 +289,6 @@ export default class extends Vue {
     .el-radio-button__inner
       border-left none
       border-radius 0 14px 14px 0
-  .paste-upload
-    width 100%
   .el-icon-caret-bottom
     cursor pointer
 </style>

src/renderer/pages/picbeds/AliYun.vue

@@ -86,17 +86,19 @@ export default class extends Vue {
     customUrl: '',
     options: ''
   }
-  created () {
-    const config = this.$db.get('picBed.aliyun') as IAliYunConfig
+
+  async created () {
+    const config = await this.getConfig<IAliYunConfig>('picBed.aliyun')
     if (config) {
       this.form = Object.assign({}, config)
     }
   }
+
   confirm () {
     // @ts-ignore
     this.$refs.aliyun.validate((valid) => {
       if (valid) {
-        this.letPicGoSaveData({
+        this.saveConfig({
           'picBed.aliyun': this.form
         })
         const successNotification = new window.Notification('设置结果', {

src/renderer/pages/picbeds/GitHub.vue

@@ -25,7 +25,7 @@
             :rules="{
               required: true, message: '分支名不能为空', trigger: 'blur'
             }">
-            <el-input v-model="form.branch" @keyup.native.enter="confirm" placeholder="例如：master"></el-input>
+            <el-input v-model="form.branch" @keyup.native.enter="confirm" placeholder="例如：main"></el-input>
           </el-form-item>
           <el-form-item
             label="设定Token"
@@ -71,17 +71,19 @@ export default class extends Vue {
     customUrl: '',
     branch: ''
   }
-  created () {
-    const config = this.$db.get('picBed.github') as IGitHubConfig
+
+  async created () {
+    const config = await this.getConfig<IGitHubConfig>('picBed.github')
     if (config) {
       this.form = Object.assign({}, config)
     }
   }
+
   confirm () {
     // @ts-ignore
     this.$refs.github.validate((valid) => {
       if (valid) {
-        this.letPicGoSaveData({
+        this.saveConfig({
           'picBed.github': this.form
         })
         const successNotification = new Notification('设置结果', {

src/renderer/pages/picbeds/Imgur.vue

@@ -48,17 +48,19 @@ export default class extends Vue {
     clientId: '',
     proxy: ''
   }
-  created () {
-    const config = this.$db.get('picBed.imgur') as IImgurConfig
+
+  async created () {
+    const config = await this.getConfig<IImgurConfig>('picBed.imgur')
     if (config) {
       this.form = Object.assign({}, config)
     }
   }
+
   confirm () {
     // @ts-ignore
     this.$refs.imgur.validate((valid) => {
       if (valid) {
-        this.letPicGoSaveData({
+        this.saveConfig({
           'picBed.imgur': this.form
         })
         const successNotification = new Notification('设置结果', {

src/renderer/pages/picbeds/Others.vue

@@ -1,9 +1,9 @@
 <template>
   <div id="others-view">
-    <el-row :gutter="16">
+    <el-row :gutter="16" class="setting-list">
       <el-col :span="16" :offset="4">
         <div class="view-title">
-          {{ picBedName }}设置
+          {{ picBedName }}{{ $T('SETTINGS') }}
         </div>
         <config-form
           v-if="config.length > 0"
@@ -14,14 +14,14 @@
         >
           <el-form-item>
             <el-button-group>
-              <el-button type="primary" @click="handleConfirm" round>确定</el-button>
-              <el-button type="success" @click="setDefaultPicBed(type)" round :disabled="defaultPicBed === type">设为默认图床</el-button>
+              <el-button type="primary" @click="handleConfirm" round>{{ $T('CONFIRM') }}</el-button>
+              <el-button type="success" @click="setDefaultPicBed(type)" round :disabled="defaultPicBed === type">{{ $T('SETTINGS_SET_DEFAULT_PICBED') }}</el-button>
             </el-button-group>
           </el-form-item>
         </config-form>
         <div v-else class="single">
-          <div class="notice">暂无配置项</div>
-          <el-button type="success" @click="setDefaultPicBed(type)" round :disabled="defaultPicBed === type" size="mini">设为默认图床</el-button>
+          <div class="notice">{{ $T('SETTINGS_NOT_CONFIG_OPTIONS') }}</div>
+          <el-button type="success" @click="setDefaultPicBed(type)" round :disabled="defaultPicBed === type" size="mini">{{ $T('SETTINGS_SET_DEFAULT_PICBED') }}</el-button>
         </div>
       </el-col>
     </el-row>
@@ -52,38 +52,43 @@ export default class extends Vue {
     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.letPicGoSaveData({
+      this.saveConfig({
         [`picBed.${this.type}`]: result
       })
-      const successNotification = new Notification('设置结果', {
-        body: '设置成功'
+      const successNotification = new Notification(this.$T('SETTINGS_RESULT'), {
+        body: this.$T('TIPS_SET_SUCCEED')
       })
       successNotification.onclick = () => {
         return true
       }
     }
   }
+
   setDefaultPicBed (type: string) {
-    this.letPicGoSaveData({
-      'picBed.current': type
+    this.saveConfig({
+      'picBed.current': type,
+      'picBed.uploader': type
     })
     // @ts-ignore 来自mixin的数据
     this.defaultPicBed = type
-    const successNotification = new Notification('设置默认图床', {
-      body: '设置成功'
+    const successNotification = new Notification(this.$T('SETTINGS_DEFAULT_PICBED'), {
+      body: this.$T('TIPS_SET_SUCCEED')
     })
     successNotification.onclick = () => {
       return true
     }
   }
+
   getPicBeds (event: IpcRendererEvent, config: any[], name: string) {
     this.config = config
     this.picBedName = name
   }
+
   beforeDestroy () {
     ipcRenderer.removeListener('getPicBedConfig', this.getPicBeds)
   }
@@ -91,6 +96,10 @@ export default class extends Vue {
 </script>
 <style lang='stylus'>
 #others-view
+  .setting-list
+    height 425px
+    overflow-y auto
+    overflow-x hidden
   .el-form
     label
       line-height 22px

src/renderer/pages/picbeds/Qiniu.vue

@@ -17,7 +17,7 @@
             :rules="{
               required: true, message: 'AccessKey不能为空', trigger: 'blur'
             }">
-            <el-input v-model="form.accessKey" placeholder="AccessKey" @keyup.native.enter="confirm('weiboForm')"></el-input>
+            <el-input v-model="form.accessKey" placeholder="AccessKey" @keyup.native.enter="confirm"></el-input>
           </el-form-item>
           <el-form-item
             label="设定SecretKey"
@@ -88,17 +88,19 @@ export default class extends Vue {
     options: '',
     path: ''
   }
-  created () {
-    const config = this.$db.get('picBed.qiniu') as IQiniuConfig
+
+  async created () {
+    const config = await this.getConfig<IQiniuConfig>('picBed.qiniu')
     if (config) {
       this.form = Object.assign({}, config)
     }
   }
+
   confirm () {
     // @ts-ignore
     this.$refs.qiniu.validate((valid) => {
       if (valid) {
-        this.letPicGoSaveData({
+        this.saveConfig({
           'picBed.qiniu': this.form
         })
         const successNotification = new Notification('设置结果', {

src/renderer/pages/picbeds/SMMS.vue

@@ -5,12 +5,27 @@
         <div class="view-title">
           SM.MS设置
         </div>
-        <div class="content">
-          感谢SM.MS提供的优质服务
-        </div>
-        <div style="text-align: center; margin-top: 20px;">
-          <el-button type="success" @click="confirm" round :disabled="defaultPicBed === 'smms'" size="mini">设为默认图床</el-button>
-        </div>
+        <el-form
+          ref="smms"
+          label-position="right"
+          label-width="120px"
+          :model="form"
+          size="mini">
+          <el-form-item
+            label="设定Token"
+            prop="token"
+            :rules="{
+              required: true, message: 'Token不能为空', trigger: 'blur'
+            }">
+            <el-input v-model="form.token" type="password" placeholder="token" @keyup.native.enter="confirm"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button-group>
+              <el-button type="primary" @click="confirm" round>确定</el-button>
+              <el-button type="success" @click="setDefaultPicBed('smms')" round :disabled="defaultPicBed === 'smms'">设为默认图床</el-button>
+            </el-button-group>
+          </el-form-item>
+        </el-form>
       </el-col>
     </el-row>
   </div>
@@ -23,25 +38,60 @@ import mixin from '@/utils/ConfirmButtonMixin'
   mixins: [mixin]
 })
 export default class extends Vue {
-  confirm () {
-    this.letPicGoSaveData({
-      'picBed.smms': true
-    })
-    // @ts-ignore 来自mixin
-    this.setDefaultPicBed('smms')
-    const successNotification = new window.Notification('设置结果', {
-      body: '设置成功'
-    })
-    successNotification.onclick = () => {
-      return true
+  form: ISMMSConfig = {
+    token: ''
+  }
+
+  async created () {
+    const config = await this.getConfig<string | boolean>('picBed.smms.token')
+    if (typeof config !== 'boolean') {
+      this.form.token = config || ''
     }
   }
+
+  confirm () {
+    // @ts-ignore
+    this.$refs.smms.validate((valid) => {
+      if (valid) {
+        this.saveConfig({
+          'picBed.smms': this.form
+        })
+        const successNotification = new window.Notification('设置结果', {
+          body: '设置成功'
+        })
+        successNotification.onclick = () => {
+          return true
+        }
+      } else {
+        return false
+      }
+    })
+  }
 }
 </script>
 <style lang='stylus'>
 #smms-view
-  .content
-    text-align center
-    font-size 14px
-    color #eee
+  .el-form
+    label
+      line-height 22px
+      padding-bottom 0
+      color #eee
+    .el-input__inner
+      border-radius 19px
+    &-item
+      margin-bottom 10.5px
+  .el-radio-group
+    width 100%
+    label
+      width 25%
+    .el-radio-button__inner
+      width 100%
+  .el-radio-button:first-child
+    .el-radio-button__inner
+      border-left none
+      border-radius 14px 0 0 14px
+  .el-radio-button:last-child
+    .el-radio-button__inner
+      border-left none
+      border-radius 0 14px 14px 0
 </style>

src/renderer/pages/picbeds/TcYun.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="tcyun-view">
-    <el-row :gutter="16">
+    <el-row :gutter="16" class="setting-list-scroll">
       <el-col :span="16" :offset="4">
         <div class="view-title">
           腾讯云COS设置
@@ -30,7 +30,7 @@
             :rules="{
               required: true, message: 'SecretId不能为空', trigger: 'blur'
             }">
-            <el-input v-model="form.secretId" placeholder="SecretId" @keyup.native.enter="confirm('weiboForm')"></el-input>
+            <el-input v-model="form.secretId" placeholder="SecretId" @keyup.native.enter="confirm"></el-input>
           </el-form-item>
           <el-form-item
             label="设定SecretKey"
@@ -74,6 +74,11 @@
             >
             <el-input v-model="form.customUrl" @keyup.native.enter="confirm" placeholder="例如https://xxxx.com"></el-input>
           </el-form-item>
+          <el-form-item
+            label="设定网址后缀"
+            >
+            <el-input v-model="form.options" @keyup.native.enter="confirm" placeholder="例如?imageMogr2"></el-input>
+          </el-form-item>
           <el-form-item>
             <el-button-group>
               <el-button type="primary" @click="confirm" round>确定</el-button>
@@ -86,15 +91,17 @@
   </div>
 </template>
 <script lang="ts">
+import { ipcRenderer } from 'electron'
 import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/ConfirmButtonMixin'
-import { remote } from 'electron'
+import { OPEN_URL } from '#/events/constants'
+import { ITcyunConfig } from 'picgo/dist/types'
 @Component({
   name: 'tcyun',
   mixins: [mixin]
 })
 export default class extends Vue {
-  form: ITcYunConfig = {
+  form: ITcyunConfig = {
     secretId: '',
     secretKey: '',
     bucket: '',
@@ -102,19 +109,22 @@ export default class extends Vue {
     area: '',
     path: '',
     customUrl: '',
-    version: 'v4'
+    version: 'v5',
+    options: ''
   }
-  created () {
-    const config = this.$db.get('picBed.tcyun') as ITcYunConfig
+
+  async created () {
+    const config = await this.getConfig<ITcyunConfig>('picBed.tcyun')
     if (config) {
       this.form = Object.assign({}, config)
     }
   }
+
   confirm () {
     // @ts-ignore
     this.$refs.tcyun.validate((valid) => {
       if (valid) {
-        this.letPicGoSaveData({
+        this.saveConfig({
           'picBed.tcyun': this.form
         })
         const successNotification = new window.Notification('设置结果', {
@@ -128,8 +138,9 @@ export default class extends Vue {
       }
     })
   }
+
   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')
+    ipcRenderer.send(OPEN_URL, 'https://picgo.github.io/PicGo-Doc/zh/guide/config.html#%E8%85%BE%E8%AE%AF%E4%BA%91cos')
   }
 }
 </script>

src/renderer/pages/picbeds/UpYun.vue

@@ -67,29 +67,33 @@
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator'
 import mixin from '@/utils/ConfirmButtonMixin'
+import { IUpyunConfig } from 'picgo/dist/types'
 @Component({
   name: 'upyun',
   mixins: [mixin]
 })
 export default class extends Vue {
-  form: IUpYunConfig = {
+  form: IUpyunConfig = {
     bucket: '',
     operator: '',
     password: '',
     options: '',
+    url: '',
     path: ''
   }
-  created () {
-    const config = this.$db.get('picBed.upyun') as IUpYunConfig
+
+  async created () {
+    const config = await this.getConfig<IUpyunConfig>('picBed.upyun')
     if (config) {
       this.form = Object.assign({}, config)
     }
   }
+
   confirm () {
     // @ts-ignore
     this.$refs.tcyun.validate((valid) => {
       if (valid) {
-        this.letPicGoSaveData({
+        this.saveConfig({
           'picBed.upyun': this.form
         })
         const successNotification = new Notification('设置结果', {

src/renderer/pages/picbeds/Weibo.vue

@@ -1,153 +0,0 @@
-<template>
-  <div id="weibo-view">
-    <el-row :gutter="16">
-      <el-col :span="16" :offset="4">
-        <div class="view-title">
-          微博图床设置[已停止支持]
-        </div>
-        <el-form
-          ref="weiboForm"
-          label-position="right"
-          label-width="120px"
-          size="small"
-          :model="form">
-          <el-form-item
-            label="设定用户名"
-            prop="username"
-            :rules="{
-              required: !chooseCookie, message: '用户名不能为空', trigger: 'blur'
-            }">
-            <el-input v-model="form.username" placeholder="用户名" @keyup.native.enter="confirm('weiboForm')" :disabled="chooseCookie"></el-input>
-          </el-form-item>
-          <el-form-item
-            label="设定密码"
-            prop="password"
-            :rules="{required: !chooseCookie,messsage: '密码不能为空',trigger: 'blur'}">
-            <el-input v-model="form.password" type="password" @keyup.native.enter="confirm('weiboForm')" placeholder="密码" :disabled="chooseCookie"></el-input>
-          </el-form-item>
-          <el-form-item
-            label="使用Cookie上传"
-          >
-            <el-switch
-              v-model="chooseCookie"
-              active-text="cookie模式"
-              @change="handleSwitchChange"
-            ></el-switch>
-            <i class="el-icon-question" @click="openWiki"></i>
-          </el-form-item>
-          <el-form-item
-            label="设定Cookie"
-            prop="cookie"
-            :rules="{
-              required: chooseCookie, message: '密码不能为空', trigger: 'blur'
-            }">
-            <el-input v-model="form.cookie" @keyup.native.enter="confirm('weiboForm')" placeholder="Cookie" :disabled="!chooseCookie"></el-input>
-          </el-form-item>
-          <el-form-item label="* 图片质量">
-            <el-radio-group v-model="quality">
-              <el-radio label="thumbnail">缩略图</el-radio>
-              <el-radio label="mw690">中等尺寸</el-radio>
-              <el-radio label="large">原图</el-radio>
-            </el-radio-group>
-          </el-form-item>
-          <el-form-item>
-            <el-button-group>
-              <el-button type="primary" @click="confirm('weiboForm')" round>确定</el-button>
-              <el-button type="success" @click="setDefaultPicBed('weibo')" round :disabled="defaultPicBed === 'weibo'">设为默认图床</el-button>
-            </el-button-group>
-          </el-form-item>
-        </el-form>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-<script>
-import mixin from '@/utils/ConfirmButtonMixin'
-export default {
-  name: 'weibo',
-  mixins: [mixin],
-  data () {
-    return {
-      form: {
-        username: '',
-        password: '',
-        cookie: ''
-      },
-      chooseCookie: false,
-      quality: 'large'
-    }
-  },
-  created () {
-    const config = this.$db.get('picBed.weibo')
-    if (config) {
-      this.form.username = config.username
-      this.form.password = config.password
-      this.quality = config.quality || 'large'
-      this.form.cookie = config.cookie
-      this.chooseCookie = config.chooseCookie
-    }
-  },
-  methods: {
-    confirm (formName) {
-      this.$refs[formName].validate((valid) => {
-        if (valid) {
-          this.letPicGoSaveData({
-            'picBed.weibo': {
-              username: this.form.username,
-              password: this.form.password,
-              quality: this.quality,
-              cookie: this.form.cookie,
-              chooseCookie: this.chooseCookie
-            }
-          })
-          const successNotification = new window.Notification('设置结果', {
-            body: '设置成功'
-          })
-          successNotification.onclick = () => {
-            return true
-          }
-        } else {
-          return false
-        }
-      })
-    },
-    handleSwitchChange () {
-      this.$refs['weiboForm'].resetFields()
-    },
-    openWiki () {
-      this.$electron.remote.shell.openExternal('https://picgo.github.io/PicGo-Doc/zh/guide/config.html#微博图床')
-    }
-  }
-}
-</script>
-<style lang='stylus'>
-.el-message
-  left 60%
-#weibo-view
-  .el-form
-    label
-      line-height 22px
-      padding-bottom 0
-      color #eee
-    .el-button-group
-      width 100%
-      .el-button
-        width 50%
-    .el-input__inner
-      border-radius 19px
-    .el-radio-group
-      margin-left 25px
-    .el-switch__label
-      color #eee
-      &.is-active
-        color #409EFF
-    .el-icon-question
-      font-size 20px
-      float right
-      margin-top 9px
-      color #eee
-      cursor pointer
-      transition .2s color ease-in-out
-      &:hover
-        color #409EFF
-</style>

src/renderer/router/index.ts

@@ -22,20 +22,15 @@ export default new Router({
       component: () => import(/* webpackChunkName: "MiniPage" */ '@/pages/MiniPage.vue')
     },
     {
-      path: '/setting',
-      name: 'setting-page',
-      component: () => import(/* webpackChunkName: "SettingPage" */ '@/layouts/SettingPage.vue'),
+      path: '/main-page',
+      name: 'main-page',
+      component: () => import(/* webpackChunkName: "SettingPage" */ '@/layouts/Main.vue'),
       children: [
         {
           path: 'upload',
           component: () => import(/* webpackChunkName: "Upload" */ '@/pages/Upload.vue'),
           name: 'upload'
         },
-        {
-          path: 'weibo',
-          component: () => import(/* webpackChunkName: "Weibo" */ '@/pages/picbeds/Weibo.vue'),
-          name: 'weibo'
-        },
         {
           path: 'qiniu',
           component: () => import(/* webpackChunkName: "Qiniu" */ '@/pages/picbeds/Qiniu.vue'),

src/renderer/utils/ConfirmButtonMixin.ts

@@ -1,15 +1,23 @@
 import { Component, Vue } from 'vue-property-decorator'
-import { ipcRenderer } from 'electron'
+import { IConfig } from 'picgo'
 @Component
 export default class extends Vue {
-  defaultPicBed = this.$db.get('picBed.current')
+  defaultPicBed = 'smms'
+  async created () {
+    const config = await this.getConfig<IConfig>()
+    if (config) {
+      this.defaultPicBed = config?.picBed?.uploader || config?.picBed?.current || 'smms'
+    }
+  }
+
   setDefaultPicBed (type: string) {
-    this.letPicGoSaveData({
-      'picBed.current': type
+    this.saveConfig({
+      'picBed.current': type,
+      'picBed.uploader': type
     })
     this.defaultPicBed = type
-    const successNotification = new Notification('设置默认图床', {
-      body: '设置成功'
+    const successNotification = new Notification(this.$T('SETTINGS_DEFAULT_PICBED'), {
+      body: this.$T('TIPS_SET_SUCCEED')
     })
     successNotification.onclick = () => {
       return true

src/renderer/utils/analytics.ts

@@ -0,0 +1,23 @@
+/* eslint-disable camelcase */
+import {
+  TALKING_DATA_APPID, TALKING_DATA_EVENT
+} from '~/universal/events/constants'
+import pkg from 'root/package.json'
+import { ipcRenderer } from 'electron'
+import { handleTalkingDataEvent } from './common'
+const { version } = pkg
+
+export const initTalkingData = () => {
+  setTimeout(() => {
+    const talkingDataScript = document.createElement('script')
+
+    talkingDataScript.src = `http://sdk.talkingdata.com/app/h5/v1?appid=${TALKING_DATA_APPID}&vn=${version}&vc=${version}`
+
+    const head = document.getElementsByTagName('head')[0]
+    head.appendChild(talkingDataScript)
+  }, 0)
+}
+
+ipcRenderer.on(TALKING_DATA_EVENT, (_, data: ITalkingDataOptions) => {
+  handleTalkingDataEvent(data)
+})

src/renderer/utils/beforeOpen.ts

@@ -0,0 +1,10 @@
+import { i18n } from '~/universal/i18n'
+
+export const handleURLParams = () => {
+  const url = new URL(location.href)
+  const search = new URLSearchParams(url.search)
+  if (search.has('lang')) {
+    const lang = search.get('lang') || 'zh-CN'
+    i18n.setLanguage(lang)
+  }
+}

src/renderer/utils/bus.ts

@@ -0,0 +1,2 @@
+import Vue from 'vue'
+export default new Vue()

src/renderer/utils/common.ts

@@ -0,0 +1,10 @@
+const isDevelopment = process.env.NODE_ENV !== 'production'
+/* eslint-disable camelcase */
+export const handleTalkingDataEvent = (data: ITalkingDataOptions) => {
+  const { EventId, Label = '', MapKv = {} } = data
+  MapKv.from = window.location.href
+  window.TDAPP.onEvent(EventId, Label, MapKv)
+  if (isDevelopment) {
+    console.log('talkingData', data)
+  }
+}

src/renderer/utils/db.ts

@@ -0,0 +1,59 @@
+import { IObject, IResult, IGetResult, IFilter } from '@picgo/store/dist/types'
+import { ipcRenderer, IpcRendererEvent } from 'electron'
+import { uuid } from 'uuidv4'
+import {
+  PICGO_GET_DB,
+  PICGO_INSERT_DB,
+  PICGO_INSERT_MANY_DB,
+  PICGO_UPDATE_BY_ID_DB,
+  PICGO_GET_BY_ID_DB,
+  PICGO_REMOVE_BY_ID_DB
+} from '#/events/constants'
+import { IGalleryDB } from '#/types/extra-vue'
+export class GalleryDB implements IGalleryDB {
+  async get<T> (filter?: IFilter): Promise<IGetResult<T>> {
+    const res = await this.msgHandler<IGetResult<T>>(PICGO_GET_DB, filter)
+    return res
+  }
+
+  async insert<T> (value: T): Promise<IResult<T>> {
+    const res = await this.msgHandler<IResult<T>>(PICGO_INSERT_DB, value)
+    return res
+  }
+
+  async insertMany<T> (value: T[]): Promise<IResult<T>[]> {
+    const res = await this.msgHandler<IResult<T>[]>(PICGO_INSERT_MANY_DB, value)
+    return res
+  }
+
+  async updateById (id: string, value: IObject): Promise<boolean> {
+    const res = await this.msgHandler<boolean>(PICGO_UPDATE_BY_ID_DB, id, value)
+    return res
+  }
+
+  async getById<T> (id: string): Promise<IResult<T> | undefined> {
+    const res = await this.msgHandler<IResult<T> | undefined>(PICGO_GET_BY_ID_DB, id)
+    return res
+  }
+
+  async removeById (id: string): Promise<void> {
+    const res = await this.msgHandler<void>(PICGO_REMOVE_BY_ID_DB, id)
+    return res
+  }
+
+  private msgHandler<T> (method: string, ...args: any[]): Promise<T> {
+    return new Promise((resolve) => {
+      const callbackId = uuid()
+      const callback = (event: IpcRendererEvent, data: T, returnCallbackId: string) => {
+        if (returnCallbackId === callbackId) {
+          resolve(data)
+          ipcRenderer.removeListener(method, callback)
+        }
+      }
+      ipcRenderer.on(method, callback)
+      ipcRenderer.send(method, ...args, callbackId)
+    })
+  }
+}
+
+export default new GalleryDB()

src/renderer/utils/key-binding.ts

@@ -14,16 +14,16 @@ const isSpecialKey = (keyCode: number) => {
 
 const keyDetect = (event: KeyboardEvent) => {
   const meta = process.platform === 'darwin' ? 'Cmd' : 'Super'
-  let specialKey = {
+  const specialKey = {
     Ctrl: event.ctrlKey,
     Shift: event.shiftKey,
     Alt: event.altKey,
     [meta]: event.metaKey
   }
 
-  let pressKey = []
+  const pressKey = []
 
-  for (let i in specialKey) {
+  for (const i in specialKey) {
     if (specialKey[i]) {
       pressKey.push(i)
     }

src/renderer/utils/mainMixin.ts

@@ -1,8 +1,40 @@
 import { Component, Vue } from 'vue-property-decorator'
-import { ipcRenderer } from 'electron'
+import { ipcRenderer, IpcRendererEvent } from 'electron'
+import { PICGO_SAVE_CONFIG, PICGO_GET_CONFIG, FORCE_UPDATE } from '#/events/constants'
+import { uuid } from 'uuidv4'
 @Component
 export default class extends Vue {
-  letPicGoSaveData (data: IObj) {
-    ipcRenderer.send('picgoSaveData', data)
+  created () {
+    this.$bus.$on(FORCE_UPDATE, () => {
+      this.$forceUpdate()
+    })
+  }
+
+  // support string key + value or object config
+  saveConfig (config: IObj | string, value?: any) {
+    if (typeof config === 'string') {
+      config = {
+        [config]: value
+      }
+    }
+    ipcRenderer.send(PICGO_SAVE_CONFIG, config)
+  }
+
+  getConfig<T> (key?: string): Promise<T | undefined> {
+    return new Promise((resolve) => {
+      const callbackId = uuid()
+      const callback = (event: IpcRendererEvent, config: T | undefined, returnCallbackId: string) => {
+        if (returnCallbackId === callbackId) {
+          resolve(config)
+          ipcRenderer.removeListener(PICGO_GET_CONFIG, callback)
+        }
+      }
+      ipcRenderer.on(PICGO_GET_CONFIG, callback)
+      ipcRenderer.send(PICGO_GET_CONFIG, key, callbackId)
+    })
+  }
+
+  forceUpdate () {
+    this.$bus.$emit(FORCE_UPDATE)
   }
 }

src/renderer/utils/mixin.ts

@@ -4,11 +4,13 @@ export default class extends Vue {
   mounted () {
     this.disableDragEvent()
   }
+
   disableDragEvent () {
     window.addEventListener('dragenter', this.disableDrag, false)
     window.addEventListener('dragover', this.disableDrag)
     window.addEventListener('drop', this.disableDrag)
   }
+
   disableDrag (e: DragEvent) {
     const dropzone = document.getElementById('upload-area')
     if (dropzone === null || !dropzone.contains(<Node>e.target)) {
@@ -17,6 +19,7 @@ export default class extends Vue {
       e.dataTransfer!.dropEffect = 'none'
     }
   }
+
   beforeDestroy () {
     window.removeEventListener('dragenter', this.disableDrag, false)
     window.removeEventListener('dragover', this.disableDrag)

src/universal/events/constants.ts

@@ -0,0 +1,35 @@
+export const SHOW_INPUT_BOX = 'SHOW_INPUT_BOX'
+export const SHOW_INPUT_BOX_RESPONSE = 'SHOW_INPUT_BOX_RESPONSE'
+export const TOGGLE_SHORTKEY_MODIFIED_MODE = 'TOGGLE_SHORTKEY_MODIFIED_MODE'
+export const TALKING_DATA_APPID = '7E6832BCE3F1438696579E541DFEBFDA'
+export const TALKING_DATA_EVENT = 'TALKING_DATA_EVENT'
+export const SHOW_PRIVACY_MESSAGE = 'SHOW_PRIVACY_MESSAGE'
+export const PICGO_SAVE_CONFIG = 'PICGO_SAVE_CONFIG'
+export const PICGO_GET_CONFIG = 'PICGO_GET_CONFIG'
+export const PICGO_GET_DB = 'PICGO_GET_DB'
+export const PICGO_INSERT_DB = 'PICGO_INSERT_DB'
+export const PICGO_INSERT_MANY_DB = 'PICGO_INSERT_MANY_DB'
+export const PICGO_UPDATE_BY_ID_DB = 'PICGO_UPDATE_BY_ID_DB'
+export const PICGO_GET_BY_ID_DB = 'PICGO_GET_BY_ID_DB'
+export const PICGO_REMOVE_BY_ID_DB = 'PICGO_REMOVE_BY_ID_DB'
+export const PICGO_OPEN_FILE = 'PICGO_OPEN_FILE'
+export const OPEN_DEVTOOLS = 'OPEN_DEVTOOLS'
+export const SHOW_MINI_PAGE_MENU = 'SHOW_MINI_PAGE_MENU'
+export const SHOW_MAIN_PAGE_MENU = 'SHOW_MAIN_PAGE_MENU'
+export const SHOW_UPLOAD_PAGE_MENU = 'SHOW_UPLOAD_PAGE_MENU'
+export const SHOW_PLUGIN_PAGE_MENU = 'SHOW_PLUGIN_PAGE_MENU'
+export const MINIMIZE_WINDOW = 'MINIMIZE_WINDOW'
+export const CLOSE_WINDOW = 'CLOSE_WINDOW'
+export const OPEN_USER_STORE_FILE = 'OPEN_USER_STORE_FILE'
+export const OPEN_URL = 'OPEN_URL'
+export const RELOAD_APP = 'RELOAD_APP'
+export const PICGO_CONFIG_PLUGIN = 'PICGO_CONFIG_PLUGIN'
+export const PICGO_HANDLE_PLUGIN_ING = 'PICGO_HANDLE_PLUGIN_ING'
+export const PICGO_TOGGLE_PLUGIN = 'PICGO_TOGGLE_PLUGIN'
+export const PASTE_TEXT = 'PASTE_TEXT'
+export const SET_MINI_WINDOW_POS = 'SET_MINI_WINDOW_POS'
+export const RENAME_FILE_NAME = 'RENAME_FILE_NAME'
+export const SHOW_MAIN_PAGE_QRCODE = 'SHOW_MAIN_PAGE_QRCODE'
+export const SHOW_MAIN_PAGE_DONATION = 'SHOW_MAIN_PAGE_DONATION'
+export const FORCE_UPDATE = 'FORCE_UPDATE'
+export const CHANGE_LANGUAGE = 'CHANGE_LANGUAGE'

src/universal/i18n/en.ts

@@ -0,0 +1,217 @@
+import { ILocales } from './zh-CN'
+/* eslint-disable no-template-curly-in-string */
+export const EN: ILocales = {
+  ABOUT: 'About',
+  OPEN_MAIN_WINDOW: 'Open Main Window',
+  CHOOSE_DEFAULT_PICBED: 'Choose Default Picbed',
+  OPEN_UPDATE_HELPER: 'Open Update Helper',
+  PRIVACY_AGREEMENT: 'Privacy Agreement',
+  RELOAD_APP: 'Reload App',
+  UPLOAD_FAILED: 'Upload Failed',
+  UPLOAD_SUCCEED: 'Upload Succeed',
+  UPLOAD_PROGRESS: 'Upload Progress',
+  OPERATION_FAILED: 'Operation Failed',
+  OPERATION_SUCCEED: 'Operation Succeed',
+  UPLOADING: 'Uploading',
+  QUICK_UPLOAD: 'Quick Upload',
+  UPLOAD_BY_CLIPBOARD: 'Upload by Clipboard',
+  HIDE_WINDOW: 'Hide Window',
+  SPONSOR_PICGO: 'Sponsor PicGo',
+  SHOW_PICBED_QRCODE: 'Show Picbed Qrcode',
+  PICBED_QRCODE: 'Picbed Qrcode',
+  ENABLE: 'Enable',
+  DISABLE: 'Disable',
+  CONFIG_THING: 'Config ${c}',
+  FIND_NEW_VERSION: 'Find New Version',
+  SHOW_DEVTOOLS: 'Show Devtools',
+  NO_MORE_NOTICE: 'No More Notice',
+
+  // ---renderer i18n---
+  CHOOSE_YOUR_DEFAULT_PICBED: 'Choose ${d} as your default picbed:',
+  UPLOAD_AREA: 'Upload Area',
+  GALLERY: 'Gallery',
+  PICBEDS_SETTINGS: 'Picbeds Settings',
+  PICGO_SETTINGS: 'PicGo Settings',
+  PLUGIN_SETTINGS: 'Plugins Settings',
+  PICGO_SPONSOR_TEXT: 'PicGo is free software, if you like it, please don\'t forget to buy me a coffee?',
+  ALIPAY: 'Alipay',
+  WECHATPAY: 'Wechat Pay',
+  CHOOSE_PICBED: 'Choose Picbed',
+  COPY_PICBED_CONFIG: 'Copy Picbed Config',
+  COPY_PICBED_CONFIG_SUCCEED: 'Copy Picbed Config Succeed',
+  INPUT: 'Input',
+  CANCEL: 'Cancel',
+  CONFIRM: 'Confirm',
+  CHOOSE_SHOWED_PICBED: 'Choose Showed Picbed',
+  CHOOSE_PASTE_FORMAT: 'Choose Paste Format',
+  SEARCH: 'Search',
+  COPY: 'Copy',
+  DELETE: 'Delete',
+  SELECT_ALL: 'Select All',
+  CHANGE_IMAGE_URL: 'Change Image URL',
+  CHANGE_IMAGE_URL_SUCCEED: 'Change Image URL Succeed',
+  COPY_LINK_SUCCEED: 'Copy Link Succeed',
+  BATCH_COPY_LINK_SUCCEED: 'Batch Copy Link Succeed',
+  FILE_RENAME: 'File Rename',
+
+  // settings
+  SETTINGS: 'Settings',
+  SETTINGS_OPEN_CONFIG_FILE: 'Open Config File',
+  SETTINGS_CLICK_TO_OPEN: 'Click to Open',
+  SETTINGS_SET_LOG_FILE: 'Set Log File',
+  SETTINGS_CLICK_TO_SET: 'Click to Set',
+  SETTINGS_CLICK_TO_CHECK: 'Click to Check',
+  SETTINGS_SET_SHORTCUT: 'Set Shortcut',
+  SETTINGS_CUSTOM_LINK_FORMAT: 'Custom Link Format',
+  SETTINGS_SET_PROXY_AND_MIRROR: 'Set Proxy and Mirror',
+  SETTINGS_SET_SERVER: 'Set Server',
+  SETTINGS_CHECK_UPDATE: 'Check Update',
+  SETTINGS_OPEN_UPDATE_HELPER: 'Open Update Helper',
+  SETTINGS_OPEN: 'Open',
+  SETTINGS_CLOSE: 'Close',
+  SETTINGS_ACCEPT_BETA_UPDATE: 'Accept Beta Update',
+  SETTINGS_LAUNCH_ON_BOOT: 'Launch On Boot',
+  SETTINGS_RENAME_BEFORE_UPLOAD: 'Rename Before Upload',
+  SETTINGS_TIMESTAMP_RENAME: 'Timestamp Rename',
+  SETTINGS_OPEN_UPLOAD_TIPS: 'Open Upload Tips',
+  SETTINGS_MINI_WINDOW_ON_TOP: 'Mini Window On Top',
+  SETTINGS_AUTO_COPY_URL_AFTER_UPLOAD: 'Auto Copy URL After Upload',
+  SETTINGS_TIPS_PLACEHOLDER_URL: 'Use $url to represent url position',
+  SETTINGS_TIPS_PLACEHOLDER_FILENAME: 'Use $fileName to represent file name position',
+  SETTINGS_TIPS_SUCH_AS: 'Such as: $url/$fileName',
+  SETTINGS_UPLOAD_PROXY: 'Upload Proxy',
+  SETTINGS_PLUGIN_INSTALL_PROXY: 'Proxy for Plugin Install',
+  SETTINGS_PLUGIN_INSTALL_MIRROR: 'Mirror for Plugin Install',
+  SETTINGS_CURRENT_VERSION: 'Current Version',
+  SETTINGS_NEWEST_VERSION: 'Newest Version',
+  SETTINGS_GETING: 'Getting...',
+  SETTINGS_TIPS_HAS_NEW_VERSION: 'PicGo has a new version, please click confirm to open download page',
+  SETTINGS_LOG_FILE: 'Log File',
+  SETTINGS_LOG_LEVEL: 'Log Level',
+  SETTINGS_SET_PICGO_SERVER: 'Set PicGo Server',
+  SETTINGS_TIPS_SERVER_NOTICE: 'If you don\'t know what is the server\'s function, please read the document, or don\'t modify the configuration.',
+  SETTINGS_ENABLE_SERVER: 'Enable Server',
+  SETTINGS_SET_SERVER_HOST: 'Set Server Host',
+  SETTINGS_SET_SERVER_PORT: 'Set Server Port',
+  SETTINGS_TIP_PLACEHOLDER_HOST: 'Default:127.0.0.1',
+  SETTINGS_TIP_PLACEHOLDER_PORT: 'Default:36677',
+  SETTINGS_LOG_LEVEL_ALL: 'All',
+  SETTINGS_LOG_LEVEL_SUCCESS: 'Success',
+  SETTINGS_LOG_LEVEL_ERROR: 'Error',
+  SETTINGS_LOG_LEVEL_INFO: 'Info',
+  SETTINGS_LOG_LEVEL_WARN: 'Warn',
+  SETTINGS_LOG_LEVEL_NONE: 'None',
+  SETTINGS_RESULT: 'Result',
+  SETTINGS_DEFAULT_PICBED: 'Default Picbed',
+  SETTINGS_SET_DEFAULT_PICBED: 'Set Default Picbed',
+  SETTINGS_NOT_CONFIG_OPTIONS: 'Not Config Options',
+  SETTINGS_USE_BUILTIN_CLIPBOARD_UPLOAD: 'Use Builtin Clipboard to Upload',
+  SETTINGS_CHOOSE_LANGUAGE: 'Choose Language',
+  BUILTIN_CLIPBOARD_TIPS: 'Use builtin clipboard function to upload instead of using scripts',
+
+  // shortcut page
+  SHORTCUT_NAME: 'Shortcut Name',
+  SHORTCUT_BIND: 'Shortcut Binding',
+  SHORTCUT_STATUS: 'Status',
+  SHORTCUT_ENABLED: 'Enabled',
+  SHORTCUT_DISABLED: 'Disabled',
+  SHORTCUT_SOURCE: 'Source',
+  SHORTCUT_HANDLE: 'Handle',
+  SHORTCUT_ENABLE: 'Enable',
+  SHORTCUT_DISABLE: 'Disable',
+  SHORTCUT_EDIT: 'Edit',
+  SHORTCUT_CHANGE_UPLOAD: 'Change Upload Shortcut',
+
+  // tray page
+  WAIT_TO_UPLOAD: 'Wait to Upload',
+  ALREADY_UPLOAD: 'Already Upload',
+
+  // uload page
+  PICTURE_UPLOAD: 'Picture Upload',
+  DRAG_FILE_TO_HERE: 'Drag file to here, or',
+  CLICK_TO_UPLOAD: 'click to upload',
+  LINK_FORMAT: 'Link Format',
+  CUSTOM: 'Custom',
+  CLIPBOARD_PICTURE: 'Clipboard',
+  TIPS_DRAG_VALID_PICTURE_OR_URL: 'Drag valid picture or url to here',
+  TIPS_INPUT_URL: 'Input URL',
+  TIPS_HTTP_PREFIX: 'http:// or https://',
+  TIPS_INPUT_VALID_URL: 'Input valid URL',
+
+  // plugins
+  PLUGIN_SEARCH_PLACEHOLDER: 'Search picgo plugins on npm, or click the button to view the awesome plugins list',
+  PLUGIN_INSTALL: 'Install',
+  PLUGIN_INSTALLING: 'Installing...',
+  PLUGIN_INSTALLED: 'Installed',
+  PLUGIN_DOING_SOMETHING: 'Doing...',
+  PLUGIN_LIST: 'Plugin List',
+  PLUGIN_IMPORT_LOCAL: 'Import Local Plugins',
+
+  // tips
+  TIPS_REMOVE_LINK: 'This operation will remove the picture from the album, continue?',
+  TIPS_WILL_REMOVE_CHOOSED_IMAGES: 'This operation will remove the picture from the album, continue?',
+  TIPS_MUST_CONTAINS_URL: 'Must contains $url',
+  TIPS_NETWORK_ERROR: 'Network Error',
+  TIPS_NEED_RELOAD: 'Need Reload App',
+  TIPS_PLEASE_CHOOSE_LOG_LEVEL: 'Please choose log level',
+  TIPS_SET_SUCCEED: 'Set successfully',
+  TIPS_PLUGIN_NOT_GUI_IMPLEMENT: 'This plugin is not optimized for the GUI, continue?',
+  TIPS_CLICK_NOTIFICATION_TO_RELOAD: 'Click notification to reload app',
+  // ---renderer i18n end---
+
+  // plugins
+  PLUGIN_INSTALL_SUCCEED: 'Plugin install succeed',
+  PLUGIN_INSTALL_FAILED: 'Plugin install failed',
+  PLUGIN_UNINSTALL_SUCCEED: 'Plugin uninstall succeed',
+  PLUGIN_UNINSTALL_FAILED: 'Plugin uninstall failed',
+  PLUGIN_UPDATE_SUCCEED: 'Plugin update succeed',
+  PLUGIN_UPDATE_FAILED: 'Plugin update failed',
+  PLUGIN_IMPORT_SUCCEED: 'Plugin import succeed',
+  PLUGIN_IMPORT_FAILED: 'Plugin import failed',
+  ENABLE_PLUGIN: 'Enable Plugin',
+  DISABLE_PLUGIN: 'Disable Plugin',
+  UNINSTALL_PLUGIN: 'Uninstall Plugin',
+  UPDATE_PLUGIN: 'Update Plugin',
+  // tips
+  TIPS_NOTICE: 'Tips',
+  TIPS_WARNING: 'Warning',
+  TIPS_ERROR: 'Error',
+  TIPS_INSTALL_NODE_AND_RELOAD_PICGO: 'Please install Node.js and restart PicGo to continue',
+  TIPS_PLUGIN_REMOVE_GALLERY_ITEM: 'Plugin is trying to remove some images from the album, continue?',
+  TIPS_UPLOAD_NOT_PICTURES: 'The latest clipboard item is not a picture',
+  TIPS_PICGO_CONFIG_FILE_BROKEN_WITH_DEFAULT: 'PicGo config file broken, has been restored to default',
+  TIPS_PICGO_CONFIG_FILE_BROKEN_WITH_BACKUP: 'PicGo config file broken, has been restored to backup',
+  TIPS_PICGO_BACKUP_FILE_VERSION: 'Backup file version: ${v}',
+  TIPS_CUSTOM_CONFIG_FILE_PATH_ERROR: 'Custom config file parse error, please check the path content',
+  TIPS_SHORTCUT_MODIFIED_SUCCEED: 'Shortcut modified successfully',
+  TIPS_SHORTCUT_MODIFIED_CONFLICT: 'Shortcut conflict, please reset',
+  TIPS_CUSTOM_LINK_STYLE_MODIFIED_SUCCEED: 'Custom link style modified successfully',
+  TIPS_FIND_NEW_VERSION: 'Find new version ${v}，update many new features, do you want to download the latest version?',
+  // privcy
+  PRIVACY:
+`
+This software respects and protects the personal privacy of all users who use the service. In order to provide you with more accurate and better services, this software will use and collect some of your behavioral information in accordance with the provisions of this Privacy Policy. When you agree to the software service use agreement, you are deemed to have agreed to the entire content of this privacy policy. This privacy policy is an integral part of the software service use agreement, and it will not be used if you do not agree. This Agreement will be updated periodically.
+
+1. Scope of application
+
+a) When you use this software, this software will record some information about your operation behavior of this software, including but not limited to the time-consuming, type, quantity and other information of your use of this software to upload files.
+
+2. Use of Information
+
+a) After obtaining your usage data, the software will upload it to the data analysis server so as to provide you with better services after analyzing the data.
+
+3. Information disclosure
+
+a) This software will not disclose your information to untrusted third parties.
+
+b) In accordance with the relevant provisions of the law, or the requirements of administrative or judicial institutions, disclose to third parties or administrative or judicial institutions;
+
+c) If you violate relevant Chinese laws, regulations or relevant rules, you need to disclose it to a third party;
+
+4. Information Security
+
+a) This software does not collect your personal information, key information and other private information, and the collected information is only used for improving the software, optimizing the experience, and understanding the daily activities of the software.
+`,
+  // action
+  QUIT: 'Quit'
+}

src/universal/i18n/index.ts

@@ -0,0 +1,23 @@
+import { ZH_CN } from './zh-CN'
+import { EN } from './en'
+import { ObjectAdapter, I18n } from '@picgo/i18n'
+
+const languageMap = {
+  'zh-CN': ZH_CN,
+  en: EN
+}
+
+const objectAdapter = new ObjectAdapter(languageMap)
+
+const i18n = new I18n({
+  adapter: objectAdapter,
+  defaultLanguage: 'zh-CN'
+})
+
+const T = (key: ILocalesKey, args: IStringKeyMap = {}): string => {
+  return i18n.translate(key, args) || ''
+}
+
+const languageList = Object.keys(languageMap)
+
+export { i18n, T, languageList }

src/universal/i18n/zh-CN.ts

@@ -0,0 +1,219 @@
+/* eslint-disable no-template-curly-in-string */
+export const ZH_CN = {
+  ABOUT: '关于',
+  OPEN_MAIN_WINDOW: '打开主窗口',
+  CHOOSE_DEFAULT_PICBED: '选择默认图床',
+  OPEN_UPDATE_HELPER: '打开更新助手',
+  PRIVACY_AGREEMENT: '隐私协议',
+  RELOAD_APP: '重启应用',
+  UPLOAD_SUCCEED: '上传成功',
+  UPLOAD_FAILED: '上传失败',
+  UPLOAD_PROGRESS: '上传进度',
+  OPERATION_SUCCEED: '操作成功',
+  OPERATION_FAILED: '操作失败',
+  UPLOADING: '正在上传',
+  QUICK_UPLOAD: '快捷上传',
+  UPLOAD_BY_CLIPBOARD: '剪贴板图片上传',
+  HIDE_WINDOW: '隐藏窗口',
+  SPONSOR_PICGO: '赞助 PicGo',
+  SHOW_PICBED_QRCODE: '生成图床配置二维码',
+  PICBED_QRCODE: '图床配置二维码',
+  ENABLE: '启用',
+  DISABLE: '禁用',
+  CONFIG_THING: '配置${c}',
+  FIND_NEW_VERSION: '发现新版本',
+  NO_MORE_NOTICE: '以后不再提醒',
+  SHOW_DEVTOOLS: '打开开发者工具',
+
+  // ---renderer i18n---
+  CHOOSE_YOUR_DEFAULT_PICBED: '选择 ${d} 作为你默认图床：',
+  UPLOAD_AREA: '上传区',
+  GALLERY: '相册',
+  PICBEDS_SETTINGS: '图床设置',
+  PICGO_SETTINGS: 'PicGo设置',
+  PLUGIN_SETTINGS: '插件设置',
+  PICGO_SPONSOR_TEXT: 'PicGo是免费开源的软件，如果你喜欢它，对你有帮助，不妨请我喝杯咖啡？',
+  ALIPAY: '支付宝',
+  WECHATPAY: '微信支付',
+  CHOOSE_PICBED: '选择图床',
+  COPY_PICBED_CONFIG: '复制图床配置',
+  COPY_PICBED_CONFIG_SUCCEED: '复制图床配置成功',
+  INPUT: '输入框',
+  CANCEL: '取消',
+  CONFIRM: '确定',
+  CHOOSE_SHOWED_PICBED: '请选择显示的图床',
+  CHOOSE_PASTE_FORMAT: '请选择粘贴的格式',
+  SEARCH: '搜索',
+  COPY: '复制',
+  DELETE: '删除',
+  SELECT_ALL: '全选',
+  CHANGE_IMAGE_URL: '修改图片URL',
+  CHANGE_IMAGE_URL_SUCCEED: '修改图片URL成功',
+  COPY_LINK_SUCCEED: '复制链接成功',
+  BATCH_COPY_LINK_SUCCEED: '批量复制链接成功',
+  FILE_RENAME: '文件改名',
+
+  // settings
+  SETTINGS: '设置',
+  SETTINGS_OPEN_CONFIG_FILE: '打开配置文件',
+  SETTINGS_CLICK_TO_OPEN: '点击打开',
+  SETTINGS_SET_LOG_FILE: '设置日志文件',
+  SETTINGS_CLICK_TO_SET: '点击设置',
+  SETTINGS_CLICK_TO_CHECK: '点击检查',
+  SETTINGS_SET_SHORTCUT: '设置快捷键',
+  SETTINGS_CUSTOM_LINK_FORMAT: '自定义链接格式',
+  SETTINGS_SET_PROXY_AND_MIRROR: '设置代理和镜像地址',
+  SETTINGS_SET_SERVER: '设置Server',
+  SETTINGS_CHECK_UPDATE: '检查更新',
+  SETTINGS_OPEN_UPDATE_HELPER: '打开更新助手',
+  SETTINGS_OPEN: '开',
+  SETTINGS_CLOSE: '关',
+  SETTINGS_ACCEPT_BETA_UPDATE: '接受Beta版本更新',
+  SETTINGS_LAUNCH_ON_BOOT: '开机自启',
+  SETTINGS_RENAME_BEFORE_UPLOAD: '上传前重命名',
+  SETTINGS_TIMESTAMP_RENAME: '时间戳重命名',
+  SETTINGS_OPEN_UPLOAD_TIPS: '开启上传提示',
+  SETTINGS_MINI_WINDOW_ON_TOP: 'Mini窗口置顶',
+  SETTINGS_AUTO_COPY_URL_AFTER_UPLOAD: '上传后自动复制URL',
+  SETTINGS_TIPS_PLACEHOLDER_URL: '用占位符 $url 来表示url的位置',
+  SETTINGS_TIPS_PLACEHOLDER_FILENAME: '用占位符 $fileName 来表示文件名的位置',
+  SETTINGS_TIPS_SUCH_AS: '如',
+  SETTINGS_UPLOAD_PROXY: '上传代理',
+  SETTINGS_PLUGIN_INSTALL_PROXY: '插件安装代理',
+  SETTINGS_PLUGIN_INSTALL_MIRROR: '插件安装镜像',
+  SETTINGS_CURRENT_VERSION: '当前版本',
+  SETTINGS_NEWEST_VERSION: '最新版本',
+  SETTINGS_GETING: '正在获取中',
+  SETTINGS_TIPS_HAS_NEW_VERSION: 'PicGo更新啦，请点击确定打开下载页面',
+  SETTINGS_LOG_FILE: '日志文件',
+  SETTINGS_LOG_LEVEL: '日志记录等级',
+  SETTINGS_SET_PICGO_SERVER: '设置PicGo-Server',
+  SETTINGS_TIPS_SERVER_NOTICE: '如果你不知道Server的作用，请阅读文档，或者不用修改配置。',
+  SETTINGS_ENABLE_SERVER: '是否开启Server',
+  SETTINGS_SET_SERVER_HOST: '设置监听地址',
+  SETTINGS_SET_SERVER_PORT: '设置监听端口',
+  SETTINGS_TIP_PLACEHOLDER_HOST: '推荐默认地址:127.0.0.1',
+  SETTINGS_TIP_PLACEHOLDER_PORT: '推荐默认端口:36677',
+  SETTINGS_LOG_LEVEL_ALL: '全部-All',
+  SETTINGS_LOG_LEVEL_SUCCESS: '成功-Success',
+  SETTINGS_LOG_LEVEL_ERROR: '错误-Error',
+  SETTINGS_LOG_LEVEL_INFO: '普通-Info',
+  SETTINGS_LOG_LEVEL_WARN: '提醒-Warn',
+  SETTINGS_LOG_LEVEL_NONE: '不记录日志-None',
+  SETTINGS_RESULT: '设置结果',
+  SETTINGS_DEFAULT_PICBED: '设置默认图床',
+  SETTINGS_SET_DEFAULT_PICBED: '设为默认图床',
+  SETTINGS_NOT_CONFIG_OPTIONS: '暂无配置项',
+  SETTINGS_USE_BUILTIN_CLIPBOARD_UPLOAD: '使用内置剪贴板上传',
+  SETTINGS_CHOOSE_LANGUAGE: '选择语言',
+  BUILTIN_CLIPBOARD_TIPS: '使用内置剪贴板函数而不是调用脚本获取剪贴板图片',
+
+  // shortcut page
+  SHORTCUT_NAME: '快捷键名称',
+  SHORTCUT_BIND: '快捷键绑定',
+  SHORTCUT_STATUS: '状态',
+  SHORTCUT_ENABLED: '已启用',
+  SHORTCUT_DISABLED: '已禁用',
+  SHORTCUT_SOURCE: '来源',
+  SHORTCUT_HANDLE: '操作',
+  SHORTCUT_ENABLE: '启用',
+  SHORTCUT_DISABLE: '禁用',
+  SHORTCUT_EDIT: '编辑',
+  SHORTCUT_CHANGE_UPLOAD: '修改上传快捷键',
+
+  // tray page
+  WAIT_TO_UPLOAD: '等待上传',
+  ALREADY_UPLOAD: '已上传',
+
+  // uload page
+  PICTURE_UPLOAD: '图片上传',
+  DRAG_FILE_TO_HERE: '将文件拖拽到此处，或',
+  CLICK_TO_UPLOAD: '点击上传',
+  LINK_FORMAT: '链接格式',
+  CUSTOM: '自定义',
+  CLIPBOARD_PICTURE: '剪贴板图片',
+  TIPS_DRAG_VALID_PICTURE_OR_URL: '请拖入合法的图片文件或者图片URL地址',
+  TIPS_INPUT_URL: '请输入URL',
+  TIPS_HTTP_PREFIX: 'http://或者https://开头',
+  TIPS_INPUT_VALID_URL: '请输入合法的URL',
+
+  // plugins
+  PLUGIN_SEARCH_PLACEHOLDER: '搜索npm上的PicGo插件，或者点击上方按钮查看优秀插件列表',
+  PLUGIN_INSTALL: '安装',
+  PLUGIN_INSTALLING: '安装中',
+  PLUGIN_INSTALLED: '已安装',
+  PLUGIN_DOING_SOMETHING: '进行中',
+  PLUGIN_LIST: '插件列表',
+  PLUGIN_IMPORT_LOCAL: '导入本地插件',
+
+  // tips
+  TIPS_REMOVE_LINK: '此操作将把该图片移出相册, 是否继续?',
+  TIPS_WILL_REMOVE_CHOOSED_IMAGES: '将在相册中移除刚才选中的 ${m} 张图片，是否继续？',
+  TIPS_MUST_CONTAINS_URL: '必须含有$url',
+  TIPS_NETWORK_ERROR: '网络错误暂时无法获取',
+  TIPS_NEED_RELOAD: '需要重启生效',
+  TIPS_PLEASE_CHOOSE_LOG_LEVEL: '请选择日志记录等级',
+  TIPS_SET_SUCCEED: '设置成功',
+  TIPS_PLUGIN_NOT_GUI_IMPLEMENT: '该插件未对可视化界面进行优化, 是否继续安装?',
+  TIPS_CLICK_NOTIFICATION_TO_RELOAD: '请点击此通知重启应用以生效',
+  // ---renderer i18n end---
+
+  // plugins
+  PLUGIN_INSTALL_SUCCEED: '插件安装成功',
+  PLUGIN_INSTALL_FAILED: '插件安装失败',
+  PLUGIN_UNINSTALL_SUCCEED: '插件卸载成功',
+  PLUGIN_UNINSTALL_FAILED: '插件卸载失败',
+  PLUGIN_UPDATE_SUCCEED: '插件更新成功',
+  PLUGIN_UPDATE_FAILED: '插件更新失败',
+  PLUGIN_IMPORT_SUCCEED: '插件导入成功',
+  PLUGIN_IMPORT_FAILED: '插件导入失败',
+  ENABLE_PLUGIN: '启用插件',
+  DISABLE_PLUGIN: '禁用插件',
+  UNINSTALL_PLUGIN: '卸载插件',
+  UPDATE_PLUGIN: '更新插件',
+  // tips
+  TIPS_NOTICE: '注意',
+  TIPS_WARNING: '警告',
+  TIPS_ERROR: '发生错误',
+  TIPS_INSTALL_NODE_AND_RELOAD_PICGO: '请安装Node.js并重启PicGo再继续操作',
+  TIPS_PLUGIN_REMOVE_GALLERY_ITEM: '有插件正在试图删除一些相册图片，是否继续',
+  TIPS_UPLOAD_NOT_PICTURES: '剪贴板最新的一条记录不是图片',
+  TIPS_PICGO_CONFIG_FILE_BROKEN_WITH_DEFAULT: 'PicGo 配置文件损坏，已经恢复为默认配置',
+  TIPS_PICGO_CONFIG_FILE_BROKEN_WITH_BACKUP: 'PicGo 配置文件损坏，已经恢复为备份配置',
+  TIPS_PICGO_BACKUP_FILE_VERSION: '备份文件版本: ${v}',
+  TIPS_CUSTOM_CONFIG_FILE_PATH_ERROR: '自定义文件解析出错，请检查路径内容是否正确',
+  TIPS_SHORTCUT_MODIFIED_SUCCEED: '快捷键已经修改成功',
+  TIPS_SHORTCUT_MODIFIED_CONFLICT: '快捷键冲突，请重新设置',
+  TIPS_CUSTOM_LINK_STYLE_MODIFIED_SUCCEED: '自定义链接格式已经修改成功',
+  TIPS_FIND_NEW_VERSION: '发现新版本${v}，更新了很多功能，是否去下载最新的版本？',
+  // privcy
+  PRIVACY:
+`
+本软件尊重并保护所有使用服务用户的个人隐私权。为了给您提供更准确、更优质的服务，本软件会按照本隐私权政策的规定使用和收集您的一些行为信息。您在同意本软件服务使用协议之时，即视为您已经同意本隐私权政策全部内容。本隐私权政策属于本软件服务使用协议不可分割的一部分，如果不同意将无法使用。本协议会定期更新。
+
+1.适用范围
+
+a)在您使用本软件时，本软件会记录的您对本软件的一些操作行为信息，包括但不限于您使用本软件进行文件上传的耗时、类型、数量等信息。
+
+2.信息的使用
+
+a)在获得您的使用数据之后，本软件会将其上传至数据分析服务器，以便分析数据后，提供给您更好的服务。
+
+3.信息披露
+
+a)本软件不会将您的信息披露给不受信任的第三方。
+
+b)根据法律的有关规定，或者行政或司法机构的要求，向第三方或者行政、司法机构披露；
+
+c)如您出现违反中国有关法律、法规或者相关规则的情况，需要向第三方披露；
+
+4.信息安全
+
+a)本软件不会收集您的个人信息、密钥信息等隐私信息，所收集的信息仅仅作为改善软件、优化体验、了解软件日活等用途。
+`,
+  // action
+  QUIT: '退出'
+}
+
+export type ILocalesKey = keyof typeof ZH_CN
+export type ILocales = typeof ZH_CN