-
+
{{ currentRouteName }}
+
+
- {{ currentRouteName }}
+ ([])
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 => {
+ // console.log('expanded', path);
+
const toggleItemExpanded = (items: MenuItemModel[]): void => {
for (const item of items) {
if (item.path === path) {
@@ -37,6 +43,40 @@ export const useMenuStore = defineStore('menu', () => {
onMounted(() => {
const menuData = convertRouteToMenu(routes.at(0)?.children || [])
navigation.value = menuData
+ menuSelected.value = router.currentRoute.value.fullPath
+
+ if (menuSelected.value !== '/' && menuSelected.value !== '/home' && menuSelected.value.includes('/home')) {
+ const result = splitRoutePath(menuSelected.value)
+
+ for (const route of result) {
+ if (route !== '/home') {
+ toggleSidebarMenu(route, true)
+ }
+ }
+ }
+ })
+
+ 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 {
diff --git a/src/types/gangguan.ts b/src/types/gangguan.ts
new file mode 100644
index 0000000..1adbe32
--- /dev/null
+++ b/src/types/gangguan.ts
@@ -0,0 +1,91 @@
+interface Data1 {
+ number: number;
+ no_laporan: string;
+ pembuat_laporan: string;
+ tanggal_laporan: string;
+ tanggal_dialihkan: string;
+ tanggal_respon: string;
+ tanggal_recovery: string;
+ durasi_respon: string;
+ durasi_recovery: string;
+ posko_awal: string;
+ posko_tujuan: string;
+ status: string;
+ id_pelanggan: string;
+ nama_pelapor: string;
+ alamat_pelapor: string;
+ no_telp_pelapor: string;
+ keterangan_pelapor: string;
+ sumber_laporan: string;
+ posko: string;
+}
+
+interface Data2 {
+ number: number;
+ no_laporan: string;
+ tanggal_laporan: string;
+ tanggal_respon: string;
+ tanggal_recovery: string;
+ jumlah_lapor: number;
+ durasi_respon: string;
+ durasi_recovery: string;
+ status: string;
+ id_pelanggan: string;
+ nama_pelapor: string;
+ alamat_pelapor: string;
+ no_telp_pelapor: string;
+ keterangan_pelapor: string;
+ sumber_laporan: string;
+ posko: string;
+}
+
+interface Data3 {
+ number: number;
+ no_laporan: string;
+ tanggal_laporan: string;
+ tanggal_respon: string;
+ tanggal_recovery: string;
+ durasi_respon: string;
+ durasi_recovery: string;
+ status: string;
+ referensi_marking: string;
+ id_pelanggan: string;
+ nama_pelapor: string;
+ alamat_pelapor: string;
+ no_telp_pelapor: string;
+ keterangan_pelapor: string;
+ posko: string;
+}
+
+interface Rekap1 {
+ id: number;
+ nama_unit: string;
+ total: number;
+ selesai: string;
+ in_progress: number;
+ avg: number;
+ max: number;
+ min: number;
+ dt_avg: number;
+ dt_max: number;
+ dt_min: number;
+ dt_more_sla: number;
+ dt_less_sla: number;
+ rt_avg: number;
+ rt_max: number;
+ rt_min: number;
+ rt_more_sla: number;
+ rt_less_sla: number;
+ ret_avg: number;
+ ret_max: number;
+ ret_min: number;
+ ret_more_sla: number;
+ ret_less_sla: number;
+}
+
+export type {
+ Data1,
+ Data2,
+ Data3,
+ Rekap1
+}
\ No newline at end of file
diff --git a/src/utils/interfaces.ts b/src/types/menu.ts
similarity index 79%
rename from src/utils/interfaces.ts
rename to src/types/menu.ts
index 4faeed8..a9a4db0 100644
--- a/src/utils/interfaces.ts
+++ b/src/types/menu.ts
@@ -6,4 +6,6 @@ interface MenuItemModel {
children: MenuItemModel[];
}
-export type { MenuItemModel }
\ No newline at end of file
+export type {
+ MenuItemModel,
+}
\ No newline at end of file
diff --git a/src/utils/icons.ts b/src/utils/icons.ts
index e237815..b2c5aa8 100644
--- a/src/utils/icons.ts
+++ b/src/utils/icons.ts
@@ -1,10 +1,14 @@
// png
export { default as IconApp } from '@/assets/images/pln-with-text.png'
-// svg
-export { default as LightningSlash } from '@/assets/icons/lightning-slash.svg'
-export { default as SmileySad } from '@/assets/icons/smiley-sad.svg'
-export { default as Monitor } from '@/assets/icons/monitor.svg'
-export { default as Swap } from '@/assets/icons/swap.svg'
-export { default as DotOutline } from '@/assets/icons/dot-outline.svg'
-export { default as Plugs } from '@/assets/icons/plugs.svg'
-export { default as Gauge } from '@/assets/icons/gauge.svg'
+// Svg with Vue component
+export { default as IconLightningSlash } from '@/components/icons/IconLightningSlash.vue'
+export { default as IconSmileySad } from '@/components/icons/IconSmileySad.vue'
+export { default as IconMonitor } from '@/components/icons/IconMonitor.vue'
+export { default as IconSwap } from '@/components/icons/IconSwap.vue'
+export { default as IconDotOutline } from '@/components/icons/IconDotOutline.vue'
+export { default as IconPlugs } from '@/components/icons/IconPlugs.vue'
+export { default as IconGauge } from '@/components/icons/IconGauge.vue'
+export { default as IconBox } from '@/components/icons/IconBox.vue'
+export { default as IconFileSearch } from '@/components/icons/IconFileSearch.vue'
+export { default as IconWallet } from '@/components/icons/IconWallet.vue'
+export { default as IconBars3 } from '@/components/icons/IconBars3.vue'
diff --git a/src/utils/route.ts b/src/utils/route.ts
index 3626c86..124b767 100644
--- a/src/utils/route.ts
+++ b/src/utils/route.ts
@@ -1,22 +1,28 @@
-import type { MenuItemModel } from './interfaces'
+import type { MenuItemModel } from '../types/menu'
import type { RouteRecordRaw } from 'vue-router'
import {
- Gauge,
- LightningSlash,
- Monitor,
- Plugs,
- SmileySad,
- Swap
+ IconBox,
+ IconFileSearch,
+ IconGauge,
+ IconLightningSlash,
+ IconMonitor,
+ IconPlugs,
+ IconSmileySad,
+ IconSwap,
+ IconWallet,
} from '@/utils/icons'
-const navigationIcon = [
- LightningSlash,
- SmileySad,
- Monitor,
- Swap,
- Plugs,
- Gauge
+export const navigationIcon = [
+ IconLightningSlash,
+ IconSmileySad,
+ IconMonitor,
+ IconSwap,
+ IconPlugs,
+ IconGauge,
+ IconBox,
+ IconWallet,
+ IconFileSearch
]
const convertToDashedString = (input: string): string => {
@@ -30,26 +36,6 @@ const convertToDashedString = (input: string): string => {
return `/${parts.join('-')}`;
}
-// export const convertRouteToMenu = (data: RouteRecordRaw[], basePath: string = '/home', iconIndex: number = 0): MenuItemModel[] => {
-// return data.filter((i) => i.path !== '').map((item) => {
-// const convertedItem: MenuItemModel = {
-// name: item.name?.toString() || '',
-// path: convertToDashedString(`${basePath}/${item.path}`).replace('/home-', '/home/'),
-// expanded: false,
-// icon: undefined,
-// children: [],
-// };
-
-// if (item.children) {
-// convertedItem.icon = navigationIcon[iconIndex];
-// iconIndex = (iconIndex + 1) % navigationIcon.length;
-// convertedItem.children = convertRouteToMenu(item.children, `${basePath}/${item.path}`, iconIndex);
-// }
-
-// return convertedItem
-// })
-// }
-
export const convertRouteToMenu = (data: RouteRecordRaw[], basePath: string = '/home', iconIndex: number = 0): MenuItemModel[] => {
return data.filter((i) => i.path !== '').map((item) => {
const convertedItem: MenuItemModel = {
diff --git a/src/stores/storage.ts b/src/utils/storage.ts
similarity index 100%
rename from src/stores/storage.ts
rename to src/utils/storage.ts
diff --git a/src/components/Pages/Welcome.vue b/src/components/Pages/Welcome.vue
new file mode 100644
index 0000000..2f0d5c1
--- /dev/null
+++ b/src/components/Pages/Welcome.vue
@@ -0,0 +1,113 @@
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconBars3.vue b/src/components/icons/IconBars3.vue
new file mode 100644
index 0000000..de9ec23
--- /dev/null
+++ b/src/components/icons/IconBars3.vue
@@ -0,0 +1,6 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconBox.vue b/src/components/icons/IconBox.vue
new file mode 100644
index 0000000..df77d9e
--- /dev/null
+++ b/src/components/icons/IconBox.vue
@@ -0,0 +1,8 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconDotOutline.vue b/src/components/icons/IconDotOutline.vue
new file mode 100644
index 0000000..6b1f216
--- /dev/null
+++ b/src/components/icons/IconDotOutline.vue
@@ -0,0 +1,10 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconFileSearch.vue b/src/components/icons/IconFileSearch.vue
new file mode 100644
index 0000000..d42b897
--- /dev/null
+++ b/src/components/icons/IconFileSearch.vue
@@ -0,0 +1,7 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconGauge.vue b/src/components/icons/IconGauge.vue
new file mode 100644
index 0000000..48b4627
--- /dev/null
+++ b/src/components/icons/IconGauge.vue
@@ -0,0 +1,10 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconLightningSlash.vue b/src/components/icons/IconLightningSlash.vue
new file mode 100644
index 0000000..2930beb
--- /dev/null
+++ b/src/components/icons/IconLightningSlash.vue
@@ -0,0 +1,7 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconMonitor.vue b/src/components/icons/IconMonitor.vue
new file mode 100644
index 0000000..0edec15
--- /dev/null
+++ b/src/components/icons/IconMonitor.vue
@@ -0,0 +1,10 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconPlugs.vue b/src/components/icons/IconPlugs.vue
new file mode 100644
index 0000000..b6b0c90
--- /dev/null
+++ b/src/components/icons/IconPlugs.vue
@@ -0,0 +1,10 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconSmileySad.vue b/src/components/icons/IconSmileySad.vue
new file mode 100644
index 0000000..96abaa3
--- /dev/null
+++ b/src/components/icons/IconSmileySad.vue
@@ -0,0 +1,10 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconSwap.vue b/src/components/icons/IconSwap.vue
new file mode 100644
index 0000000..f16a4a9
--- /dev/null
+++ b/src/components/icons/IconSwap.vue
@@ -0,0 +1,10 @@
+
+
+
\ No newline at end of file
diff --git a/src/components/icons/IconWallet.vue b/src/components/icons/IconWallet.vue
new file mode 100644
index 0000000..40798e7
--- /dev/null
+++ b/src/components/icons/IconWallet.vue
@@ -0,0 +1,8 @@
+
+
+
\ No newline at end of file
diff --git a/src/router/index.ts b/src/router/index.ts
index 94c8133..0dabbc4 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -5,11 +5,19 @@ import HomeView from '@/views/HomeView.vue'
import TestView from '@/views/TestView.vue'
import LoginView from '@/views/LoginView.vue'
import NotFoundView from '@/views/NotFoundView.vue'
-import EmptyPage from '@/components/Pages/HomeEmpty.vue'
+import WelcomePage from '@/components/Pages/Welcome.vue'
import TestPage from '@/components/Pages/TestPage.vue'
-import { hasMoreThanTwoSlashes, removeExtraSlashes } from '@/utils/route'
+import qs from 'qs'
+import {
+ GangguanDaftar1,
+ GangguanDaftar2,
+ GangguanDaftar3
+} from '@/components/Pages/Gangguan/Daftar'
+import {
+ GangguanRekap1,
+} from '@/components/Pages/Gangguan/Rekapitulasi'
-const routes: RouteRecordRaw[] = [
+export const routes: RouteRecordRaw[] = [
{
path: '/home',
name: 'Home',
@@ -18,61 +26,61 @@ const routes: RouteRecordRaw[] = [
{
path: '',
name: 'Home Page',
- component: EmptyPage,
+ component: WelcomePage,
},
{
path: 'gangguan',
name: 'Gangguan',
children: [
{
- path: 'a',
+ path: 'daftar',
name: 'Daftar',
children: [
{
path: '1',
name: 'Daftar Keluhan Dialihkan Ke Posko Lain',
- component: TestPage,
+ component: GangguanDaftar1,
},
{
path: '2',
name: 'Daftar Gangguan Melapor Lebih Dari 1 Kali',
- component: TestPage,
+ component: GangguanDaftar2,
},
{
path: '3',
name: 'Daftar Gangguan Response Time',
- component: TestPage,
+ component: GangguanDaftar3,
},
{
path: '4',
name: 'Daftar Gangguan Recovery Time',
- component: TestPage,
+ component: GangguanDaftar3,
},
{
path: '5',
name: 'Daftar Gangguan Selesai Tanpa ID Pelanggan',
- component: TestPage,
+ component: GangguanDaftar3,
},
{
path: '6',
name: 'Daftar Gangguan Berdasarkan Media',
- component: TestPage,
+ component: GangguanDaftar3,
},
{
path: '7',
name: 'Daftar Gangguan Diselesaikan Mobile APKT',
- component: TestPage,
+ component: GangguanDaftar3,
},
],
},
{
- path: 'b',
+ path: 'rekapitulasi',
name: 'Rekapitulasi',
children: [
{
path: '1',
name: 'Rekapitulasi Gangguan All',
- component: TestPage,
+ component: GangguanRekap1,
},
{
path: '2',
@@ -148,7 +156,7 @@ const routes: RouteRecordRaw[] = [
name: 'Keluhan',
children: [
{
- path: 'a',
+ path: 'daftar',
name: 'Daftar',
children: [
{
@@ -189,7 +197,7 @@ const routes: RouteRecordRaw[] = [
],
},
{
- path: 'b',
+ path: 'rekapitulasi',
name: 'Rekapitulasi',
children: [
{
@@ -241,11 +249,11 @@ const routes: RouteRecordRaw[] = [
name: 'Monalisa',
children: [
{
- path: 'a',
+ path: 'gangguan',
name: 'Gangguan',
children: [
{
- path: 'a',
+ path: 'rekapitulasi',
name: 'Rekapitulasi',
children: [
{
@@ -255,31 +263,41 @@ const routes: RouteRecordRaw[] = [
},
{
path: '2',
- name: 'Recovery Time (RCT) Gangguan',
+ name: 'Dispacthing Time (DT) Gangguan',
component: TestPage,
},
{
path: '3',
- name: 'Response Time (RPT) Gangguan',
+ name: 'Recovery Time (RCT) Gangguan',
component: TestPage,
},
{
path: '4',
- name: 'Rekapitulasi Gangguan Per Jenis Gangguan',
+ name: 'Response Time (RPT) Gangguan',
component: TestPage,
},
{
path: '5',
- name: 'Rekapitulasi Lapor Ulang Gangguan',
+ name: 'Jumlah dan Durasi RPT RCT Gangguan',
component: TestPage,
},
{
path: '6',
- name: 'Rekapitulasi ENS Gangguan',
+ name: 'Rekapitulasi Gangguan Per Jenis Gangguan',
component: TestPage,
},
{
path: '7',
+ name: 'Rekapitulasi Lapor Ulang Gangguan',
+ component: TestPage,
+ },
+ {
+ path: '8',
+ name: 'Rekapitulasi ENS Gangguan',
+ component: TestPage,
+ },
+ {
+ path: '9',
name: 'Rekapitulasi Gangguan Belum Selesai',
component: TestPage,
},
@@ -288,11 +306,11 @@ const routes: RouteRecordRaw[] = [
],
},
{
- path: 'b',
+ path: 'keluhan',
name: 'Keluhan',
children: [
{
- path: 'a',
+ path: 'rekapitulasi',
name: 'Rekapitulasi',
children: [
{
@@ -312,16 +330,21 @@ const routes: RouteRecordRaw[] = [
},
{
path: '4',
- name: 'Rekapitulasi Gangguan Per Jenis Keluhan',
+ name: 'Jumlah dan Durasi RPT RCT Keluhan',
component: TestPage,
},
{
path: '5',
- name: 'Rekapitulasi Lapor Ulang Keluhan',
+ name: 'Rekapitulasi Gangguan Per Jenis Keluhan',
component: TestPage,
},
{
path: '6',
+ name: 'Rekapitulasi Lapor Ulang Keluhan',
+ component: TestPage,
+ },
+ {
+ path: '7',
name: 'Rekapitulasi Keluhan Belum Selesai',
component: TestPage,
},
@@ -330,11 +353,11 @@ const routes: RouteRecordRaw[] = [
],
},
{
- path: 'c',
+ path: 'kpi',
name: 'Laporan KPI',
children: [
{
- path: 'a',
+ path: 'bulanan',
name: 'Bulanan',
children: [
{
@@ -360,7 +383,7 @@ const routes: RouteRecordRaw[] = [
],
},
{
- path: '2',
+ path: 'kumulatif',
name: 'Kumulatif',
children: [
{
@@ -394,7 +417,7 @@ const routes: RouteRecordRaw[] = [
name: 'Check In OutCheck In Dan Check Out',
children: [
{
- path: 'a',
+ path: 'laporan',
name: 'Laporan Check In /Check Out (CICO)',
children: [
{
@@ -411,7 +434,7 @@ const routes: RouteRecordRaw[] = [
name: 'Anomali Penangan Pengaduan',
children: [
{
- path: 'a',
+ path: 'gangguan',
name: 'Gangguan',
children: [
{
@@ -427,7 +450,7 @@ const routes: RouteRecordRaw[] = [
],
},
{
- path: 'b',
+ path: 'keluhan',
name: 'Keluhan',
children: [
{
@@ -450,6 +473,56 @@ const routes: RouteRecordRaw[] = [
},
],
},
+ {
+ path: 'material',
+ name: 'Material',
+ children: [
+ {
+ path: 'daftar',
+ name: 'Daftar',
+ children: [
+ {
+ path: '1',
+ name: 'Daftar Gangguan Dan Material Yang Dipakai',
+ component: TestPage,
+ },
+ ],
+ },
+ {
+ path: 'rekapitulasi',
+ name: 'Rekapitulasi',
+ children: [
+ {
+ path: '1',
+ name: 'Rekapitulasi Pemakaian Material',
+ component: TestPage,
+ },
+ ],
+ }
+ ],
+ },
+ {
+ path: 'transaksi',
+ name: 'Transaksi',
+ children: [
+ {
+ path: '1',
+ name: 'Transaksi APKT',
+ component: TestPage,
+ },
+ ],
+ },
+ {
+ path: 'pencarian-data',
+ name: 'Pencarian Data',
+ children: [
+ {
+ path: '1',
+ name: 'Pencarian Report Number',
+ component: TestPage,
+ }
+ ]
+ },
]
},
{
@@ -469,50 +542,50 @@ const routes: RouteRecordRaw[] = [
},
]
-// const createRoute = (route: RouteRecordRaw[]): RouteRecordRaw[] => {
-// var newRoute: RouteRecordRaw[] = []
+export const mergeChildrenRoutes = (routes: RouteRecordRaw[]): RouteRecordRaw[] => {
+ const mergedRoutes: RouteRecordRaw[] = [];
-// const getRoute = (route: RouteRecordRaw[], parent: string = '') => {
-// route.forEach((r) => {
-// if (r.children) {
-// if (r.component) {
-// var fullPath = `${parent.replace('/', '')}/${r.path.replace('/', '')}`
-// fullPath = hasMoreThanTwoSlashes(fullPath) ? removeExtraSlashes(fullPath) : fullPath
-// newRoute.push({
-// path: fullPath,
-// name: r.name,
-// component: r.component
-// } as RouteRecordRaw)
-// }
-// getRoute(r.children, `${parent}/${r.path}`)
-// } else {
-// var fullPath = `${parent.replace('/', '')}/${r.path.replace('/', '')}`
-// if (newRoute.find((nr) => nr.path !== '/' && nr.path === '/home' && fullPath.includes(nr.path))) {
-// const index = newRoute.findIndex((nr) => nr.path !== '/' && fullPath.includes(nr.path))
-// newRoute[index] = {
-// ...newRoute[index], children: [...newRoute[index].children ?? [], {
-// path: fullPath === '/home/' ? '' : fullPath.includes('/home/') ? fullPath.replace('/home/', '').split('/').join('-') : fullPath.split('/').join('-'),
-// name: r.name,
-// component: r.component
-// } as RouteRecordRaw]
-// }
-// } else {
-// newRoute.push({
-// path: fullPath,
-// name: r.name,
-// component: r.component
-// } as RouteRecordRaw)
-// }
-// }
-// })
-// }
-// getRoute(route)
-// console.log(newRoute);
+ for (const route of routes) {
+ if (route.children && route.children.length > 0) {
+ // Buat salinan route tanpa children
+ const topLevelRoute: RouteRecordRaw = { ...route, children: [] };
-// return newRoute
-// }
+ // Salin setiap route children ke children route paling atas
+ for (const childRoute of route.children) {
+ const fullPath = `${route.path}/${childRoute.path}`.replace(/\/+/g, '/');
+ const mergedChildRoute: RouteRecordRaw = { ...childRoute, path: fullPath };
+ topLevelRoute.children?.push(mergedChildRoute);
+ }
-const createRoute = (route: RouteRecordRaw[]): RouteRecordRaw[] => {
+ mergedRoutes.push(topLevelRoute);
+ } else {
+ // Jika route tidak memiliki children, tambahkan as is
+ mergedRoutes.push(route);
+ }
+ }
+
+ return mergedRoutes;
+}
+
+export const extractLeafRoutes = (routes: RouteRecordRaw[], parentPath = ''): RouteRecordRaw[] => {
+ const leafRoutes: RouteRecordRaw[] = [];
+
+ for (const route of routes) {
+
+ const fullPath = `${parentPath}/${route.path}`.replace(/\/+/g, '/');
+
+ if (route.children && route.children.length > 0) {
+ leafRoutes.push(...extractLeafRoutes(route.children, fullPath));
+ } else {
+ const leafRoute = { ...route, path: fullPath };
+ leafRoutes.push(leafRoute);
+ }
+ }
+
+ return leafRoutes;
+}
+
+export const fixRoute = (route: RouteRecordRaw[]): RouteRecordRaw[] => {
var newRoute: RouteRecordRaw[] = []
const getRoute = (route: RouteRecordRaw[], parent: string = '') => {
@@ -556,13 +629,13 @@ const createRoute = (route: RouteRecordRaw[]): RouteRecordRaw[] => {
return uniqueRoute
}
+
const router = createRouter({
history: createWebHistory(),
linkActiveClass: 'active',
- routes: createRoute(routes)
+ stringifyQuery: qs.stringify,
+ routes: fixRoute(routes)
})
-console.log(router.getRoutes());
-
router.beforeEach((to, from, next) => {
// redirect to login page if not logged in and trying to access a restricted page
@@ -600,6 +673,3 @@ router.beforeEach((to, from, next) => {
})
export default router
-export {
- routes
-}
diff --git a/src/stores/auth.ts b/src/stores/auth.ts
index 1386cfb..1fc73da 100644
--- a/src/stores/auth.ts
+++ b/src/stores/auth.ts
@@ -1,7 +1,7 @@
import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
import { dispatchNotification } from '@/components/Notification'
-import { readData, removeData, writeData } from './storage'
+import { readData, removeData, writeData } from '@/utils/storage'
import router from '@/router'
export const useAuthStore = defineStore('auth', () => {
diff --git a/src/stores/command.ts b/src/stores/command.ts
index 1f3d667..86ad874 100644
--- a/src/stores/command.ts
+++ b/src/stores/command.ts
@@ -1,21 +1,24 @@
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);
+ const open = ref(false)
const controlStatus = ref(false)
const keyFStatus = ref(false)
- function showCommandPalettes() {
+ const showCommandPalettes = () => {
open.value = true;
}
- function handleOnDismissCommandPalettes() {
+ const handleOnDismissCommandPalettes = () => {
open.value = false;
}
- function onKeyPressed(event: KeyboardEvent) {
+ const onKeyPressed = (event: KeyboardEvent) => {
if (event.key === 'Control') {
console.log('control pressed');
controlStatus.value = true
@@ -31,7 +34,7 @@ export const useCommandPalattesStore = defineStore('command_palettes', () => {
}
}
- function onKeyUp(event: KeyboardEvent) {
+ const onKeyUp = (event: KeyboardEvent) => {
if (event.key === 'Control') {
console.log('control released');
controlStatus.value = false
@@ -43,5 +46,51 @@ export const useCommandPalattesStore = defineStore('command_palettes', () => {
}
}
- return { open, showCommandPalettes, handleOnDismissCommandPalettes, onKeyPressed, onKeyUp }
+ const readRecent = (): RouteRecordRaw[] => {
+ const recent = readDataJson('recentmenu')
+ if (recent) {
+ try {
+ JSON.parse(recent)
+ } catch (error) {
+ return recent as RouteRecordRaw[]
+ }
+ }
+ return [] as RouteRecordRaw[]
+ }
+
+ const addRecent = (menu: RouteRecordRaw) => {
+ const lastRecent = readRecent()
+ const index = lastRecent.findIndex((item: RouteRecordRaw) => item.path === menu.path)
+ if (index > -1) {
+ lastRecent.splice(index, 1)
+ }
+ lastRecent.unshift(menu)
+ if (lastRecent.length > 5) {
+ lastRecent.pop()
+ }
+
+ 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,
+ handleOnDismissCommandPalettes,
+ onKeyPressed,
+ onKeyUp,
+ addRecent,
+ readRecent,
+ searchRoutesByName,
+ searchRoutesPath
+ }
})
\ No newline at end of file
diff --git a/src/stores/menu.ts b/src/stores/menu.ts
index 1cff66a..5ea0647 100644
--- a/src/stores/menu.ts
+++ b/src/stores/menu.ts
@@ -1,18 +1,24 @@
-import { onMounted, ref } from 'vue'
+import { onMounted, ref, watch } from 'vue'
import { defineStore } from 'pinia'
-import { useRoute } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
import { convertRouteToMenu } from '@/utils/route'
import { routes } from '@/router'
-import type { MenuItemModel } from '@/utils/interfaces'
+import type { MenuItemModel } from '@/types/menu'
+import { splitRoutePath } from '@/utils/texts'
+import { useCommandPalattesStore } from '@/stores/command'
export const useMenuStore = defineStore('menu', () => {
const route = useRoute()
const navigation = ref
+
+
+
+
+
+
+
+
+ + Terakhir Dikunjungi +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ menu.name }}
+
+
+ {{ menu.path.replace('/home/', '') }}
+
+
+
+ Buka
+
+