feat: add more shortcuts (#508)

Co-authored-by: rick <[email protected]>

Author: LinuxSuRen

console/atest-ui/src/views/TestCase.vue

@@ -9,14 +9,12 @@ import { Cache } from './cache'
 import { API } from './net'
 import { UIAPI } from './net-vue'
 import type { TestCaseResponse } from './cache'
+import { Magic } from './magicKeys'
 import { useI18n } from 'vue-i18n'
 import { JSONPath } from 'jsonpath-plus'
 import { Codemirror } from 'vue-codemirror'
 import jsonlint from 'jsonlint-mod'
-import { useMagicKeys } from '@vueuse/core'
 
-const keys = useMagicKeys()
-const keyAltS = keys['Alt+S']
 const { t } = useI18n()
 
 const props = defineProps({
@@ -30,12 +28,6 @@ let querySuggestedAPIs = NewSuggestedAPIsQuery(Cache.GetCurrentStore().name!, pr
 const testResultActiveTab = ref(Cache.GetPreference().responseActiveTab)
 watch(testResultActiveTab, Cache.WatchResponseActiveTab)
 
-watch(keyAltS, (v) => {
-  if (v) {
-    sendRequest()
-  }
-})
-
 const parameters = ref([] as Pair[])
 const requestLoading = ref(false)
 const testResult = ref({ header: [] as Pair[] } as TestResult)
@@ -47,6 +39,7 @@ const sendRequest = async () => {
     runTestCase()
   }
 }
+Magic.Keys(sendRequest, ['Alt+S', 'Alt+ß'])
 
 const runTestCase = () => {
   requestLoading.value = true

console/atest-ui/src/views/TestSuite.vue

@@ -8,6 +8,7 @@ import { NewSuggestedAPIsQuery, GetHTTPMethods } from './types'
 import { Cache } from './cache'
 import { useI18n } from 'vue-i18n'
 import { API } from './net'
+import { Magic } from './magicKeys'
 import { Codemirror } from 'vue-codemirror'
 import yaml from 'js-yaml'
 
@@ -58,7 +59,7 @@ watch(props, () => {
   load()
 })
 
-function save() {
+const save = () => {
   let oldImportPath = ''
   let hasImport = false
   if (suite.value.spec && suite.value.spec.rpc) {
@@ -94,6 +95,7 @@ function save() {
     }
   )
 }
+Magic.Keys(save, ['Alt+S', 'Alt+ß'])
 
 const isFullScreen = ref(false)
 const dialogVisible = ref(false)
@@ -112,6 +114,7 @@ function openNewTestCaseDialog() {
   dialogVisible.value = true
   querySuggestedAPIs = NewSuggestedAPIsQuery(Cache.GetCurrentStore().name!, props.name!)
 }
+Magic.Keys(openNewTestCaseDialog, ['Alt+N', 'Alt+dead'])
 
 const submitForm = async (formEl: FormInstance | undefined) => {
   if (!formEl) return

console/atest-ui/src/views/magicKeys.ts

@@ -0,0 +1,31 @@
+/*
+Copyright 2024 API Testing Authors.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { watch } from 'vue'
+import { useMagicKeys } from '@vueuse/core'
+
+function Keys(func: () => void, keys: string[]) {
+    const magicKeys = useMagicKeys()
+    keys.forEach(k => {
+        watch(magicKeys[k], (v) => {
+            if (v) func()
+        })
+    })
+}
+
+export const Magic = {
+    Keys
+}