verben-workflow-ui 0.5.38 → 0.5.39
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/src/lib/components/form-group/form-fields/form-fields.component.mjs +3 -4
- package/esm2022/src/lib/components/my-queue/my-queue.component.mjs +3 -3
- package/esm2022/src/lib/components/my-queue/my-queue.facade.mjs +2 -2
- package/esm2022/src/lib/components/tasks/tasks.component.mjs +3 -3
- package/fesm2022/verben-workflow-ui-src-lib-components-form-group.mjs +2 -3
- package/fesm2022/verben-workflow-ui-src-lib-components-form-group.mjs.map +1 -1
- package/fesm2022/verben-workflow-ui-src-lib-components-my-queue.mjs +3 -3
- package/fesm2022/verben-workflow-ui-src-lib-components-my-queue.mjs.map +1 -1
- package/fesm2022/verben-workflow-ui-src-lib-components-tasks.mjs +2 -2
- package/fesm2022/verben-workflow-ui-src-lib-components-tasks.mjs.map +1 -1
- package/package.json +30 -30
- package/styles/styles.css +35 -4
|
@@ -515,7 +515,7 @@ class MyQueueFacade {
|
|
|
515
515
|
async passBack(action, request, comment, recipient, currentUser) {
|
|
516
516
|
try {
|
|
517
517
|
this.state.setUpdating(true);
|
|
518
|
-
const response = await this.service.
|
|
518
|
+
const response = await this.service.passBack(
|
|
519
519
|
// Alternate from and to stage o.
|
|
520
520
|
action.ToStage, action.FromStage, {
|
|
521
521
|
...request,
|
|
@@ -1013,11 +1013,11 @@ class MyQueueComponent extends BaseDataViewComponent {
|
|
|
1013
1013
|
}
|
|
1014
1014
|
}
|
|
1015
1015
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MyQueueComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: MyQueueFacade }], target: i0.ɵɵFactoryTarget.Component });
|
|
1016
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: MyQueueComponent, selector: "lib-my-queue", inputs: { isGeneral: { classPropertyName: "isGeneral", publicName: "isGeneral", isSignal: true, isRequired: false, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: false, isRequired: false, transformFunction: null } }, providers: [MyQueueService, MyQueueState, MyQueueFacade], usesInheritance: true, ngImport: i0, template: "<div class=\"space-y-8\">\n <verben-data-view\n #vdv\n [viewState]=\"{\n isSearch: true,\n isColumn: true,\n isFilter: true,\n isSort: true,\n isExport: true,\n isSelect: true,\n isCreate: isGeneral(),\n isToggle: true,\n }\"\n [buttonClass]=\"'my-custom-button-class'\"\n [iconClass]=\"'my-icon-class'\"\n [activeIconClass]=\"'my-active-icon-class'\"\n [selectedColumnCount]=\"0\"\n [selectedSortCount]=\"0\"\n [selectedFilterTableCount]=\"0\"\n (viewChange)=\"onViewChange($event)\"\n (stateChange)=\"onStateChange($event)\"\n >\n <div table-content>\n <lib-data-table\n [data]=\"data()\"\n [columns]=\"config.columns\"\n [styleConfig]=\"styles\"\n (selectionChange)=\"onSelectionChange($event)\"\n [groupBy]=\"groupByWorkflowCode\"\n >\n <ng-container libColumn=\"history\">\n <ng-template #cell let-value let-deleteRow>\n <a\n [routerLink]=\"['/workflow/task-history', value]\"\n routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF]\"\n >view history</a\n >\n </ng-template>\n </ng-container>\n\n <ng-container libColumn=\"workflow\">\n <ng-template #cell let-value>\n <a\n [routerLink]=\"['/workflow/workflows', value]\"\n routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF]\"\n >view Workflow</a\n >\n </ng-template>\n </ng-container>\n\n <ng-container libColumn=\"actions\">\n <ng-template #cell let-row=\"row\">\n <verben-pop-Up\n #popup\n [customStyles]=\"{ 'z-index': '99' }\"\n [enableMouseLeave]=\"false\"\n [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\"\n (dropdownOpenChange)=\"handlePopupClose($event)\"\n >\n <verben-svg\n dropdown-trigger\n icon=\"dots\"\n [width]=\"4\"\n [height]=\"24\"\n class=\"cursor-pointer w-auto\"\n ></verben-svg>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n @if (selectedTaskCode && activeActionType) {\n <div style=\"width: 16rem\">\n <div\n class=\"flex items-center gap-4 justify-between h-12 px-2 pt-4\"\n >\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <g opacity=\"0.6\">\n <path\n d=\"M6.74649 8.00338C6.91483 8.1347 7.0252 8.20455 7.11531 8.29396C7.98846 9.16222 8.85742 10.0347 9.72917 10.905C9.87167 11.0475 9.99391 11.1921 9.99321 11.4129C9.99251 11.6462 9.89472 11.8152 9.69564 11.9256C9.49307 12.038 9.2926 12.0206 9.10469 11.8899C9.03833 11.8438 8.98175 11.7845 8.92378 11.7272C7.85574 10.6592 6.79678 9.58203 5.71477 8.52867C5.3711 8.19407 5.38437 7.79173 5.70779 7.47599C6.7884 6.42123 7.84875 5.34551 8.91539 4.27607C9.11377 4.07769 9.32054 3.92262 9.623 4.04137C9.97924 4.18107 10.112 4.58901 9.89472 4.90335C9.82976 4.99765 9.74174 5.07728 9.66002 5.1597C8.80642 6.01469 7.95283 6.86968 7.09645 7.72257C7.01472 7.8043 6.91553 7.86856 6.74579 8.00408L6.74649 8.00338Z\"\n fill=\"black\"\n />\n </g>\n </svg>\n\n <h3 class=\"text-sm font-medium\">Select Assignee</h3>\n </div>\n\n <div class=\"grid gap-2 max-h-96 overflow-y-auto p-2\">\n <verben-drop-down\n label=\"Action\"\n styleClass=\"w-full\"\n width=\"100%\"\n [multiselect]=\"false\"\n [filter]=\"true\"\n [showClear]=\"true\"\n placeholder=\"Select Action\"\n [(options)]=\"nextActions\"\n id=\"actions\"\n optionLabel=\"Name\"\n [ngModel]=\"selectedAction | async\"\n (ngModelChange)=\"selectedAction.next($event)\"\n class=\"form-control\"\n >\n </verben-drop-down>\n\n <verben-drop-down\n label=\"Actors\"\n styleClass=\"w-full\"\n width=\"100%\"\n [multiselect]=\"false\"\n [filter]=\"true\"\n [showClear]=\"true\"\n placeholder=\"Select Actor\"\n [(options)]=\"nextActors\"\n id=\"actors\"\n optionLabel=\"Name\"\n optionValue=\"Code\"\n [(ngModel)]=\"recipientCode\"\n class=\"form-control\"\n >\n </verben-drop-down>\n\n <textarea\n [(ngModel)]=\"comment\"\n placeholder=\"Enter Comment\"\n class=\"w-full p-1 text-xs border border-primary rounded-md\"\n style=\"height: 8rem\"\n [cols]=\"8\"\n ></textarea>\n\n <verbena-button\n [disable]=\"!comment\"\n [text]=\"activeActionType\"\n (click)=\"handleAction(row, popup)\"\n class=\"text-xs w-full\"\n bgColor=\"#FFE681\"\n textColor=\"#404040\"\n borderRadius=\"10px\"\n fontSize=\"14px\"\n pd=\"10px 20px\"\n width=\"100%\"\n height=\"32px\"\n >\n {{ activeActionType }}\n </verbena-button>\n </div>\n </div>\n } @else { @for (item of getTableActions(row); track item.label)\n {\n <div\n (click)=\"item.action(row)\"\n class=\"cursor-pointer py-2 px-3 text-sm hover:bg-primary\"\n >\n {{ item.label }}\n </div>\n @if (item.divider) {\n <hr class=\"bg-[#FFE681] h-1 rounded-xl border-0\" />\n } } }\n </div>\n </verben-pop-Up>\n </ng-template>\n <ng-template #header>\n <strong class=\"text-center\">Actions</strong>\n </ng-template>\n </ng-container>\n </lib-data-table>\n </div>\n <div card-content>\n <verben-card-data-view\n borderRadius=\"12px\"\n (loadMoreClick)=\"loadMore()\"\n #vdcv\n dataId=\"Id\"\n border=\"5px\"\n [cardDataList]=\"cardData()\"\n rbgColor=\"#f5f6f9\"\n mg=\"20px\"\n >\n <verben-left-card-data-view class=\"space-y-7\">\n <verben-left-card-data\n #vlcd\n [parent]=\"vdcv\"\n dataId=\"Id\"\n class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n [cardDataList]=\"cardData()\"\n >\n <ng-template #card let-item>\n <div\n (click)=\"\n currentData = isGeneral() ? vdcv.onItemClick(item) : null\n \"\n class=\"flex\"\n >\n <div\n (click)=\"\n currentData = isGeneral() ? vdcv.onItemClick(item) : null\n \"\n class=\"flex cursor-pointer w-full bg-secondary rounded-xl\"\n >\n <div\n class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n [ngClass]=\"\n item.selected ? 'bg-primary' : 'bg-secondary-200'\n \"\n ></div>\n <div class=\"flex flex-col py-2 px-4 w-full\">\n <div class=\"flex items-center gap-4 justify-between\">\n <div class=\"grid gap-y-2\">\n <span class=\"font-semibold text-[#404040]\">{{\n item.title\n }}</span>\n <p class=\"flex items-center\">\n <label for=\"phone\" class=\"text-[10px] font-light\"\n >Status:</label\n >\n <span id=\"phone\" class=\"text-sm\">{{\n item.data.Status\n }}</span>\n </p>\n </div>\n\n <div class=\"grid gap-y-2\">\n <span for=\"role\" class=\"font-light\">{{\n item.data.WorkflowCode\n }}</span>\n <a\n [routerLink]=\"[\n '/workflow/task-history',\n item.data.Code\n ]\"\n routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF] text-xs\"\n >view history</a\n >\n </div>\n </div>\n\n <!-- <div class=\"flex\">\n <span class=\"font-normal text-sm\">{{ item.title }}</span>\n </div>\n @for (ciItem of item.body; track ciItem.value) {\n <div class=\"\">\n <span class=\"text-muted font-light text-xs\"\n >{{ ciItem.title }}:</span\n >\n <span class=\"text-black\">{{ ciItem.value }}</span>\n </div>\n } -->\n </div>\n </div>\n </div>\n </ng-template>\n </verben-left-card-data>\n </verben-left-card-data-view>\n\n <verben-right-card-data-view>\n <ng-template #parent>\n <!-- <lib-user-request-form\n [currentData]=\"currentData\"\n (switchView)=\"vdv.toggleView()\"\n (onApproval)=\"onApprove($event)\"\n ></lib-user-request-form> -->\n </ng-template>\n </verben-right-card-data-view>\n\n <verben-card-data-view-footer class=\"w-full\">\n <div\n [ngClass]=\"{\n 'flex gap-2 items-center': true,\n 'justify-end': true,\n }\"\n >\n <!-- <verbena-button\n *ngIf=\"!vdcv.hasCurrentItem()\"\n [fontWeight]=\"'bold'\"\n [bgColor]=\"'#8E8D87'\"\n [borderRadius]=\"'4px'\"\n [textColor]=\"'#fff'\"\n [pd]=\"'9.79px 37.28px'\"\n [text]=\"'Delete'\"\n >\n </verbena-button> -->\n <div\n class=\"flex {{\n vdcv.hasCurrentItem() ? 'flex-1' : ''\n }} justify-end items-center gap-5\"\n >\n <span class=\"paginator-text\"\n >{{ cardData().length }} records loaded</span\n >\n <button\n (click)=\"loadMore()\"\n class=\"load-more view-links text-[#3479E9] underline\"\n >\n Load more\n </button>\n </div>\n </div>\n </verben-card-data-view-footer>\n </verben-card-data-view>\n </div>\n <div column-content>\n <lib-data-columns\n [columns]=\"config.columns\"\n (columnsUpdated)=\"onColumnsUpdated($event)\"\n ></lib-data-columns>\n </div>\n <div filter-content>\n <verben-table-filter\n [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n borderRadius=\"10px\"\n boxShadow=\"2px 2px 2px 0px silver\"\n bgColor=\"white\"\n width=\"420px\"\n textColor=\"black\"\n pd=\"1rem\"\n primaryColor=\"#FFE681\"\n secondaryColor=\"#3479E9\"\n tertiaryColor=\"#404040\"\n [filterOptions]=\"filterArray\"\n [maxFilterLength]=\"3\"\n ></verben-table-filter>\n </div>\n <div sort-content>\n <lib-data-sort\n [columns]=\"config.columns\"\n [data]=\"data()\"\n (sortApplied)=\"onSortUpdated($event)\"\n ></lib-data-sort>\n </div>\n <div export-content>\n <lib-data-export [data]=\"data()\" (exportDataEvent)=\"handleExport($event)\">\n </lib-data-export>\n </div>\n </verben-data-view>\n\n <div *ngIf=\"vdv.isTableView\" class=\"flex gap-2 justify-end\">\n\n <div class=\"flex justify-end items-center gap-5\">\n <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n <button\n (click)=\"loadMore()\"\n class=\"load-more view-links text-[#3479E9] underline\"\n >\n Load more\n </button>\n </div>\n </div>\n</div>\n\n<verben-dialogue\n [showCloseIcon]=\"true\"\n [dismissOutsideClick]=\"true\"\n [closeOnEscape]=\"true\"\n [mode]=\"'drawer'\"\n [padding]=\"'0px'\"\n [drawerWidth]=\"'400px'\"\n [disableFooter]=\"false\"\n [isVisible]=\"isModalVisible\"\n [modalData]=\"stageForm\"\n [headerTemplate]=\"headerTemplate\"\n [bodyTemplate]=\"bodyTemplate\"\n [showCloseIcon]=\"false\"\n>\n</verben-dialogue>\n<ng-template #headerTemplate>\n <div class=\"bg-[#FFE681] px-6 py-4 flex justify-between items-center\">\n <h1>Form</h1>\n <verben-svg\n class=\"cursor-pointer\"\n [icon]=\"'close-circle'\"\n (click)=\"isModalVisible = false\"\n [width]=\"15\"\n [height]=\"15\"\n [stroke]=\"'#fff'\"\n ></verben-svg>\n </div>\n</ng-template>\n\n<ng-template #bodyTemplate>\n <div>\n <div *ngIf=\"stageForm?.Entities?.[active]; else emptyState\" class=\"mt-4\">\n <form-control\n [dataType]=\"dataType\"\n [formProperties]=\"stageForm?.Entities?.[active]?.Properties ?? []\"\n ></form-control>\n\n <div class=\"flex gap-3 justify-end\">\n <verbena-button\n class=\"verben-primary-button\"\n (click)=\"submitForm()\"\n [disable]=\"!areRequiredPropertiesFilled()\"\n text=\"Save\"\n ></verbena-button>\n </div>\n </div>\n\n <!-- Empty state template -->\n <ng-template #emptyState>\n <p class=\"mt-4 p-4 text-gray-600 text-center\">\n No entries available for the selected form group.\n </p>\n </ng-template>\n </div>\n</ng-template>\n", styles: [".view-links{color:#3479e9;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.DataTableComponent, selector: "lib-data-table", inputs: ["data", "columns", "dataKey", "formGroupConfig", "groupBy", "useVirtualScroll", "virtualScrollItemSize", "styleConfig"], outputs: ["rowEdit", "rowSave", "rowRevert", "rowDelete", "selectionChange"] }, { kind: "directive", type: i3.ColumnDirective, selector: "[libColumn]", inputs: ["libColumn"] }, { kind: "component", type: i3.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "type", "size"] }, { kind: "component", type: i3.DataViewComponent, selector: "verben-data-view", inputs: ["buttonClass", "iconClass", "activeIconClass", "columnCustomClass", "filterCustomClass", "sortCustomClass", "extendCustomClass", "exportCustomClass", "selectCustomClass", "importCustomClass", "zIndex", "createCustomClass", "tableIcon", "cardIcon", "cardClass", "tableClass", "searchKey", "searchValue", "viewState", "searchTemplate", "importTemplate", "columnTemplate", "extendTemplate", "filterTemplate", "sortTemplate", "children", "exportTemplate", "createTemplate", "selectedColumnCount", "selectedSortCount", "selectedFilterTableCount", "inputWidth", "milliseconds", "showColumnChild", "showSortChild", "showFilterChild", "showImportChild", "showExportChild", "showExtendChild", "create", "showSelected", "isTableView"], outputs: ["viewChange", "stateChange", "onSearchChange"] }, { kind: "component", type: i3.CardDataViewComponent, selector: "verben-card-data-view", inputs: ["pd", "mg", "lHeight", "rHeight", "rWidth", "lWidth", "textColor", "lbgColor", "rbgColor", "border", "display", "borderRadius", "activeCss", "inActiveCss", "displayAsRow", "cardDataList", "dataId", "totalRecords", "footer", "noOfVisibleChildren", "showEditIcon", "onItemClick", "onCardChildClick"], outputs: ["editClicked", "loadMoreClick"] }, { kind: "component", type: i3.LeftCardDataComponent, selector: "verben-left-card-data", inputs: ["pd", "mg", "height", "weight", "activeCss", "inActiveCss", "cardDataList", "iconCollapse", "iconExpanded", "parent", "dataId"] }, { kind: "component", type: i3.LeftCardDataViewComponent, selector: "verben-left-card-data-view", inputs: ["cardDataList"] }, { kind: "component", type: i3.RightCardDataViewComponent, selector: "verben-right-card-data-view", inputs: ["parentData", "chilData", "meth"] }, { kind: "component", type: i3.CardDataViewFooterComponent, selector: "verben-card-data-view-footer" }, { kind: "component", type: i3.TableFilterComponent, selector: "verben-table-filter", inputs: ["filterOptions", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "maxFilterLength", "tooltip"], outputs: ["filtersApplied", "resetSortData"] }, { kind: "component", type: i3.DataExportComponent, selector: "lib-data-export", inputs: ["columns", "data", "dataFetchUrl", "dataQueryParameters"], outputs: ["exportDataEvent"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "useIcon", "svgPosition", "iconPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "svgSize", "weight", "variant", "styleType", "svg", "svgWidth", "svgHeight", "iconColor", "svgColor", "buttonClass", "buttonTextClass", "isLoading", "spinnerSize", "spinnerColor"] }, { kind: "component", type: i3.VerbenDialogueComponent, selector: "verben-dialogue", inputs: ["dialogueWidth", "headerTemplate", "bodyTemplate", "footerTemplate", "showCloseIcon", "dismissOutsideClick", "closeOnEscape", "isVisible", "size", "backdropColor", "customClass", "disableFooter", "margin", "padding", "borderRadius", "dialogueBgColor", "width", "closeIconClass", "boxShadow", "enableTransition", "modalData", "mode", "position", "drawerWidth"], outputs: ["openModal", "closeModal"] }, { kind: "component", type: i3.DropDownComponent, selector: "verben-drop-down", inputs: ["options", "width", "showHorizontalLine", "horizontalLineColor", "optionLabel", "optionSubLabel", "optionValue", "placeholder", "invalidMessage", "errorPosition", "loadMoreCaption", "display", "showClear", "lazyLoad", "selectKey", "styleClass", "group", "multiselect", "filter", "avoidDuplication", "filterBy", "debounceTime", "minChar", "disabled", "required", "load", "asyncLabel", "search"], outputs: ["optionsChange", "onChange", "onClick", "onClear"] }, { kind: "component", type: i3.VerbenPopUpComponent, selector: "verben-pop-Up", inputs: ["dropdownOpen", "dropdownWidth", "color", "customStyles", "popUpClass", "border", "borderRadius", "enableMouseLeave", "cdkPosition"], outputs: ["dropdownOpenChange", "close"] }, { kind: "component", type: i3.DataColumnsComponent, selector: "lib-data-columns", inputs: ["columns", "enableDragAndDrop", "maxVisibleItems"], outputs: ["columnsUpdated"] }, { kind: "component", type: i3.DataSortComponent, selector: "lib-data-sort", inputs: ["columns", "data", "enableDragAndDrop"], outputs: ["sortApplied", "resetFilter"] }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i6.FormControlComponent, selector: "form-control", inputs: ["dataType", "value", "boolInputType", "formProperties"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
1016
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: MyQueueComponent, selector: "lib-my-queue", inputs: { isGeneral: { classPropertyName: "isGeneral", publicName: "isGeneral", isSignal: true, isRequired: false, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: false, isRequired: false, transformFunction: null } }, providers: [MyQueueService, MyQueueState, MyQueueFacade], usesInheritance: true, ngImport: i0, template: "<div class=\"space-y-8\">\n <verben-data-view #vdv [viewState]=\"{\n isSearch: true,\n isColumn: true,\n isFilter: true,\n isSort: true,\n isExport: true,\n isSelect: true,\n isCreate: isGeneral(),\n isToggle: true,\n }\" [buttonClass]=\"'my-custom-button-class'\" [iconClass]=\"'my-icon-class'\"\n [activeIconClass]=\"'my-active-icon-class'\" [selectedColumnCount]=\"0\" [selectedSortCount]=\"0\"\n [selectedFilterTableCount]=\"0\" (viewChange)=\"onViewChange($event)\" (stateChange)=\"onStateChange($event)\">\n <div table-content>\n <lib-data-table [data]=\"data()\" [columns]=\"config.columns\" [styleConfig]=\"styles\"\n (selectionChange)=\"onSelectionChange($event)\" [groupBy]=\"groupByWorkflowCode\">\n <ng-container libColumn=\"history\">\n <ng-template #cell let-value let-deleteRow>\n <a [routerLink]=\"['/workflow/task-history', value]\" routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF]\">view history</a>\n </ng-template>\n </ng-container>\n\n <ng-container libColumn=\"workflow\">\n <ng-template #cell let-value>\n <a [routerLink]=\"['/workflow/workflows', value]\" routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF]\">view Workflow</a>\n </ng-template>\n </ng-container>\n\n <ng-container libColumn=\"actions\">\n <ng-template #cell let-row=\"row\">\n <verben-pop-Up #popup [customStyles]=\"{ 'z-index': '99' }\" [enableMouseLeave]=\"false\" [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\" (dropdownOpenChange)=\"handlePopupClose($event)\">\n <verben-svg dropdown-trigger icon=\"dots\" [width]=\"3\" [height]=\"18\"\n class=\"cursor-pointer w-auto\"></verben-svg>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n @for (item of getTableActions(row); track item.label) {\n\n <verben-pop-Up #popup2 [customStyles]=\"{ 'z-index': '99' }\" [enableMouseLeave]=\"false\" [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\" (dropdownOpenChange)=\"handlePopupClose($event)\">\n <div (click)=\"item.action(row)\" dropdown-trigger class=\"cursor-pointer py-2 px-3 hover:bg-primary\">\n {{ item.label }}\n </div>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n <div style=\"width: 16rem\">\n <div class=\"flex items-center gap-4 justify-between h-12 px-2 pt-4\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.6\">\n <path\n d=\"M6.74649 8.00338C6.91483 8.1347 7.0252 8.20455 7.11531 8.29396C7.98846 9.16222 8.85742 10.0347 9.72917 10.905C9.87167 11.0475 9.99391 11.1921 9.99321 11.4129C9.99251 11.6462 9.89472 11.8152 9.69564 11.9256C9.49307 12.038 9.2926 12.0206 9.10469 11.8899C9.03833 11.8438 8.98175 11.7845 8.92378 11.7272C7.85574 10.6592 6.79678 9.58203 5.71477 8.52867C5.3711 8.19407 5.38437 7.79173 5.70779 7.47599C6.7884 6.42123 7.84875 5.34551 8.91539 4.27607C9.11377 4.07769 9.32054 3.92262 9.623 4.04137C9.97924 4.18107 10.112 4.58901 9.89472 4.90335C9.82976 4.99765 9.74174 5.07728 9.66002 5.1597C8.80642 6.01469 7.95283 6.86968 7.09645 7.72257C7.01472 7.8043 6.91553 7.86856 6.74579 8.00408L6.74649 8.00338Z\"\n fill=\"black\" />\n </g>\n </svg>\n\n <h3 class=\"text-sm font-medium\">Select Assignee</h3>\n </div>\n\n <div class=\"grid gap-2 max-h-96 overflow-y-auto p-2\">\n <verben-drop-down label=\"Action\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\"\n [filter]=\"true\" [showClear]=\"true\" placeholder=\"Select Action\" [(options)]=\"nextActions\"\n id=\"actions\" optionLabel=\"Name\" [ngModel]=\"selectedAction | async\"\n (ngModelChange)=\"selectedAction.next($event)\" class=\"form-control\">\n </verben-drop-down>\n\n <verben-drop-down label=\"Actors\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\"\n [filter]=\"true\" [showClear]=\"true\" placeholder=\"Select Actor\" [(options)]=\"nextActors\"\n id=\"actors\" optionLabel=\"Name\" optionValue=\"Code\" [(ngModel)]=\"recipientCode\"\n class=\"form-control\">\n </verben-drop-down>\n\n <textarea [(ngModel)]=\"comment\" placeholder=\"Enter Comment\"\n class=\"w-full p-1 text-xs border border-primary rounded-md\" style=\"height: 8rem\"\n [cols]=\"8\"></textarea>\n\n <verbena-button [disable]=\"!comment\" [text]=\"activeActionType ?? ''\"\n (click)=\"handleAction(row, popup)\" class=\"text-xs w-full\" bgColor=\"#FFE681\"\n textColor=\"#404040\" borderRadius=\"10px\" fontSize=\"14px\" pd=\"10px 20px\" width=\"100%\"\n height=\"32px\">\n {{ activeActionType }}\n </verbena-button>\n </div>\n </div>\n </div>\n </verben-pop-Up>\n\n @if (item.divider) {\n <hr class=\"bg-[#FFE681] h-1 rounded-xl border-0\" />\n } }\n </div>\n </verben-pop-Up>\n </ng-template>\n <ng-template #header>\n <strong class=\"text-center\">Actions</strong>\n </ng-template>\n </ng-container>\n </lib-data-table>\n </div>\n <div card-content>\n <verben-card-data-view borderRadius=\"12px\" (loadMoreClick)=\"loadMore()\" #vdcv dataId=\"Id\" border=\"5px\"\n [cardDataList]=\"cardData()\" rbgColor=\"#f5f6f9\" mg=\"20px\">\n <verben-left-card-data-view class=\"space-y-7\">\n <verben-left-card-data #vlcd [parent]=\"vdcv\" dataId=\"Code\"\n class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\" [cardDataList]=\"cardData()\">\n <ng-template #card let-item>\n <div (click)=\"\n currentData = isGeneral() ? vdcv.onItemClick(item) : null\n \" class=\"flex\">\n <div (click)=\"\n currentData = isGeneral() ? vdcv.onItemClick(item) : null\n \" class=\"flex cursor-pointer w-full bg-secondary rounded-xl\">\n <div class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\" [ngClass]=\"\n item.selected ? 'bg-primary' : 'bg-secondary-200'\n \"></div>\n <div class=\"flex flex-col py-2 px-4 w-full\">\n <div class=\"flex items-center gap-4 justify-between\">\n <div class=\"grid gap-y-2\">\n <span class=\"font-semibold text-[#404040]\">{{\n item.title\n }}</span>\n <p class=\"flex items-center\">\n <label for=\"phone\" class=\"text-[10px] font-light\">Status:</label>\n <span id=\"phone\" class=\"text-sm\">{{\n item.data.Status\n }}</span>\n </p>\n </div>\n\n <div class=\"grid gap-y-2\">\n <span for=\"role\" class=\"font-light\">{{\n item.data.WorkflowCode\n }}</span>\n\n <div (click)=\"$event.stopPropagation();\" class=\"flex items-end gap-4\">\n <a [routerLink]=\"[\n '/workflow/task-history',\n item.data.Code\n ]\" routerLinkActive=\"router-link-active\" class=\"underline text-[#0000FF] text-xs\">view\n history</a>\n\n <verben-pop-Up #popup [customStyles]=\"{ 'z-index': '99' }\" [enableMouseLeave]=\"false\"\n [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\" (dropdownOpenChange)=\"handlePopupClose($event);\">\n <verben-svg dropdown-trigger icon=\"dots\" [width]=\"3\" [height]=\"18\"\n class=\"cursor-pointer\"></verben-svg>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n @for (actionItem of getTableActions(item.data); track actionItem.label) {\n\n <verben-pop-Up #popup2 [customStyles]=\"{ 'z-index': '99' }\" [enableMouseLeave]=\"false\"\n [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\" (dropdownOpenChange)=\"handlePopupClose($event)\">\n <div (click)=\"actionItem.action(item.data)\" dropdown-trigger\n class=\"cursor-pointer py-2 px-3 hover:bg-primary\">\n {{ actionItem.label }}\n </div>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n <div style=\"width: 16rem\">\n <div class=\"flex items-center gap-4 justify-between h-12 px-2 pt-4\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.6\">\n <path\n d=\"M6.74649 8.00338C6.91483 8.1347 7.0252 8.20455 7.11531 8.29396C7.98846 9.16222 8.85742 10.0347 9.72917 10.905C9.87167 11.0475 9.99391 11.1921 9.99321 11.4129C9.99251 11.6462 9.89472 11.8152 9.69564 11.9256C9.49307 12.038 9.2926 12.0206 9.10469 11.8899C9.03833 11.8438 8.98175 11.7845 8.92378 11.7272C7.85574 10.6592 6.79678 9.58203 5.71477 8.52867C5.3711 8.19407 5.38437 7.79173 5.70779 7.47599C6.7884 6.42123 7.84875 5.34551 8.91539 4.27607C9.11377 4.07769 9.32054 3.92262 9.623 4.04137C9.97924 4.18107 10.112 4.58901 9.89472 4.90335C9.82976 4.99765 9.74174 5.07728 9.66002 5.1597C8.80642 6.01469 7.95283 6.86968 7.09645 7.72257C7.01472 7.8043 6.91553 7.86856 6.74579 8.00408L6.74649 8.00338Z\"\n fill=\"black\" />\n </g>\n </svg>\n\n <h3 class=\"text-sm font-medium\">Select Assignee</h3>\n </div>\n\n <div class=\"grid gap-2 max-h-96 overflow-y-auto p-2\">\n <verben-drop-down label=\"Action\" styleClass=\"w-full\" width=\"100%\"\n [multiselect]=\"false\" [filter]=\"true\" [showClear]=\"true\"\n placeholder=\"Select Action\" [(options)]=\"nextActions\" id=\"actions\"\n optionLabel=\"Name\" [ngModel]=\"selectedAction | async\"\n (ngModelChange)=\"selectedAction.next($event)\" class=\"form-control\">\n </verben-drop-down>\n\n <verben-drop-down label=\"Actors\" styleClass=\"w-full\" width=\"100%\"\n [multiselect]=\"false\" [filter]=\"true\" [showClear]=\"true\"\n placeholder=\"Select Actor\" [(options)]=\"nextActors\" id=\"actors\"\n optionLabel=\"Name\" optionValue=\"Code\" [(ngModel)]=\"recipientCode\"\n class=\"form-control\">\n </verben-drop-down>\n\n <textarea [(ngModel)]=\"comment\" placeholder=\"Enter Comment\"\n class=\"w-full p-1 text-xs border border-primary rounded-md\" style=\"height: 8rem\"\n [cols]=\"8\"></textarea>\n\n <verbena-button [disable]=\"!comment\" [text]=\"activeActionType ?? ''\"\n (click)=\"handleAction(item.data, popup)\" class=\"text-xs w-full\"\n bgColor=\"#FFE681\" textColor=\"#404040\" borderRadius=\"10px\" fontSize=\"14px\"\n pd=\"10px 20px\" width=\"100%\" height=\"32px\">\n {{ activeActionType }}\n </verbena-button>\n </div>\n </div>\n </div>\n </verben-pop-Up>\n\n @if (actionItem.divider) {\n <hr class=\"bg-[#FFE681] h-1 rounded-xl border-0\" />\n } }\n </div>\n </verben-pop-Up>\n </div>\n </div>\n </div>\n\n <!-- <div class=\"flex\">\n <span class=\"font-normal text-sm\">{{ item.title }}</span>\n </div>\n @for (ciItem of item.body; track ciItem.value) {\n <div class=\"\">\n <span class=\"text-muted font-light text-xs\"\n >{{ ciItem.title }}:</span\n >\n <span class=\"text-black\">{{ ciItem.value }}</span>\n </div>\n } -->\n </div>\n </div>\n </div>\n </ng-template>\n </verben-left-card-data>\n </verben-left-card-data-view>\n\n <verben-right-card-data-view>\n <ng-template #parent>\n <!-- <lib-user-request-form\n [currentData]=\"currentData\"\n (switchView)=\"vdv.toggleView()\"\n (onApproval)=\"onApprove($event)\"\n ></lib-user-request-form> -->\n </ng-template>\n </verben-right-card-data-view>\n\n <verben-card-data-view-footer class=\"w-full\">\n <div [ngClass]=\"{\n 'flex gap-2 items-center': true,\n 'justify-end': true,\n }\">\n <!-- <verbena-button\n *ngIf=\"!vdcv.hasCurrentItem()\"\n [fontWeight]=\"'bold'\"\n [bgColor]=\"'#8E8D87'\"\n [borderRadius]=\"'4px'\"\n [textColor]=\"'#fff'\"\n [pd]=\"'9.79px 37.28px'\"\n [text]=\"'Delete'\"\n >\n </verbena-button> -->\n <div class=\"flex {{\n vdcv.hasCurrentItem() ? 'flex-1' : ''\n }} justify-end items-center gap-5\">\n <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n <button (click)=\"loadMore()\" class=\"load-more view-links text-[#3479E9] underline\">\n Load more\n </button>\n </div>\n </div>\n </verben-card-data-view-footer>\n </verben-card-data-view>\n </div>\n <div column-content>\n <lib-data-columns [columns]=\"config.columns\" (columnsUpdated)=\"onColumnsUpdated($event)\"></lib-data-columns>\n </div>\n <div filter-content>\n <verben-table-filter [border]=\"'1px solid rgba(212, 160, 7, 1)'\" borderRadius=\"10px\"\n boxShadow=\"2px 2px 2px 0px silver\" bgColor=\"white\" width=\"420px\" textColor=\"black\" pd=\"1rem\"\n primaryColor=\"#FFE681\" secondaryColor=\"#3479E9\" tertiaryColor=\"#404040\" [filterOptions]=\"filterArray\"\n [maxFilterLength]=\"3\"></verben-table-filter>\n </div>\n <div sort-content>\n <lib-data-sort [columns]=\"config.columns\" [data]=\"data()\" (sortApplied)=\"onSortUpdated($event)\"></lib-data-sort>\n </div>\n <div export-content>\n <lib-data-export [data]=\"data()\" (exportDataEvent)=\"handleExport($event)\">\n </lib-data-export>\n </div>\n </verben-data-view>\n\n <div *ngIf=\"vdv.isTableView\" class=\"flex gap-2 justify-end\">\n\n <div class=\"flex justify-end items-center gap-5\">\n <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n <button (click)=\"loadMore()\" class=\"load-more view-links text-[#3479E9] underline\">\n Load more\n </button>\n </div>\n </div>\n</div>\n\n<verben-dialogue [showCloseIcon]=\"true\" [dismissOutsideClick]=\"true\" [closeOnEscape]=\"true\" [mode]=\"'drawer'\"\n [padding]=\"'0px'\" [drawerWidth]=\"'400px'\" [disableFooter]=\"false\" [isVisible]=\"isModalVisible\" [modalData]=\"stageForm\"\n [headerTemplate]=\"headerTemplate\" [bodyTemplate]=\"bodyTemplate\" [showCloseIcon]=\"false\">\n</verben-dialogue>\n<ng-template #headerTemplate>\n <div class=\"bg-[#FFE681] px-6 py-4 flex justify-between items-center\">\n <h1>Form</h1>\n <verben-svg class=\"cursor-pointer\" [icon]=\"'close-circle'\" (click)=\"isModalVisible = false\" [width]=\"15\"\n [height]=\"15\" [stroke]=\"'#fff'\"></verben-svg>\n </div>\n</ng-template>\n\n<ng-template #bodyTemplate>\n <div>\n <div *ngIf=\"stageForm?.Entities?.[active]; else emptyState\" class=\"mt-4\">\n <form-control [dataType]=\"dataType\"\n [formProperties]=\"stageForm?.Entities?.[active]?.Properties ?? []\"></form-control>\n\n <div class=\"flex gap-3 justify-end\">\n <verbena-button class=\"verben-primary-button\" (click)=\"submitForm()\" [disable]=\"!areRequiredPropertiesFilled()\"\n text=\"Save\"></verbena-button>\n </div>\n </div>\n\n <!-- Empty state template -->\n <ng-template #emptyState>\n <p class=\"mt-4 p-4 text-gray-600 text-center\">\n No entries available for the selected form group.\n </p>\n </ng-template>\n </div>\n</ng-template>\n", styles: [".view-links{color:#3479e9;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.DataTableComponent, selector: "lib-data-table", inputs: ["data", "columns", "dataKey", "formGroupConfig", "groupBy", "useVirtualScroll", "virtualScrollItemSize", "styleConfig"], outputs: ["rowEdit", "rowSave", "rowRevert", "rowDelete", "selectionChange"] }, { kind: "directive", type: i3.ColumnDirective, selector: "[libColumn]", inputs: ["libColumn"] }, { kind: "component", type: i3.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "type", "size"] }, { kind: "component", type: i3.DataViewComponent, selector: "verben-data-view", inputs: ["buttonClass", "iconClass", "activeIconClass", "columnCustomClass", "filterCustomClass", "sortCustomClass", "extendCustomClass", "exportCustomClass", "selectCustomClass", "importCustomClass", "zIndex", "createCustomClass", "tableIcon", "cardIcon", "cardClass", "tableClass", "searchKey", "searchValue", "viewState", "searchTemplate", "importTemplate", "columnTemplate", "extendTemplate", "filterTemplate", "sortTemplate", "children", "exportTemplate", "createTemplate", "selectedColumnCount", "selectedSortCount", "selectedFilterTableCount", "inputWidth", "milliseconds", "showColumnChild", "showSortChild", "showFilterChild", "showImportChild", "showExportChild", "showExtendChild", "create", "showSelected", "isTableView"], outputs: ["viewChange", "stateChange", "onSearchChange"] }, { kind: "component", type: i3.CardDataViewComponent, selector: "verben-card-data-view", inputs: ["pd", "mg", "lHeight", "rHeight", "rWidth", "lWidth", "textColor", "lbgColor", "rbgColor", "border", "display", "borderRadius", "activeCss", "inActiveCss", "displayAsRow", "cardDataList", "dataId", "totalRecords", "footer", "noOfVisibleChildren", "showEditIcon", "onItemClick", "onCardChildClick"], outputs: ["editClicked", "loadMoreClick"] }, { kind: "component", type: i3.LeftCardDataComponent, selector: "verben-left-card-data", inputs: ["pd", "mg", "height", "weight", "activeCss", "inActiveCss", "cardDataList", "iconCollapse", "iconExpanded", "parent", "dataId"] }, { kind: "component", type: i3.LeftCardDataViewComponent, selector: "verben-left-card-data-view", inputs: ["cardDataList"] }, { kind: "component", type: i3.RightCardDataViewComponent, selector: "verben-right-card-data-view", inputs: ["parentData", "chilData", "meth"] }, { kind: "component", type: i3.CardDataViewFooterComponent, selector: "verben-card-data-view-footer" }, { kind: "component", type: i3.TableFilterComponent, selector: "verben-table-filter", inputs: ["filterOptions", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "maxFilterLength", "tooltip"], outputs: ["filtersApplied", "resetSortData"] }, { kind: "component", type: i3.DataExportComponent, selector: "lib-data-export", inputs: ["columns", "data", "dataFetchUrl", "dataQueryParameters"], outputs: ["exportDataEvent"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "useIcon", "svgPosition", "iconPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "svgSize", "weight", "variant", "styleType", "svg", "svgWidth", "svgHeight", "iconColor", "svgColor", "buttonClass", "buttonTextClass", "isLoading", "spinnerSize", "spinnerColor"] }, { kind: "component", type: i3.VerbenDialogueComponent, selector: "verben-dialogue", inputs: ["dialogueWidth", "headerTemplate", "bodyTemplate", "footerTemplate", "showCloseIcon", "dismissOutsideClick", "closeOnEscape", "isVisible", "size", "backdropColor", "customClass", "disableFooter", "margin", "padding", "borderRadius", "dialogueBgColor", "width", "closeIconClass", "boxShadow", "enableTransition", "modalData", "mode", "position", "drawerWidth"], outputs: ["openModal", "closeModal"] }, { kind: "component", type: i3.DropDownComponent, selector: "verben-drop-down", inputs: ["options", "width", "showHorizontalLine", "horizontalLineColor", "optionLabel", "optionSubLabel", "optionValue", "placeholder", "invalidMessage", "errorPosition", "loadMoreCaption", "display", "showClear", "lazyLoad", "selectKey", "styleClass", "group", "multiselect", "filter", "avoidDuplication", "filterBy", "debounceTime", "minChar", "disabled", "required", "load", "asyncLabel", "search"], outputs: ["optionsChange", "onChange", "onClick", "onClear"] }, { kind: "component", type: i3.VerbenPopUpComponent, selector: "verben-pop-Up", inputs: ["dropdownOpen", "dropdownWidth", "color", "customStyles", "popUpClass", "border", "borderRadius", "enableMouseLeave", "cdkPosition"], outputs: ["dropdownOpenChange", "close"] }, { kind: "component", type: i3.DataColumnsComponent, selector: "lib-data-columns", inputs: ["columns", "enableDragAndDrop", "maxVisibleItems"], outputs: ["columnsUpdated"] }, { kind: "component", type: i3.DataSortComponent, selector: "lib-data-sort", inputs: ["columns", "data", "enableDragAndDrop"], outputs: ["sortApplied", "resetFilter"] }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i6.FormControlComponent, selector: "form-control", inputs: ["dataType", "value", "boolInputType", "formProperties"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
1017
1017
|
}
|
|
1018
1018
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MyQueueComponent, decorators: [{
|
|
1019
1019
|
type: Component,
|
|
1020
|
-
args: [{ selector: 'lib-my-queue', providers: [MyQueueService, MyQueueState, MyQueueFacade], template: "<div class=\"space-y-8\">\n <verben-data-view\n #vdv\n [viewState]=\"{\n isSearch: true,\n isColumn: true,\n isFilter: true,\n isSort: true,\n isExport: true,\n isSelect: true,\n isCreate: isGeneral(),\n isToggle: true,\n }\"\n [buttonClass]=\"'my-custom-button-class'\"\n [iconClass]=\"'my-icon-class'\"\n [activeIconClass]=\"'my-active-icon-class'\"\n [selectedColumnCount]=\"0\"\n [selectedSortCount]=\"0\"\n [selectedFilterTableCount]=\"0\"\n (viewChange)=\"onViewChange($event)\"\n (stateChange)=\"onStateChange($event)\"\n >\n <div table-content>\n <lib-data-table\n [data]=\"data()\"\n [columns]=\"config.columns\"\n [styleConfig]=\"styles\"\n (selectionChange)=\"onSelectionChange($event)\"\n [groupBy]=\"groupByWorkflowCode\"\n >\n <ng-container libColumn=\"history\">\n <ng-template #cell let-value let-deleteRow>\n <a\n [routerLink]=\"['/workflow/task-history', value]\"\n routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF]\"\n >view history</a\n >\n </ng-template>\n </ng-container>\n\n <ng-container libColumn=\"workflow\">\n <ng-template #cell let-value>\n <a\n [routerLink]=\"['/workflow/workflows', value]\"\n routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF]\"\n >view Workflow</a\n >\n </ng-template>\n </ng-container>\n\n <ng-container libColumn=\"actions\">\n <ng-template #cell let-row=\"row\">\n <verben-pop-Up\n #popup\n [customStyles]=\"{ 'z-index': '99' }\"\n [enableMouseLeave]=\"false\"\n [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\"\n (dropdownOpenChange)=\"handlePopupClose($event)\"\n >\n <verben-svg\n dropdown-trigger\n icon=\"dots\"\n [width]=\"4\"\n [height]=\"24\"\n class=\"cursor-pointer w-auto\"\n ></verben-svg>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n @if (selectedTaskCode && activeActionType) {\n <div style=\"width: 16rem\">\n <div\n class=\"flex items-center gap-4 justify-between h-12 px-2 pt-4\"\n >\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <g opacity=\"0.6\">\n <path\n d=\"M6.74649 8.00338C6.91483 8.1347 7.0252 8.20455 7.11531 8.29396C7.98846 9.16222 8.85742 10.0347 9.72917 10.905C9.87167 11.0475 9.99391 11.1921 9.99321 11.4129C9.99251 11.6462 9.89472 11.8152 9.69564 11.9256C9.49307 12.038 9.2926 12.0206 9.10469 11.8899C9.03833 11.8438 8.98175 11.7845 8.92378 11.7272C7.85574 10.6592 6.79678 9.58203 5.71477 8.52867C5.3711 8.19407 5.38437 7.79173 5.70779 7.47599C6.7884 6.42123 7.84875 5.34551 8.91539 4.27607C9.11377 4.07769 9.32054 3.92262 9.623 4.04137C9.97924 4.18107 10.112 4.58901 9.89472 4.90335C9.82976 4.99765 9.74174 5.07728 9.66002 5.1597C8.80642 6.01469 7.95283 6.86968 7.09645 7.72257C7.01472 7.8043 6.91553 7.86856 6.74579 8.00408L6.74649 8.00338Z\"\n fill=\"black\"\n />\n </g>\n </svg>\n\n <h3 class=\"text-sm font-medium\">Select Assignee</h3>\n </div>\n\n <div class=\"grid gap-2 max-h-96 overflow-y-auto p-2\">\n <verben-drop-down\n label=\"Action\"\n styleClass=\"w-full\"\n width=\"100%\"\n [multiselect]=\"false\"\n [filter]=\"true\"\n [showClear]=\"true\"\n placeholder=\"Select Action\"\n [(options)]=\"nextActions\"\n id=\"actions\"\n optionLabel=\"Name\"\n [ngModel]=\"selectedAction | async\"\n (ngModelChange)=\"selectedAction.next($event)\"\n class=\"form-control\"\n >\n </verben-drop-down>\n\n <verben-drop-down\n label=\"Actors\"\n styleClass=\"w-full\"\n width=\"100%\"\n [multiselect]=\"false\"\n [filter]=\"true\"\n [showClear]=\"true\"\n placeholder=\"Select Actor\"\n [(options)]=\"nextActors\"\n id=\"actors\"\n optionLabel=\"Name\"\n optionValue=\"Code\"\n [(ngModel)]=\"recipientCode\"\n class=\"form-control\"\n >\n </verben-drop-down>\n\n <textarea\n [(ngModel)]=\"comment\"\n placeholder=\"Enter Comment\"\n class=\"w-full p-1 text-xs border border-primary rounded-md\"\n style=\"height: 8rem\"\n [cols]=\"8\"\n ></textarea>\n\n <verbena-button\n [disable]=\"!comment\"\n [text]=\"activeActionType\"\n (click)=\"handleAction(row, popup)\"\n class=\"text-xs w-full\"\n bgColor=\"#FFE681\"\n textColor=\"#404040\"\n borderRadius=\"10px\"\n fontSize=\"14px\"\n pd=\"10px 20px\"\n width=\"100%\"\n height=\"32px\"\n >\n {{ activeActionType }}\n </verbena-button>\n </div>\n </div>\n } @else { @for (item of getTableActions(row); track item.label)\n {\n <div\n (click)=\"item.action(row)\"\n class=\"cursor-pointer py-2 px-3 text-sm hover:bg-primary\"\n >\n {{ item.label }}\n </div>\n @if (item.divider) {\n <hr class=\"bg-[#FFE681] h-1 rounded-xl border-0\" />\n } } }\n </div>\n </verben-pop-Up>\n </ng-template>\n <ng-template #header>\n <strong class=\"text-center\">Actions</strong>\n </ng-template>\n </ng-container>\n </lib-data-table>\n </div>\n <div card-content>\n <verben-card-data-view\n borderRadius=\"12px\"\n (loadMoreClick)=\"loadMore()\"\n #vdcv\n dataId=\"Id\"\n border=\"5px\"\n [cardDataList]=\"cardData()\"\n rbgColor=\"#f5f6f9\"\n mg=\"20px\"\n >\n <verben-left-card-data-view class=\"space-y-7\">\n <verben-left-card-data\n #vlcd\n [parent]=\"vdcv\"\n dataId=\"Id\"\n class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n [cardDataList]=\"cardData()\"\n >\n <ng-template #card let-item>\n <div\n (click)=\"\n currentData = isGeneral() ? vdcv.onItemClick(item) : null\n \"\n class=\"flex\"\n >\n <div\n (click)=\"\n currentData = isGeneral() ? vdcv.onItemClick(item) : null\n \"\n class=\"flex cursor-pointer w-full bg-secondary rounded-xl\"\n >\n <div\n class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n [ngClass]=\"\n item.selected ? 'bg-primary' : 'bg-secondary-200'\n \"\n ></div>\n <div class=\"flex flex-col py-2 px-4 w-full\">\n <div class=\"flex items-center gap-4 justify-between\">\n <div class=\"grid gap-y-2\">\n <span class=\"font-semibold text-[#404040]\">{{\n item.title\n }}</span>\n <p class=\"flex items-center\">\n <label for=\"phone\" class=\"text-[10px] font-light\"\n >Status:</label\n >\n <span id=\"phone\" class=\"text-sm\">{{\n item.data.Status\n }}</span>\n </p>\n </div>\n\n <div class=\"grid gap-y-2\">\n <span for=\"role\" class=\"font-light\">{{\n item.data.WorkflowCode\n }}</span>\n <a\n [routerLink]=\"[\n '/workflow/task-history',\n item.data.Code\n ]\"\n routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF] text-xs\"\n >view history</a\n >\n </div>\n </div>\n\n <!-- <div class=\"flex\">\n <span class=\"font-normal text-sm\">{{ item.title }}</span>\n </div>\n @for (ciItem of item.body; track ciItem.value) {\n <div class=\"\">\n <span class=\"text-muted font-light text-xs\"\n >{{ ciItem.title }}:</span\n >\n <span class=\"text-black\">{{ ciItem.value }}</span>\n </div>\n } -->\n </div>\n </div>\n </div>\n </ng-template>\n </verben-left-card-data>\n </verben-left-card-data-view>\n\n <verben-right-card-data-view>\n <ng-template #parent>\n <!-- <lib-user-request-form\n [currentData]=\"currentData\"\n (switchView)=\"vdv.toggleView()\"\n (onApproval)=\"onApprove($event)\"\n ></lib-user-request-form> -->\n </ng-template>\n </verben-right-card-data-view>\n\n <verben-card-data-view-footer class=\"w-full\">\n <div\n [ngClass]=\"{\n 'flex gap-2 items-center': true,\n 'justify-end': true,\n }\"\n >\n <!-- <verbena-button\n *ngIf=\"!vdcv.hasCurrentItem()\"\n [fontWeight]=\"'bold'\"\n [bgColor]=\"'#8E8D87'\"\n [borderRadius]=\"'4px'\"\n [textColor]=\"'#fff'\"\n [pd]=\"'9.79px 37.28px'\"\n [text]=\"'Delete'\"\n >\n </verbena-button> -->\n <div\n class=\"flex {{\n vdcv.hasCurrentItem() ? 'flex-1' : ''\n }} justify-end items-center gap-5\"\n >\n <span class=\"paginator-text\"\n >{{ cardData().length }} records loaded</span\n >\n <button\n (click)=\"loadMore()\"\n class=\"load-more view-links text-[#3479E9] underline\"\n >\n Load more\n </button>\n </div>\n </div>\n </verben-card-data-view-footer>\n </verben-card-data-view>\n </div>\n <div column-content>\n <lib-data-columns\n [columns]=\"config.columns\"\n (columnsUpdated)=\"onColumnsUpdated($event)\"\n ></lib-data-columns>\n </div>\n <div filter-content>\n <verben-table-filter\n [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n borderRadius=\"10px\"\n boxShadow=\"2px 2px 2px 0px silver\"\n bgColor=\"white\"\n width=\"420px\"\n textColor=\"black\"\n pd=\"1rem\"\n primaryColor=\"#FFE681\"\n secondaryColor=\"#3479E9\"\n tertiaryColor=\"#404040\"\n [filterOptions]=\"filterArray\"\n [maxFilterLength]=\"3\"\n ></verben-table-filter>\n </div>\n <div sort-content>\n <lib-data-sort\n [columns]=\"config.columns\"\n [data]=\"data()\"\n (sortApplied)=\"onSortUpdated($event)\"\n ></lib-data-sort>\n </div>\n <div export-content>\n <lib-data-export [data]=\"data()\" (exportDataEvent)=\"handleExport($event)\">\n </lib-data-export>\n </div>\n </verben-data-view>\n\n <div *ngIf=\"vdv.isTableView\" class=\"flex gap-2 justify-end\">\n\n <div class=\"flex justify-end items-center gap-5\">\n <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n <button\n (click)=\"loadMore()\"\n class=\"load-more view-links text-[#3479E9] underline\"\n >\n Load more\n </button>\n </div>\n </div>\n</div>\n\n<verben-dialogue\n [showCloseIcon]=\"true\"\n [dismissOutsideClick]=\"true\"\n [closeOnEscape]=\"true\"\n [mode]=\"'drawer'\"\n [padding]=\"'0px'\"\n [drawerWidth]=\"'400px'\"\n [disableFooter]=\"false\"\n [isVisible]=\"isModalVisible\"\n [modalData]=\"stageForm\"\n [headerTemplate]=\"headerTemplate\"\n [bodyTemplate]=\"bodyTemplate\"\n [showCloseIcon]=\"false\"\n>\n</verben-dialogue>\n<ng-template #headerTemplate>\n <div class=\"bg-[#FFE681] px-6 py-4 flex justify-between items-center\">\n <h1>Form</h1>\n <verben-svg\n class=\"cursor-pointer\"\n [icon]=\"'close-circle'\"\n (click)=\"isModalVisible = false\"\n [width]=\"15\"\n [height]=\"15\"\n [stroke]=\"'#fff'\"\n ></verben-svg>\n </div>\n</ng-template>\n\n<ng-template #bodyTemplate>\n <div>\n <div *ngIf=\"stageForm?.Entities?.[active]; else emptyState\" class=\"mt-4\">\n <form-control\n [dataType]=\"dataType\"\n [formProperties]=\"stageForm?.Entities?.[active]?.Properties ?? []\"\n ></form-control>\n\n <div class=\"flex gap-3 justify-end\">\n <verbena-button\n class=\"verben-primary-button\"\n (click)=\"submitForm()\"\n [disable]=\"!areRequiredPropertiesFilled()\"\n text=\"Save\"\n ></verbena-button>\n </div>\n </div>\n\n <!-- Empty state template -->\n <ng-template #emptyState>\n <p class=\"mt-4 p-4 text-gray-600 text-center\">\n No entries available for the selected form group.\n </p>\n </ng-template>\n </div>\n</ng-template>\n", styles: [".view-links{color:#3479e9;cursor:pointer}\n"] }]
|
|
1020
|
+
args: [{ selector: 'lib-my-queue', providers: [MyQueueService, MyQueueState, MyQueueFacade], template: "<div class=\"space-y-8\">\n <verben-data-view #vdv [viewState]=\"{\n isSearch: true,\n isColumn: true,\n isFilter: true,\n isSort: true,\n isExport: true,\n isSelect: true,\n isCreate: isGeneral(),\n isToggle: true,\n }\" [buttonClass]=\"'my-custom-button-class'\" [iconClass]=\"'my-icon-class'\"\n [activeIconClass]=\"'my-active-icon-class'\" [selectedColumnCount]=\"0\" [selectedSortCount]=\"0\"\n [selectedFilterTableCount]=\"0\" (viewChange)=\"onViewChange($event)\" (stateChange)=\"onStateChange($event)\">\n <div table-content>\n <lib-data-table [data]=\"data()\" [columns]=\"config.columns\" [styleConfig]=\"styles\"\n (selectionChange)=\"onSelectionChange($event)\" [groupBy]=\"groupByWorkflowCode\">\n <ng-container libColumn=\"history\">\n <ng-template #cell let-value let-deleteRow>\n <a [routerLink]=\"['/workflow/task-history', value]\" routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF]\">view history</a>\n </ng-template>\n </ng-container>\n\n <ng-container libColumn=\"workflow\">\n <ng-template #cell let-value>\n <a [routerLink]=\"['/workflow/workflows', value]\" routerLinkActive=\"router-link-active\"\n class=\"underline text-[#0000FF]\">view Workflow</a>\n </ng-template>\n </ng-container>\n\n <ng-container libColumn=\"actions\">\n <ng-template #cell let-row=\"row\">\n <verben-pop-Up #popup [customStyles]=\"{ 'z-index': '99' }\" [enableMouseLeave]=\"false\" [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\" (dropdownOpenChange)=\"handlePopupClose($event)\">\n <verben-svg dropdown-trigger icon=\"dots\" [width]=\"3\" [height]=\"18\"\n class=\"cursor-pointer w-auto\"></verben-svg>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n @for (item of getTableActions(row); track item.label) {\n\n <verben-pop-Up #popup2 [customStyles]=\"{ 'z-index': '99' }\" [enableMouseLeave]=\"false\" [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\" (dropdownOpenChange)=\"handlePopupClose($event)\">\n <div (click)=\"item.action(row)\" dropdown-trigger class=\"cursor-pointer py-2 px-3 hover:bg-primary\">\n {{ item.label }}\n </div>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n <div style=\"width: 16rem\">\n <div class=\"flex items-center gap-4 justify-between h-12 px-2 pt-4\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.6\">\n <path\n d=\"M6.74649 8.00338C6.91483 8.1347 7.0252 8.20455 7.11531 8.29396C7.98846 9.16222 8.85742 10.0347 9.72917 10.905C9.87167 11.0475 9.99391 11.1921 9.99321 11.4129C9.99251 11.6462 9.89472 11.8152 9.69564 11.9256C9.49307 12.038 9.2926 12.0206 9.10469 11.8899C9.03833 11.8438 8.98175 11.7845 8.92378 11.7272C7.85574 10.6592 6.79678 9.58203 5.71477 8.52867C5.3711 8.19407 5.38437 7.79173 5.70779 7.47599C6.7884 6.42123 7.84875 5.34551 8.91539 4.27607C9.11377 4.07769 9.32054 3.92262 9.623 4.04137C9.97924 4.18107 10.112 4.58901 9.89472 4.90335C9.82976 4.99765 9.74174 5.07728 9.66002 5.1597C8.80642 6.01469 7.95283 6.86968 7.09645 7.72257C7.01472 7.8043 6.91553 7.86856 6.74579 8.00408L6.74649 8.00338Z\"\n fill=\"black\" />\n </g>\n </svg>\n\n <h3 class=\"text-sm font-medium\">Select Assignee</h3>\n </div>\n\n <div class=\"grid gap-2 max-h-96 overflow-y-auto p-2\">\n <verben-drop-down label=\"Action\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\"\n [filter]=\"true\" [showClear]=\"true\" placeholder=\"Select Action\" [(options)]=\"nextActions\"\n id=\"actions\" optionLabel=\"Name\" [ngModel]=\"selectedAction | async\"\n (ngModelChange)=\"selectedAction.next($event)\" class=\"form-control\">\n </verben-drop-down>\n\n <verben-drop-down label=\"Actors\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\"\n [filter]=\"true\" [showClear]=\"true\" placeholder=\"Select Actor\" [(options)]=\"nextActors\"\n id=\"actors\" optionLabel=\"Name\" optionValue=\"Code\" [(ngModel)]=\"recipientCode\"\n class=\"form-control\">\n </verben-drop-down>\n\n <textarea [(ngModel)]=\"comment\" placeholder=\"Enter Comment\"\n class=\"w-full p-1 text-xs border border-primary rounded-md\" style=\"height: 8rem\"\n [cols]=\"8\"></textarea>\n\n <verbena-button [disable]=\"!comment\" [text]=\"activeActionType ?? ''\"\n (click)=\"handleAction(row, popup)\" class=\"text-xs w-full\" bgColor=\"#FFE681\"\n textColor=\"#404040\" borderRadius=\"10px\" fontSize=\"14px\" pd=\"10px 20px\" width=\"100%\"\n height=\"32px\">\n {{ activeActionType }}\n </verbena-button>\n </div>\n </div>\n </div>\n </verben-pop-Up>\n\n @if (item.divider) {\n <hr class=\"bg-[#FFE681] h-1 rounded-xl border-0\" />\n } }\n </div>\n </verben-pop-Up>\n </ng-template>\n <ng-template #header>\n <strong class=\"text-center\">Actions</strong>\n </ng-template>\n </ng-container>\n </lib-data-table>\n </div>\n <div card-content>\n <verben-card-data-view borderRadius=\"12px\" (loadMoreClick)=\"loadMore()\" #vdcv dataId=\"Id\" border=\"5px\"\n [cardDataList]=\"cardData()\" rbgColor=\"#f5f6f9\" mg=\"20px\">\n <verben-left-card-data-view class=\"space-y-7\">\n <verben-left-card-data #vlcd [parent]=\"vdcv\" dataId=\"Code\"\n class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\" [cardDataList]=\"cardData()\">\n <ng-template #card let-item>\n <div (click)=\"\n currentData = isGeneral() ? vdcv.onItemClick(item) : null\n \" class=\"flex\">\n <div (click)=\"\n currentData = isGeneral() ? vdcv.onItemClick(item) : null\n \" class=\"flex cursor-pointer w-full bg-secondary rounded-xl\">\n <div class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\" [ngClass]=\"\n item.selected ? 'bg-primary' : 'bg-secondary-200'\n \"></div>\n <div class=\"flex flex-col py-2 px-4 w-full\">\n <div class=\"flex items-center gap-4 justify-between\">\n <div class=\"grid gap-y-2\">\n <span class=\"font-semibold text-[#404040]\">{{\n item.title\n }}</span>\n <p class=\"flex items-center\">\n <label for=\"phone\" class=\"text-[10px] font-light\">Status:</label>\n <span id=\"phone\" class=\"text-sm\">{{\n item.data.Status\n }}</span>\n </p>\n </div>\n\n <div class=\"grid gap-y-2\">\n <span for=\"role\" class=\"font-light\">{{\n item.data.WorkflowCode\n }}</span>\n\n <div (click)=\"$event.stopPropagation();\" class=\"flex items-end gap-4\">\n <a [routerLink]=\"[\n '/workflow/task-history',\n item.data.Code\n ]\" routerLinkActive=\"router-link-active\" class=\"underline text-[#0000FF] text-xs\">view\n history</a>\n\n <verben-pop-Up #popup [customStyles]=\"{ 'z-index': '99' }\" [enableMouseLeave]=\"false\"\n [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\" (dropdownOpenChange)=\"handlePopupClose($event);\">\n <verben-svg dropdown-trigger icon=\"dots\" [width]=\"3\" [height]=\"18\"\n class=\"cursor-pointer\"></verben-svg>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n @for (actionItem of getTableActions(item.data); track actionItem.label) {\n\n <verben-pop-Up #popup2 [customStyles]=\"{ 'z-index': '99' }\" [enableMouseLeave]=\"false\"\n [customStyles]=\"{\n border: '1px solid #d4a10780',\n borderRadius: '5px',\n backgroundColor: 'white'\n }\" (dropdownOpenChange)=\"handlePopupClose($event)\">\n <div (click)=\"actionItem.action(item.data)\" dropdown-trigger\n class=\"cursor-pointer py-2 px-3 hover:bg-primary\">\n {{ actionItem.label }}\n </div>\n <div class=\"bg-white rounded-sm\" dropdown-content>\n <div style=\"width: 16rem\">\n <div class=\"flex items-center gap-4 justify-between h-12 px-2 pt-4\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g opacity=\"0.6\">\n <path\n d=\"M6.74649 8.00338C6.91483 8.1347 7.0252 8.20455 7.11531 8.29396C7.98846 9.16222 8.85742 10.0347 9.72917 10.905C9.87167 11.0475 9.99391 11.1921 9.99321 11.4129C9.99251 11.6462 9.89472 11.8152 9.69564 11.9256C9.49307 12.038 9.2926 12.0206 9.10469 11.8899C9.03833 11.8438 8.98175 11.7845 8.92378 11.7272C7.85574 10.6592 6.79678 9.58203 5.71477 8.52867C5.3711 8.19407 5.38437 7.79173 5.70779 7.47599C6.7884 6.42123 7.84875 5.34551 8.91539 4.27607C9.11377 4.07769 9.32054 3.92262 9.623 4.04137C9.97924 4.18107 10.112 4.58901 9.89472 4.90335C9.82976 4.99765 9.74174 5.07728 9.66002 5.1597C8.80642 6.01469 7.95283 6.86968 7.09645 7.72257C7.01472 7.8043 6.91553 7.86856 6.74579 8.00408L6.74649 8.00338Z\"\n fill=\"black\" />\n </g>\n </svg>\n\n <h3 class=\"text-sm font-medium\">Select Assignee</h3>\n </div>\n\n <div class=\"grid gap-2 max-h-96 overflow-y-auto p-2\">\n <verben-drop-down label=\"Action\" styleClass=\"w-full\" width=\"100%\"\n [multiselect]=\"false\" [filter]=\"true\" [showClear]=\"true\"\n placeholder=\"Select Action\" [(options)]=\"nextActions\" id=\"actions\"\n optionLabel=\"Name\" [ngModel]=\"selectedAction | async\"\n (ngModelChange)=\"selectedAction.next($event)\" class=\"form-control\">\n </verben-drop-down>\n\n <verben-drop-down label=\"Actors\" styleClass=\"w-full\" width=\"100%\"\n [multiselect]=\"false\" [filter]=\"true\" [showClear]=\"true\"\n placeholder=\"Select Actor\" [(options)]=\"nextActors\" id=\"actors\"\n optionLabel=\"Name\" optionValue=\"Code\" [(ngModel)]=\"recipientCode\"\n class=\"form-control\">\n </verben-drop-down>\n\n <textarea [(ngModel)]=\"comment\" placeholder=\"Enter Comment\"\n class=\"w-full p-1 text-xs border border-primary rounded-md\" style=\"height: 8rem\"\n [cols]=\"8\"></textarea>\n\n <verbena-button [disable]=\"!comment\" [text]=\"activeActionType ?? ''\"\n (click)=\"handleAction(item.data, popup)\" class=\"text-xs w-full\"\n bgColor=\"#FFE681\" textColor=\"#404040\" borderRadius=\"10px\" fontSize=\"14px\"\n pd=\"10px 20px\" width=\"100%\" height=\"32px\">\n {{ activeActionType }}\n </verbena-button>\n </div>\n </div>\n </div>\n </verben-pop-Up>\n\n @if (actionItem.divider) {\n <hr class=\"bg-[#FFE681] h-1 rounded-xl border-0\" />\n } }\n </div>\n </verben-pop-Up>\n </div>\n </div>\n </div>\n\n <!-- <div class=\"flex\">\n <span class=\"font-normal text-sm\">{{ item.title }}</span>\n </div>\n @for (ciItem of item.body; track ciItem.value) {\n <div class=\"\">\n <span class=\"text-muted font-light text-xs\"\n >{{ ciItem.title }}:</span\n >\n <span class=\"text-black\">{{ ciItem.value }}</span>\n </div>\n } -->\n </div>\n </div>\n </div>\n </ng-template>\n </verben-left-card-data>\n </verben-left-card-data-view>\n\n <verben-right-card-data-view>\n <ng-template #parent>\n <!-- <lib-user-request-form\n [currentData]=\"currentData\"\n (switchView)=\"vdv.toggleView()\"\n (onApproval)=\"onApprove($event)\"\n ></lib-user-request-form> -->\n </ng-template>\n </verben-right-card-data-view>\n\n <verben-card-data-view-footer class=\"w-full\">\n <div [ngClass]=\"{\n 'flex gap-2 items-center': true,\n 'justify-end': true,\n }\">\n <!-- <verbena-button\n *ngIf=\"!vdcv.hasCurrentItem()\"\n [fontWeight]=\"'bold'\"\n [bgColor]=\"'#8E8D87'\"\n [borderRadius]=\"'4px'\"\n [textColor]=\"'#fff'\"\n [pd]=\"'9.79px 37.28px'\"\n [text]=\"'Delete'\"\n >\n </verbena-button> -->\n <div class=\"flex {{\n vdcv.hasCurrentItem() ? 'flex-1' : ''\n }} justify-end items-center gap-5\">\n <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n <button (click)=\"loadMore()\" class=\"load-more view-links text-[#3479E9] underline\">\n Load more\n </button>\n </div>\n </div>\n </verben-card-data-view-footer>\n </verben-card-data-view>\n </div>\n <div column-content>\n <lib-data-columns [columns]=\"config.columns\" (columnsUpdated)=\"onColumnsUpdated($event)\"></lib-data-columns>\n </div>\n <div filter-content>\n <verben-table-filter [border]=\"'1px solid rgba(212, 160, 7, 1)'\" borderRadius=\"10px\"\n boxShadow=\"2px 2px 2px 0px silver\" bgColor=\"white\" width=\"420px\" textColor=\"black\" pd=\"1rem\"\n primaryColor=\"#FFE681\" secondaryColor=\"#3479E9\" tertiaryColor=\"#404040\" [filterOptions]=\"filterArray\"\n [maxFilterLength]=\"3\"></verben-table-filter>\n </div>\n <div sort-content>\n <lib-data-sort [columns]=\"config.columns\" [data]=\"data()\" (sortApplied)=\"onSortUpdated($event)\"></lib-data-sort>\n </div>\n <div export-content>\n <lib-data-export [data]=\"data()\" (exportDataEvent)=\"handleExport($event)\">\n </lib-data-export>\n </div>\n </verben-data-view>\n\n <div *ngIf=\"vdv.isTableView\" class=\"flex gap-2 justify-end\">\n\n <div class=\"flex justify-end items-center gap-5\">\n <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n <button (click)=\"loadMore()\" class=\"load-more view-links text-[#3479E9] underline\">\n Load more\n </button>\n </div>\n </div>\n</div>\n\n<verben-dialogue [showCloseIcon]=\"true\" [dismissOutsideClick]=\"true\" [closeOnEscape]=\"true\" [mode]=\"'drawer'\"\n [padding]=\"'0px'\" [drawerWidth]=\"'400px'\" [disableFooter]=\"false\" [isVisible]=\"isModalVisible\" [modalData]=\"stageForm\"\n [headerTemplate]=\"headerTemplate\" [bodyTemplate]=\"bodyTemplate\" [showCloseIcon]=\"false\">\n</verben-dialogue>\n<ng-template #headerTemplate>\n <div class=\"bg-[#FFE681] px-6 py-4 flex justify-between items-center\">\n <h1>Form</h1>\n <verben-svg class=\"cursor-pointer\" [icon]=\"'close-circle'\" (click)=\"isModalVisible = false\" [width]=\"15\"\n [height]=\"15\" [stroke]=\"'#fff'\"></verben-svg>\n </div>\n</ng-template>\n\n<ng-template #bodyTemplate>\n <div>\n <div *ngIf=\"stageForm?.Entities?.[active]; else emptyState\" class=\"mt-4\">\n <form-control [dataType]=\"dataType\"\n [formProperties]=\"stageForm?.Entities?.[active]?.Properties ?? []\"></form-control>\n\n <div class=\"flex gap-3 justify-end\">\n <verbena-button class=\"verben-primary-button\" (click)=\"submitForm()\" [disable]=\"!areRequiredPropertiesFilled()\"\n text=\"Save\"></verbena-button>\n </div>\n </div>\n\n <!-- Empty state template -->\n <ng-template #emptyState>\n <p class=\"mt-4 p-4 text-gray-600 text-center\">\n No entries available for the selected form group.\n </p>\n </ng-template>\n </div>\n</ng-template>\n", styles: [".view-links{color:#3479e9;cursor:pointer}\n"] }]
|
|
1021
1021
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: MyQueueFacade }], propDecorators: { user: [{
|
|
1022
1022
|
type: Input
|
|
1023
1023
|
}] } });
|