From db9e3e791e3a168c2f3cdef75d5cf1f834bce484 Mon Sep 17 00:00:00 2001
From: viarotel <viarotel@qq.com>
Date: Thu, 11 Jul 2024 17:18:27 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E2=9C=85=20Support=20batch=20screensho?=
 =?UTF-8?q?t=20and=20other=20performance=20optimization?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .vscode/settings.json                         |  3 +-
 CHANGELOG.md                                  | 19 +++++++
 README-CN.md                                  |  2 +-
 README.md                                     |  2 +-
 components.d.ts                               | 32 ------------
 electron/main.js                              |  2 -
 package.json                                  |  2 +-
 src/App.vue                                   |  2 +-
 .../{AppInstall => Application}/index.vue     |  8 +--
 .../BatchActions/Screenshot/index.vue         | 34 +++++++++++++
 .../Device/components/BatchActions/index.vue  | 17 +++++--
 .../{AppInstall => Application}/index.vue     | 13 +++--
 .../ControlBar/Screenshot/index.vue           | 50 ++++++-------------
 .../Device/components/ControlBar/index.vue    |  6 +--
 .../MoreDropdown/components/Record/index.vue  | 24 ++-------
 src/components/Device/index.vue               |  7 +--
 src/components/Preference/index.vue           |  7 +--
 .../{AppSearch => Search}/index.vue           |  0
 src/plugins/auto.js                           |  1 +
 .../components/EleIconLoading}/index.vue      |  2 +-
 src/plugins/element-plus/index.js             | 10 ++++
 src/styles/css/desktop.css                    |  1 +
 22 files changed, 123 insertions(+), 121 deletions(-)
 rename src/components/Device/components/BatchActions/{AppInstall => Application}/index.vue (67%)
 create mode 100644 src/components/Device/components/BatchActions/Screenshot/index.vue
 rename src/components/Device/components/ControlBar/{AppInstall => Application}/index.vue (89%)
 rename src/components/{AppSearch => Search}/index.vue (100%)
 rename src/{components/Device/components/LoadingIcon => plugins/element-plus/components/EleIconLoading}/index.vue (84%)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 0b9f2b6..ffb9835 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -49,5 +49,6 @@
   ],
   "cSpell.words": [
     "bhsn"
-  ]
+  ],
+  "common-intellisense.ui": []
 }
\ No newline at end of file
diff --git a/CHANGELOG.md b/CHANGELOG.md
index cce69ed..52ba658 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,24 @@
 # Changelog
 
+## [1.20.1](https://github.com/viarotel-org/escrcpy/compare/v1.20.0...v1.20.1) (2024-07-04)
+
+
+### Bug Fixes
+
+* 🐛 Fix batch text spelling errors ([062c689](https://github.com/viarotel-org/escrcpy/commit/062c689755df5bcc5f8e38605c7f101762d7ada0))
+
+## [1.20.0](https://github.com/viarotel-org/escrcpy/compare/v1.19.4...v1.20.0) (2024-07-04)
+
+
+### Features
+
+* ✨ Add batch installation application function ([37ce245](https://github.com/viarotel-org/escrcpy/commit/37ce2457bce9a1b661c6db7162023f53268833f5))
+
+
+### Performance Improvements
+
+* 🚀 Add mouse binding options ([7ee4ba4](https://github.com/viarotel-org/escrcpy/commit/7ee4ba4f2b177e6dbfce85036425b51bfa35ecff))
+
 ## [1.19.4](https://github.com/viarotel-org/escrcpy/compare/v1.19.3...v1.19.4) (2024-07-02)
 
 
diff --git a/README-CN.md b/README-CN.md
index 84fcafa..03ff1cb 100644
--- a/README-CN.md
+++ b/README-CN.md
@@ -203,7 +203,7 @@ Windows 及 Linux 端内部集成了 Gnirehtet， 用于提供 PC 到安卓设
 15. 支持批量连接历史设备功能 ✅
 16. 支持使用内置终端执行自定义命令 ✅
 17. 支持设备自动执行镜像 ✅
-18. 添加批量安装应用功能 ✅
+18. 支持常用批量功能 ✅
 19. 支持更多批量处理功能 🚧
 20. 支持对设备进行分组 🚧
 21. 添加文件传输助手功能 🚧
diff --git a/README.md b/README.md
index 518fe32..17b766c 100644
--- a/README.md
+++ b/README.md
@@ -201,7 +201,7 @@ Refer to [scrcpy/doc/shortcuts](https://github.com/Genymobile/scrcpy/blob/master
 15. Support bulk connecting to historical devices ✅
 16. Support to use built-in terminals to execute custom commands ✅
 17. Supports automatic execution of mirror on devices ✅
-18. Add batch installation application function ✅
+18. Support common batch processing function ✅
 19. Support more batch processing functions 🚧
 20. Support the device to group 🚧
 21. Add file transmission assistant function 🚧
diff --git a/components.d.ts b/components.d.ts
index c6282ce..ab50cdb 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -7,21 +7,11 @@ export {}
 /* prettier-ignore */
 declare module 'vue' {
   export interface GlobalComponents {
-    About: typeof import('./src/components/About/index.vue')['default']
-    AppInstall: typeof import('./src/components/Device/components/BatchActions/AppInstall/index.vue')['default']
-    AppSearch: typeof import('./src/components/AppSearch/index.vue')['default']
-    AudioCodecSelect: typeof import('./src/components/Preference/components/AudioCodecSelect/index.vue')['default']
-    BatchActions: typeof import('./src/components/Device/components/BatchActions/index.vue')['default']
-    Camera: typeof import('./src/components/Device/components/MoreDropdown/components/Camera/index.vue')['default']
-    ControlBar: typeof import('./src/components/Device/components/ControlBar/index.vue')['default']
-    Device: typeof import('./src/components/Device/index.vue')['default']
-    DisplaySelect: typeof import('./src/components/Preference/components/DisplaySelect/index.vue')['default']
     ElAutocomplete: typeof import('element-plus/es')['ElAutocomplete']
     ElButton: typeof import('element-plus/es')['ElButton']
     ElCol: typeof import('element-plus/es')['ElCol']
     ElCollapse: typeof import('element-plus/es')['ElCollapse']
     ElCollapseItem: typeof import('element-plus/es')['ElCollapseItem']
-    ElCollapseTransition: typeof import('element-plus/es')['ElCollapseTransition']
     ElDialog: typeof import('element-plus/es')['ElDialog']
     ElDropdown: typeof import('element-plus/es')['ElDropdown']
     ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
@@ -44,28 +34,6 @@ declare module 'vue' {
     ElTabs: typeof import('element-plus/es')['ElTabs']
     ElTag: typeof import('element-plus/es')['ElTag']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
-    FileManage: typeof import('./src/components/Device/components/ControlBar/FileManage/index.vue')['default']
-    Gnirehtet: typeof import('./src/components/Device/components/ControlBar/Gnirehtet/index.vue')['default']
-    KeyboardInjectSelect: typeof import('./src/components/Preference/components/KeyboardInjectSelect/index.vue')['default']
-    LanguageSelect: typeof import('./src/components/Preference/components/LanguageSelect/index.vue')['default']
-    LoadingIcon: typeof import('./src/components/Device/components/LoadingIcon/index.vue')['default']
-    MirrorAction: typeof import('./src/components/Device/components/MirrorAction/index.vue')['default']
-    MirrorGroup: typeof import('./src/components/Device/components/ControlBar/MirrorGroup/index.vue')['default']
-    MoreDropdown: typeof import('./src/components/Device/components/MoreDropdown/index.vue')['default']
-    Otg: typeof import('./src/components/Device/components/MoreDropdown/components/Otg/index.vue')['default']
-    PairDialog: typeof import('./src/components/Device/components/Wireless/PairDialog/index.vue')['default']
-    PathInput: typeof import('./src/components/Preference/components/PathInput/index.vue')['default']
-    Preference: typeof import('./src/components/Preference/index.vue')['default']
-    Record: typeof import('./src/components/Device/components/MoreDropdown/components/Record/index.vue')['default']
-    Remark: typeof import('./src/components/Device/components/Remark/index.vue')['default']
-    Rotation: typeof import('./src/components/Device/components/ControlBar/Rotation/index.vue')['default']
-    Screenshot: typeof import('./src/components/Device/components/ControlBar/Screenshot/index.vue')['default']
-    TerminalAction: typeof import('./src/components/Device/components/TerminalAction/index.vue')['default']
-    TerminalDialog: typeof import('./src/components/Device/components/TerminalAction/components/TerminalDialog/index.vue')['default']
-    VideoCodecSelect: typeof import('./src/components/Preference/components/VideoCodecSelect/index.vue')['default']
-    Volume: typeof import('./src/components/Device/components/ControlBar/Volume/index.vue')['default']
-    Wireless: typeof import('./src/components/Device/components/Wireless/index.vue')['default']
-    WirelessAction: typeof import('./src/components/Device/components/WirelessAction/index.vue')['default']
   }
   export interface ComponentCustomProperties {
     vLoading: typeof import('element-plus/es')['ElLoadingDirective']
diff --git a/electron/main.js b/electron/main.js
index 76b0e9a..f037f6d 100644
--- a/electron/main.js
+++ b/electron/main.js
@@ -27,8 +27,6 @@ log.initialize({ preload: true })
 
 const debug = !!appStore.get('common.debug')
 
-log.info('Debug Status:', debug)
-
 if (!debug) {
   log.warn(
     'Debug Tips:',
diff --git a/package.json b/package.json
index 56f04b1..cdfb6fb 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "escrcpy",
   "type": "module",
-  "version": "1.19.4",
+  "version": "1.20.1",
   "private": true,
   "description": "Scrcpy Powered by Electron",
   "author": "viarotel",
diff --git a/src/App.vue b/src/App.vue
index 16fc657..746ac26 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -33,7 +33,7 @@ import { ElMessageBox } from 'element-plus'
 import Device from './components/Device/index.vue'
 import Preference from './components/Preference/index.vue'
 import About from './components/About/index.vue'
-import AppSearch from './components/AppSearch/index.vue'
+import AppSearch from './components/Search/index.vue'
 
 import { useThemeStore } from '$/store/theme/index.js'
 import { usePreferenceStore } from '$/store/preference/index.js'
diff --git a/src/components/Device/components/BatchActions/AppInstall/index.vue b/src/components/Device/components/BatchActions/Application/index.vue
similarity index 67%
rename from src/components/Device/components/BatchActions/AppInstall/index.vue
rename to src/components/Device/components/BatchActions/Application/index.vue
index 7aeef33..5482a82 100644
--- a/src/components/Device/components/BatchActions/AppInstall/index.vue
+++ b/src/components/Device/components/BatchActions/Application/index.vue
@@ -1,17 +1,17 @@
 <template>
   <div class="" @click="handleClick">
     <slot />
-    <AppInstallProxy ref="appInstallProxyRef" />
+    <ApplicationProxy ref="applicationProxyRef" />
   </div>
 </template>
 
 <script>
-import AppInstallProxy from '$/components/Device/components/ControlBar/AppInstall/index.vue'
+import ApplicationProxy from '$/components/Device/components/ControlBar/Application/index.vue'
 import { sleep } from '$/utils'
 
 export default {
   components: {
-    AppInstallProxy,
+    ApplicationProxy,
   },
   props: {
     devices: {
@@ -23,7 +23,7 @@ export default {
     async handleClick() {
       for (let index = 0; index < this.devices.length; index++) {
         const item = this.devices[index]
-        await this.$refs.appInstallProxyRef.handleInstall(item)
+        await this.$refs.applicationProxyRef.invoke(item)
         await sleep(2 * 1000)
       }
     },
diff --git a/src/components/Device/components/BatchActions/Screenshot/index.vue b/src/components/Device/components/BatchActions/Screenshot/index.vue
new file mode 100644
index 0000000..5d91b48
--- /dev/null
+++ b/src/components/Device/components/BatchActions/Screenshot/index.vue
@@ -0,0 +1,34 @@
+<template>
+  <div class="" @click="handleClick">
+    <slot />
+    <ScreenshotProxy ref="screenshotProxyRef" />
+  </div>
+</template>
+
+<script>
+import ScreenshotProxy from '$/components/Device/components/ControlBar/Screenshot/index.vue'
+import { sleep } from '$/utils'
+
+export default {
+  components: {
+    ScreenshotProxy,
+  },
+  props: {
+    devices: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  methods: {
+    async handleClick() {
+      for (let index = 0; index < this.devices.length; index++) {
+        const item = this.devices[index]
+        await this.$refs.screenshotProxyRef.invoke(item)
+        await sleep(2 * 1000)
+      }
+    },
+  },
+}
+</script>
+
+<style></style>
diff --git a/src/components/Device/components/BatchActions/index.vue b/src/components/Device/components/BatchActions/index.vue
index 8073157..33468c0 100644
--- a/src/components/Device/components/BatchActions/index.vue
+++ b/src/components/Device/components/BatchActions/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex items-center">
+  <div class="flex items-center space-x-2">
     <component
       :is="item.component || 'div'"
       v-for="(item, index) in actionModel"
@@ -31,7 +31,7 @@
               <component :is="item.elIcon" />
             </el-icon>
           </template>
-          {{ $t('common.batch') }}{{ $t(item.label) }}
+          {{ $t('common.batch') }}-{{ $t(item.label) }}
         </el-button>
       </template>
     </component>
@@ -39,11 +39,13 @@
 </template>
 
 <script>
-import AppInstall from './AppInstall/index.vue'
+import Application from './Application/index.vue'
+import Screenshot from './Screenshot/index.vue'
 
 export default {
   components: {
-    AppInstall,
+    Application,
+    Screenshot,
   },
   props: {
     devices: {
@@ -54,10 +56,15 @@ export default {
   data() {
     return {
       actionModel: [
+        {
+          label: 'device.control.capture',
+          elIcon: 'Crop',
+          component: 'Screenshot',
+        },
         {
           label: 'device.control.install',
           svgIcon: 'install',
-          component: 'AppInstall',
+          component: 'Application',
         },
       ],
     }
diff --git a/src/components/Device/components/ControlBar/AppInstall/index.vue b/src/components/Device/components/ControlBar/Application/index.vue
similarity index 89%
rename from src/components/Device/components/ControlBar/AppInstall/index.vue
rename to src/components/Device/components/ControlBar/Application/index.vue
index b08b706..c4559db 100644
--- a/src/components/Device/components/ControlBar/AppInstall/index.vue
+++ b/src/components/Device/components/ControlBar/Application/index.vue
@@ -5,8 +5,6 @@
 </template>
 
 <script>
-import LoadingIcon from '$/components/Device/components/LoadingIcon/index.vue'
-
 export default {
   props: {
     device: {
@@ -18,6 +16,9 @@ export default {
     return {}
   },
   methods: {
+    invoke(...args) {
+      return this.handleInstall(...args)
+    },
     preferenceData(...args) {
       return this.$store.preference.getData(...args)
     },
@@ -46,13 +47,11 @@ export default {
         return false
       }
 
-      const messageEl = this.$message({
-        message: this.$t('device.control.install.progress', {
+      const messageEl = this.$message.loading(
+        this.$t('device.control.install.progress', {
           deviceName: this.$store.device.getLabel(device),
         }),
-        icon: LoadingIcon,
-        duration: 0,
-      })
+      )
 
       let failCount = 0
 
diff --git a/src/components/Device/components/ControlBar/Screenshot/index.vue b/src/components/Device/components/ControlBar/Screenshot/index.vue
index 1353f20..09bcb72 100644
--- a/src/components/Device/components/ControlBar/Screenshot/index.vue
+++ b/src/components/Device/components/ControlBar/Screenshot/index.vue
@@ -1,12 +1,10 @@
 <template>
-  <div class="" @click="handleScreenCap(device)">
+  <div class="" @click="handleCapture(device)">
     <slot />
   </div>
 </template>
 
 <script>
-import LoadingIcon from '$/components/Device/components/LoadingIcon/index.vue'
-
 export default {
   props: {
     device: {
@@ -18,21 +16,22 @@ export default {
     return {}
   },
   methods: {
+    invoke(...args) {
+      return this.handleCapture(...args)
+    },
     preferenceData(...args) {
       return this.$store.preference.getData(...args)
     },
-    async handleScreenCap(device) {
-      const messageEl = this.$message({
-        message: this.$t('device.control.capture.progress', {
+    async handleCapture(device) {
+      const messageEl = this.$message.loading(
+        this.$t('device.control.capture.progress', {
           deviceName: this.$store.device.getLabel(device),
         }),
-        icon: LoadingIcon,
-        duration: 0,
-      })
+      )
 
       const fileName = this.$store.device.getLabel(
         device,
-        ({ time }) => `screenshot-${time}.png`,
+        ({ time }) => `screenshot-${time}.jpg`,
       )
 
       const deviceConfig = this.preferenceData(device.id)
@@ -40,7 +39,7 @@ export default {
 
       try {
         await this.$adb.screencap(device.id, { savePath })
-        this.handleScreencapSuccess(savePath)
+        await this.handleSuccess(savePath)
       }
       catch (error) {
         if (error.message) {
@@ -50,29 +49,12 @@ export default {
 
       messageEl.close()
     },
-    async handleScreencapSuccess(savePath) {
-      try {
-        await this.$confirm(
-          this.$t('device.control.capture.success.message'),
-          this.$t('device.control.capture.success.message.title'),
-          {
-            confirmButtonText: this.$t('common.confirm'),
-            cancelButtonText: this.$t('common.cancel'),
-            closeOnClickModal: false,
-            type: 'success',
-          },
-        )
-
-        await this.$electron.ipcRenderer.invoke(
-          'show-item-in-folder',
-          savePath,
-        )
-      }
-      catch (error) {
-        if (error.message) {
-          this.$message.warning(error.message)
-        }
-      }
+    async handleSuccess(savePath) {
+      return this.$message.success(
+        `${this.$t(
+          'device.control.capture.success.message.title',
+        )}: ${savePath}`,
+      )
     },
   },
 }
diff --git a/src/components/Device/components/ControlBar/index.vue b/src/components/Device/components/ControlBar/index.vue
index fd250ae..2718789 100644
--- a/src/components/Device/components/ControlBar/index.vue
+++ b/src/components/Device/components/ControlBar/index.vue
@@ -66,7 +66,7 @@
 
 <script>
 import Screenshot from './Screenshot/index.vue'
-import AppInstall from './AppInstall/index.vue'
+import Application from './Application/index.vue'
 import Gnirehtet from './Gnirehtet/index.vue'
 import MirrorGroup from './MirrorGroup/index.vue'
 import Rotation from './Rotation/index.vue'
@@ -76,7 +76,7 @@ import FileManage from './FileManage/index.vue'
 export default {
   components: {
     Screenshot,
-    AppInstall,
+    Application,
     Gnirehtet,
     MirrorGroup,
     Rotation,
@@ -142,7 +142,7 @@ export default {
         {
           label: 'device.control.install',
           svgIcon: 'install',
-          component: 'AppInstall',
+          component: 'Application',
         },
         {
           label: 'device.control.file.name',
diff --git a/src/components/Device/components/MoreDropdown/components/Record/index.vue b/src/components/Device/components/MoreDropdown/components/Record/index.vue
index 28ef644..7392554 100644
--- a/src/components/Device/components/MoreDropdown/components/Record/index.vue
+++ b/src/components/Device/components/MoreDropdown/components/Record/index.vue
@@ -51,7 +51,7 @@ export default {
 
         await recording
 
-        this.onRecordSuccess(savePath)
+        await this.handleSuccess(savePath)
       }
       catch (error) {
         console.error('record.args', args)
@@ -79,24 +79,10 @@ export default {
 
       return value
     },
-    async onRecordSuccess(savePath) {
-      try {
-        await this.$confirm(
-          this.$t('device.record.success.message'),
-          this.$t('device.record.success.title'),
-          {
-            confirmButtonText: this.$t('common.confirm'),
-            cancelButtonText: this.$t('common.cancel'),
-            closeOnClickModal: false,
-            type: 'success',
-          },
-        )
-
-        await this.$electron.ipcRenderer.invoke('show-item-in-folder', savePath)
-      }
-      catch (error) {
-        console.warn(error)
-      }
+    async handleSuccess(savePath) {
+      return this.$message.success(
+        `${this.$t('device.record.success.title')}: ${savePath}`,
+      )
     },
   },
 }
diff --git a/src/components/Device/index.vue b/src/components/Device/index.vue
index 308af98..b10128e 100644
--- a/src/components/Device/index.vue
+++ b/src/components/Device/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="h-full flex flex-col">
-    <div class="flex items-center flex-none space-x-2 pt-1">
+    <div class="flex items-center flex-none space-x-2 py-1 overflow-x-auto">
       <Wireless ref="wireless" :reload="getDeviceData" />
 
       <div class="w-px h-7 !ml-4 !mr-2 bg-gray-200"></div>
@@ -33,7 +33,7 @@
 
     <BatchActions
       class="overflow-hidden transition-all"
-      :class="isMultipleRow ? 'h-12 opacity-100 mt-4' : 'h-0 opacity-0 mt-0'"
+      :class="isMultipleRow ? 'h-12 opacity-100 mt-3' : 'h-0 opacity-0 mt-0'"
       :devices="selectionRows"
     />
 
@@ -68,6 +68,7 @@
           sortable
           show-overflow-tooltip
           align="left"
+          min-width="200"
         >
           <template #default="{ row }">
             <div class="flex items-center">
@@ -96,7 +97,7 @@
         <el-table-column
           v-slot="{ row, $index }"
           :label="$t('device.control.name')"
-          width="450"
+          width="400"
           align="left"
         >
           <MirrorAction
diff --git a/src/components/Preference/index.vue b/src/components/Preference/index.vue
index f5b7a8c..e10035d 100644
--- a/src/components/Preference/index.vue
+++ b/src/components/Preference/index.vue
@@ -208,7 +208,6 @@ import DisplaySelect from './components/DisplaySelect/index.vue'
 import KeyboardInjectSelect from './components/KeyboardInjectSelect/index.vue'
 
 import { usePreferenceStore } from '$/store/index.js'
-import LoadingIcon from '$/components/Device/components/LoadingIcon/index.vue'
 
 export default {
   components: {
@@ -349,11 +348,7 @@ export default {
     },
 
     async handleExport() {
-      const messageEl = this.$message({
-        message: this.$t('preferences.config.export.message'),
-        icon: LoadingIcon,
-        duration: 0,
-      })
+      const messageEl = this.$message.loading(this.$t('preferences.config.export.message'))
 
       try {
         await this.$electron.ipcRenderer.invoke('show-save-dialog', {
diff --git a/src/components/AppSearch/index.vue b/src/components/Search/index.vue
similarity index 100%
rename from src/components/AppSearch/index.vue
rename to src/components/Search/index.vue
diff --git a/src/plugins/auto.js b/src/plugins/auto.js
index 0e9c6c2..4e63297 100644
--- a/src/plugins/auto.js
+++ b/src/plugins/auto.js
@@ -16,6 +16,7 @@ export default () => {
     }),
     useAutoComponents({
       resolvers,
+      dirs: 'none',
     }),
   ]
 }
diff --git a/src/components/Device/components/LoadingIcon/index.vue b/src/plugins/element-plus/components/EleIconLoading/index.vue
similarity index 84%
rename from src/components/Device/components/LoadingIcon/index.vue
rename to src/plugins/element-plus/components/EleIconLoading/index.vue
index 074ba74..1388dfd 100644
--- a/src/components/Device/components/LoadingIcon/index.vue
+++ b/src/plugins/element-plus/components/EleIconLoading/index.vue
@@ -6,7 +6,7 @@
 
 <script>
 export default {
-  name: 'LoadingIcon',
+  name: 'EleIconLoading',
 }
 </script>
 
diff --git a/src/plugins/element-plus/index.js b/src/plugins/element-plus/index.js
index 7874d74..0e07347 100644
--- a/src/plugins/element-plus/index.js
+++ b/src/plugins/element-plus/index.js
@@ -8,12 +8,22 @@ import 'element-plus/theme-chalk/el-message-box.css'
 import 'element-plus/theme-chalk/dark/css-vars.css'
 import './restyle.css'
 
+import EleIconLoading from './components/EleIconLoading/index.vue'
+
 export default {
   install(app) {
     for (const [key, component] of Object.entries(ElementPlusIcons)) {
       app.component(key, component)
     }
 
+    ElMessage.loading = (message, options = {}) =>
+      ElMessage({
+        duration: 0,
+        ...options,
+        message,
+        icon: EleIconLoading,
+      })
+
     app.use(ElMessage)
     app.use(ElMessageBox)
     app.use(ElLoading)
diff --git a/src/styles/css/desktop.css b/src/styles/css/desktop.css
index 0ef191f..4b44d67 100644
--- a/src/styles/css/desktop.css
+++ b/src/styles/css/desktop.css
@@ -7,6 +7,7 @@ html {
 @screen sm {
   ::-webkit-scrollbar {
     width: 8px;
+    height: 8px;
   }
 
   ::-webkit-scrollbar-track {