chore: add more magic keys on ui page (#509)

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

Author: LinuxSuRen

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

@@ -8,6 +8,7 @@ import { API } from './net'
 import { UIAPI } from './net-vue'
 import { SupportedExtensions } from './store'
 import { useI18n } from 'vue-i18n'
+import { Magic } from './magicKeys'
 
 const { t } = useI18n()
 
@@ -64,6 +65,7 @@ function loadStores() {
   })
 }
 loadStores()
+Magic.Keys(loadStores, ['Alt+KeyR'])
 
 function deleteStore(name: string) {
   API.DeleteStore(name, (e) => {
@@ -108,6 +110,7 @@ function addStore() {
     dialogVisible.value = true
     createAction.value = true
 }
+Magic.Keys(addStore, ['Alt+KeyN'])
 
 const rules = reactive<FormRules<Store>>({
   name: [{ required: true, message: 'Name is required', trigger: 'blur' }],

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

@@ -3,6 +3,7 @@ import { ref } from 'vue'
 import type { Pair } from './types'
 import { API } from './net'
 import { useI18n } from 'vue-i18n'
+import { Magic } from './magicKeys'
 
 const { t } = useI18n()
 
@@ -15,6 +16,10 @@ function queryFuncs() {
         funcs.value = d.data
     })
 }
+
+Magic.Keys(() => {
+    dialogVisible.value = true
+}, ['Alt+KeyT'])
 </script>
 
 <template>

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

@@ -27,6 +27,9 @@ const emit = defineEmits(['updated'])
 let querySuggestedAPIs = NewSuggestedAPIsQuery(Cache.GetCurrentStore().name!, props.suite!)
 const testResultActiveTab = ref(Cache.GetPreference().responseActiveTab)
 watch(testResultActiveTab, Cache.WatchResponseActiveTab)
+Magic.Keys(() => {
+  testResultActiveTab.value = 'output'
+}, ['Alt+KeyO'])
 
 const parameters = ref([] as Pair[])
 const requestLoading = ref(false)
@@ -349,6 +352,15 @@ watch(currentCodeGenerator, () => {
 const options = GetHTTPMethods()
 const requestActiveTab = ref(Cache.GetPreference().requestActiveTab)
 watch(requestActiveTab, Cache.WatchRequestActiveTab)
+Magic.Keys(() => {
+  requestActiveTab.value = 'query'
+}, ['Alt+KeyQ'])
+Magic.Keys(() => {
+  requestActiveTab.value = 'header'
+}, ['Alt+KeyH'])
+Magic.Keys(() => {
+  requestActiveTab.value = 'body'
+}, ['Alt+KeyB'])
 
 function bodyFiledExpectChange() {
   const data = testCaseWithSuite.value.data.response.bodyFieldsExpect
@@ -525,6 +537,7 @@ const openDuplicateTestCaseDialog = () => {
     duplicateTestCaseDialog.value = true
     targetTestCaseName.value = props.name + '-copy'
 }
+Magic.Keys(openDuplicateTestCaseDialog, ['Alt+KeyD'])
 const duplicateTestCase = () => {
     API.DuplicateTestCase(props.suite, props.suite, props.name, targetTestCaseName.value,(d) => {
         duplicateTestCaseDialog.value = false
@@ -535,6 +548,11 @@ const duplicateTestCase = () => {
         emit('updated')
     })
 }
+Magic.Keys(() => {
+  if (duplicateTestCaseDialog.value) {
+    duplicateTestCase()
+  }
+}, ['Alt+KeyO'])
 </script>
 
 <template>