refactor: update navigation generator

This commit is contained in:
Łukasz Holeczek
2021-08-30 15:02:03 +02:00
parent d37c7f8b02
commit 201c7063c4
2 changed files with 64 additions and 64 deletions
+57 -57
View File
@@ -1,6 +1,6 @@
export default [ export default [
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Dashboard', name: 'Dashboard',
to: '/dashboard', to: '/dashboard',
icon: 'cil-speedometer', icon: 'cil-speedometer',
@@ -10,188 +10,188 @@ export default [
}, },
}, },
{ {
_name: 'CNavTitle', component: 'CNavTitle',
name: 'Theme', name: 'Theme',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Colors', name: 'Colors',
to: '/theme/colors', to: '/theme/colors',
icon: 'cil-drop', icon: 'cil-drop',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Typography', name: 'Typography',
to: '/theme/typography', to: '/theme/typography',
icon: 'cil-pencil', icon: 'cil-pencil',
}, },
{ {
_name: 'CNavTitle', component: 'CNavTitle',
name: 'Components', name: 'Components',
}, },
{ {
_name: 'CNavGroup', component: 'CNavGroup',
name: 'Base', name: 'Base',
to: '/base', to: '/base',
icon: 'cil-puzzle', icon: 'cil-puzzle',
children: [ items: [
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Accordion', name: 'Accordion',
to: '/base/accordion', to: '/base/accordion',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Breadcrumbs', name: 'Breadcrumbs',
to: '/base/breadcrumbs', to: '/base/breadcrumbs',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Cards', name: 'Cards',
to: '/base/cards', to: '/base/cards',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Carousels', name: 'Carousels',
to: '/base/carousels', to: '/base/carousels',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Collapses', name: 'Collapses',
to: '/base/collapses', to: '/base/collapses',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'List Groups', name: 'List Groups',
to: '/base/list-groups', to: '/base/list-groups',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Navs & Tabs', name: 'Navs & Tabs',
to: '/base/navs', to: '/base/navs',
}, },
// { // {
// _name: "CNavItem", // component: "CNavItem",
// name: "Navbars", // name: "Navbars",
// to: "/base/navbars", // to: "/base/navbars",
// }, // },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Paginations', name: 'Paginations',
to: '/base/paginations', to: '/base/paginations',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Popovers', name: 'Popovers',
to: '/base/popovers', to: '/base/popovers',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Progress', name: 'Progress',
to: '/base/progress', to: '/base/progress',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Spinners', name: 'Spinners',
to: '/base/spinners', to: '/base/spinners',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Tables', name: 'Tables',
to: '/base/tables', to: '/base/tables',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Tooltips', name: 'Tooltips',
to: '/base/tooltips', to: '/base/tooltips',
}, },
], ],
}, },
{ {
_name: 'CNavGroup', component: 'CNavGroup',
name: 'Buttons', name: 'Buttons',
to: '/buttons', to: '/buttons',
icon: 'cil-cursor', icon: 'cil-cursor',
children: [ items: [
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Buttons', name: 'Buttons',
to: '/buttons/standard-buttons', to: '/buttons/standard-buttons',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Button Groups', name: 'Button Groups',
to: '/buttons/button-groups', to: '/buttons/button-groups',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Dropdowns', name: 'Dropdowns',
to: '/buttons/dropdowns', to: '/buttons/dropdowns',
}, },
], ],
}, },
{ {
_name: 'CNavGroup', component: 'CNavGroup',
name: 'Forms', name: 'Forms',
to: '/forms', to: '/forms',
icon: 'cil-star', icon: 'cil-star',
children: [ items: [
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Form Control', name: 'Form Control',
to: '/forms/form-control', to: '/forms/form-control',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Select', name: 'Select',
to: '/forms/select', to: '/forms/select',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Checks & Radios', name: 'Checks & Radios',
to: '/forms/checks-radios', to: '/forms/checks-radios',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Range', name: 'Range',
to: '/forms/range', to: '/forms/range',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Input Group', name: 'Input Group',
to: '/forms/input-group', to: '/forms/input-group',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Floating Labels', name: 'Floating Labels',
to: '/forms/floating-labels', to: '/forms/floating-labels',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Layout', name: 'Layout',
to: '/forms/layout', to: '/forms/layout',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Validation', name: 'Validation',
to: '/forms/validation', to: '/forms/validation',
}, },
], ],
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Charts', name: 'Charts',
to: '/charts', to: '/charts',
icon: 'cil-chart-pie', icon: 'cil-chart-pie',
}, },
{ {
_name: 'CNavGroup', component: 'CNavGroup',
name: 'Icons', name: 'Icons',
to: '/icons', to: '/icons',
icon: 'cil-star', icon: 'cil-star',
children: [ items: [
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'CoreUI Icons', name: 'CoreUI Icons',
to: '/icons/coreui-icons', to: '/icons/coreui-icons',
badge: { badge: {
@@ -200,42 +200,42 @@ export default [
}, },
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Brands', name: 'Brands',
to: '/icons/brands', to: '/icons/brands',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Flags', name: 'Flags',
to: '/icons/flags', to: '/icons/flags',
}, },
], ],
}, },
{ {
_name: 'CNavGroup', component: 'CNavGroup',
name: 'Notifications', name: 'Notifications',
to: '/notifications', to: '/notifications',
icon: 'cil-bell', icon: 'cil-bell',
children: [ items: [
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Alerts', name: 'Alerts',
to: '/notifications/alerts', to: '/notifications/alerts',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Badges', name: 'Badges',
to: '/notifications/badges', to: '/notifications/badges',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Modals', name: 'Modals',
to: '/notifications/modals', to: '/notifications/modals',
}, },
], ],
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Widgets', name: 'Widgets',
to: '/widgets', to: '/widgets',
icon: 'cil-calculator', icon: 'cil-calculator',
@@ -246,32 +246,32 @@ export default [
}, },
}, },
{ {
_name: 'CNavTitle', component: 'CNavTitle',
name: 'Extras', name: 'Extras',
}, },
{ {
_name: 'CNavGroup', component: 'CNavGroup',
name: 'Pages', name: 'Pages',
to: '/pages', to: '/pages',
icon: 'cil-star', icon: 'cil-star',
children: [ items: [
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Login', name: 'Login',
to: '/pages/login', to: '/pages/login',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Register', name: 'Register',
to: '/pages/register', to: '/pages/register',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Error 404', name: 'Error 404',
to: '/pages/404', to: '/pages/404',
}, },
{ {
_name: 'CNavItem', component: 'CNavItem',
name: 'Error 500', name: 'Error 500',
to: '/pages/500', to: '/pages/500',
}, },
@@ -279,7 +279,7 @@ export default [
}, },
// { // {
// _name: 'CNavItem', // component: 'CNavItem',
// name: 'Download CoreUI', // name: 'Download CoreUI',
// href: 'http://coreui.io/vue/', // href: 'http://coreui.io/vue/',
// icon: { name: 'cil-cloud-download', class: 'text-white' }, // icon: { name: 'cil-cloud-download', class: 'text-white' },
@@ -287,7 +287,7 @@ export default [
// target: '_blank' // target: '_blank'
// }, // },
// { // {
// _name: 'CNavItem', // component: 'CNavItem',
// name: 'Try CoreUI PRO', // name: 'Try CoreUI PRO',
// href: 'http://coreui.io/pro/vue/', // href: 'http://coreui.io/pro/vue/',
// icon: { name: 'cil-layers', class: 'text-white' }, // icon: { name: 'cil-layers', class: 'text-white' },
+7 -7
View File
@@ -37,8 +37,8 @@ const AppSidebarNav = defineComponent({
return true return true
} }
if (item.children) { if (item.items) {
return item.children.some((child) => isActiveItem(route, child)) return item.items.some((child) => isActiveItem(route, child))
} }
return false return false
@@ -47,11 +47,11 @@ const AppSidebarNav = defineComponent({
const renderItem = (item) => { const renderItem = (item) => {
const route = useRoute() const route = useRoute()
if (item.children) { if (item.items) {
return h( return h(
resolveComponent('CNavGroup'), resolveComponent('CNavGroup'),
{ {
visible: item.children.some((child) => isActiveItem(route, child)), visible: item.items.some((child) => isActiveItem(route, child)),
}, },
{ {
togglerContent: () => [ togglerContent: () => [
@@ -61,7 +61,7 @@ const AppSidebarNav = defineComponent({
}), }),
item.name, item.name,
], ],
default: () => item.children.map((child) => renderItem(child)), default: () => item.items.map((child) => renderItem(child)),
}, },
) )
} }
@@ -76,7 +76,7 @@ const AppSidebarNav = defineComponent({
{ {
default: (props) => default: (props) =>
h( h(
resolveComponent(item._name), resolveComponent(item.component),
{ {
active: props.isActive, active: props.isActive,
href: props.href, href: props.href,
@@ -107,7 +107,7 @@ const AppSidebarNav = defineComponent({
}, },
) )
: h( : h(
resolveComponent(item._name), resolveComponent(item.component),
{}, {},
{ {
default: () => item.name, default: () => item.name,