update command

src/components/Pages/MenuProvider.vue

@@ -1,6 +1,6 @@
 <template>
-    <main class="flex-1 px-4 overflow-y-auto bg-white md:mr-3 sm:px-3 md:px-4 rounded-t-2xl md:rounded-t-3xl no-scroll-bar">
-        <div v-if="route.path !== '/home'" class="pt-4 max-w-7xl">
+    <main class="flex-1 px-4 overflow-y-auto bg-white md:mr-3 sm:px-3 md:px-6 rounded-t-2xl md:rounded-t-3xl no-scroll-bar">
+        <div v-if="route.path !== '/home'" class="mt-4 lg:mt-6 max-w-7xl">
             <h1 class="text-xl font-medium md:text-3xl text-dark">{{ currentRouteName }}</h1>
         </div>
         <div class="mt-2 sm:mt-4 dx-viewport">

src/components/Pages/Welcome.vue

@@ -16,7 +16,7 @@
                     </h2>
                     <div class="flex flex-col w-full space-y-3" v-for="menu in query === '' ? recent : filteredMenus"
                         :key="menu.path">
-                        <div @click="openMenu(menu)" class="group">
+                        <div @click="command.openMenu(menu)" class="group">
                             <div
                                 class="flex flex-row items-center justify-between px-3 py-2 rounded-md cursor-pointer select-none group-hover:bg-primary-500 group-hover:text-white group-hover:bg-opacity-80">
                                 <component v-if="menu.path.includes('/gangguan/')" :is="navigationIcon[0]" alt="icon"
@@ -63,17 +63,15 @@
 </template>
 
 <script setup lang="ts">
-import { readData, writeData } from '@/utils/storage'
 import { MagnifyingGlassIcon } from '@heroicons/vue/20/solid';
-import { computed, onMounted, ref, watch } from 'vue'
+import { computed, ref } from 'vue'
 import { useCommandPalattesStore } from '@/stores/command'
 import { IconApp } from '@/utils/icons'
-import { useRouter, type RouteRecordRaw } from 'vue-router'
+import { type RouteRecordRaw } from 'vue-router'
 import { routes, extractLeafRoutes } from '@/router'
 import { navigationIcon } from '@/utils/route';
 
 const command = useCommandPalattesStore()
-const route = useRouter()
 const recent = computed(() => query.value === '' ? command.readRecent() : [])
 const query = ref('')
 
@@ -87,27 +85,5 @@ const filteredMenus = computed(() =>
         ? []
         : searchRoutesByName(routes, query.value)
 )
-const onClose = () => command.open = false
-
-let debounceTimeout: ReturnType<typeof setTimeout> | null = null;
-const onQueryChange = (value: string) => {
-    if (debounceTimeout) {
-        clearTimeout(debounceTimeout);
-    }
-    debounceTimeout = setTimeout(() => {
-        // check if value is empty or only spaces
-        if (value.trim() === '') {
-            query.value = ''
-            return
-        }
-        query.value = value
-    }, 300);
-}
-
-const openMenu = (menu: RouteRecordRaw) => {
-    command.addRecent(menu)
-    route.push(menu.path)
-    onClose()
-}
 
 </script>