공지사항 삭제알림

src/app/modules/admin/board/notice/components/list.component.html

@@ -102,7 +102,12 @@
         <mat-icon [svgIcon]="'heroicons_outline:plus'"></mat-icon>
         <span class="ml-2 mr-1">숨김</span>
       </button>
-      <button class="ml-4" mat-flat-button [color]="'primary'">
+      <button
+        class="ml-4"
+        mat-flat-button
+        [color]="'primary'"
+        (click)="__onClickRemoveBtn($event, 'id')"
+      >
         <mat-icon [svgIcon]="'heroicons_outline:plus'"></mat-icon>
         <span class="ml-2 mr-1">완전삭제</span>
       </button>

src/app/modules/admin/board/notice/components/list.component.ts

@@ -77,6 +77,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
 
   private _unsubscribeAll: Subject<any> = new Subject<any>();
 
+  configForm!: FormGroup;
   /**
    * Constructor
    */
@@ -107,6 +108,29 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
         this._changeDetectorRef.markForCheck();
       });
 
+    this.configForm = this._formBuilder.group({
+      title: '알림',
+      message:
+        '정말로 삭제하시겠습니까? <span class="font-medium">삭제!</span>',
+      icon: this._formBuilder.group({
+        show: true,
+        name: 'heroicons_outline:exclamation',
+        color: 'warn',
+      }),
+      actions: this._formBuilder.group({
+        confirm: this._formBuilder.group({
+          show: true,
+          label: '삭제',
+          color: 'warn',
+        }),
+        cancel: this._formBuilder.group({
+          show: true,
+          label: '취소',
+        }),
+      }),
+      dismissible: true,
+    });
+
     // Get the products
     this.notices$ = this._noticeService.notices$;
   }
@@ -142,6 +166,16 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
     this.__isSearchOpened = !this.__isSearchOpened;
   }
 
+  __onClickRemoveBtn(event: MouseEvent, id: string): void {
+    // Open the dialog and save the reference of it
+    const dialogRef = this._fuseConfirmationService.open(this.configForm.value);
+
+    // Subscribe to afterClosed from the dialog reference
+    dialogRef.afterClosed().subscribe((result) => {
+      console.log(result);
+    });
+  }
+
   /**
    * Create product
    */