瀏覽代碼

🎁 绑定机器码按钮通过菜单键响应

快乐的梦鱼 4 周之前
父節點
當前提交
2407283edb
共有 2 個文件被更改,包括 26 次插入2 次删除
  1. 18 0
      src/composeable/HandleWindowKey.ts
  2. 8 2
      src/views/HomeView.vue

+ 18 - 0
src/composeable/HandleWindowKey.ts

@@ -0,0 +1,18 @@
+import { onBeforeUnmount, onMounted } from "vue";
+
+export function useHandleWindowKey(key: string, callback: () => void) {
+
+  function handleKeyUp(e: KeyboardEvent) {
+    if (e.key === key) {
+      e.preventDefault();
+      callback();
+    }
+  }
+
+  onMounted(() => {
+    window.addEventListener('keyup', handleKeyUp);
+  });
+  onBeforeUnmount(() => {
+    window.removeEventListener('keyup', handleKeyUp);
+  });
+}

+ 8 - 2
src/views/HomeView.vue

@@ -18,6 +18,7 @@ import { DynamicForm, type IDynamicFormOptions, type IDynamicFormRef } from '@im
 import IndexContent from '@/api/introduction/IndexContent';
 import { SettingsUtils } from '@imengyu/imengyu-utils';
 import Tab from '@/components/small/Tab.vue';
+import { useHandleWindowKey } from '@/composeable/HandleWindowKey';
 
 const router = useRouter();
 const defaultCards = [Card1, Card2, Card3, Card4, Card5, Card6, Card7, Card8];
@@ -167,6 +168,11 @@ function handleClick(item: any) {
     router.push({ name: 'Content', query: { tab: item.id } });
 }
 
+useHandleWindowKey('ContextMenu', () => {
+  showBindDeviceCode.value = true;
+});
+
+
 /* onMounted(() => {
   SettingsUtils.setSettings('deviceCode', '1122');
 }) */
@@ -189,7 +195,7 @@ function handleClick(item: any) {
             { label: mainPageCustomConfigData.content.value?.title || '自定义' },
           ]" @update:modelValue="(v) => mainPageCurrentShowConfig = v == 1" />
         </div>
-        <div v-else class="main-any-button box" :tabindex="1" @click="showBindDeviceCode=true" />
+        <div v-else class="main-any-button box" @click="showBindDeviceCode=true" />
       </div>
 
       <img v-if="mainPageData?.title === 'Default'" src="@/assets/images/Home/title.png" alt="" class="main-title">
@@ -204,7 +210,7 @@ function handleClick(item: any) {
           :style="{
             backgroundImage: `url(${item.image})`
           }"
-          class="main-card round"
+          class="main-card round active"
           @click="handleClick(item)"
         >
           {{ item.title }}