Bangara Raju Kottedi
55b436c7d2
- Added DynamicField interface to define form field structure. - Created DynamicFormConfig interface for form configuration. - Developed DynamicFormComponent to handle dynamic form rendering and validation. - Implemented DynamicPopupComponent for displaying forms in a modal dialog. - Added HTML and SCSS for dynamic form and popup styling. - Integrated Material Design components for form inputs and buttons. - Implemented form submission logic with API integration. - Added tests for DynamicForm and DynamicPopup components. - Updated global styles for Material components in themed popups. - Included Material Icons in index.html for better UI representation.
18 lines
764 B
HTML
18 lines
764 B
HTML
<div class="popup-box themed-popup" role="dialog" [attr.aria-modal]="true" [attr.aria-labelledby]="titleId">
|
|
<div class="popup-header">
|
|
<h2 class="popup-title" [id]="titleId">{{ config.title }}</h2>
|
|
<button class="close-btn" (click)="close()" aria-label="Close">
|
|
<i class="fa-solid fa-xmark"></i>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="popup-content">
|
|
<app-dynamic-form class="popup-form" [config]="config" [initialData]="data" (formBuilt)="onFormBuilt($event)">
|
|
</app-dynamic-form>
|
|
</div>
|
|
|
|
<div class="popup-actions">
|
|
<button class="submit-btn primary" (click)="submit()">{{ config.submitLabel }}</button>
|
|
<button class="submit-btn" (click)="close()">Cancel</button>
|
|
</div>
|
|
</div> |