通用组件-确认框

src/app/view/admin/components/common-table/common-table.component.html

@@ -36,9 +36,14 @@
                         </ng-template>
                     </ng-template>
                     <ng-container *ngIf="headData.isActionColumns">
-                        <a *ngFor="let action of headData.action; let i = index" (mouseenter)="action.hover(t)"
-                           (mouseout)="null" (click)="action.click(t)"
-                           [ngStyle]="{'color':action.color,'font-size':action.fontSize}">
+                        <a *ngFor="let action of headData.action; let i = index"
+                           (mouseenter)="action.hover(t)"
+                           (mouseout)="null"
+                           [ngStyle]="{'color':action.color,'font-size':action.fontSize}"
+                           nz-popconfirm
+                           [nzPopconfirmTitle]="'是否确认'+action.name+'该数据?'"
+                           [nzCondition]="!action.needConfirm"
+                           (nzOnConfirm)="action.click(t)">
                             {{action.name}}
                             <ng-template [ngIf]="i!=headData.action.length-1">
                                 <nz-divider nzType="vertical"></nz-divider>

src/app/view/admin/components/common-table/common-table.component.ts

@@ -32,7 +32,7 @@ export class CommonTableComponent<T> implements OnInit, OnChanges {
     dataList: PageList<T> = new PageList<T>();
 
     ngOnInit(): void {
-        this.getData();
+        if (!this.template) this.template = {}
         this.data.forEach(dat => {
             if (!dat.action) return;
             dat.action.forEach(act => {
@@ -40,7 +40,9 @@ export class CommonTableComponent<T> implements OnInit, OnChanges {
                     act.hover = () => null;
                 }
             })
-        })
+        });
+        if (!this.request) return
+        this.getData();
     }
 
     getData = () => {

src/app/view/admin/components/common-table/common-table.module.ts

@@ -4,7 +4,7 @@ import {CommonTableComponent} from './common-table.component';
 import {
     NzCardModule,
     NzDividerModule,
-    NzIconModule, NzOutletModule,
+    NzIconModule, NzOutletModule, NzPopconfirmModule,
     NzTableModule,
     NzToolTipModule,
     NzTypographyModule
@@ -26,7 +26,8 @@ import {
         NzToolTipModule,
         NzCardModule,
         NzIconModule,
-        NzOutletModule
+        NzOutletModule,
+        NzPopconfirmModule
     ]
 })
 export class CommonTableModule {

src/app/view/admin/components/common-table/data.ts

@@ -17,6 +17,7 @@ export class Data<T> {
         color?: string,
         order?: number,
         fontSize?: string,
+        needConfirm?: boolean,
         click: (data: T) => void,
         hover?: (data: T) => void | null;
     }[] = []