diff --git a/src/app/features/admin/admin-routing.module.ts b/src/app/features/admin/admin-routing.module.ts new file mode 100644 index 0000000..7e42028 --- /dev/null +++ b/src/app/features/admin/admin-routing.module.ts @@ -0,0 +1,11 @@ +import { NgModule } from '@angular/core'; +import { RouterModule, Routes } from '@angular/router'; +import { AdminComponent } from './admin.component'; + +const routes: Routes = [{ path: '', component: AdminComponent }]; + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule] +}) +export class AdminRoutingModule { } diff --git a/src/app/features/admin/admin.component.html b/src/app/features/admin/admin.component.html new file mode 100644 index 0000000..5601a83 --- /dev/null +++ b/src/app/features/admin/admin.component.html @@ -0,0 +1,5 @@ +
+ + + +
diff --git a/src/app/features/admin/admin.component.scss b/src/app/features/admin/admin.component.scss new file mode 100644 index 0000000..248abe2 --- /dev/null +++ b/src/app/features/admin/admin.component.scss @@ -0,0 +1,8 @@ +:host { + display: block; + height: 100%; +} + +.container { + height: 100%; +} diff --git a/src/app/features/admin/admin.component.spec.ts b/src/app/features/admin/admin.component.spec.ts new file mode 100644 index 0000000..eb28e42 --- /dev/null +++ b/src/app/features/admin/admin.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AdminComponent } from './admin.component'; + +describe('AdminComponent', () => { + let component: AdminComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ AdminComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(AdminComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/features/admin/admin.component.ts b/src/app/features/admin/admin.component.ts new file mode 100644 index 0000000..d267ab2 --- /dev/null +++ b/src/app/features/admin/admin.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-admin', + templateUrl: './admin.component.html', + styleUrls: ['./admin.component.scss'] +}) +export class AdminComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/features/admin/admin.module.ts b/src/app/features/admin/admin.module.ts new file mode 100644 index 0000000..bc0a9be --- /dev/null +++ b/src/app/features/admin/admin.module.ts @@ -0,0 +1,26 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; + +import { AdminRoutingModule } from './admin-routing.module'; +import { AdminComponent } from './admin.component'; +import { MatTabsModule } from "@angular/material/tabs"; +import { MenuManagerComponent } from './menu-manager/menu-manager.component'; +import { DragDropModule } from "@angular/cdk/drag-drop"; +import { MatCardModule } from "@angular/material/card"; +import { SharedModule } from "../../shared/shared.module"; +import { MatListModule } from "@angular/material/list"; + + +@NgModule({ + declarations: [AdminComponent, MenuManagerComponent], + imports: [ + CommonModule, + AdminRoutingModule, + MatTabsModule, + DragDropModule, + MatCardModule, + SharedModule, + MatListModule + ] +}) +export class AdminModule { } diff --git a/src/app/features/admin/menu-manager/menu-manager.component.html b/src/app/features/admin/menu-manager/menu-manager.component.html new file mode 100644 index 0000000..53578c4 --- /dev/null +++ b/src/app/features/admin/menu-manager/menu-manager.component.html @@ -0,0 +1,25 @@ +
+ +
+ HI + + {{ cat.title }} + + + + + {{ page.title }} + + + + +
+
diff --git a/src/app/features/admin/menu-manager/menu-manager.component.scss b/src/app/features/admin/menu-manager/menu-manager.component.scss new file mode 100644 index 0000000..0627599 --- /dev/null +++ b/src/app/features/admin/menu-manager/menu-manager.component.scss @@ -0,0 +1,13 @@ +:host { + display: block; +} + +.dlg { + display: flex; + flex-flow: row wrap; + gap: 0.5rem; + + mat-card { + height: 100%; + } +} diff --git a/src/app/features/admin/menu-manager/menu-manager.component.spec.ts b/src/app/features/admin/menu-manager/menu-manager.component.spec.ts new file mode 100644 index 0000000..1ea620b --- /dev/null +++ b/src/app/features/admin/menu-manager/menu-manager.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { MenuManagerComponent } from './menu-manager.component'; + +describe('MenuManagerComponent', () => { + let component: MenuManagerComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ MenuManagerComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(MenuManagerComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/features/admin/menu-manager/menu-manager.component.ts b/src/app/features/admin/menu-manager/menu-manager.component.ts new file mode 100644 index 0000000..23df57a --- /dev/null +++ b/src/app/features/admin/menu-manager/menu-manager.component.ts @@ -0,0 +1,39 @@ +import { Component } from '@angular/core'; +import { Category } from '../../../data/category'; +import { ContentService } from '../../../shared/services/content.service'; +import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop'; +import { Page } from '../../../data/page'; +import { map, mergeMap } from 'rxjs/operators'; +import { Observable } from 'rxjs'; + +@Component({ + selector: 'app-menu-manager', + templateUrl: './menu-manager.component.html', + styleUrls: ['./menu-manager.component.scss'] +}) +export class MenuManagerComponent { + categories: Category[]; + pages: Page[][]; + + constructor(content: ContentService) { + content.getCategories().pipe(mergeMap((categories) => { + this.categories = categories; + this.pages = []; + return categories.map>((value, i) => value.pages$.pipe(map(pages => [pages, i]))); + }), mergeMap(value => value)).subscribe(([pages, i]) => this.pages[i] = pages); + } + + dropPage(event: CdkDragDrop): void { + console.log(event); + if (event.container === event.previousContainer) { + moveItemInArray(event.container.data, event.previousIndex, event.currentIndex); + } else { + transferArrayItem(event.previousContainer.data, event.container.data, event.previousIndex, event.currentIndex); + } + } + + dropCategory(event: CdkDragDrop): void { + console.log(event); + moveItemInArray(event.container.data, event.previousIndex, event.currentIndex); + } +}