bpm-core 0.0.78 → 0.0.79
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/lib/components/shared-components/form-field/control-value-accessor.directive.mjs +4 -1
- package/esm2022/lib/components/shared-components/form-field/toggle-button/toggle-button.component.mjs +16 -5
- package/esm2022/lib/testComponent/request-details-section/request-details-section.component.mjs +29 -19
- package/fesm2022/bpm-core.mjs +46 -22
- package/fesm2022/bpm-core.mjs.map +1 -1
- package/lib/components/shared-components/form-field/control-value-accessor.directive.d.ts +1 -0
- package/lib/components/shared-components/form-field/shared-imports.d.ts +3 -3
- package/lib/components/shared-components/form-field/toggle-button/toggle-button.component.d.ts +1 -0
- package/package.json +1 -1
package/fesm2022/bpm-core.mjs
CHANGED
|
@@ -1777,6 +1777,7 @@ class ControlValueAccessorDirective {
|
|
|
1777
1777
|
randomID;
|
|
1778
1778
|
multiple = false;
|
|
1779
1779
|
searchControl = new FormControl();
|
|
1780
|
+
toggleButtonControl = new FormControl();
|
|
1780
1781
|
employeeSearchControl = new FormControl();
|
|
1781
1782
|
telephoneControl = new FormControl();
|
|
1782
1783
|
attachments = [];
|
|
@@ -1847,6 +1848,7 @@ class ControlValueAccessorDirective {
|
|
|
1847
1848
|
this.startDateControl.reset();
|
|
1848
1849
|
this.endDateControl.reset();
|
|
1849
1850
|
this.telephoneControl.reset();
|
|
1851
|
+
this.toggleButtonControl.reset();
|
|
1850
1852
|
this.attachments = [];
|
|
1851
1853
|
this.searchControl.reset();
|
|
1852
1854
|
this.employeeSearchControl.reset();
|
|
@@ -1854,6 +1856,7 @@ class ControlValueAccessorDirective {
|
|
|
1854
1856
|
else {
|
|
1855
1857
|
this.startDateControl.setValue(this.value?.startDate);
|
|
1856
1858
|
this.endDateControl.setValue(this.value?.endDate);
|
|
1859
|
+
this.toggleButtonControl.setValue(value);
|
|
1857
1860
|
this.searchControl.setValue(value['value']);
|
|
1858
1861
|
this.telephoneControl.setValue(value);
|
|
1859
1862
|
if (this.value['value'] === '') {
|
|
@@ -3679,8 +3682,8 @@ class ToggleButtonComponent extends ControlValueAccessorDirective {
|
|
|
3679
3682
|
optionEn;
|
|
3680
3683
|
hasHint = false;
|
|
3681
3684
|
options;
|
|
3682
|
-
displayedLabel;
|
|
3683
|
-
key;
|
|
3685
|
+
displayedLabel = 'description';
|
|
3686
|
+
key = 'value';
|
|
3684
3687
|
destroyRef = inject(DestroyRef);
|
|
3685
3688
|
ngOnInit() {
|
|
3686
3689
|
super.ngOnInit();
|
|
@@ -3691,6 +3694,17 @@ class ToggleButtonComponent extends ControlValueAccessorDirective {
|
|
|
3691
3694
|
this.control.reset();
|
|
3692
3695
|
}
|
|
3693
3696
|
});
|
|
3697
|
+
this.toggleButtonControl.setValue(this.control.value?.key);
|
|
3698
|
+
this.toggleButtonControl.valueChanges.subscribe((ctrlValue) => {
|
|
3699
|
+
if (ctrlValue?.key) {
|
|
3700
|
+
this.toggleButtonControl.setValue(ctrlValue?.key);
|
|
3701
|
+
}
|
|
3702
|
+
});
|
|
3703
|
+
}
|
|
3704
|
+
setToggelButtonValue(hasHint, hintSection, item) {
|
|
3705
|
+
hasHint ? hintSection?.toggle() : null;
|
|
3706
|
+
this.control.setValue({ key: item[this.key], value: item[this.displayedLabel] });
|
|
3707
|
+
this.toggleButtonControl.setValue(item[this.key]);
|
|
3694
3708
|
}
|
|
3695
3709
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ToggleButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3696
3710
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ToggleButtonComponent, isStandalone: true, selector: "app-toggle-button", inputs: { className: "className", data: "data", error: "error", optionAr: "optionAr", optionEn: "optionEn", hasHint: "hasHint", options: "options", displayedLabel: "displayedLabel", key: "key" }, outputs: { onChange: "onChange" }, providers: [
|
|
@@ -3699,7 +3713,7 @@ class ToggleButtonComponent extends ControlValueAccessorDirective {
|
|
|
3699
3713
|
useExisting: forwardRef(() => ToggleButtonComponent),
|
|
3700
3714
|
multi: true,
|
|
3701
3715
|
},
|
|
3702
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"!
|
|
3716
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"!toggleButtonControl.hasValidator(Validators['required']) || !required\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n\r\n @if(options){\r\n <mat-button-toggle-group class=\"Toggle__buttons d-flex align-items-center gap-3\" [value]=\"toggleButtonControl.value\" [formControl]=\"toggleButtonControl\"\r\n aria-label=\"Font Style\" [multiple]=\"multiple\">\r\n @for(item of options; track item){\r\n <mat-button-toggle (click)=\"setToggelButtonValue(hasHint, hintSection, item)\" [value]=\"item[key]\" [satPopoverAnchor]=\"hintSection\">\r\n <span>\r\n {{item[displayedLabel]}}\r\n </span>\r\n <sat-popover #hintSection [hasBackdrop]=\" true\" verticalAlign=\"below\">\r\n <div class=\"default-tooltip\">\r\n <p class=\"m-0\" [innerHTML]=\"item[displayedLabel]\"></p>\r\n </div>\r\n </sat-popover>\r\n </mat-button-toggle>\r\n }\r\n\r\n </mat-button-toggle-group>\r\n }\r\n </ng-container>\r\n}\r\n\r\n@if(isReadOnly && toggleButtonControl.value){\r\n <ng-container>\r\n <app-info-item class=\"info-item w-100\" [insideTable]=\"insideTable\" [type]=\"'toggleBtn'\" [label]=\"label\" [value]=\"toggleButtonControl?.value\"></app-info-item>\r\n </ng-container>\r\n\r\n}\r\n", styles: [""], dependencies: [{ kind: "directive", type: MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$2.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: i1$2.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
3703
3717
|
}
|
|
3704
3718
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ToggleButtonComponent, decorators: [{
|
|
3705
3719
|
type: Component,
|
|
@@ -3714,7 +3728,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
|
|
|
3714
3728
|
useExisting: forwardRef(() => ToggleButtonComponent),
|
|
3715
3729
|
multi: true,
|
|
3716
3730
|
},
|
|
3717
|
-
], standalone: true, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"!
|
|
3731
|
+
], standalone: true, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"!toggleButtonControl.hasValidator(Validators['required']) || !required\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n\r\n @if(options){\r\n <mat-button-toggle-group class=\"Toggle__buttons d-flex align-items-center gap-3\" [value]=\"toggleButtonControl.value\" [formControl]=\"toggleButtonControl\"\r\n aria-label=\"Font Style\" [multiple]=\"multiple\">\r\n @for(item of options; track item){\r\n <mat-button-toggle (click)=\"setToggelButtonValue(hasHint, hintSection, item)\" [value]=\"item[key]\" [satPopoverAnchor]=\"hintSection\">\r\n <span>\r\n {{item[displayedLabel]}}\r\n </span>\r\n <sat-popover #hintSection [hasBackdrop]=\" true\" verticalAlign=\"below\">\r\n <div class=\"default-tooltip\">\r\n <p class=\"m-0\" [innerHTML]=\"item[displayedLabel]\"></p>\r\n </div>\r\n </sat-popover>\r\n </mat-button-toggle>\r\n }\r\n\r\n </mat-button-toggle-group>\r\n }\r\n </ng-container>\r\n}\r\n\r\n@if(isReadOnly && toggleButtonControl.value){\r\n <ng-container>\r\n <app-info-item class=\"info-item w-100\" [insideTable]=\"insideTable\" [type]=\"'toggleBtn'\" [label]=\"label\" [value]=\"toggleButtonControl?.value\"></app-info-item>\r\n </ng-container>\r\n\r\n}\r\n" }]
|
|
3718
3732
|
}], propDecorators: { className: [{
|
|
3719
3733
|
type: Input
|
|
3720
3734
|
}], data: [{
|
|
@@ -7401,20 +7415,26 @@ class RequestDetailsSectionComponent {
|
|
|
7401
7415
|
}
|
|
7402
7416
|
ngOnInit() {
|
|
7403
7417
|
this.createForm();
|
|
7404
|
-
this.
|
|
7405
|
-
|
|
7406
|
-
if (
|
|
7407
|
-
this.formGroup.
|
|
7408
|
-
this.requiredSearchable = true;
|
|
7409
|
-
console.log(this.requiredSearchable);
|
|
7418
|
+
let data = this.section.body.details;
|
|
7419
|
+
for (const key in data) {
|
|
7420
|
+
if (key !== 'decision') {
|
|
7421
|
+
this.formGroup.patchValue({ [key]: data[key] });
|
|
7410
7422
|
}
|
|
7411
|
-
|
|
7423
|
+
}
|
|
7424
|
+
// this.initializeTableConfig()
|
|
7425
|
+
/* this.formGroup.get('checkbox').valueChanges.subscribe(res=> {
|
|
7426
|
+
if (res){
|
|
7427
|
+
this.formGroup.get('customSearchable').setValidators(Validators.required)
|
|
7428
|
+
this.requiredSearchable = true;
|
|
7429
|
+
console.log(this.requiredSearchable)
|
|
7430
|
+
}else {
|
|
7412
7431
|
this.formGroup.get('customSearchable').clearValidators();
|
|
7413
|
-
this.requiredSearchable = false
|
|
7414
|
-
console.log(this.requiredSearchable)
|
|
7415
|
-
|
|
7416
|
-
|
|
7417
|
-
|
|
7432
|
+
this.requiredSearchable = false
|
|
7433
|
+
console.log(this.requiredSearchable)
|
|
7434
|
+
}
|
|
7435
|
+
this.formGroup.get('customSearchable').updateValueAndValidity();
|
|
7436
|
+
|
|
7437
|
+
})*/
|
|
7418
7438
|
}
|
|
7419
7439
|
initializeTableConfig() {
|
|
7420
7440
|
this.initializeColumns();
|
|
@@ -7455,12 +7475,16 @@ class RequestDetailsSectionComponent {
|
|
|
7455
7475
|
type: 'actions',
|
|
7456
7476
|
actions: [
|
|
7457
7477
|
{ viewMode: 'allocate', actionName: "Allocate", disabled: true },
|
|
7458
|
-
{
|
|
7478
|
+
{
|
|
7479
|
+
viewMode: 'edit', actionName: "Edit", action: "edit", onClick: (asset) => {
|
|
7459
7480
|
this.editAsset(asset);
|
|
7460
|
-
},
|
|
7461
|
-
|
|
7481
|
+
},
|
|
7482
|
+
},
|
|
7483
|
+
{
|
|
7484
|
+
viewMode: 'delete', actionName: "Delete", action: "delete", onClick: (asset) => {
|
|
7462
7485
|
this.deleteAsset(asset);
|
|
7463
|
-
},
|
|
7486
|
+
},
|
|
7487
|
+
},
|
|
7464
7488
|
{ viewMode: 'chart', actionName: "Chart", action: "chart" },
|
|
7465
7489
|
]
|
|
7466
7490
|
},
|
|
@@ -7606,7 +7630,7 @@ class RequestDetailsSectionComponent {
|
|
|
7606
7630
|
this.pageSize = event.pageSize;
|
|
7607
7631
|
}
|
|
7608
7632
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: RequestDetailsSectionComponent, deps: [{ token: CoreI18nService }, { token: i4.FormBuilder }, { token: ActionStateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7609
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: RequestDetailsSectionComponent, isStandalone: true, selector: "app-request-details-section", inputs: { isReadOnly: "isReadOnly", section: "section", form: "form", lov: "lov", className: "className" }, ngImport: i0, template: "<div>\r\n <form [ngClass]=\"{'form-section-divide form-section':!section?.header?.readOnly,'info-section':section?.header?.readOnly}\" [formGroup]=\"formGroup\">\r\n
|
|
7633
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: RequestDetailsSectionComponent, isStandalone: true, selector: "app-request-details-section", inputs: { isReadOnly: "isReadOnly", section: "section", form: "form", lov: "lov", className: "className" }, ngImport: i0, template: "<div>\r\n <form [ngClass]=\"{'form-section-divide form-section':!section?.header?.readOnly,'info-section':section?.header?.readOnly}\" [formGroup]=\"formGroup\">\r\n<!--\r\n <app-search-employee\r\n class=\"section-item full\"\r\n [multiple]=\"true\"\r\n [arrayList]=\"formGroup.get('searchEmployee').value\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"searchEmployee\"\r\n label=\"Search-employee\"></app-search-employee>\r\n <app-input class=\"section-item full\" [isReadOnly]=\"isReadOnly\" [loading]=\"true\" type=\"enOnly\" formControlName=\"input\" label=\"Input\"></app-input>\r\n <app-input-currency class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"currencyInput\" label=\"currency\"></app-input-currency>\r\n <app-input-email class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"emailInput\" label=\"email\"></app-input-email>\r\n <app-input-number class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"numberInput\" label=\"number\"></app-input-number>\r\n <app-custom-searchable\r\n class=\"section-item mb-0 full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"customSearchable\"\r\n label=\"Custom-searchable\"\r\n [options]=\"lov?.['approverActions']?.options\"\r\n [displayedLabel]=\"'name'\"\r\n [key]=\"'name'\"></app-custom-searchable>\r\n <app-checkbox\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"checkbox\"\r\n termsLabel=\"Terms and conditions\"\r\n label=\"check-box\"\r\n [containTerms]=\"true\"></app-checkbox>\r\n <app-textarea class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"textArea\" label=\"Text-area\"></app-textarea>\r\n <app-datepicker\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"datePicker\"\r\n [matSuffix]=\"true\"\r\n label=\"Date-picker\"></app-datepicker>\r\n <app-date-range-picker\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"datePickerRange\"\r\n label=\"Date-picker-range\"\r\n [matSuffix]=\"true\"></app-date-range-picker>\r\n <app-radio class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"radio\" [options]=\"options\" label=\"Radio\"></app-radio>-->\r\n <app-toggle-button\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"toggle\"\r\n [options]=\"lov?.['decision']?.options\"\r\n label=\"Toggle-button\"\r\n [displayedLabel]=\"'description'\"\r\n [key]=\"'value'\"></app-toggle-button>\r\n <!--<app-input-telephone class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"telephone\" label=\"Telephone\"></app-input-telephone>\r\n\r\n <app-file-uploader\r\n class=\"section-item full\"\r\n [callApi]=\"true\"\r\n [isReadOnly]=\"isReadOnly\"\r\n [multiple]=\"false\"\r\n label=\"attachment\"\r\n formControlName=\"attachment\"></app-file-uploader>\r\n <app-attachment-section\r\n class=\"section-item full\"\r\n [descriptionRequired]=\"false\"\r\n label=\"Attachment section\"\r\n [commentsRequired]=\"false\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"attachmentSection\"></app-attachment-section>\r\n-->\r\n\r\n\r\n <!-- <app-table\r\n [columnsConfig]=\"columnsConfig\"\r\n [columns]=\"columns\"\r\n [isError]=\"isError\"\r\n [isLoading]=\"isLoading\"\r\n [rows]=\"categoryData\" [hasPaginator]=\"true\"\r\n [pageSize]=\"pageSize\" [currentPage]=\"pageNumber\"\r\n [totalElements]=\"totalElements\"\r\n (pageChange)=\"pageChanged($event)\"\r\n class=\"new-primary-table full\">\r\n </app-table> -->\r\n\r\n\r\n </form>\r\n\r\n\r\n</div>\r\n@if (!section?.header?.readOnly) {\r\n <div class=\"mt-4\">\r\n <lib-action-buttons\r\n [lovOptions]=\"lov?.['decision']?.options\"\r\n [lovType]=\"lov?.['decision']?.type\"\r\n [section]=\"section\"\r\n [form]=\"form\"\r\n [sections]=\"form.sections\"\r\n [showApprovalCycle]=\"true\"\r\n [customCall]=\"false\"\r\n [fieldsForm]=\"formGroup\"\r\n (customCallEmit)=\"customCallSubmit($event)\"\r\n (resetFormEmit)=\"resetForm()\"\r\n />\r\n </div>\r\n}\r\n", styles: [".form-section-divide{--form-section-columns: 1fr 1fr}@media (max-width: 756px){.form-section-divide{--form-section-columns: 100%}}.form-section-divide .full{grid-column:1/-1}.head-title{position:relative;margin-bottom:12px}.head-title h3{display:inline-block;color:#8e9aa0;font-size:14px;font-weight:500;background-color:#fff;padding-inline-end:20px;position:relative;z-index:2;margin:0}.head-title:after{content:\"\";position:absolute;width:100%;height:1px;background-color:#dee0e2;top:50%;left:0;right:0;transform:translateY(-50%);z-index:1}.chamber{margin-bottom:20px}.chamber .chamber-content{background-color:#f8f8f8;padding:20px}.chamber .chamber-content .chamber-select{display:flex}.chamber .chamber-content mat-checkbox{font-size:14px}.section-item{margin-bottom:20px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ActionButtonsComponent, selector: "lib-action-buttons", inputs: ["lovOptions", "lovType", "fieldsForm", "form", "section", "sections", "showApprovalCycle", "customCall"], outputs: ["resetFormEmit", "customCallEmit"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ToggleButtonComponent, selector: "app-toggle-button", inputs: ["className", "data", "error", "optionAr", "optionEn", "hasHint", "options", "displayedLabel", "key"], outputs: ["onChange"] }] });
|
|
7610
7634
|
}
|
|
7611
7635
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: RequestDetailsSectionComponent, decorators: [{
|
|
7612
7636
|
type: Component,
|
|
@@ -7631,7 +7655,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
|
|
|
7631
7655
|
AttachmentSectionComponent,
|
|
7632
7656
|
TableComponent,
|
|
7633
7657
|
TranslatePipe
|
|
7634
|
-
], template: "<div>\r\n <form [ngClass]=\"{'form-section-divide form-section':!section?.header?.readOnly,'info-section':section?.header?.readOnly}\" [formGroup]=\"formGroup\">\r\n
|
|
7658
|
+
], template: "<div>\r\n <form [ngClass]=\"{'form-section-divide form-section':!section?.header?.readOnly,'info-section':section?.header?.readOnly}\" [formGroup]=\"formGroup\">\r\n<!--\r\n <app-search-employee\r\n class=\"section-item full\"\r\n [multiple]=\"true\"\r\n [arrayList]=\"formGroup.get('searchEmployee').value\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"searchEmployee\"\r\n label=\"Search-employee\"></app-search-employee>\r\n <app-input class=\"section-item full\" [isReadOnly]=\"isReadOnly\" [loading]=\"true\" type=\"enOnly\" formControlName=\"input\" label=\"Input\"></app-input>\r\n <app-input-currency class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"currencyInput\" label=\"currency\"></app-input-currency>\r\n <app-input-email class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"emailInput\" label=\"email\"></app-input-email>\r\n <app-input-number class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"numberInput\" label=\"number\"></app-input-number>\r\n <app-custom-searchable\r\n class=\"section-item mb-0 full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"customSearchable\"\r\n label=\"Custom-searchable\"\r\n [options]=\"lov?.['approverActions']?.options\"\r\n [displayedLabel]=\"'name'\"\r\n [key]=\"'name'\"></app-custom-searchable>\r\n <app-checkbox\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"checkbox\"\r\n termsLabel=\"Terms and conditions\"\r\n label=\"check-box\"\r\n [containTerms]=\"true\"></app-checkbox>\r\n <app-textarea class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"textArea\" label=\"Text-area\"></app-textarea>\r\n <app-datepicker\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"datePicker\"\r\n [matSuffix]=\"true\"\r\n label=\"Date-picker\"></app-datepicker>\r\n <app-date-range-picker\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"datePickerRange\"\r\n label=\"Date-picker-range\"\r\n [matSuffix]=\"true\"></app-date-range-picker>\r\n <app-radio class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"radio\" [options]=\"options\" label=\"Radio\"></app-radio>-->\r\n <app-toggle-button\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"toggle\"\r\n [options]=\"lov?.['decision']?.options\"\r\n label=\"Toggle-button\"\r\n [displayedLabel]=\"'description'\"\r\n [key]=\"'value'\"></app-toggle-button>\r\n <!--<app-input-telephone class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"telephone\" label=\"Telephone\"></app-input-telephone>\r\n\r\n <app-file-uploader\r\n class=\"section-item full\"\r\n [callApi]=\"true\"\r\n [isReadOnly]=\"isReadOnly\"\r\n [multiple]=\"false\"\r\n label=\"attachment\"\r\n formControlName=\"attachment\"></app-file-uploader>\r\n <app-attachment-section\r\n class=\"section-item full\"\r\n [descriptionRequired]=\"false\"\r\n label=\"Attachment section\"\r\n [commentsRequired]=\"false\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"attachmentSection\"></app-attachment-section>\r\n-->\r\n\r\n\r\n <!-- <app-table\r\n [columnsConfig]=\"columnsConfig\"\r\n [columns]=\"columns\"\r\n [isError]=\"isError\"\r\n [isLoading]=\"isLoading\"\r\n [rows]=\"categoryData\" [hasPaginator]=\"true\"\r\n [pageSize]=\"pageSize\" [currentPage]=\"pageNumber\"\r\n [totalElements]=\"totalElements\"\r\n (pageChange)=\"pageChanged($event)\"\r\n class=\"new-primary-table full\">\r\n </app-table> -->\r\n\r\n\r\n </form>\r\n\r\n\r\n</div>\r\n@if (!section?.header?.readOnly) {\r\n <div class=\"mt-4\">\r\n <lib-action-buttons\r\n [lovOptions]=\"lov?.['decision']?.options\"\r\n [lovType]=\"lov?.['decision']?.type\"\r\n [section]=\"section\"\r\n [form]=\"form\"\r\n [sections]=\"form.sections\"\r\n [showApprovalCycle]=\"true\"\r\n [customCall]=\"false\"\r\n [fieldsForm]=\"formGroup\"\r\n (customCallEmit)=\"customCallSubmit($event)\"\r\n (resetFormEmit)=\"resetForm()\"\r\n />\r\n </div>\r\n}\r\n", styles: [".form-section-divide{--form-section-columns: 1fr 1fr}@media (max-width: 756px){.form-section-divide{--form-section-columns: 100%}}.form-section-divide .full{grid-column:1/-1}.head-title{position:relative;margin-bottom:12px}.head-title h3{display:inline-block;color:#8e9aa0;font-size:14px;font-weight:500;background-color:#fff;padding-inline-end:20px;position:relative;z-index:2;margin:0}.head-title:after{content:\"\";position:absolute;width:100%;height:1px;background-color:#dee0e2;top:50%;left:0;right:0;transform:translateY(-50%);z-index:1}.chamber{margin-bottom:20px}.chamber .chamber-content{background-color:#f8f8f8;padding:20px}.chamber .chamber-content .chamber-select{display:flex}.chamber .chamber-content mat-checkbox{font-size:14px}.section-item{margin-bottom:20px}\n"] }]
|
|
7635
7659
|
}], ctorParameters: () => [{ type: CoreI18nService }, { type: i4.FormBuilder }, { type: ActionStateService }], propDecorators: { isReadOnly: [{
|
|
7636
7660
|
type: Input
|
|
7637
7661
|
}], section: [{
|