mirror of
https://github.com/akveo/ngx-admin.git
synced 2025-12-16 15:40:11 +01:00
refactor(app): refactor forRoot & menu import
This commit is contained in:
parent
d6cef06dcd
commit
be69ccc058
6 changed files with 170 additions and 111 deletions
|
|
@ -1,7 +1,12 @@
|
|||
import { NgModule, Optional, SkipSelf } from '@angular/core';
|
||||
import { ModuleWithProviders, NgModule, Optional, SkipSelf } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
import { throwIfAlreadyLoaded } from './module-import-guard';
|
||||
import { DataModule } from './data/data.module';
|
||||
|
||||
const NGA_CORE_PROVIDERS = [
|
||||
...DataModule.forRoot().providers,
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
|
|
@ -13,4 +18,13 @@ export class CoreModule {
|
|||
constructor(@Optional() @SkipSelf() parentModule: CoreModule) {
|
||||
throwIfAlreadyLoaded(parentModule, 'CoreModule');
|
||||
}
|
||||
|
||||
static forRoot(): ModuleWithProviders {
|
||||
return <ModuleWithProviders>{
|
||||
ngModule: CoreModule,
|
||||
providers: [
|
||||
...NGA_CORE_PROVIDERS,
|
||||
],
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,9 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { ModuleWithProviders, NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
||||
|
||||
import {
|
||||
NgaThemeModule,
|
||||
NgaCardModule,
|
||||
NgaLayoutModule,
|
||||
NgaTabsetModule,
|
||||
|
|
@ -45,6 +46,7 @@ const NGA_MODULES = [
|
|||
NgaUserModule,
|
||||
NgaActionsModule,
|
||||
NgaSearchModule,
|
||||
NgaSidebarModule,
|
||||
];
|
||||
|
||||
const COMPONENTS = [
|
||||
|
|
@ -61,11 +63,17 @@ const PIPES = [
|
|||
RoundPipe,
|
||||
];
|
||||
|
||||
const NGA_THEME_PROVIDERS = [
|
||||
...NgaThemeModule.forRoot({ name: 'cosmic' }).providers,
|
||||
...NgaSidebarModule.forRoot().providers,
|
||||
...NgaSidebarModule.forRoot().providers,
|
||||
...NgaMenuModule.forRoot().providers,
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
...BASE_MODULES,
|
||||
...NGA_MODULES,
|
||||
NgaSidebarModule.forRoot(),
|
||||
],
|
||||
exports: [
|
||||
...BASE_MODULES,
|
||||
|
|
@ -79,4 +87,13 @@ const PIPES = [
|
|||
],
|
||||
})
|
||||
export class ThemeModule {
|
||||
|
||||
static forRoot(): ModuleWithProviders {
|
||||
return <ModuleWithProviders>{
|
||||
ngModule: ThemeModule,
|
||||
providers: [
|
||||
...NGA_THEME_PROVIDERS,
|
||||
],
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ import { CoreModule } from './@core/core.module';
|
|||
|
||||
import { AppComponent } from './app.component';
|
||||
import { AppRoutingModule } from './app-routing.module';
|
||||
import { ThemeModule } from './@theme/theme.module';
|
||||
|
||||
@NgModule({
|
||||
declarations: [AppComponent],
|
||||
|
|
@ -22,6 +23,8 @@ import { AppRoutingModule } from './app-routing.module';
|
|||
HttpModule,
|
||||
AppRoutingModule,
|
||||
CoreModule,
|
||||
ThemeModule.forRoot(),
|
||||
CoreModule.forRoot(),
|
||||
],
|
||||
bootstrap: [AppComponent],
|
||||
providers: [
|
||||
|
|
|
|||
|
|
@ -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',
|
||||
},
|
||||
]),
|
||||
},
|
||||
]);
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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: [
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue