/**
* @module module:lib/components/crud-form/crud-form.component
* @description CRUD form component module.
* @summary Provides `CrudFormComponent` — a wrapper that composes dynamic form
* fields and layout to produce create/read/update/delete forms with validation
* and submission handling.
*
* @link {@link CrudFormComponent}
*/
import {
Component,
} from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
import { IonButton, IonIcon } from '@ionic/angular/standalone';
import { Dynamic } from '../../engine/decorators';
import { DefaultFormReactiveOptions, ComponentEventNames } from '../../engine/constants';
import { NgxFormDirective } from '../../engine/NgxFormDirective';
import { ComponentRendererComponent } from '../../components/component-renderer/component-renderer.component';
import { LayoutComponent } from '../layout/layout.component';
@Dynamic()
@Component({
standalone: true,
selector: 'ngx-decaf-crud-form',
templateUrl: './crud-form.component.html',
styleUrls: ['./crud-form.component.scss'],
imports: [ReactiveFormsModule, LayoutComponent, ComponentRendererComponent, IonButton, IonIcon],
host: {'[attr.id]': 'uid'},
})
export class CrudFormComponent extends NgxFormDirective {
constructor() {
super('CrudFormComponent');
}
/**
* @description Component initialization lifecycle method.
* @summary Initializes the component by setting up the logger, configuring form state
* based on the operation type, and merging configuration options. For READ and DELETE
* operations, the formGroup is set to undefined since these operations don't require
* form input. Configuration options are merged with default settings.
*
* @returns {Promise<void>}
* @memberOf CrudFormComponent
*/
override async ngOnInit(): Promise<void> {
this.options = Object.assign(
{},
DefaultFormReactiveOptions,
this.options || {},
);
await super.ngOnInit();
}
/**
* @description Handles delete operations by emitting delete events.
* @summary Processes delete requests by emitting a submit event with the
* record's unique identifier as data. This allows parent components to
* handle the actual deletion logic while maintaining separation of concerns.
* The event includes the uid and standard component identification.
*
* @returns {void}
* @memberOf CrudFormComponent
*/
handleDelete(): void {
this.submitEvent.emit({
data: this.modelId,
component: 'CrudFormComponent',
name: ComponentEventNames.SUBMIT,
});
}
}
Source