✨ Feature: support short url now

src/renderer/pages/Gallery.vue

@@ -31,7 +31,7 @@
             class="handle-bar"
             :gutter="16"
           >
-            <el-col :span="6">
+            <el-col :span="5">
               <el-select
                 v-model="choosedPicBed"
                 multiple
@@ -66,7 +66,7 @@
                 border-style="hidden"
               />
             </el-col>
-            <el-col :span="5">
+            <el-col :span="3">
               <el-select
                 v-model="pasteStyle"
                 size="small"
@@ -82,6 +82,22 @@
                 />
               </el-select>
             </el-col>
+            <el-col :span="3">
+              <el-select
+                v-model="useShortUrl"
+                size="small"
+                style="width: 100%"
+                placeholder="Choose"
+                @change="handleUseShortUrlChange"
+              >
+                <el-option
+                  v-for="(value, key) in shortURLMap"
+                  :key="key"
+                  :label="key"
+                  :value="value"
+                />
+              </el-select>
+            </el-col>
             <el-col :span="2">
               <el-dropdown>
                 <el-button
@@ -112,7 +128,7 @@
             class="handle-bar"
             :gutter="16"
           >
-            <el-col :span="6">
+            <el-col :span="5">
               <el-input
                 v-model="searchText"
                 :placeholder="$T('GALLERY_SEARCH_FILENAME')"
@@ -146,6 +162,13 @@
                 </template>
               </el-input>
             </el-col>
+            <el-col :span="1">
+              <el-divider
+                direction="vertical"
+                style="height: 100%;"
+                border-style="hidden"
+              />
+            </el-col>
             <el-col :span="3">
               <div
                 class="item-base copy round"
@@ -439,6 +462,11 @@ const pasteStyleMap = {
   UBB: 'UBB',
   Custom: 'Custom'
 }
+const useShortUrl = ref<string>('')
+const shortURLMap = {
+  [$T('UPLOAD_SHORT_URL')]: $T('UPLOAD_SHORT_URL'),
+  [$T('UPLOAD_NORMAL_URL')]: $T('UPLOAD_NORMAL_URL')
+}
 const fileSortNameReverse = ref(false)
 const fileSortTimeReverse = ref(false)
 const fileSortExtReverse = ref(false)
@@ -835,6 +863,11 @@ async function handlePasteStyleChange (val: string) {
   pasteStyle.value = val
 }
 
+function handleUseShortUrlChange (value: string) {
+  saveConfig('settings.useShortUrl', value === $T('UPLOAD_SHORT_URL'))
+  useShortUrl.value = value
+}
+
 function sortFile (type: 'name' | 'time' | 'ext' | 'check') {
   switch (type) {
     case 'name':
@@ -954,6 +987,7 @@ onBeforeUnmount(() => {
 
 onActivated(async () => {
   pasteStyle.value = (await getConfig('settings.pasteStyle')) || 'markdown'
+  useShortUrl.value = (await getConfig('settings.useShortUrl') ? $T('UPLOAD_SHORT_URL') : $T('UPLOAD_NORMAL_URL'))
   initDeleteCloud()
 })
 

src/renderer/pages/PicGoSetting.vue

@@ -312,6 +312,16 @@
                 @change="handleAutoCopyUrl"
               />
             </el-form-item>
+            <el-form-item
+              :label="$T('SETTINGS_SHORT_URL')"
+            >
+              <el-switch
+                v-model="form.useShortUrl"
+                :active-text="$T('SETTINGS_OPEN')"
+                :inactive-text="$T('SETTINGS_CLOSE')"
+                @change="handleUseShortUrl"
+              />
+            </el-form-item>
             <el-form-item>
               <template #label>
                 <el-row align="middle">
@@ -1062,7 +1072,8 @@ const form = reactive<ISettingForm>({
   customMiniIcon: '',
   isHideDock: false,
   encodeOutputURL: true,
-  isAutoListenClipboard: false
+  isAutoListenClipboard: false,
+  useShortUrl: false
 })
 
 const languageList = i18nManager.languageList.map(item => ({
@@ -1160,6 +1171,7 @@ async function initData () {
     form.isCustomMiniIcon = settings.isCustomMiniIcon || false
     form.customMiniIcon = settings.customMiniIcon || ''
     form.isHideDock = settings.isHideDock || false
+    form.useShortUrl = settings.useShortUrl || false
     currentLanguage.value = settings.language ?? 'zh-CN'
     currentStartMode.value = settings.startMode || 'quiet'
     customLink.value = settings.customLink || '![$fileName]($url)'
@@ -1414,6 +1426,16 @@ function handleAutoCopyUrl (val: ICheckBoxValueType) {
   }
 }
 
+function handleUseShortUrl (val: ICheckBoxValueType) {
+  saveConfig('settings.useShortUrl', val)
+  const successNotification = new Notification($T('SETTINGS_SHORT_URL'), {
+    body: $T('TIPS_SET_SUCCEED')
+  })
+  successNotification.onclick = () => {
+    return true
+  }
+}
+
 function confirmLogLevelSetting () {
   if (form.logLevel.length === 0) {
     return $message.error($T('TIPS_PLEASE_CHOOSE_LOG_LEVEL'))

src/renderer/pages/TrayPage.vue

@@ -70,7 +70,7 @@ import { IResult } from '@picgo/store/dist/types'
 import { OPEN_WINDOW } from '#/events/constants'
 import { IPasteStyle, IWindowList } from '#/types/enum'
 import { getConfig, sendToMain } from '@/utils/dataSender'
-import { handleUrlEncode } from '#/utils/common'
+import { handleUrlEncode, generateShortUrl } from '#/utils/common'
 
 const files = ref<IResult<ImgInfo>[]>([])
 const notification = reactive({
@@ -127,6 +127,10 @@ async function pasteTemplate (style: IPasteStyle, item: ImgInfo, customLink: str
   if ((await getConfig('settings.encodeOutputURL')) !== false) {
     url = handleUrlEncode(url)
   }
+  const useShortUrl = await getConfig('settings.useShortUrl') || false
+  if (useShortUrl) {
+    url = await generateShortUrl(url)
+  }
   const _customLink = customLink || '![$fileName]($url)'
   const tpl = {
     markdown: `![](${url})`,

src/renderer/pages/Upload.vue

@@ -102,6 +102,24 @@
                 :title="customLink"
               />
             </el-radio-group>
+            <el-radio-group
+              v-model="useShortUrl"
+              size="small"
+              @change="handleUseShortUrlChange"
+            >
+              <el-radio-button
+                :label="true"
+                style="border-radius: 5px"
+              >
+                {{ $T('UPLOAD_SHORT_URL') }}
+              </el-radio-button>
+              <el-radio-button
+                :label="false"
+                style="border-radius: 5px"
+              >
+                {{ $T('UPLOAD_NORMAL_URL') }}
+              </el-radio-button>
+            </el-radio-group>
           </div>
           <div class="el-col-8">
             <div class="paste-style__text">
@@ -386,6 +404,7 @@ import { PICBEDS_PAGE } from '@/router/config'
 const $router = useRouter()
 
 const imageProcessDialogVisible = ref(false)
+const useShortUrl = ref(false)
 
 const waterMarkPositionMap = new Map([
   ['north', $T('UPLOAD_PAGE_IMAGE_PROCESS_POSITION_TOP')],
@@ -488,6 +507,7 @@ onBeforeMount(() => {
       showError.value = true
     }
   })
+  getUseShortUrl()
   getPasteStyle()
   getDefaultPicBed()
   ipcRenderer.on('syncPicBed', () => {
@@ -605,6 +625,17 @@ async function getPasteStyle () {
   customLink.value = await getConfig('settings.customLink') || '![$fileName]($url)'
 }
 
+async function getUseShortUrl () {
+  useShortUrl.value = await getConfig('settings.useShortUrl') || false
+}
+
+async function handleUseShortUrlChange () {
+  console.log(useShortUrl.value)
+  saveConfig({
+    'settings.useShortUrl': useShortUrl.value
+  })
+}
+
 function handlePasteStyleChange (val: string | number | boolean) {
   saveConfig({
     'settings.pasteStyle': val