add route page to recent when menu load
This commit is contained in:
parent
a9b1d720d9
commit
92706caf90
@ -116,10 +116,6 @@ import { useCommandPalattesStore } from '@/stores/command'
|
|||||||
import { navigationIcon } from '@/utils/route'
|
import { navigationIcon } from '@/utils/route'
|
||||||
|
|
||||||
const command = useCommandPalattesStore()
|
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 route = useRouter()
|
||||||
const recent = computed(() => query.value === '' ? command.readRecent() : [])
|
const recent = computed(() => query.value === '' ? command.readRecent() : [])
|
||||||
@ -127,7 +123,7 @@ const query = ref('')
|
|||||||
const filteredMenus = computed(() =>
|
const filteredMenus = computed(() =>
|
||||||
query.value === ''
|
query.value === ''
|
||||||
? []
|
? []
|
||||||
: searchRoutesByName(routes, query.value)
|
: command.searchRoutesByName(routes, query.value)
|
||||||
)
|
)
|
||||||
const onClose = () => command.open = false
|
const onClose = () => command.open = false
|
||||||
|
|
||||||
|
@ -112,7 +112,7 @@ const onSelectionChanged = ({ selectedRowsData }: any) => {
|
|||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
createDummy()
|
createDummy()
|
||||||
console.log(readDataJson('data-daftar-1'));
|
// console.log(readDataJson('data-daftar-1'));
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -2,6 +2,7 @@ import { ref } from 'vue'
|
|||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import type { RouteRecordRaw } from 'vue-router'
|
import type { RouteRecordRaw } from 'vue-router'
|
||||||
import { readDataJson, writeDataJson } from '@/utils/storage'
|
import { readDataJson, writeDataJson } from '@/utils/storage'
|
||||||
|
import { extractLeafRoutes } from '@/router'
|
||||||
|
|
||||||
export const useCommandPalattesStore = defineStore('command_palettes', () => {
|
export const useCommandPalattesStore = defineStore('command_palettes', () => {
|
||||||
const open = ref(false)
|
const open = ref(false)
|
||||||
@ -71,6 +72,16 @@ export const useCommandPalattesStore = defineStore('command_palettes', () => {
|
|||||||
writeDataJson('recentmenu', lastRecent)
|
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 {
|
return {
|
||||||
open,
|
open,
|
||||||
showCommandPalettes,
|
showCommandPalettes,
|
||||||
@ -78,6 +89,8 @@ export const useCommandPalattesStore = defineStore('command_palettes', () => {
|
|||||||
onKeyPressed,
|
onKeyPressed,
|
||||||
onKeyUp,
|
onKeyUp,
|
||||||
addRecent,
|
addRecent,
|
||||||
readRecent
|
readRecent,
|
||||||
|
searchRoutesByName,
|
||||||
|
searchRoutesPath
|
||||||
}
|
}
|
||||||
})
|
})
|
@ -5,6 +5,7 @@ import { convertRouteToMenu } from '@/utils/route'
|
|||||||
import { routes } from '@/router'
|
import { routes } from '@/router'
|
||||||
import type { MenuItemModel } from '@/types/menu'
|
import type { MenuItemModel } from '@/types/menu'
|
||||||
import { splitRoutePath } from '@/utils/texts'
|
import { splitRoutePath } from '@/utils/texts'
|
||||||
|
import { useCommandPalattesStore } from '@/stores/command'
|
||||||
|
|
||||||
export const useMenuStore = defineStore('menu', () => {
|
export const useMenuStore = defineStore('menu', () => {
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
@ -12,6 +13,7 @@ export const useMenuStore = defineStore('menu', () => {
|
|||||||
const sidebarOpen = ref(false)
|
const sidebarOpen = ref(false)
|
||||||
const sidebarShowed = ref(true)
|
const sidebarShowed = ref(true)
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
const command = useCommandPalattesStore()
|
||||||
const menuSelected = ref(route.fullPath)
|
const menuSelected = ref(route.fullPath)
|
||||||
const toggleSidebar = () => (sidebarOpen.value = !sidebarOpen.value)
|
const toggleSidebar = () => (sidebarOpen.value = !sidebarOpen.value)
|
||||||
const toggleSidebarMenu = (path: string, newExpanded: boolean): void => {
|
const toggleSidebarMenu = (path: string, newExpanded: boolean): void => {
|
||||||
@ -54,14 +56,29 @@ export const useMenuStore = defineStore('menu', () => {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(router, () => {
|
watch(router, (value) => {
|
||||||
if (router.currentRoute.value.fullPath === '/' || router.currentRoute.value.fullPath === '/home') {
|
if (value.currentRoute.value.fullPath === '/' || value.currentRoute.value.fullPath === '/home') {
|
||||||
for (const item of navigation.value) {
|
for (const item of navigation.value) {
|
||||||
item.expanded = false
|
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 {
|
return {
|
||||||
navigation,
|
navigation,
|
||||||
toggleSidebar,
|
toggleSidebar,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user