refactor dynamic dialog example

primefaces · Dec 12, 2023 · 251abad · 251abad
1 parent 1bb10b9
commit 251abad
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 17 deletions.
diff --git a/src/app/showcase/doc/dynamicdialog/basicdoc.ts b/src/app/showcase/doc/dynamicdialog/basicdoc.ts
@@ -32,18 +32,13 @@ export class BasicDoc implements OnDestroy {
             header: 'Select a Product',
             width: '50vw',
             contentStyle: { overflow: 'auto' },
-            baseZIndex: 10000,
             maximizable: true
-
         });
 
-        this.ref.onClose.subscribe((product: Product) => {
-            const buttonType = product?.buttonType;
-            const summary_and_detail = buttonType ? { summary: 'No Product Selected', detail: `Pressed '${buttonType}' button` } : { summary: 'Product Selected', detail: product.name };
-
-            if (product) {
-                this.messageService.add({ severity: 'info', ...summary_and_detail, life: 3000 });
-            }
+        this.ref.onClose.subscribe((data: any) => {
+            const buttonType = data?.buttonType;
+            const summary_and_detail = buttonType ? { summary: 'No Product Selected', detail: `Pressed '${buttonType}' button` } : { summary: 'Product Selected', detail: data?.name };
+            this.messageService.add({ severity: 'info', ...summary_and_detail, life: 3000 });
         });
 
         this.ref.onMaximize.subscribe((value) => {

diff --git a/src/app/showcase/doc/dynamicdialog/productlistdemo.ts b/src/app/showcase/doc/dynamicdialog/productlistdemo.ts
@@ -30,19 +30,20 @@ import { InfoDemo } from './infodemo';
                     </td>
                 </tr>
             </ng-template>
-            <ng-template pTemplate="footer">
-                <p-button type="button" label="Cancel" icon="pi pi-times" styleClass="mt-3" (click)="closeDialog({ buttonType: 'Cancel', summary: 'No Product Selected' })" [autofocus]="true"></p-button>
-            </ng-template>
-        </p-table>`
+        </p-table>
+        <div class="flex w-full justify-content-end mt-3">
+            <p-button type="button" label="Cancel" icon="pi pi-times" (click)="closeDialog({ buttonType: 'Cancel', summary: 'No Product Selected' })"></p-button>
+        </div>`
 })
 export class ProductListDemo implements OnInit {
     products: Product[];
 
-    ref: DynamicDialogRef | undefined;
+    instance: any;
 
-    constructor(private productService: ProductService, private dialogService: DialogService) {}
+    constructor(private productService: ProductService, private dialogService: DialogService, public ref: DynamicDialogRef) {}
 
     ngOnInit() {
+        this.instance = this.dialogService.dialogComponentRefMap.get(this.ref).instance;
         this.productService.getProductsSmall().then((products) => (this.products = products.slice(0, 5)));
     }
 
@@ -60,8 +61,8 @@ export class ProductListDemo implements OnInit {
         });
     }
 
-    closeDialog(e) {
-        this.ref.close(e);
+    closeDialog(data) {
+        this.ref.close(data);
     }
 
     getSeverity(status: string) {