From 25f4b8cac7c3c33c8b01a4a8d7008be7b1aa19e3 Mon Sep 17 00:00:00 2001 From: "dwi.firman" Date: Tue, 8 Jul 2025 14:07:05 +0700 Subject: [PATCH] authorized fix keycloak sidebarItem --- _mockApis/components/dashboard/dashboard1.ts | 2 +- .../full/vertical-sidebar/MinIconItems.ts | 91 +- .../full/vertical-sidebar/VerticalSidebar.vue | 230 +-- .../full/vertical-sidebar/sidebarItem.ts | 1360 +++++++++-------- composables/useGetUserLoginComposables.ts | 4 - middleware/auth.ts | 64 +- package-lock.json | 75 + package.json | 10 +- pages/SambelPage_copy.vue | 12 +- pages/Sample-Page.vue | 34 +- pages/index.vue | 12 +- server/api/auth/[...].ts | 174 ++- stores/userInfo.ts | 38 - stores/userInfo.ts.ex | 40 + utils/UpdateColors.ts | 2 +- utils/helper.ts | 4 + 16 files changed, 1183 insertions(+), 969 deletions(-) delete mode 100644 composables/useGetUserLoginComposables.ts delete mode 100644 stores/userInfo.ts create mode 100644 stores/userInfo.ts.ex diff --git a/_mockApis/components/dashboard/dashboard1.ts b/_mockApis/components/dashboard/dashboard1.ts index 94c3db4..3ed1181 100644 --- a/_mockApis/components/dashboard/dashboard1.ts +++ b/_mockApis/components/dashboard/dashboard1.ts @@ -1,4 +1,4 @@ -import type { RevenueProjects,Performance } from '@/types/components/dashboard/dashboard1'; +import type { RevenueProjects,Performance } from '@/types/components/dashboards/dashboard1'; import product1 from "@/assets/images/products/dash-prd-1.jpg"; import product2 from "@/assets/images/products/dash-prd-2.jpg"; diff --git a/components/layout/full/vertical-sidebar/MinIconItems.ts b/components/layout/full/vertical-sidebar/MinIconItems.ts index f6c341e..7afbc88 100644 --- a/components/layout/full/vertical-sidebar/MinIconItems.ts +++ b/components/layout/full/vertical-sidebar/MinIconItems.ts @@ -1,50 +1,55 @@ export interface minisidebar { - icon?: string; - id?:number; - tooltip?:string + icon?: string; + id?:number; + tooltip?:string, + typeUser?:string[], } + const MiniSideIcons: minisidebar[] = [ - { - icon: 'layers-line-duotone', - tooltip:'Dashboards', - id: 1 - }, - { - icon: 'notes-line-duotone', - tooltip:'Pages', - id: 2, - }, - { - icon: 'palette-round-line-duotone', - tooltip:'Forms', - id: 3 - }, - { - icon:'align-vertical-spacing-broken', - tooltip:'Tables', - id: 4 - }, - { - icon:'chart-line-duotone', - tooltip:'Charts', - id: 5 - }, - { - icon:'widget-6-line-duotone', - tooltip:'UI Components', - id: 6 - }, - { - icon:'lock-keyhole-line-duotone', - tooltip:'Authentication Pages', - id: 7 - }, - { - icon:'mirror-left-line-duotone', - tooltip:'Others', - id: 8 - } + { + icon: 'layers-line-duotone', + tooltip:'Dashboards', + id: 1, + typeUser:['super_admin','admin'] + }, + { + icon: 'notes-line-duotone', + tooltip:'Pages', + id: 2, + typeUser:['super_admin'] + }, + { + icon: 'palette-round-line-duotone', + tooltip:'Forms', + id: 3 + }, + { + icon:'align-vertical-spacing-broken', + tooltip:'Tables', + id: 4, + typeUser:['super_admin'] + }, + { + icon:'chart-line-duotone', + tooltip:'Charts', + id: 5 + }, + { + icon:'widget-6-line-duotone', + tooltip:'UI Components', + id: 6 + }, + { + icon:'lock-keyhole-line-duotone', + tooltip:'Authentication Pages', + id: 7 + }, + { + icon:'mirror-left-line-duotone', + tooltip:'Others', + id: 8 + } ] export default MiniSideIcons; diff --git a/components/layout/full/vertical-sidebar/VerticalSidebar.vue b/components/layout/full/vertical-sidebar/VerticalSidebar.vue index 2eb6fac..ed0959a 100644 --- a/components/layout/full/vertical-sidebar/VerticalSidebar.vue +++ b/components/layout/full/vertical-sidebar/VerticalSidebar.vue @@ -10,125 +10,155 @@ import MiniSideIcons from './MinIconItems'; const route = useRoute(); -const findTitleByPath = (items: any, path: any) => { - let title = ''; - - for (const item of items) { - if (item.to === path) { - title = item.id; - break; - } else if (item.children) { - for (const child of item.children) { - if (child.to === path) { - title = item.id; - break; - } else if (child.children) { - for (const grandChild of child.children) { - if (grandChild.to === path) { - title = item.id; - break; - } - } - } - } - } +// const findTitleByPath = (items: any, path: any) => { +// let title = ''; +// +// for (const item of items) { +// if (item.to === path) { +// title = item.id; +// break; +// } else if (item.children) { +// for (const child of item.children) { +// if (child.to === path) { +// title = item.id; +// break; +// } else if (child.children) { +// for (const grandChild of child.children) { +// if (grandChild.to === path) { +// title = item.id; +// break; +// } +// } +// } +// } +// } +// } +// +// return title; +// }; +const findTitleByPath = (items:any, path:any) => { + for (const item of items) { + if (item.to === path) { + return item.id; } - - return title; + if (item.children) { + const title = findTitleByPath(item.children, path); + if (title) { + return item.id; + } + } + } + return ''; }; + const foundId = findTitleByPath(sidebarItems, route.path); const getCurrent = foundId ? foundId : 1; const currentMenu = ref(getCurrent); function showData(data: any) { - currentMenu.value = data; - //customizer.SET_MINI_SIDEBAR(!customizer.mini_sidebar) + currentMenu.value = data; + //customizer.SET_MINI_SIDEBAR(!customizer.mini_sidebar) } // MiniSidebar Icons End const customizer = useCustomizerStore(); const sidebarMenu = shallowRef(sidebarItems); +const miniSidebar = MiniSideIcons.filter(menuIcon=>menuIcon.typeUser?.includes('super_admin')); + +const filterSidebarItems=(items:any, userType:string) => { + // const result = items.filter((item:any)=>item?.typeUser.includes(userType)); + const result = items.filter((item:any)=>item.typeUser?.includes(userType)) + .map((item:any)=>({ + ...item, + children: item.children ? filterSidebarItems(item.children,userType):'' + })) + .filter((item:any)=>item.children.length > 0||item.typeUser.includes(userType)); + return result; +} +const filteredSidebarItems = filterSidebarItems(sidebarItems, 'super_admin'); +// console.log(filteredSidebarItems) + diff --git a/components/layout/full/vertical-sidebar/sidebarItem.ts b/components/layout/full/vertical-sidebar/sidebarItem.ts index b715a23..1047d91 100644 --- a/components/layout/full/vertical-sidebar/sidebarItem.ts +++ b/components/layout/full/vertical-sidebar/sidebarItem.ts @@ -14,695 +14,707 @@ export interface menu { disabled?: boolean; type?: string; subCaption?: string; + typeUser?:string[], } const sidebarItem: menu[] = [ { - header: 'dashboards', - id: 1, - children: [ + header: 'dashboards', + id: 1, + typeUser:['super_admin','admin'], + children: [ + { + title: 'Dashboard1', + icon: 'widget-add-line-duotone', + to: '/dashboards/dashboard1', + typeUser:['super_admin','admin'], + }, + { + title: 'Dashboard2', + icon: 'chart-line-duotone', + to: '/dashboards/dashboard2' + }, + { + title: 'Dashboard3', + icon: 'screencast-2-line-duotone', + to: '/dashboards/dashboard3', + typeUser:['super_admin','admin'], + }, + { + title: 'Front Pages', + icon: 'home-angle-linear', + to: '/', + typeUser:['super_admin','admin'], + children: [ { - title: 'Dashboard1', - icon: 'widget-add-line-duotone', - to: '/dashboards/dashboard1' + title: 'Homepage', + to: '/front-page/homepage', + typeUser:['admin'], }, { - title: 'Dashboard2', - icon: 'chart-line-duotone', - to: '/dashboards/dashboard2' + title: 'About Us', + to: '/front-page/about-us', + typeUser:['super_admin','admin'], }, { - title: 'Dashboard3', - icon: 'screencast-2-line-duotone', - to: '/dashboards/dashboard3' + title: 'Blog', + to: '/front-page/blog/posts' }, { - title: 'Front Pages', - icon: 'home-angle-linear', - to: '/', - children: [ + title: 'Blog Details', + to: '/front-page/blog/early-black-friday-amazon-deals-cheap-tvs-headphones' + }, + { + title: 'Contact Us', + to: '/front-page/contact-us' + }, + { + title: 'Portfolio', + to: '/front-page/portfolio' + }, + { + title: 'Pricing', + to: '/front-page/pricing' + } + ] + }, + ] + }, + + { + header: 'apps', + id: 1, + children: [ + { + title: 'ECommerce', + icon: 'cart-3-line-duotone', + to: '/ecommerce/', + children: [ + { + title: 'Shop', + to: '/ecommerce/products' + }, + { + title: 'Detail', + to: '/ecommerce/product/detail/1' + }, + { + title: 'List', + to: '/ecommerce/productlist' + }, + { + title: 'Checkout', + to: '/ecommerce/checkout' + }, + { + title: 'Add Product', + to: '/ecommerce/add-product' + }, + { + title: 'Edit Product', + to: '/ecommerce/edit-product' + } + ] + }, + { + title: 'Blog', + icon: 'widget-4-line-duotone', + to: '/', + children: [ + { + title: 'Blog Posts', + to: '/apps/blog/posts' + }, + { + title: 'Blog Details', + to: '/apps/blog/early-black-friday-amazon-deals-cheap-tvs-headphones' + } + ] + }, + { + title: 'User Profile', + icon: 'shield-user-line-duotone', + to: '/', + children: [ + { + title: 'Profile', + to: '/apps/user/profile' + }, + { + title: 'Followers', + to: '/apps/user/profile/followers' + }, + { + title: 'Friends', + to: '/apps/user/profile/friends' + }, + { + title: 'Gallery', + to: '/apps/user/profile/gallery' + } + ] + }, + { + title: 'Invoice', + icon: 'bill-check-outline', + to: '/', + children: [ + { + title: 'List', + to: '/apps/invoice' + }, + { + title: 'Details', + to: '/apps/invoice/details/102' + }, + { + title: 'Create', + to: '/apps/invoice/create' + }, + { + title: 'Edit', + to: '/apps/invoice/edit/102' + } + ] + }, + { + title: 'Calendar', + icon: 'calendar-mark-line-duotone', + to: '/apps/calendar' + }, + { + title: 'Email', + icon: 'letter-linear', + to: '/apps/email' + }, + { + title: 'Chats', + icon: 'chat-round-line-line-duotone', + to: '/apps/chats' + }, + { + title: 'Notes', + icon: 'document-text-line-duotone', + to: '/apps/notes' + }, + { + title: 'Kanban', + icon: 'airbuds-case-minimalistic-line-duotone', + to: '/apps/kanban' + }, + { + title: 'Contact', + icon: 'iphone-line-duotone', + to: '/apps/contacts' + }, + { + title: 'Tickets', + icon: 'ticker-star-outline', + to: '/apps/tickets' + }, + ] + }, + + { + header: 'pages', + id: 2, + children: [ + + { + title: 'Account Setting', + icon: 'settings-minimalistic-line-duotone', + to: '/pages/account-settings' + }, + { + title: 'Banners Widgets', + icon: 'align-vertical-spacing-line-duotone', + to: '/widgets/banners' + }, + { + title: 'Cards Widgets', + icon: 'cardholder-line-duotone', + to: '/widgets/cards' + }, + { + title: 'Charts Widgets', + icon: 'chart-square-line-duotone', + to: '/widgets/charts' + }, + { + title: 'FAQ', + icon: 'question-circle-line-duotone', + to: '/pages/faq' + }, + { + title: 'Gallery Lightbox', + icon: 'gallery-bold-duotone', + to: '/pages/gallery-lightbox', + }, + { + title: 'Landing Page', + icon: 'passport-line-duotone', + to: '/' + }, + { + title: 'Pricing', + icon: 'dollar-line-duotone', + to: '/pages/pricing' + }, + { + title: 'Search Results', + icon: 'card-search-line-duotone', + to: '/pages/search-results' + }, + { + title: 'Social Contacts', + icon: 'chat-round-like-linear', + to: '/pages/social-media-contacts' + }, + { + title: 'Treeview', + icon: 'transmission-line-duotone', + to: '/pages/treeview' + }, + + + + ] + }, + { + header: 'icons', + id: 2, + children: [ + { + title: 'Tabler Icons', + icon: 'sticker-smile-circle-2-line-duotone', + to: '/icons/tabler' + }, + { + title: 'Solar Icons', + icon: 'sticker-smile-circle-2-line-duotone', + to: '/icons/solar' + } + ] + }, + + { + header: 'Forms', + id: 3, + children: [ + { + title: 'Form Elements', + icon: 'text-selection-line-duotone', + to: '/components/', + children: [ + { + title: 'Autocomplete', + to: '/forms/form-elements/autocomplete' + }, + { + title: 'Combobox', + to: '/forms/form-elements/combobox' + }, + { + title: 'Button', + to: '/forms/form-elements/button' + }, + { + title: 'Checkbox', + to: '/forms/form-elements/checkbox' + }, + { + title: 'Custom Inputs', + to: '/forms/form-elements/custominputs' + }, + { + title: 'File Inputs', + to: '/forms/form-elements/fileinputs' + }, + { + title: 'Radio', + to: '/forms/form-elements/radio' + }, + { + title: 'Date Time', + to: '/forms/form-elements/date-time' + }, + { + title: 'Select', + to: '/forms/form-elements/select' + }, + { + title: 'Slider', + to: '/forms/form-elements/slider' + }, + { + title: 'Switch', + to: '/forms/form-elements/switch' + }, + { + title: 'Time Picker', + to: '/forms/form-elements/time-picker' + }, + + { + title: 'Stepper', + to: '/forms/form-elements/stepper' + } + ] + }, + { + title: 'Form Layout', + icon: 'layers-minimalistic-outline', + to: '/forms/form-layouts' + }, + { + title: 'Form Horizontal', + icon: 'password-minimalistic-input-line-duotone', + to: '/forms/form-horizontal' + }, + { + title: 'Form Vertical', + icon: 'slider-vertical-line-duotone', + to: '/forms/form-vertical' + }, + { + title: 'Form Custom', + icon: 'clapperboard-play-outline', + to: '/forms/form-custom' + }, + { + title: 'Form Validation', + icon: 'soundwave-square-line-duotone', + to: '/forms/form-validation' + }, + { + title: 'Editor', + icon: 'clapperboard-edit-line-duotone', + to: '/forms/editor' + } + ] + }, + + { + header: 'tables', + id: 4, + children: [ + { + title: 'Basic Table', + icon: 'tablet-line-duotone', + to: '/tables/basic' + }, + { + title: 'Dark Table', + icon: 'bedside-table-4-outline', + to: '/tables/dark' + }, + { + title: 'Density Table', + icon: 'bedside-table-3-linear', + to: '/tables/density' + }, + { + title: 'Fixed Header Table', + icon: 'archive-up-minimlistic-broken', + to: '/tables/fixed-header' + }, + { + title: 'Height Table', + icon: 'archive-down-minimlistic-broken', + to: '/tables/height' + }, + { + title: 'Editable Table', + icon: 'document-add-linear', + to: '/tables/editable' + } + ] + }, + + { + header: 'datatables', + id: 4, + children: [ + { + title: 'Basic Table', + icon: 'database-outline', + to: '/tables/datatables/basic' + }, + { + title: 'Header Table', + icon: 'folder-open-broken', + to: '/tables/datatables/header' + }, + { + title: 'Selection Table', + icon: 'chart-square-broken', + to: '/tables/datatables/selection' + }, + { + title: 'Sorting Table', + icon: 'card-send-line-duotone', + to: '/tables/datatables/sorting' + }, + { + title: 'Pagination Table', + icon: 'tag-horizontal-broken', + to: '/tables/datatables/pagination' + }, + { + title: 'Filtering Table', + icon: 'tuning-square-2-line-duotone', + to: '/tables/datatables/filtering' + }, + { + title: 'Grouping Table', + icon: 'tuning-square-2-line-duotone', + to: '/tables/datatables/grouping' + }, + { + title: 'Table Slots', + icon: 'closet-line-duotone', + to: '/tables/datatables/slots' + }, + { + title: 'CRUD Table', + icon: 'text-underline-cross-broken', + to: '/tables/datatables/crudtable' + } + ] + }, + + { + header: 'Charts', + id: 5, + children: [ + { + title: 'Line', + icon: 'chat-square-2-outline', + to: '/charts/line-chart' + }, + { + title: 'Gredient', + icon: 'round-graph-linear', + to: '/charts/gredient-chart' + }, + { + title: 'Area', + icon: 'graph-up-linear', + to: '/charts/area-chart' + }, + { + title: 'Candlestick', + icon: 'chandelier-broken', + to: '/charts/candlestick-chart' + }, + { + title: 'Column', + icon: 'colour-tuneing-broken', + to: '/charts/column-chart' + }, + { + title: 'Doughnut & Pie', + icon: 'pie-chart-2-linear', + to: '/charts/doughnut-pie-chart' + }, + { + title: 'Radialbar & Radar', + icon: 'radar-2-outline', + to: '/charts/radialbar-chart' + } + ] + }, + + { + header: 'UI', + id: 6, + children: [ + { + title: 'Alert', + icon: 'info-circle-linear', + to: '/ui-components/alert' + }, + { + title: 'Accordion', + icon: 'waterdrops-line-duotone', + to: '/ui-components/accordion' + }, + { + title: 'Avatar', + icon: 'expressionless-circle-outline', + to: '/ui-components/avatar' + }, + { + title: 'Chip', + icon: 'tag-horizontal-line-duotone', + to: '/ui-components/chip' + }, + { + title: 'Dialog', + icon: 'bolt-line-duotone', + to: '/ui-components/dialogs' + }, + { + title: 'List', + icon: 'checklist-bold-duotone', + to: '/ui-components/list' + }, + { + title: 'Menus', + icon: 'menu-dots-circle-outline', + to: '/ui-components/menus' + }, + { + title: 'Rating', + icon: 'shield-star-outline', + to: '/ui-components/rating' + }, + { + title: 'Tabs', + icon: 'box-minimalistic-line-duotone', + to: '/ui-components/tabs' + }, + { + title: 'Tooltip', + icon: 'transmission-square-outline', + to: '/ui-components/tooltip' + }, + { + title: 'Typography', + icon: 'text-circle-linear', + to: '/ui-components/typography' + } + ] + }, + + { + header: 'Auth', + id: 7, + children: [ + { + title: 'Error', + icon: 'bug-minimalistic-line-duotone', + to: '/auth/404' + }, + { + title: 'UnAuthorization', + icon: 'bug-minimalistic-line-duotone', + to: '/auth/401' + }, + { + title: 'Side Login', + icon: 'login-3-line-duotone', + to: '/auth/login' + }, + { + title: 'Boxed Login', + icon: 'login-3-line-duotone', + to: '/auth/login2' + }, + { + title: 'Side Register', + icon: 'user-plus-rounded-line-duotone', + to: '/auth/register' + }, + { + title: 'Boxed Register', + icon: 'user-plus-rounded-line-duotone', + to: '/auth/register2' + }, + { + title: 'Side Forgot Pwd', + icon: 'password-outline', + to: '/auth/forgot-password' + }, + { + title: 'Boxed Forgot Pwd', + icon: 'password-outline', + to: '/auth/forgot-password2' + }, + { + title: 'Side Two Steps', + icon: 'siderbar-line-duotone', + to: '/auth/two-step' + }, + { + title: 'Boxed Two Steps', + icon: 'siderbar-line-duotone', + to: '/auth/two-step2' + }, + { + title: 'Maintenance', + icon: 'settings-line-duotone', + to: '/auth/maintenance' + } + ] + }, + { + header: 'Multi Level', + id: 8, + children: [ + { + title: 'Menu Level', + icon: 'align-left-line-duotone', + to: '#', + id: 8, + children: [ + { + title: 'Level 1', + to: '/level1' + }, + { + title: 'Level 1 ', + to: '/2level', + children: [ + { + title: 'Level 2', + to: '/barry' + }, + { + title: 'Level 2', + to: '/2.2level', + children: [ { - title: 'Homepage', - to: '/front-page/homepage' - }, - { - title: 'About Us', - to: '/front-page/about-us' - }, - { - title: 'Blog', - to: '/front-page/blog/posts' - }, - { - title: 'Blog Details', - to: '/front-page/blog/early-black-friday-amazon-deals-cheap-tvs-headphones' - }, - { - title: 'Contact Us', - to: '/front-page/contact-us' - }, - { - title: 'Portfolio', - to: '/front-page/portfolio' - }, - { - title: 'Pricing', - to: '/front-page/pricing' + title: 'Level 3', + to: '/barry' } - ] - }, - ] - }, - - { - header: 'apps', - id: 1, - children: [ - { - title: 'ECommerce', - icon: 'cart-3-line-duotone', - to: '/ecommerce/', - children: [ - { - title: 'Shop', - to: '/ecommerce/products' - }, - { - title: 'Detail', - to: '/ecommerce/product/detail/1' - }, - { - title: 'List', - to: '/ecommerce/productlist' - }, - { - title: 'Checkout', - to: '/ecommerce/checkout' - }, - { - title: 'Add Product', - to: '/ecommerce/add-product' - }, - { - title: 'Edit Product', - to: '/ecommerce/edit-product' - } - ] - }, - { - title: 'Blog', - icon: 'widget-4-line-duotone', - to: '/', - children: [ - { - title: 'Blog Posts', - to: '/apps/blog/posts' - }, - { - title: 'Blog Details', - to: '/apps/blog/early-black-friday-amazon-deals-cheap-tvs-headphones' - } - ] - }, - { - title: 'User Profile', - icon: 'shield-user-line-duotone', - to: '/', - children: [ - { - title: 'Profile', - to: '/apps/user/profile' - }, - { - title: 'Followers', - to: '/apps/user/profile/followers' - }, - { - title: 'Friends', - to: '/apps/user/profile/friends' - }, - { - title: 'Gallery', - to: '/apps/user/profile/gallery' - } - ] - }, - { - title: 'Invoice', - icon: 'bill-check-outline', - to: '/', - children: [ - { - title: 'List', - to: '/apps/invoice' - }, - { - title: 'Details', - to: '/apps/invoice/details/102' - }, - { - title: 'Create', - to: '/apps/invoice/create' - }, - { - title: 'Edit', - to: '/apps/invoice/edit/102' - } - ] - }, - { - title: 'Calendar', - icon: 'calendar-mark-line-duotone', - to: '/apps/calendar' - }, - { - title: 'Email', - icon: 'letter-linear', - to: '/apps/email' - }, - { - title: 'Chats', - icon: 'chat-round-line-line-duotone', - to: '/apps/chats' - }, - { - title: 'Notes', - icon: 'document-text-line-duotone', - to: '/apps/notes' - }, - { - title: 'Kanban', - icon: 'airbuds-case-minimalistic-line-duotone', - to: '/apps/kanban' - }, - { - title: 'Contact', - icon: 'iphone-line-duotone', - to: '/apps/contacts' - }, - { - title: 'Tickets', - icon: 'ticker-star-outline', - to: '/apps/tickets' - }, - ] - }, - - { - header: 'pages', - id: 2, - children: [ - - { - title: 'Account Setting', - icon: 'settings-minimalistic-line-duotone', - to: '/pages/account-settings' - }, - { - title: 'Banners Widgets', - icon: 'align-vertical-spacing-line-duotone', - to: '/widgets/banners' - }, - { - title: 'Cards Widgets', - icon: 'cardholder-line-duotone', - to: '/widgets/cards' - }, - { - title: 'Charts Widgets', - icon: 'chart-square-line-duotone', - to: '/widgets/charts' - }, - { - title: 'FAQ', - icon: 'question-circle-line-duotone', - to: '/pages/faq' - }, - { - title: 'Gallery Lightbox', - icon: 'gallery-bold-duotone', - to: '/pages/gallery-lightbox', - }, - { - title: 'Landing Page', - icon: 'passport-line-duotone', - to: '/' - }, - { - title: 'Pricing', - icon: 'dollar-line-duotone', - to: '/pages/pricing' - }, - { - title: 'Search Results', - icon: 'card-search-line-duotone', - to: '/pages/search-results' - }, - { - title: 'Social Contacts', - icon: 'chat-round-like-linear', - to: '/pages/social-media-contacts' - }, - { - title: 'Treeview', - icon: 'transmission-line-duotone', - to: '/pages/treeview' - }, - - - - ] - }, - { - header: 'icons', - id: 2, - children: [ - { - title: 'Tabler Icons', - icon: 'sticker-smile-circle-2-line-duotone', - to: '/icons/tabler' - }, - { - title: 'Solar Icons', - icon: 'sticker-smile-circle-2-line-duotone', - to: '/icons/solar' + ] + } + ] } - ] - }, - - { - header: 'Forms', - id: 3, - children: [ - { - title: 'Form Elements', - icon: 'text-selection-line-duotone', - to: '/components/', - children: [ - { - title: 'Autocomplete', - to: '/forms/form-elements/autocomplete' - }, - { - title: 'Combobox', - to: '/forms/form-elements/combobox' - }, - { - title: 'Button', - to: '/forms/form-elements/button' - }, - { - title: 'Checkbox', - to: '/forms/form-elements/checkbox' - }, - { - title: 'Custom Inputs', - to: '/forms/form-elements/custominputs' - }, - { - title: 'File Inputs', - to: '/forms/form-elements/fileinputs' - }, - { - title: 'Radio', - to: '/forms/form-elements/radio' - }, - { - title: 'Date Time', - to: '/forms/form-elements/date-time' - }, - { - title: 'Select', - to: '/forms/form-elements/select' - }, - { - title: 'Slider', - to: '/forms/form-elements/slider' - }, - { - title: 'Switch', - to: '/forms/form-elements/switch' - }, - { - title: 'Time Picker', - to: '/forms/form-elements/time-picker' - }, - - { - title: 'Stepper', - to: '/forms/form-elements/stepper' - } - ] - }, - { - title: 'Form Layout', - icon: 'layers-minimalistic-outline', - to: '/forms/form-layouts' - }, - { - title: 'Form Horizontal', - icon: 'password-minimalistic-input-line-duotone', - to: '/forms/form-horizontal' - }, - { - title: 'Form Vertical', - icon: 'slider-vertical-line-duotone', - to: '/forms/form-vertical' - }, - { - title: 'Form Custom', - icon: 'clapperboard-play-outline', - to: '/forms/form-custom' - }, - { - title: 'Form Validation', - icon: 'soundwave-square-line-duotone', - to: '/forms/form-validation' - }, - { - title: 'Editor', - icon: 'clapperboard-edit-line-duotone', - to: '/forms/editor' - } - ] - }, - - { - header: 'tables', - id: 4, - children: [ - { - title: 'Basic Table', - icon: 'tablet-line-duotone', - to: '/tables/basic' - }, - { - title: 'Dark Table', - icon: 'bedside-table-4-outline', - to: '/tables/dark' - }, - { - title: 'Density Table', - icon: 'bedside-table-3-linear', - to: '/tables/density' - }, - { - title: 'Fixed Header Table', - icon: 'archive-up-minimlistic-broken', - to: '/tables/fixed-header' - }, - { - title: 'Height Table', - icon: 'archive-down-minimlistic-broken', - to: '/tables/height' - }, - { - title: 'Editable Table', - icon: 'document-add-linear', - to: '/tables/editable' - } - ] - }, - - { - header: 'datatables', - id: 4, - children: [ - { - title: 'Basic Table', - icon: 'database-outline', - to: '/tables/datatables/basic' - }, - { - title: 'Header Table', - icon: 'folder-open-broken', - to: '/tables/datatables/header' - }, - { - title: 'Selection Table', - icon: 'chart-square-broken', - to: '/tables/datatables/selection' - }, - { - title: 'Sorting Table', - icon: 'card-send-line-duotone', - to: '/tables/datatables/sorting' - }, - { - title: 'Pagination Table', - icon: 'tag-horizontal-broken', - to: '/tables/datatables/pagination' - }, - { - title: 'Filtering Table', - icon: 'tuning-square-2-line-duotone', - to: '/tables/datatables/filtering' - }, - { - title: 'Grouping Table', - icon: 'tuning-square-2-line-duotone', - to: '/tables/datatables/grouping' - }, - { - title: 'Table Slots', - icon: 'closet-line-duotone', - to: '/tables/datatables/slots' - }, - { - title: 'CRUD Table', - icon: 'text-underline-cross-broken', - to: '/tables/datatables/crudtable' - } - ] - }, - - { - header: 'Charts', - id: 5, - children: [ - { - title: 'Line', - icon: 'chat-square-2-outline', - to: '/charts/line-chart' - }, - { - title: 'Gredient', - icon: 'round-graph-linear', - to: '/charts/gredient-chart' - }, - { - title: 'Area', - icon: 'graph-up-linear', - to: '/charts/area-chart' - }, - { - title: 'Candlestick', - icon: 'chandelier-broken', - to: '/charts/candlestick-chart' - }, - { - title: 'Column', - icon: 'colour-tuneing-broken', - to: '/charts/column-chart' - }, - { - title: 'Doughnut & Pie', - icon: 'pie-chart-2-linear', - to: '/charts/doughnut-pie-chart' - }, - { - title: 'Radialbar & Radar', - icon: 'radar-2-outline', - to: '/charts/radialbar-chart' - } - ] - }, - - { - header: 'UI', - id: 6, - children: [ - { - title: 'Alert', - icon: 'info-circle-linear', - to: '/ui-components/alert' - }, - { - title: 'Accordion', - icon: 'waterdrops-line-duotone', - to: '/ui-components/accordion' - }, - { - title: 'Avatar', - icon: 'expressionless-circle-outline', - to: '/ui-components/avatar' - }, - { - title: 'Chip', - icon: 'tag-horizontal-line-duotone', - to: '/ui-components/chip' - }, - { - title: 'Dialog', - icon: 'bolt-line-duotone', - to: '/ui-components/dialogs' - }, - { - title: 'List', - icon: 'checklist-bold-duotone', - to: '/ui-components/list' - }, - { - title: 'Menus', - icon: 'menu-dots-circle-outline', - to: '/ui-components/menus' - }, - { - title: 'Rating', - icon: 'shield-star-outline', - to: '/ui-components/rating' - }, - { - title: 'Tabs', - icon: 'box-minimalistic-line-duotone', - to: '/ui-components/tabs' - }, - { - title: 'Tooltip', - icon: 'transmission-square-outline', - to: '/ui-components/tooltip' - }, - { - title: 'Typography', - icon: 'text-circle-linear', - to: '/ui-components/typography' - } - ] - }, - - { - header: 'Auth', - id: 7, - children: [ - { - title: 'Error', - icon: 'bug-minimalistic-line-duotone', - to: '/auth/404' - }, - { - title: 'Side Login', - icon: 'login-3-line-duotone', - to: '/auth/login' - }, - { - title: 'Boxed Login', - icon: 'login-3-line-duotone', - to: '/auth/login2' - }, - { - title: 'Side Register', - icon: 'user-plus-rounded-line-duotone', - to: '/auth/register' - }, - { - title: 'Boxed Register', - icon: 'user-plus-rounded-line-duotone', - to: '/auth/register2' - }, - { - title: 'Side Forgot Pwd', - icon: 'password-outline', - to: '/auth/forgot-password' - }, - { - title: 'Boxed Forgot Pwd', - icon: 'password-outline', - to: '/auth/forgot-password2' - }, - { - title: 'Side Two Steps', - icon: 'siderbar-line-duotone', - to: '/auth/two-step' - }, - { - title: 'Boxed Two Steps', - icon: 'siderbar-line-duotone', - to: '/auth/two-step2' - }, - { - title: 'Maintenance', - icon: 'settings-line-duotone', - to: '/auth/maintenance' - } - ] + ] + } + ] }, { - header: 'Multi Level', - id: 8, - children: [ - { - title: 'Menu Level', - icon: 'align-left-line-duotone', - to: '#', - id: 8, - children: [ - { - title: 'Level 1', - to: '/level1' - }, - { - title: 'Level 1 ', - to: '/2level', - children: [ - { - title: 'Level 2', - to: '/barry' - }, - { - title: 'Level 2', - to: '/2.2level', - children: [ - { - title: 'Level 3', - to: '/barry' - } - ] - } - ] - } - ] - } - ] - }, - { - header: 'More Options', - id: 8, - children: [ - { - title: 'Applications', - icon: 'check-circle-bold', - BgColor: 'primary' - }, - { - title: 'Form Options', - icon: 'check-circle-bold', - BgColor: 'secondary' - }, - { - title: 'Table Variations', - icon: 'check-circle-bold', - BgColor: 'error' - }, - { - title: 'Charts Selection', - icon: 'check-circle-bold', - BgColor: 'warning' - }, - { - title: 'Widgets', - icon: 'check-circle-bold', - BgColor: 'success' - } - ] + header: 'More Options', + id: 8, + children: [ + { + title: 'Applications', + icon: 'check-circle-bold', + BgColor: 'primary' + }, + { + title: 'Form Options', + icon: 'check-circle-bold', + BgColor: 'secondary' + }, + { + title: 'Table Variations', + icon: 'check-circle-bold', + BgColor: 'error' + }, + { + title: 'Charts Selection', + icon: 'check-circle-bold', + BgColor: 'warning' + }, + { + title: 'Widgets', + icon: 'check-circle-bold', + BgColor: 'success' + } + ] } ]; diff --git a/composables/useGetUserLoginComposables.ts b/composables/useGetUserLoginComposables.ts deleted file mode 100644 index 20d7773..0000000 --- a/composables/useGetUserLoginComposables.ts +++ /dev/null @@ -1,4 +0,0 @@ -export const useUseGetUserLoginComposables = (data: any) => { - console.log('data useUseGetUserLoginComposables', data) - return data; -} diff --git a/middleware/auth.ts b/middleware/auth.ts index 360ad3e..c1dabe4 100644 --- a/middleware/auth.ts +++ b/middleware/auth.ts @@ -1,12 +1,54 @@ -const userInfoStores = useUserInfoStore() -const { getUserInfoStore } = storeToRefs(useUserInfoStore()) -const { data } = useAuth() -export default defineNuxtRouteMiddleware((to, from) => { - console.log(data.value) - if (data.value === null || !data.value) { - navigateTo('/sample-page') - } else { - navigateTo('/sambelPage_copy') - console.log('berhasil login') +import {getTimetoMilis, timestampToDate} from "~/utils/helper"; +import {signOut} from "next-auth/react"; + +export default defineNuxtRouteMiddleware(async (to, from) => { + if (process.server) return; + try { + const sess = await useSessionLogin('getSess'); + console.log('session data:', sess); + // console.log('route auth requirement:', timestampToDate(sess?.expires_in?.timestamps, 'id-ID')); + // const timeMilis= sess?.expires_in?.timestamps*1000 + // console.log(timeMilis) + // console.log('route auth requirement:', new Date(timeMilis)); + // console.log('milis:', timestampToDate(sess?.expires_in?.timestamps,'id-ID')); + // console.log('milis:', timestampToDate(getTimetoMilis(),'id-ID')); + + // Jika session tidak ada atau sudah expired + + if(!sess || getTimetoMilis()>= sess?.user_payload?.expires?.expires_at){ + if(to.path!=='/auth/login'){ + await signOut() + return navigateTo({ + path: "/auth/login", + query: { + ...to.query, + reason: "auth_required", + continue: "true" + } + }); + } + return; } -}) + + + // Optional: Pengecekan tipe user jika diperlukan + // if (to.meta.auth && to.meta.auth !== sess?.user_payload?.typeUser) { + const metaRoles=to.meta?.roles; + console.log(metaRoles); + if (!to.meta || !metaRoles.includes(sess?.user_payload?.typeUser)) { + return navigateTo('/auth/401'); + } + + } catch (err) { + console.error('Session check failed:', err); + if (to.path !== '/auth/login') { + return navigateTo({ + path: '/auth/login', + query: { + returnUrl: to.fullPath, + reason: 'session check failed' + } + }); + } + } +}); diff --git a/package-lock.json b/package-lock.json index e2105a7..2584b84 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,11 @@ "version": "2.0.0", "hasInstallScript": true, "dependencies": { + "@fullcalendar/core": "6.1.10", + "@fullcalendar/daygrid": "6.1.10", + "@fullcalendar/interaction": "6.1.10", + "@fullcalendar/timegrid": "6.1.10", + "@fullcalendar/vue3": "6.1.10", "@iconify/vue": "^4.1.1", "@mdi/font": "7.4.47", "@pinia/nuxt": "^0.11.1", @@ -16,6 +21,7 @@ "apexcharts": "4.5.0", "axios": "^1.9.0", "axios-mock-adapter": "^2.1.0", + "date-fns": "^4.1.0", "jsonwebtoken": "^9.0.2", "sass": "1.70.0", "sass-loader": "^16.0.5", @@ -975,6 +981,65 @@ "dev": true, "license": "MIT" }, + "node_modules/@fullcalendar/core": { + "version": "6.1.10", + "resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-6.1.10.tgz", + "integrity": "sha512-oTXGJSAGpCf1oY+CKp5qYjMHkJCPBkJ3SHitl63n8Q6xKeiwQ4EF6Au451euUovREwJpLmD1AyZrCnWmtB9AVg==", + "license": "MIT", + "dependencies": { + "preact": "~10.12.1" + } + }, + "node_modules/@fullcalendar/core/node_modules/preact": { + "version": "10.12.1", + "resolved": "https://registry.npmjs.org/preact/-/preact-10.12.1.tgz", + "integrity": "sha512-l8386ixSsBdbreOAkqtrwqHwdvR35ID8c3rKPa8lCWuO86dBi32QWHV4vfsZK1utLLFMvw+Z5Ad4XLkZzchscg==", + "license": "MIT", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/preact" + } + }, + "node_modules/@fullcalendar/daygrid": { + "version": "6.1.10", + "resolved": "https://registry.npmjs.org/@fullcalendar/daygrid/-/daygrid-6.1.10.tgz", + "integrity": "sha512-Z4GRm1IyHKgxXFTWGcEI0nTsvYOIkpE0aMt3/o3ER2SZkF+hfwcDFhtj0c9+WhMjXFIWYeoTnA9rUOY7Zl/nxA==", + "license": "MIT", + "peerDependencies": { + "@fullcalendar/core": "~6.1.10" + } + }, + "node_modules/@fullcalendar/interaction": { + "version": "6.1.10", + "resolved": "https://registry.npmjs.org/@fullcalendar/interaction/-/interaction-6.1.10.tgz", + "integrity": "sha512-aZRlwCpmDasq2RNeWV0ub20Uevare9Cb6iMlxCacx0fhOC14H28G9d1FsduJIecInL84SPGwt5ItqAYMsWv7zw==", + "license": "MIT", + "peerDependencies": { + "@fullcalendar/core": "~6.1.10" + } + }, + "node_modules/@fullcalendar/timegrid": { + "version": "6.1.10", + "resolved": "https://registry.npmjs.org/@fullcalendar/timegrid/-/timegrid-6.1.10.tgz", + "integrity": "sha512-hFKyQXJaPbNyq1reZmvkCmM64O99krHoIcJAbDS+dntCm3FzZUcDtAcRKIbMiantHrezCG/1MEYk3m9e3aKvIQ==", + "license": "MIT", + "dependencies": { + "@fullcalendar/daygrid": "~6.1.10" + }, + "peerDependencies": { + "@fullcalendar/core": "~6.1.10" + } + }, + "node_modules/@fullcalendar/vue3": { + "version": "6.1.10", + "resolved": "https://registry.npmjs.org/@fullcalendar/vue3/-/vue3-6.1.10.tgz", + "integrity": "sha512-YMYBQx0TlWNuN4G6ra2dkf5cCF5aVi/2zDLGLvLqe2Nk2o7uNbTkrCSG40061OepWQlJv+hYqm1JukLRmyqi4Q==", + "license": "MIT", + "peerDependencies": { + "@fullcalendar/core": "~6.1.10", + "vue": "^3.0.11" + } + }, "node_modules/@iconify/types": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz", @@ -5089,6 +5154,16 @@ "node": ">= 12" } }, + "node_modules/date-fns": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz", + "integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==", + "license": "MIT", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/kossnocorp" + } + }, "node_modules/db0": { "version": "0.3.2", "resolved": "https://registry.npmjs.org/db0/-/db0-0.3.2.tgz", diff --git a/package.json b/package.json index 2ff7cde..9ca63ed 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,11 @@ "postinstall": "nuxt prepare" }, "dependencies": { + "@fullcalendar/core": "6.1.10", + "@fullcalendar/daygrid": "6.1.10", + "@fullcalendar/interaction": "6.1.10", + "@fullcalendar/timegrid": "6.1.10", + "@fullcalendar/vue3": "6.1.10", "@iconify/vue": "^4.1.1", "@mdi/font": "7.4.47", "@pinia/nuxt": "^0.11.1", @@ -18,6 +23,7 @@ "apexcharts": "4.5.0", "axios": "^1.9.0", "axios-mock-adapter": "^2.1.0", + "date-fns": "^4.1.0", "jsonwebtoken": "^9.0.2", "sass": "1.70.0", "sass-loader": "^16.0.5", @@ -32,11 +38,11 @@ "vuetify": "3.7.18" }, "devDependencies": { - "nuxt": "^3.17.5", "@sidebase/nuxt-auth": "^0.10.1", + "nuxt": "^3.17.5", "pinia": "^3.0.3" }, "overrides": { "nth-check": "2.1.1" } -} \ No newline at end of file +} diff --git a/pages/SambelPage_copy.vue b/pages/SambelPage_copy.vue index 6a04057..31874d6 100644 --- a/pages/SambelPage_copy.vue +++ b/pages/SambelPage_copy.vue @@ -3,12 +3,10 @@ definePageMeta({ middleware: ['auth'] }) import { ref } from "vue"; -import UiParentCard from "@/components/shared/UiParentCard.vue"; -import { useAuth, useUserInfoStore } from "#imports"; -import { useUseGetUserLoginComposables } from "~/composables/useGetUserLoginComposables" +import { useAuth } from "#imports"; -const { setUserInfoStore } = useUserInfoStore(); -const { getUserInfoStore } = storeToRefs(useUserInfoStore()); +// const { setUserInfoStore } = useUserInfoStore(); +// const { getUserInfoStore } = storeToRefs(useUserInfoStore()); const { data, status, getCsrfToken, getProviders, signOut, getSession } = useAuth() const tokens = ref('') onMounted(async () => { @@ -16,12 +14,8 @@ onMounted(async () => { const headers = useRequestHeaders(['cookie']) as HeadersInit const { data: token } = await useFetch('/api/token', { headers }) tokens.value = token.value - // userAuthenticate(token.value) - setUserInfoStore(token.value) }) const getUserFromComposable = () => { - const a = useUseGetUserLoginComposables(getUserInfoStore.value) - console.log('ini a', a) }