@elite.framework/ng.core 1.0.22 → 1.0.23

package/fesm2022/elite.framework-ng.core.mjs

@@ -3137,11 +3137,11 @@ class GenericTable {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericTable, isStandalone: true, selector: "lib-generic-table", inputs: { data: "data", columns: "columns", loading: "loading", actions: "actions", actionsMode: "actionsMode", first: "first", rows: "rows", totalRecords: "totalRecords", sortField: "sortField", sortOrder: "sortOrder", globalFilterFields: "globalFilterFields", scrollHeight: "scrollHeight", rowSelectable: "rowSelectable", selection: "selection", paginator: "paginator", showRowSelectionCheckbox: "showRowSelectionCheckbox" }, outputs: { action: "action", pageChange: "pageChange", rowSelect: "rowSelect", selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "dt", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "\r\n<div class=\"flex-1 last:[&>td]:border-0 rounded-lg border border-surface w-full overflow-auto\">\r\n  <p-table #dt\r\n  [value]=\"data\"\r\n  [columns]=\"columns\"\r\n  [lazy]=\"true\"\r\n  [paginator]=\"paginator\"\r\n  [rows]=\"rows\"\r\n  [first]=\"first\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [sortField]=\"sortField\"\r\n    [sortOrder]=\"sortOrder\" (onLazyLoad)=\"onLazyLoad($event)\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [loading]=\"loading\"\r\n    [scrollable]=\"true\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [selectionMode]=\"showRowSelectionCheckbox ? 'multiple' : (rowSelectable ? 'single' : undefined)\"\r\n    [(selection)]=\"_selection\"\r\n    (onRowSelect)=\"onInternalSelectionChange($event)\"\r\n    (onRowUnselect)=\"onInternalSelectionChange($event)\"\r\n    (onHeaderCheckboxToggle)=\"onInternalSelectionChange($event)\"\r\n    tableLayout=\"fixed\"\r\n    [customSort]=\"false\"\r\n    (sortFunction)=\"customSort($event)\"\r\n    >\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n          <th *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n      </th>\r\n        <!-- <th style=\"width: 1rem\">\r\n          <p-tableHeaderCheckbox />\r\n        </th> -->\r\n\r\n       <ng-container *ngFor=\"let col of columns\" >\r\n  <th *ngIf=\"col.props?.table?.props?.width; else templateName\" [pSortableColumn]=\"col.key\"\r\n      class=\"px-4 py-2 text-sm font-medium text-white text-center\"\r\n      [style.width]=\"col.props?.table?.props?.width\">\r\n    {{ col.props?.label | translate }}\r\n    <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n  </th>\r\n\r\n  <ng-template #templateName>\r\n    <th class=\"px-4 py-2 text-sm font-medium text-white text-center\">\r\n      {{ col.props?.label | translate }}\r\n      <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n    </th>\r\n  </ng-template>\r\n</ng-container>\r\n\r\n\r\n        <th class=\"px-4 py-2 text-sm font-medium text-white text-center\"> {{ 'OPERATIONS' | translate }}</th>\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-i=\"rowIndex\">\r\n      <tr class=\"even:bg-gray-50 hover:bg-gray-100\" (click)=\"rowSelect.emit(rowData)\">\r\n        <!-- <td style=\"width: 1rem\">\r\n          <p-tableCheckbox [value]=\"rowData\" />\r\n        </td> -->\r\n        <td *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n      </td>\r\n        <td *ngFor=\"let col of columns_ ; let colIndex = index\"\r\n    class=\"border-t border-gray-200 px-4 py-2 text-center text-sm text-gray-700\"\r\n     [style.width]=\"col.props && col.props['table']\r\n     && col.props['table']['props'] && col.props['table']['props']['width']\"\r\n\r\n     >\r\n\r\n\r\n <!-- \u0625\u0630\u0627 \u0627\u0644\u0639\u0645\u0648\u062F \u0642\u0627\u0628\u0644 \u0644\u0644\u0646\u0642\u0631 -->\r\n\r\n      <formly-form\r\n      [model]=\"rowData\"\r\n      [form]=\"getForm(i, colIndex)\"\r\n      [fields]=\"[cloneField(col)]\"\r\n      [options]=\"options\">\r\n    </formly-form>\r\n\r\n        </td>\r\n        <td class=\"border-t border-gray-200 px-4 py-2 text-center align-middle\">\r\n          <ng-container [ngSwitch]=\"actionsMode\">\r\n                  <!-- Render buttons -->\r\n                  <ng-container *ngSwitchCase=\"'buttons'\">\r\n                    <ng-container *ngFor=\"let act of actions\">\r\n                      <button\r\n                        *ngIf=\"act.icon || act.label\"\r\n                        pButton\r\n                        [icon]=\"act.icon || ''\"\r\n                        [label]=\"(act.label  || '') | translate\"\r\n                        [class]=\"act.styleClass || ''\"\r\n                        class=\"p-button-sm mx-1\"\r\n                        (click)=\"onAction(act, rowData)\"\r\n                      ></button>\r\n                    </ng-container>\r\n                  </ng-container>\r\n\r\n                  <!-- Render menu -->\r\n                  <ng-container *ngSwitchCase=\"'menu'\">\r\n                     <p-menu #menu [model]=\"getMenuItems(rowData)\" [popup]=\"true\" appendTo=\"body\">\r\n                    <ng-template let-item pTemplate=\"item\">\r\n                      <div class=\"flex items-center gap-2 px-2 py-1\">\r\n                        <i [ngClass]=\"item.icon\" class=\"text-primary-600\" *ngIf=\"item.icon\"></i>\r\n                        <span class=\"font-medium\">{{ (item.label  || '') | translate }}</span>\r\n\r\n                        <span *ngIf=\"item.badge\" class=\"ml-auto text-xs bg-red-500 text-white px-2 py-1 rounded\">\r\n                          {{ item.badge }}\r\n                        </span>\r\n\r\n                        <!-- <p-inputSwitch *ngIf=\"item.toggle\" [(ngModel)]=\"item.toggleValue\" class=\"ml-auto\" /> -->\r\n                      </div>\r\n                    </ng-template>\r\n                  </p-menu>\r\n\r\n                    <p-button\r\n                    outlined\r\n                      icon=\"pi pi-ellipsis-v\"\r\n                      class=\"p-button-text p-button-sm\"\r\n                      (onClick)=\"menu.toggle($event)\"\r\n                    ></p-button>\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n\r\n</div>\r\n", styles: [".custom-button-medium{font-size:1.1rem;width:2.5rem;height:2.5rem;line-height:2.5rem;padding:0}.custom-button-gray{color:#333;background-color:transparent;border:none}.custom-button-gray:hover{background-color:#eee;color:#000}.icon-delete{color:red!important}.icon-edit{color:#333}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["value", "disabled", "required", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i2$3.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i4.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex", "appendTo"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericTable, isStandalone: true, selector: "lib-generic-table", inputs: { data: "data", columns: "columns", loading: "loading", actions: "actions", actionsMode: "actionsMode", first: "first", rows: "rows", totalRecords: "totalRecords", sortField: "sortField", sortOrder: "sortOrder", globalFilterFields: "globalFilterFields", scrollHeight: "scrollHeight", rowSelectable: "rowSelectable", selection: "selection", paginator: "paginator", showRowSelectionCheckbox: "showRowSelectionCheckbox" }, outputs: { action: "action", pageChange: "pageChange", rowSelect: "rowSelect", selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "dt", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "\r\n<div class=\"flex-1 last:[&>td]:border-0 rounded-lg border border-surface w-full overflow-auto\">\r\n  <p-table #dt\r\n  [value]=\"data\"\r\n  [columns]=\"columns\"\r\n  [lazy]=\"true\"\r\n  [paginator]=\"paginator\"\r\n  [rows]=\"rows\"\r\n  [first]=\"first\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [sortField]=\"sortField\"\r\n    [sortOrder]=\"sortOrder\" (onLazyLoad)=\"onLazyLoad($event)\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [loading]=\"loading\"\r\n    [scrollable]=\"true\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [selectionMode]=\"showRowSelectionCheckbox ? 'multiple' : (rowSelectable ? 'single' : undefined)\"\r\n    [(selection)]=\"_selection\"\r\n    (onRowSelect)=\"onInternalSelectionChange($event)\"\r\n    (onRowUnselect)=\"onInternalSelectionChange($event)\"\r\n    (onHeaderCheckboxToggle)=\"onInternalSelectionChange($event)\"\r\n    tableLayout=\"fixed\"\r\n    [customSort]=\"false\"\r\n    (sortFunction)=\"customSort($event)\"\r\n    >\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n          <th *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n      </th>\r\n        <!-- <th style=\"width: 1rem\">\r\n          <p-tableHeaderCheckbox />\r\n        </th> -->\r\n\r\n       <ng-container *ngFor=\"let col of columns\" >\r\n  <th *ngIf=\"col.props?.table?.props?.width; else templateName\" [pSortableColumn]=\"col.key\"\r\n      class=\"px-4 py-2 text-sm font-medium text-white text-center\"\r\n      [style.min-width]=\"col.props?.table?.props?.width\">\r\n    {{ col.props?.label | translate }}\r\n    <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n  </th>\r\n\r\n  <ng-template #templateName>\r\n    <th class=\"px-4 py-2 text-sm font-medium text-white text-center\">\r\n      {{ col.props?.label | translate }}\r\n      <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n    </th>\r\n  </ng-template>\r\n</ng-container>\r\n\r\n\r\n        <th class=\"px-4 py-2 text-sm font-medium text-white text-center\"> {{ 'OPERATIONS' | translate }}</th>\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-i=\"rowIndex\">\r\n      <tr class=\"even:bg-gray-50 hover:bg-gray-100\" (click)=\"rowSelect.emit(rowData)\">\r\n        <!-- <td style=\"width: 1rem\">\r\n          <p-tableCheckbox [value]=\"rowData\" />\r\n        </td> -->\r\n        <td *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n      </td>\r\n        <td *ngFor=\"let col of columns_ ; let colIndex = index\"\r\n    class=\"border-t border-gray-200 px-4 py-2 text-center text-sm text-gray-700\"\r\n     [style.width]=\"col.props && col.props['table']\r\n     && col.props['table']['props'] && col.props['table']['props']['width'] \"\r\n\r\n     >\r\n\r\n\r\n <!-- \u0625\u0630\u0627 \u0627\u0644\u0639\u0645\u0648\u062F \u0642\u0627\u0628\u0644 \u0644\u0644\u0646\u0642\u0631 -->\r\n\r\n      <formly-form\r\n      [model]=\"rowData\"\r\n      [form]=\"getForm(i, colIndex)\"\r\n      [fields]=\"[cloneField(col)]\"\r\n      [options]=\"options\">\r\n    </formly-form>\r\n\r\n        </td>\r\n        <td class=\"border-t border-gray-200 px-4 py-2 text-center align-middle\">\r\n          <ng-container [ngSwitch]=\"actionsMode\">\r\n                  <!-- Render buttons -->\r\n                  <ng-container *ngSwitchCase=\"'buttons'\">\r\n                    <ng-container *ngFor=\"let act of actions\">\r\n                      <button\r\n                        *ngIf=\"act.icon || act.label\"\r\n                        pButton\r\n                        [icon]=\"act.icon || ''\"\r\n                        [label]=\"(act.label  || '') | translate\"\r\n                        [class]=\"act.styleClass || ''\"\r\n                        class=\"p-button-sm mx-1\"\r\n                        (click)=\"onAction(act, rowData)\"\r\n                      ></button>\r\n                    </ng-container>\r\n                  </ng-container>\r\n\r\n                  <!-- Render menu -->\r\n                  <ng-container *ngSwitchCase=\"'menu'\">\r\n                     <p-menu #menu [model]=\"getMenuItems(rowData)\" [popup]=\"true\" appendTo=\"body\">\r\n                    <ng-template let-item pTemplate=\"item\">\r\n                      <div class=\"flex items-center gap-2 px-2 py-1\">\r\n                        <i [ngClass]=\"item.icon\" class=\"text-primary-600\" *ngIf=\"item.icon\"></i>\r\n                        <span class=\"font-medium\">{{ (item.label  || '') | translate }}</span>\r\n\r\n                        <span *ngIf=\"item.badge\" class=\"ml-auto text-xs bg-red-500 text-white px-2 py-1 rounded\">\r\n                          {{ item.badge }}\r\n                        </span>\r\n\r\n                        <!-- <p-inputSwitch *ngIf=\"item.toggle\" [(ngModel)]=\"item.toggleValue\" class=\"ml-auto\" /> -->\r\n                      </div>\r\n                    </ng-template>\r\n                  </p-menu>\r\n\r\n                    <p-button\r\n                    outlined\r\n                      icon=\"pi pi-ellipsis-v\"\r\n                      class=\"p-button-text p-button-sm\"\r\n                      (onClick)=\"menu.toggle($event)\"\r\n                    ></p-button>\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n\r\n</div>\r\n", styles: [".custom-button-medium{font-size:1.1rem;width:2.5rem;height:2.5rem;line-height:2.5rem;padding:0}.custom-button-gray{color:#333;background-color:transparent;border:none}.custom-button-gray:hover{background-color:#eee;color:#000}.icon-delete{color:red!important}.icon-edit{color:#333}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["value", "disabled", "required", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i2$3.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i4.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex", "appendTo"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericTable, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-generic-table', imports: [CommonModule, TableModule, ButtonModule, MenuModule, NgForOf, TranslateModule, FormlyField, FormlyForm, NgIf, TranslatePipe, Menu, Button], template: "\r\n<div class=\"flex-1 last:[&>td]:border-0 rounded-lg border border-surface w-full overflow-auto\">\r\n  <p-table #dt\r\n  [value]=\"data\"\r\n  [columns]=\"columns\"\r\n  [lazy]=\"true\"\r\n  [paginator]=\"paginator\"\r\n  [rows]=\"rows\"\r\n  [first]=\"first\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [sortField]=\"sortField\"\r\n    [sortOrder]=\"sortOrder\" (onLazyLoad)=\"onLazyLoad($event)\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [loading]=\"loading\"\r\n    [scrollable]=\"true\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [selectionMode]=\"showRowSelectionCheckbox ? 'multiple' : (rowSelectable ? 'single' : undefined)\"\r\n    [(selection)]=\"_selection\"\r\n    (onRowSelect)=\"onInternalSelectionChange($event)\"\r\n    (onRowUnselect)=\"onInternalSelectionChange($event)\"\r\n    (onHeaderCheckboxToggle)=\"onInternalSelectionChange($event)\"\r\n    tableLayout=\"fixed\"\r\n    [customSort]=\"false\"\r\n    (sortFunction)=\"customSort($event)\"\r\n    >\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n          <th *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n      </th>\r\n        <!-- <th style=\"width: 1rem\">\r\n          <p-tableHeaderCheckbox />\r\n        </th> -->\r\n\r\n       <ng-container *ngFor=\"let col of columns\" >\r\n  <th *ngIf=\"col.props?.table?.props?.width; else templateName\" [pSortableColumn]=\"col.key\"\r\n      class=\"px-4 py-2 text-sm font-medium text-white text-center\"\r\n      [style.width]=\"col.props?.table?.props?.width\">\r\n    {{ col.props?.label | translate }}\r\n    <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n  </th>\r\n\r\n  <ng-template #templateName>\r\n    <th class=\"px-4 py-2 text-sm font-medium text-white text-center\">\r\n      {{ col.props?.label | translate }}\r\n      <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n    </th>\r\n  </ng-template>\r\n</ng-container>\r\n\r\n\r\n        <th class=\"px-4 py-2 text-sm font-medium text-white text-center\"> {{ 'OPERATIONS' | translate }}</th>\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-i=\"rowIndex\">\r\n      <tr class=\"even:bg-gray-50 hover:bg-gray-100\" (click)=\"rowSelect.emit(rowData)\">\r\n        <!-- <td style=\"width: 1rem\">\r\n          <p-tableCheckbox [value]=\"rowData\" />\r\n        </td> -->\r\n        <td *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n      </td>\r\n        <td *ngFor=\"let col of columns_ ; let colIndex = index\"\r\n    class=\"border-t border-gray-200 px-4 py-2 text-center text-sm text-gray-700\"\r\n     [style.width]=\"col.props && col.props['table']\r\n     && col.props['table']['props'] && col.props['table']['props']['width']\"\r\n\r\n     >\r\n\r\n\r\n <!-- \u0625\u0630\u0627 \u0627\u0644\u0639\u0645\u0648\u062F \u0642\u0627\u0628\u0644 \u0644\u0644\u0646\u0642\u0631 -->\r\n\r\n      <formly-form\r\n      [model]=\"rowData\"\r\n      [form]=\"getForm(i, colIndex)\"\r\n      [fields]=\"[cloneField(col)]\"\r\n      [options]=\"options\">\r\n    </formly-form>\r\n\r\n        </td>\r\n        <td class=\"border-t border-gray-200 px-4 py-2 text-center align-middle\">\r\n          <ng-container [ngSwitch]=\"actionsMode\">\r\n                  <!-- Render buttons -->\r\n                  <ng-container *ngSwitchCase=\"'buttons'\">\r\n                    <ng-container *ngFor=\"let act of actions\">\r\n                      <button\r\n                        *ngIf=\"act.icon || act.label\"\r\n                        pButton\r\n                        [icon]=\"act.icon || ''\"\r\n                        [label]=\"(act.label  || '') | translate\"\r\n                        [class]=\"act.styleClass || ''\"\r\n                        class=\"p-button-sm mx-1\"\r\n                        (click)=\"onAction(act, rowData)\"\r\n                      ></button>\r\n                    </ng-container>\r\n                  </ng-container>\r\n\r\n                  <!-- Render menu -->\r\n                  <ng-container *ngSwitchCase=\"'menu'\">\r\n                     <p-menu #menu [model]=\"getMenuItems(rowData)\" [popup]=\"true\" appendTo=\"body\">\r\n                    <ng-template let-item pTemplate=\"item\">\r\n                      <div class=\"flex items-center gap-2 px-2 py-1\">\r\n                        <i [ngClass]=\"item.icon\" class=\"text-primary-600\" *ngIf=\"item.icon\"></i>\r\n                        <span class=\"font-medium\">{{ (item.label  || '') | translate }}</span>\r\n\r\n                        <span *ngIf=\"item.badge\" class=\"ml-auto text-xs bg-red-500 text-white px-2 py-1 rounded\">\r\n                          {{ item.badge }}\r\n                        </span>\r\n\r\n                        <!-- <p-inputSwitch *ngIf=\"item.toggle\" [(ngModel)]=\"item.toggleValue\" class=\"ml-auto\" /> -->\r\n                      </div>\r\n                    </ng-template>\r\n                  </p-menu>\r\n\r\n                    <p-button\r\n                    outlined\r\n                      icon=\"pi pi-ellipsis-v\"\r\n                      class=\"p-button-text p-button-sm\"\r\n                      (onClick)=\"menu.toggle($event)\"\r\n                    ></p-button>\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n\r\n</div>\r\n", styles: [".custom-button-medium{font-size:1.1rem;width:2.5rem;height:2.5rem;line-height:2.5rem;padding:0}.custom-button-gray{color:#333;background-color:transparent;border:none}.custom-button-gray:hover{background-color:#eee;color:#000}.icon-delete{color:red!important}.icon-edit{color:#333}\n"] }]
+            args: [{ selector: 'lib-generic-table', imports: [CommonModule, TableModule, ButtonModule, MenuModule, NgForOf, TranslateModule, FormlyField, FormlyForm, NgIf, TranslatePipe, Menu, Button], template: "\r\n<div class=\"flex-1 last:[&>td]:border-0 rounded-lg border border-surface w-full overflow-auto\">\r\n  <p-table #dt\r\n  [value]=\"data\"\r\n  [columns]=\"columns\"\r\n  [lazy]=\"true\"\r\n  [paginator]=\"paginator\"\r\n  [rows]=\"rows\"\r\n  [first]=\"first\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [sortField]=\"sortField\"\r\n    [sortOrder]=\"sortOrder\" (onLazyLoad)=\"onLazyLoad($event)\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [loading]=\"loading\"\r\n    [scrollable]=\"true\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [selectionMode]=\"showRowSelectionCheckbox ? 'multiple' : (rowSelectable ? 'single' : undefined)\"\r\n    [(selection)]=\"_selection\"\r\n    (onRowSelect)=\"onInternalSelectionChange($event)\"\r\n    (onRowUnselect)=\"onInternalSelectionChange($event)\"\r\n    (onHeaderCheckboxToggle)=\"onInternalSelectionChange($event)\"\r\n    tableLayout=\"fixed\"\r\n    [customSort]=\"false\"\r\n    (sortFunction)=\"customSort($event)\"\r\n    >\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n          <th *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n      </th>\r\n        <!-- <th style=\"width: 1rem\">\r\n          <p-tableHeaderCheckbox />\r\n        </th> -->\r\n\r\n       <ng-container *ngFor=\"let col of columns\" >\r\n  <th *ngIf=\"col.props?.table?.props?.width; else templateName\" [pSortableColumn]=\"col.key\"\r\n      class=\"px-4 py-2 text-sm font-medium text-white text-center\"\r\n      [style.min-width]=\"col.props?.table?.props?.width\">\r\n    {{ col.props?.label | translate }}\r\n    <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n  </th>\r\n\r\n  <ng-template #templateName>\r\n    <th class=\"px-4 py-2 text-sm font-medium text-white text-center\">\r\n      {{ col.props?.label | translate }}\r\n      <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n    </th>\r\n  </ng-template>\r\n</ng-container>\r\n\r\n\r\n        <th class=\"px-4 py-2 text-sm font-medium text-white text-center\"> {{ 'OPERATIONS' | translate }}</th>\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-i=\"rowIndex\">\r\n      <tr class=\"even:bg-gray-50 hover:bg-gray-100\" (click)=\"rowSelect.emit(rowData)\">\r\n        <!-- <td style=\"width: 1rem\">\r\n          <p-tableCheckbox [value]=\"rowData\" />\r\n        </td> -->\r\n        <td *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n      </td>\r\n        <td *ngFor=\"let col of columns_ ; let colIndex = index\"\r\n    class=\"border-t border-gray-200 px-4 py-2 text-center text-sm text-gray-700\"\r\n     [style.width]=\"col.props && col.props['table']\r\n     && col.props['table']['props'] && col.props['table']['props']['width'] \"\r\n\r\n     >\r\n\r\n\r\n <!-- \u0625\u0630\u0627 \u0627\u0644\u0639\u0645\u0648\u062F \u0642\u0627\u0628\u0644 \u0644\u0644\u0646\u0642\u0631 -->\r\n\r\n      <formly-form\r\n      [model]=\"rowData\"\r\n      [form]=\"getForm(i, colIndex)\"\r\n      [fields]=\"[cloneField(col)]\"\r\n      [options]=\"options\">\r\n    </formly-form>\r\n\r\n        </td>\r\n        <td class=\"border-t border-gray-200 px-4 py-2 text-center align-middle\">\r\n          <ng-container [ngSwitch]=\"actionsMode\">\r\n                  <!-- Render buttons -->\r\n                  <ng-container *ngSwitchCase=\"'buttons'\">\r\n                    <ng-container *ngFor=\"let act of actions\">\r\n                      <button\r\n                        *ngIf=\"act.icon || act.label\"\r\n                        pButton\r\n                        [icon]=\"act.icon || ''\"\r\n                        [label]=\"(act.label  || '') | translate\"\r\n                        [class]=\"act.styleClass || ''\"\r\n                        class=\"p-button-sm mx-1\"\r\n                        (click)=\"onAction(act, rowData)\"\r\n                      ></button>\r\n                    </ng-container>\r\n                  </ng-container>\r\n\r\n                  <!-- Render menu -->\r\n                  <ng-container *ngSwitchCase=\"'menu'\">\r\n                     <p-menu #menu [model]=\"getMenuItems(rowData)\" [popup]=\"true\" appendTo=\"body\">\r\n                    <ng-template let-item pTemplate=\"item\">\r\n                      <div class=\"flex items-center gap-2 px-2 py-1\">\r\n                        <i [ngClass]=\"item.icon\" class=\"text-primary-600\" *ngIf=\"item.icon\"></i>\r\n                        <span class=\"font-medium\">{{ (item.label  || '') | translate }}</span>\r\n\r\n                        <span *ngIf=\"item.badge\" class=\"ml-auto text-xs bg-red-500 text-white px-2 py-1 rounded\">\r\n                          {{ item.badge }}\r\n                        </span>\r\n\r\n                        <!-- <p-inputSwitch *ngIf=\"item.toggle\" [(ngModel)]=\"item.toggleValue\" class=\"ml-auto\" /> -->\r\n                      </div>\r\n                    </ng-template>\r\n                  </p-menu>\r\n\r\n                    <p-button\r\n                    outlined\r\n                      icon=\"pi pi-ellipsis-v\"\r\n                      class=\"p-button-text p-button-sm\"\r\n                      (onClick)=\"menu.toggle($event)\"\r\n                    ></p-button>\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n\r\n</div>\r\n", styles: [".custom-button-medium{font-size:1.1rem;width:2.5rem;height:2.5rem;line-height:2.5rem;padding:0}.custom-button-gray{color:#333;background-color:transparent;border:none}.custom-button-gray:hover{background-color:#eee;color:#000}.icon-delete{color:red!important}.icon-edit{color:#333}\n"] }]
         }], propDecorators: { dt: [{
                 type: ViewChild,
                 args: ['dt']
@@ -5452,7 +5452,7 @@ class ClickableLabelTypeComponent extends FieldType {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ClickableLabelTypeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.4", type: ClickableLabelTypeComponent, isStandalone: true, selector: "formly-clickable-label-type", usesInheritance: true, ngImport: i0, template: `
 
-<span  class="cursor-pointer hover:underline hover:text-blue-600 font-bold"
+<a  class="cursor-pointer hover:underline hover:text-blue-600 font-bold"
             (click)="handleCellClick(props,model, $event)"
             (mouseenter)="props['hoverable'] && onCellHover(props, model, $event)"
             (mouseleave)="props['hoverable'] && onCellLeave(props, model, $event)"
@@ -5465,7 +5465,7 @@ class ClickableLabelTypeComponent extends FieldType {
           }
 
 
-          </span>
+        </a>
   `, isInline: true });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ClickableLabelTypeComponent, decorators: [{
@@ -5476,7 +5476,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
                     // imports:[NgIf],
                     template: `
 
-<span  class="cursor-pointer hover:underline hover:text-blue-600 font-bold"
+<a  class="cursor-pointer hover:underline hover:text-blue-600 font-bold"
             (click)="handleCellClick(props,model, $event)"
             (mouseenter)="props['hoverable'] && onCellHover(props, model, $event)"
             (mouseleave)="props['hoverable'] && onCellLeave(props, model, $event)"
@@ -5489,7 +5489,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
           }
 
 
-          </span>
+        </a>
   `,
                 }]
         }] });