redit 컴포넌트 추가

src/app/modules/admin/board/customer-template/components/index.ts

@@ -1,3 +1,3 @@
 import { ListComponent } from './list.component';
-
+import { ReditComponent } from './redit.component';
-export const COMPONENTS = [ListComponent];
+export const COMPONENTS = [ListComponent, ReditComponent];

src/app/modules/admin/board/customer-template/components/redit.component.html

@@ -0,0 +1,4 @@
+<!-- Title -->
+<div class="text-4xl font-extrabold tracking-tight">
+  고객센터템플릿-상세페이지
+</div>

src/app/modules/admin/board/customer-template/components/redit.component.ts

@@ -0,0 +1,140 @@
+import {
+  AfterViewInit,
+  ChangeDetectionStrategy,
+  ChangeDetectorRef,
+  Component,
+  OnDestroy,
+  OnInit,
+  ViewChild,
+  ViewEncapsulation,
+} from '@angular/core';
+import {
+  FormBuilder,
+  FormControl,
+  FormGroup,
+  Validators,
+} from '@angular/forms';
+import { MatCheckboxChange } from '@angular/material/checkbox';
+import { MatPaginator } from '@angular/material/paginator';
+import { MatSort } from '@angular/material/sort';
+import {
+  debounceTime,
+  map,
+  merge,
+  Observable,
+  Subject,
+  switchMap,
+  takeUntil,
+} from 'rxjs';
+import { fuseAnimations } from '@fuse/animations';
+import { FuseConfirmationService } from '@fuse/services/confirmation';
+
+import { User } from 'app/modules/admin/member/user/models/user';
+import { UserService } from 'app/modules/admin/member/user/services/user.service';
+import { ActivatedRoute } from '@angular/router';
+
+@Component({
+  selector: 'customer-template-redit',
+  templateUrl: './redit.component.html',
+  styles: [
+    /* language=SCSS */
+    `
+      .inventory-grid {
+        grid-template-columns: 48px auto 40px;
+
+        @screen sm {
+          grid-template-columns: 48px auto 112px 72px;
+        }
+
+        @screen md {
+          grid-template-columns: 48px 112px auto 112px 72px;
+        }
+
+        @screen lg {
+          grid-template-columns: 48px 112px auto 112px 96px 96px 72px;
+        }
+      }
+    `,
+  ],
+  encapsulation: ViewEncapsulation.None,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  animations: fuseAnimations,
+})
+export class ReditComponent implements OnInit, AfterViewInit, OnDestroy {
+  @ViewChild(MatPaginator) private _paginator!: MatPaginator;
+  @ViewChild(MatSort) private _sort!: MatSort;
+
+  isLoading = false;
+  searchInputControl = new FormControl();
+  selectedProductForm!: FormGroup;
+  selectedUser?: User;
+
+  private _unsubscribeAll: Subject<any> = new Subject<any>();
+
+  /**
+   * Constructor
+   */
+  constructor(
+    private _changeDetectorRef: ChangeDetectorRef,
+    private _fuseConfirmationService: FuseConfirmationService,
+    private _formBuilder: FormBuilder,
+    private _userService: UserService,
+    private _route: ActivatedRoute
+  ) {}
+
+  // -----------------------------------------------------------------------------------------------------
+  // @ Lifecycle hooks
+  // -----------------------------------------------------------------------------------------------------
+
+  /**
+   * On init
+   */
+  ngOnInit(): void {
+    const idx = this._route.snapshot.params['id'];
+    console.log(idx);
+  }
+
+  /**
+   * After view init
+   */
+  ngAfterViewInit(): void {}
+
+  /**
+   * On destroy
+   */
+  ngOnDestroy(): void {
+    // Unsubscribe from all subscriptions
+    this._unsubscribeAll.next(null);
+    this._unsubscribeAll.complete();
+  }
+
+  // -----------------------------------------------------------------------------------------------------
+  // @ Public methods
+  // -----------------------------------------------------------------------------------------------------
+
+  // -----------------------------------------------------------------------------------------------------
+  // @ Private methods
+  // -----------------------------------------------------------------------------------------------------
+
+  /**
+   * Create product
+   */
+  __createProduct(): void {}
+
+  /**
+   * Toggle product details
+   *
+   * @param productId
+   */
+  __toggleDetails(productId: string): void {}
+
+  /**
+   * Track by function for ngFor loops
+   *
+   * @param index
+   * @param item
+   */
+  __trackByFn(index: number, item: any): any {
+    return item.id || index;
+  }
+}

src/app/modules/admin/board/customer-template/customer-template.routing.ts

@@ -3,22 +3,35 @@ import { Route } from '@angular/router';
 import { ListComponent } from './components/list.component';
 import { ViewComponent } from '../../member/user/components/view.component';
 
-import { CustomerTemplatesResolver } from './resolvers/customer-template.resolver';
+import {
+  CustomerTemplatesResolver,
+  CustomerTemplateResolver,
+} from './resolvers/customer-template.resolver';
 import { UserResolver } from '../../member/user/resolvers/user.resolver';
+import { ReditComponent } from './components/redit.component';
 
 export const customerTemplateRoutes: Route[] = [
   {
     path: '',
+    pathMatch: 'full',
+    redirectTo: 'list',
+  },
+  {
+    path: 'list',
     component: ListComponent,
     resolve: {
       customerTemplates: CustomerTemplatesResolver,
     },
   },
   {
-    path: ':id',
+    path: 'redit',
-    component: ViewComponent,
+    component: ReditComponent,
+  },
+  {
+    path: 'redit/:id',
+    component: ReditComponent,
     resolve: {
-      users: UserResolver,
+      customerTemplates: CustomerTemplateResolver,
     },
   },
 ];