refactor(app): refactor forRoot & menu import

This commit is contained in:
Dmitry Nehaychik 2017-07-20 15:14:38 +03:00
parent d6cef06dcd
commit be69ccc058
6 changed files with 170 additions and 111 deletions

View file

@ -2,102 +2,134 @@ import { NgaMenuItem } from '@akveo/nga-theme';
import { List } from 'immutable';
// TODO: refactor array styles
export const menuItems: List<NgaMenuItem> = List([{
title: 'Dashboard',
icon: 'ion ion-ios-home-outline',
link: '/pages/dashboard',
home: true,
}, {
title: 'FEATURES',
group: true,
}, {
title: 'UI Features',
icon: 'ion ion-ios-keypad-outline',
link: '/pages/ui-features',
children: List<NgaMenuItem>([{
title: 'Buttons',
link: '/pages/ui-features/buttons',
}, {
title: 'Grid',
link: '/pages/ui-features/grid',
}, {
title: 'Icons',
link: '/pages/ui-features/icons',
}, {
title: 'Modals',
link: '/pages/ui-features/modals',
}, {
title: 'Typography',
link: '/pages/ui-features/typography',
}, {
title: 'Animated Searches',
link: '/pages/ui-features/search-fields',
export const MENU_ITEMS: List<NgaMenuItem> = List([
{
title: 'Dashboard',
icon: 'ion ion-ios-home-outline',
link: '/pages/dashboard',
home: true,
},
{
title: 'Tabs',
link: '/pages/ui-features/tabs',
}]),
}, {
title: 'Components',
icon: 'ion ion-ios-gear-outline',
children: List<NgaMenuItem>([
{
title: 'Tree',
link: '/pages/components/tree',
}, {
title: 'Toaster',
link: '/pages/components/toaster',
},
]),
}, {
title: 'Maps',
icon: 'ion ion-ios-location-outline',
children: List<NgaMenuItem>([{
title: 'Gmaps',
link: '/pages/maps/gmaps',
}, {
title: 'Leaflet',
link: '/pages/maps/leaflet',
}]),
}, {
title: 'Charts',
icon: 'ion ion-arrow-graph-up-right',
children: List<NgaMenuItem>([{
title: 'Echarts',
link: '/pages/charts/echarts',
}, {
title: 'D3',
link: '/pages/charts/d3',
}, {
title: 'Charts.js',
link: '/pages/charts/chartjs',
}]),
}, {
title: 'Editors',
icon: 'ion ion-edit',
children: List<NgaMenuItem>([{
title: 'TinyMCE',
link: '/pages/editors/tinymce',
}, {
title: 'CKEditor',
link: '/pages/editors/ckeditor',
}]),
}, {
title: 'Forms',
icon: 'ion-compose',
children: List<NgaMenuItem>([{
title: 'Form Inputs',
link: '/pages/forms/inputs',
}, {
title: 'Form Layouts',
link: '/pages/forms/layouts',
}]),
}, {
title: 'Tables',
icon: 'ion-ios-grid-view',
children: List<NgaMenuItem>([{
title: 'Smart Table',
link: '/pages/tables/smart-table',
}]),
}]);
title: 'FEATURES',
group: true,
},
{
title: 'UI Features',
icon: 'ion ion-ios-keypad-outline',
link: '/pages/ui-features',
children: List<NgaMenuItem>([
{
title: 'Buttons',
link: '/pages/ui-features/buttons',
},
{
title: 'Grid',
link: '/pages/ui-features/grid',
},
{
title: 'Icons',
link: '/pages/ui-features/icons',
},
{
title: 'Modals',
link: '/pages/ui-features/modals',
},
{
title: 'Typography',
link: '/pages/ui-features/typography',
},
{
title: 'Animated Searches',
link: '/pages/ui-features/search-fields',
},
{
title: 'Tabs',
link: '/pages/ui-features/tabs',
},
]),
},
{
title: 'Components',
icon: 'ion ion-ios-gear-outline',
children: List<NgaMenuItem>([
{
title: 'Tree',
link: '/pages/components/tree',
}, {
title: 'Toaster',
link: '/pages/components/toaster',
},
]),
},
{
title: 'Maps',
icon: 'ion ion-ios-location-outline',
children: List<NgaMenuItem>([
{
title: 'Gmaps',
link: '/pages/maps/gmaps',
},
{
title: 'Leaflet',
link: '/pages/maps/leaflet',
},
]),
},
{
title: 'Charts',
icon: 'ion ion-arrow-graph-up-right',
children: List<NgaMenuItem>([
{
title: 'Echarts',
link: '/pages/charts/echarts',
},
{
title: 'D3',
link: '/pages/charts/d3',
},
{
title: 'Charts.js',
link: '/pages/charts/chartjs',
},
]),
},
{
title: 'Editors',
icon: 'ion ion-edit',
children: List<NgaMenuItem>([
{
title: 'TinyMCE',
link: '/pages/editors/tinymce',
},
{
title: 'CKEditor',
link: '/pages/editors/ckeditor',
},
]),
},
{
title: 'Forms',
icon: 'ion-compose',
children: List<NgaMenuItem>([
{
title: 'Form Inputs',
link: '/pages/forms/inputs',
},
{
title: 'Form Layouts',
link: '/pages/forms/layouts',
},
]),
},
{
title: 'Tables',
icon: 'ion-ios-grid-view',
children: List<NgaMenuItem>([
{
title: 'Smart Table',
link: '/pages/tables/smart-table',
},
]),
},
]);

View file

@ -1,15 +1,18 @@
import { Component } from '@angular/core';
import 'style-loader!../@theme/styles/styles.scss';
import { MENU_ITEMS } from './pages-menu';
@Component({
selector: 'ngx-pages',
template: `
<ngx-one-column-layout>
<nga-menu></nga-menu>
<nga-menu [items]="menu"></nga-menu>
<router-outlet></router-outlet>
</ngx-one-column-layout>
`,
})
export class PagesComponent {
menu = MENU_ITEMS;
}

View file

@ -1,14 +1,9 @@
import { NgModule } from '@angular/core';
import { NgaMenuModule, NgaSidebarModule, NgaThemeModule } from '@akveo/nga-theme';
import { menuItems } from './pages-menu';
import { PagesComponent } from './pages.component';
import { DashboardModule } from './dashboard/dashboard.module';
import { PagesRoutingModule } from './pages-routing.module';
import { ThemeModule } from '../@theme/theme.module';
import { DataModule } from '../@core/data/data.module';
const PAGES_COMPONENTS = [
PagesComponent,
@ -16,13 +11,8 @@ const PAGES_COMPONENTS = [
@NgModule({
imports: [
// TODO: why here? review the modules structure
NgaThemeModule.forRoot({ name: 'cosmic' }),
NgaSidebarModule.forRoot(),
NgaMenuModule.forRoot({ items: menuItems }),
PagesRoutingModule,
ThemeModule,
DataModule.forRoot(),
DashboardModule,
],
declarations: [