perf: 🧑‍💻 Improve device-based terminal experience

src/components/Device/components/BatchActions/Tasks/components/TaskDialog/index.vue

@@ -127,12 +127,12 @@
         >
           <InputPath
             v-model="model.extra"
-            :placeholder="$t('device.control.shell.select')"
+            :placeholder="$t('device.control.terminal.script.select')"
             :data="{
               properties: ['openFile'],
               filters: [
                 {
-                  name: $t('device.control.shell.select'),
+                  name: $t('device.control.terminal.script.select'),
                   extensions: ['sh'],
                 },
               ],

src/components/Device/components/BatchActions/index.vue

@@ -43,7 +43,7 @@
 import Application from './Application/index.vue'
 import FilePush from './FilePush/index.vue'
 import Screenshot from './Screenshot/index.vue'
-import Shell from './Shell/index.vue'
+import Script from './Script/index.vue'
 import Tasks from './Tasks/index.vue'
 
 const props = defineProps({
@@ -70,9 +70,9 @@ const actionModel = [
     component: FilePush,
   },
   {
-    label: 'device.control.shell.name',
+    label: 'device.control.terminal.script.name',
     svgIcon: 'command',
-    component: Shell,
+    component: Script,
   },
   {
     label: 'device.task.name',

src/components/Device/components/ControlBar/Terminal/index.vue

@@ -0,0 +1,40 @@
+<template>
+  <el-dropdown>
+    <slot :loading />
+
+    <template #dropdown>
+      <el-dropdown-menu>
+        <el-dropdown-item @click="handleCommand(device)">
+          {{ $t('device.control.terminal.command.name') }}
+        </el-dropdown-item>
+        <el-dropdown-item @click="handleScript(device)">
+          {{ $t('device.control.terminal.script.name') }}
+        </el-dropdown-item>
+      </el-dropdown-menu>
+    </template>
+  </el-dropdown>
+</template>
+
+<script setup>
+import { useShellAction } from '$/composables/useShellAction/index.js'
+import { useTaskStore } from '$/store'
+
+const props = defineProps({
+  device: {
+    type: Object,
+    default: () => null,
+  },
+})
+
+const { loading, invoke: handleScript } = useShellAction()
+
+function handleCommand(device) {
+  const taskStore = useTaskStore()
+
+  const command = `adb -s ${device.id} `
+
+  taskStore.emit('terminal', { command })
+}
+</script>
+
+<style></style>

src/components/Device/components/ControlBar/index.vue

@@ -64,28 +64,26 @@
 </template>
 
 <script>
-// import Synergy from './Synergy/index.vue'
 import Application from './Application/index.vue'
 import ApplicationStart from './ApplicationStart/index.vue'
 import FileManage from './FileManage/index.vue'
 import Gnirehtet from './Gnirehtet/index.vue'
 import Rotation from './Rotation/index.vue'
 import Screenshot from './Screenshot/index.vue'
-import Shell from './Shell/index.vue'
+import Terminal from './Terminal/index.vue'
 import Tasks from './Tasks/index.vue'
 import Volume from './Volume/index.vue'
 
 export default {
   components: {
-    // Synergy,
     Screenshot,
     Application,
     ApplicationStart,
     Gnirehtet,
     Rotation,
     Volume,
     FileManage,
-    Shell,
+    Terminal,
     Tasks,
   },
   props: {
@@ -176,10 +174,9 @@ export default {
           hiddenKeys: ['floating'],
         },
         {
-          label: 'device.control.shell.name',
+          label: 'device.terminal.name',
           svgIcon: 'command',
-          component: 'Shell',
-          tips: 'device.control.shell.tips',
+          component: 'Terminal',
           hiddenKeys: ['floating'],
         },
         {

src/components/Quick/components/Terminal/components/TerminalDialog/index.vue

@@ -123,7 +123,7 @@ function close() {
   visible.value = false
 }
 
-async function invoke(command) {
+async function invoke(command, options = {}) {
   visible.value = true
 
   const shell = await getShell()
@@ -132,7 +132,9 @@ async function invoke(command) {
 
   await focus()
 
-  ElMessage.info(window.t('device.control.shell.enter'))
+  if (options.message) {
+    ElMessage.info(options.message)
+  }
 }
 
 async function focus() {
@@ -169,7 +171,7 @@ function onClosed() {
 }
 
 taskStore.on('terminal', (task) => {
-  invoke(task.command)
+  invoke(task.command, { message: task.message })
 })
 
 defineExpose({

src/composables/useShellAction/index.js

@@ -19,14 +19,16 @@ export function useShellAction() {
     return singleInvoke(...args)
   }
 
-  async function singleInvoke(device, { files } = {}) {
+  async function singleInvoke(device, { files, actionType } = {}) {
+    loading.value = true
+
     if (!files) {
       try {
         files = await selectAndSendFileToDevice(device.id, {
           extensions: ['sh'],
-          selectText: window.t('device.control.shell.select'),
-          loadingText: window.t('device.control.shell.push.loading'),
-          successText: window.t('device.control.shell.push.success'),
+          selectText: window.t('device.control.terminal.script.select'),
+          loadingText: window.t('device.control.terminal.script.push.loading'),
+          successText: window.t('device.control.terminal.script.push.success'),
         })
       }
       catch (error) {
@@ -36,25 +38,25 @@ export function useShellAction() {
       }
     }
 
-    loading.value = true
-
     const filePath = files[0]
 
     const command = `adb -s ${device.id} shell sh ${filePath}`
 
-    taskStore.emit('terminal', { command })
+    taskStore.emit('terminal', { command, message: window.t('device.control.terminal.script.enter') })
 
     loading.value = false
   }
 
   async function multipleInvoke(devices, { files } = {}) {
+    loading.value = true
+
     if (!files) {
       try {
         files = await window.electron.ipcRenderer.invoke('show-open-dialog', {
           properties: ['openFile'],
           filters: [
             {
-              name: window.t('device.control.shell.select'),
+              name: window.t('device.control.terminal.script.select'),
               extensions: ['sh'],
             },
           ],
@@ -65,14 +67,14 @@ export function useShellAction() {
           const message = error.message?.match(/Error: (.*)/)?.[1]
           ElMessage.warning(message || error.message)
         }
+
+        loading.value = false
         return false
       }
     }
 
-    loading.value = true
-
     const closeLoading = ElMessage.loading(
-      window.t('device.control.shell.push.loading'),
+      window.t('device.control.terminal.script.push.loading'),
     ).close
 
     const failFiles = []
@@ -108,7 +110,7 @@ export function useShellAction() {
 
     closeLoading()
 
-    await ElMessage.success(window.t('device.control.shell.success'))
+    await ElMessage.success(window.t('device.control.terminal.script.success'))
 
     loading.value = false
   }

src/locales/languages/en-US.json

@@ -155,13 +155,13 @@
   "device.control.file.manager.download": "Download File",
   "device.control.file.manager.download.tips": "Are you sure you want to download the selected content?",
   "device.control.file.manager.delete.tips": "Are you sure you want to delete the selected content?",
-  "device.control.shell.name": "Execute Script",
-  "device.control.shell.tips": "Perform custom script through the ADB command",
-  "device.control.shell.select": "Please select the script you want to execute",
-  "device.control.shell.push.loading": "Push script...",
-  "device.control.shell.push.success": "Push script success",
-  "device.control.shell.enter": "Please enter the Enter key to confirm the execution of the script",
-  "device.control.shell.success": "Script execution successfully",
+  "device.control.terminal.command.name": "Execute Command",
+  "device.control.terminal.script.name": "Execute Script",
+  "device.control.terminal.script.select": "Please select the script you want to execute",
+  "device.control.terminal.script.push.loading": "Push script...",
+  "device.control.terminal.script.push.success": "Push script success",
+  "device.control.terminal.script.enter": "Please enter the Enter key to confirm the execution of the script",
+  "device.control.terminal.script.success": "Script execution successfully",
   "device.control.capture": "Screenshot",
   "device.control.capture.progress": "Capturing screenshot for {deviceName}...",
   "device.control.capture.success.message": "Open screenshot location?",