add route page to recent when menu load

This commit is contained in:
Dede Fuji Abdul 2023-10-26 16:52:25 +07:00
parent a9b1d720d9
commit 92706caf90
4 changed files with 35 additions and 9 deletions

View File

@ -116,10 +116,6 @@ import { useCommandPalattesStore } from '@/stores/command'
import { navigationIcon } from '@/utils/route'
const command = useCommandPalattesStore()
const searchRoutesByName = (routes: RouteRecordRaw[], query: string): RouteRecordRaw[] => {
const matchingRoutes = extractLeafRoutes(routes, '').filter((item: RouteRecordRaw) => item.path.includes('home/') && item.name?.toString().toLocaleLowerCase().includes(query.toLocaleLowerCase()))
return matchingRoutes
}
const route = useRouter()
const recent = computed(() => query.value === '' ? command.readRecent() : [])
@ -127,7 +123,7 @@ const query = ref('')
const filteredMenus = computed(() =>
query.value === ''
? []
: searchRoutesByName(routes, query.value)
: command.searchRoutesByName(routes, query.value)
)
const onClose = () => command.open = false

View File

@ -112,7 +112,7 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
onMounted(() => {
createDummy()
console.log(readDataJson('data-daftar-1'));
// console.log(readDataJson('data-daftar-1'));
})

View File

@ -2,6 +2,7 @@ import { ref } from 'vue'
import { defineStore } from 'pinia'
import type { RouteRecordRaw } from 'vue-router'
import { readDataJson, writeDataJson } from '@/utils/storage'
import { extractLeafRoutes } from '@/router'
export const useCommandPalattesStore = defineStore('command_palettes', () => {
const open = ref(false)
@ -71,6 +72,16 @@ export const useCommandPalattesStore = defineStore('command_palettes', () => {
writeDataJson('recentmenu', lastRecent)
}
const searchRoutesByName = (routes: RouteRecordRaw[], query: string): RouteRecordRaw[] => {
const matchingRoutes = extractLeafRoutes(routes, '').filter((item: RouteRecordRaw) => item.path.includes('home/') && item.name?.toString().toLocaleLowerCase().includes(query.toLocaleLowerCase()))
return matchingRoutes
}
const searchRoutesPath = (routes: RouteRecordRaw[], query: string): RouteRecordRaw[] => {
const matchingRoutes = extractLeafRoutes(routes, '').filter((item: RouteRecordRaw) => item.path.includes('home/') && item.path === query)
return matchingRoutes
}
return {
open,
showCommandPalettes,
@ -78,6 +89,8 @@ export const useCommandPalattesStore = defineStore('command_palettes', () => {
onKeyPressed,
onKeyUp,
addRecent,
readRecent
readRecent,
searchRoutesByName,
searchRoutesPath
}
})

View File

@ -5,6 +5,7 @@ import { convertRouteToMenu } from '@/utils/route'
import { routes } from '@/router'
import type { MenuItemModel } from '@/types/menu'
import { splitRoutePath } from '@/utils/texts'
import { useCommandPalattesStore } from '@/stores/command'
export const useMenuStore = defineStore('menu', () => {
const route = useRoute()
@ -12,6 +13,7 @@ export const useMenuStore = defineStore('menu', () => {
const sidebarOpen = ref(false)
const sidebarShowed = ref(true)
const router = useRouter()
const command = useCommandPalattesStore()
const menuSelected = ref(route.fullPath)
const toggleSidebar = () => (sidebarOpen.value = !sidebarOpen.value)
const toggleSidebarMenu = (path: string, newExpanded: boolean): void => {
@ -54,14 +56,29 @@ export const useMenuStore = defineStore('menu', () => {
}
})
watch(router, () => {
if (router.currentRoute.value.fullPath === '/' || router.currentRoute.value.fullPath === '/home') {
watch(router, (value) => {
if (value.currentRoute.value.fullPath === '/' || value.currentRoute.value.fullPath === '/home') {
for (const item of navigation.value) {
item.expanded = false
}
}
})
watch(menuSelected, (value) => {
if (value !== '/login' && value !== '/404' && value !== '/home' && value !== '/') {
console.log('current route', value);
const result = command.searchRoutesPath(routes, value)
if (result.length > 0) {
const route = result.find((item) => item.path === value)
if (route) {
command.addRecent(route)
}
}
}
})
return {
navigation,
toggleSidebar,