Spaces:
Running
Running
import { Component, Inject } from '@angular/core'; | |
import { CommonModule } from '@angular/common'; | |
import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog'; | |
import { MatButtonModule } from '@angular/material/button'; | |
export interface ConfirmDialogData { | |
title: string; | |
message: string; | |
confirmText?: string; | |
cancelText?: string; | |
confirmColor?: 'primary' | 'accent' | 'warn'; | |
} | |
({ | |
selector: 'app-confirm-dialog', | |
standalone: true, | |
imports: [CommonModule, MatDialogModule, MatButtonModule], | |
template: ` | |
<h2 mat-dialog-title>{{ data.title }}</h2> | |
<mat-dialog-content> | |
<p>{{ data.message }}</p> | |
</mat-dialog-content> | |
<mat-dialog-actions align="end"> | |
<button mat-button (click)="onCancel()">{{ data.cancelText || 'Cancel' }}</button> | |
<button mat-raised-button [color]="data.confirmColor || 'primary'" (click)="onConfirm()"> | |
{{ data.confirmText || 'Confirm' }} | |
</button> | |
</mat-dialog-actions> | |
`, | |
styles: [` | |
mat-dialog-content { | |
padding: 20px 24px; | |
} | |
p { | |
margin: 0; | |
color: rgba(0,0,0,0.87); | |
line-height: 1.5; | |
} | |
mat-dialog-actions { | |
padding: 16px 24px; | |
} | |
`] | |
}) | |
export default class ConfirmDialogComponent { | |
constructor( | |
public dialogRef: MatDialogRef<ConfirmDialogComponent>, | |
public data: ConfirmDialogData (MAT_DIALOG_DATA) | |
) {} | |
onConfirm(): void { | |
this.dialogRef.close(true); | |
} | |
onCancel(): void { | |
this.dialogRef.close(false); | |
} | |
} |