@unifylib/ui-lib 1.2.10 → 1.2.12
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/action-confirmation/action-confirmation.component.mjs +2 -2
- package/esm2022/lib/components/base-form-canvas/base-form-canvas.component.mjs +4 -2
- package/esm2022/lib/components/multi-auto-complete/multi-auto-complete.component.mjs +16 -11
- package/esm2022/lib/components/section-form-canvas/section-form-canvas.component.mjs +9 -3
- package/fesm2022/unifylib-ui-lib.mjs +27 -14
- package/fesm2022/unifylib-ui-lib.mjs.map +1 -1
- package/lib/components/base-form-canvas/base-form-canvas.component.d.ts +1 -1
- package/lib/components/section-form-canvas/section-form-canvas.component.d.ts +3 -1
- package/package.json +1 -1
|
@@ -83,7 +83,7 @@ class ActionConfirmationComponent {
|
|
|
83
83
|
this.listMessages = this.data.listMessages || [];
|
|
84
84
|
this.extraWarningMsg = this.data.extraWarningMsg || '';
|
|
85
85
|
this.currentDirection = this.data.direction;
|
|
86
|
-
this.isListMessagesTranslatable = this.data.isListMessagesTranslatable;
|
|
86
|
+
this.isListMessagesTranslatable = this.data.isListMessagesTranslatable ?? true;
|
|
87
87
|
this.icon = this.data.icon || { name: 'check_circle', color: '#0d7d6a' };
|
|
88
88
|
}
|
|
89
89
|
commentAndClose() {
|
|
@@ -1405,15 +1405,20 @@ class MultiAutoCompleteComponent {
|
|
|
1405
1405
|
}));
|
|
1406
1406
|
}
|
|
1407
1407
|
filterRequest.columns = ['id', 'code', 'englishName', 'arabicName'];
|
|
1408
|
-
this.
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1408
|
+
if (!this.field.readonly) {
|
|
1409
|
+
this.backendService.getLookupItemsByMultiFilter(listItems, filterRequest).subscribe((resp => {
|
|
1410
|
+
if (resp.valid) {
|
|
1411
|
+
this.lookupItems = this.field.includeAllOption ? [ALL_ITEM].concat(resp.body) : resp.body;
|
|
1412
|
+
if (!this.form.get('id')?.value) {
|
|
1413
|
+
this.patchLookupValue(this.lookupItems?.find(l => l.defaultValue));
|
|
1414
|
+
}
|
|
1415
|
+
this.patchLookupValue(this.multiControl.value);
|
|
1413
1416
|
}
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
+
}));
|
|
1418
|
+
}
|
|
1419
|
+
else {
|
|
1420
|
+
this.patchLookupValue(this.multiControl.value);
|
|
1421
|
+
}
|
|
1417
1422
|
}
|
|
1418
1423
|
selected(value) {
|
|
1419
1424
|
if (value.id !== -1 && this.selectedItems.findIndex(i => i.id === value.id) === -1) {
|
|
@@ -1530,7 +1535,7 @@ class MultiAutoCompleteComponent {
|
|
|
1530
1535
|
return this.field.property;
|
|
1531
1536
|
}
|
|
1532
1537
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MultiAutoCompleteComponent, deps: [{ token: BackendService }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1533
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: MultiAutoCompleteComponent, isStandalone: true, selector: "app-multi-auto-complete", inputs: { field: "field", form: "form", defaultValue: "defaultValue", pathParam: "pathParam", readonly: "readonly" }, outputs: { selectedValue: "selectedValue" }, viewQueries: [{ propertyName: "itemInput", first: true, predicate: ["itemInput"], descendants: true }, { propertyName: "matACTrigger", first: true, predicate: ["autocompleteTrigger"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"this.field\" class=\"main-multi-auto\">\r\n <div class=\"matField\">\r\n <mat-form-field class=\"full-width\" appearance=\"outline\" floatLabel=\"always\">\r\n <mat-label>{{ getLabel() }}</mat-label>\r\n <mat-chip-listbox #chipList [selectable]=\"true\">\r\n <mat-chip\r\n *ngFor=\"let item of selectedItems\"\r\n [removable]=\"true\"\r\n (removed)=\"remove(item)\">\r\n {{ itemNameByLag(item) }}\r\n <mat-icon matChipRemove>cancel</mat-icon>\r\n </mat-chip>\r\n <input class=\"chip-input\" type=\"text\"\r\n [id]=\"getId()\" #itemInput\r\n [formControl]=\"multiControl\"\r\n [matAutocomplete]=\"auto\" matInput\r\n [readonly]=\"readonly\"\r\n [required]=\"isRequired\"\r\n (keydown)=\"onKeydown($event, autocompleteTrigger)\"\r\n [disabled]=\"field.readonly\"\r\n #autocompleteTrigger=\"matAutocompleteTrigger\"\r\n [attr.aria-describedby]=\"matErrorDescribedBy\"\r\n >\r\n </mat-chip-listbox>\r\n\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n class=\"arrow_drop_down_autocomplete\"\r\n [attr.aria-label]=\"'BASE_TABLE.openLookupOptions' | translate\"\r\n (click)=\"openLookupPanel(autocompleteTrigger)\">\r\n <mat-icon aria-hidden=\"true\">arrow_drop_down</mat-icon>\r\n </button>\r\n <mat-autocomplete #auto=\"matAutocomplete\" autoActiveFirstOption [displayWith]=\"displayFn\"\r\n (optionSelected)=\"selected($event.option.value)\">\r\n <ng-container *ngIf=\"!field.readonly\">\r\n <mat-option *ngFor=\"let item of lookupItems$ | async\" [value]=\"item\"\r\n [disabled]=\"field.readonly || isSelected(item)\">\r\n {{ itemNameByLag(item) }}\r\n </mat-option>\r\n </ng-container>\r\n </mat-autocomplete>\r\n <ng-content select=\"mat-error\"></ng-content>\r\n </mat-form-field>\r\n </div>\r\n</ng-container>\r\n", styles: ["::ng-deep .main-multi-auto{.matField{margin-bottom:24px!important;.mat-form-field-wrapper{padding:0!important;margin-bottom:0!important}}}.full-width{width:100%}.chip-input{flex:1 1 auto}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i4.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "directive", type: i4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: MatOption$1, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
|
|
1538
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: MultiAutoCompleteComponent, isStandalone: true, selector: "app-multi-auto-complete", inputs: { field: "field", form: "form", defaultValue: "defaultValue", pathParam: "pathParam", readonly: "readonly" }, outputs: { selectedValue: "selectedValue" }, viewQueries: [{ propertyName: "itemInput", first: true, predicate: ["itemInput"], descendants: true }, { propertyName: "matACTrigger", first: true, predicate: ["autocompleteTrigger"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"this.field\" class=\"main-multi-auto\">\r\n <div class=\"matField\">\r\n <mat-form-field class=\"full-width\" appearance=\"outline\" floatLabel=\"always\">\r\n <mat-label>{{ getLabel() }}</mat-label>\r\n <mat-chip-listbox #chipList [selectable]=\"true\">\r\n <mat-chip\r\n *ngFor=\"let item of selectedItems\"\r\n [removable]=\"true\"\r\n (removed)=\"remove(item)\">\r\n {{ itemNameByLag(item) }}\r\n <mat-icon *ngIf=\"!this.field.readonly\" matChipRemove>cancel</mat-icon>\r\n </mat-chip>\r\n <input class=\"chip-input\" type=\"text\"\r\n [id]=\"getId()\" #itemInput\r\n [formControl]=\"multiControl\"\r\n [matAutocomplete]=\"auto\" matInput\r\n [readonly]=\"readonly\"\r\n [required]=\"isRequired\"\r\n (keydown)=\"onKeydown($event, autocompleteTrigger)\"\r\n [disabled]=\"field.readonly\"\r\n #autocompleteTrigger=\"matAutocompleteTrigger\"\r\n [attr.aria-describedby]=\"matErrorDescribedBy\"\r\n >\r\n </mat-chip-listbox>\r\n\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n class=\"arrow_drop_down_autocomplete\"\r\n [attr.aria-label]=\"'BASE_TABLE.openLookupOptions' | translate\"\r\n (click)=\"openLookupPanel(autocompleteTrigger)\">\r\n <mat-icon aria-hidden=\"true\">arrow_drop_down</mat-icon>\r\n </button>\r\n <mat-autocomplete #auto=\"matAutocomplete\" autoActiveFirstOption [displayWith]=\"displayFn\"\r\n (optionSelected)=\"selected($event.option.value)\">\r\n <ng-container *ngIf=\"!field.readonly\">\r\n <mat-option *ngFor=\"let item of lookupItems$ | async\" [value]=\"item\"\r\n [disabled]=\"field.readonly || isSelected(item)\">\r\n {{ itemNameByLag(item) }}\r\n </mat-option>\r\n </ng-container>\r\n </mat-autocomplete>\r\n <ng-content select=\"mat-error\"></ng-content>\r\n </mat-form-field>\r\n </div>\r\n</ng-container>\r\n", styles: ["::ng-deep .main-multi-auto{.matField{margin-bottom:24px!important;.mat-form-field-wrapper{padding:0!important;margin-bottom:0!important}}}.full-width{width:100%}.chip-input{flex:1 1 auto}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i4.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "directive", type: i4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: MatOption$1, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
|
|
1534
1539
|
}
|
|
1535
1540
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MultiAutoCompleteComponent, decorators: [{
|
|
1536
1541
|
type: Component,
|
|
@@ -1554,7 +1559,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
1554
1559
|
MatLabel,
|
|
1555
1560
|
MatIconButton,
|
|
1556
1561
|
TranslateModule,
|
|
1557
|
-
], template: "<ng-container *ngIf=\"this.field\" class=\"main-multi-auto\">\r\n <div class=\"matField\">\r\n <mat-form-field class=\"full-width\" appearance=\"outline\" floatLabel=\"always\">\r\n <mat-label>{{ getLabel() }}</mat-label>\r\n <mat-chip-listbox #chipList [selectable]=\"true\">\r\n <mat-chip\r\n *ngFor=\"let item of selectedItems\"\r\n [removable]=\"true\"\r\n (removed)=\"remove(item)\">\r\n {{ itemNameByLag(item) }}\r\n <mat-icon matChipRemove>cancel</mat-icon>\r\n </mat-chip>\r\n <input class=\"chip-input\" type=\"text\"\r\n [id]=\"getId()\" #itemInput\r\n [formControl]=\"multiControl\"\r\n [matAutocomplete]=\"auto\" matInput\r\n [readonly]=\"readonly\"\r\n [required]=\"isRequired\"\r\n (keydown)=\"onKeydown($event, autocompleteTrigger)\"\r\n [disabled]=\"field.readonly\"\r\n #autocompleteTrigger=\"matAutocompleteTrigger\"\r\n [attr.aria-describedby]=\"matErrorDescribedBy\"\r\n >\r\n </mat-chip-listbox>\r\n\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n class=\"arrow_drop_down_autocomplete\"\r\n [attr.aria-label]=\"'BASE_TABLE.openLookupOptions' | translate\"\r\n (click)=\"openLookupPanel(autocompleteTrigger)\">\r\n <mat-icon aria-hidden=\"true\">arrow_drop_down</mat-icon>\r\n </button>\r\n <mat-autocomplete #auto=\"matAutocomplete\" autoActiveFirstOption [displayWith]=\"displayFn\"\r\n (optionSelected)=\"selected($event.option.value)\">\r\n <ng-container *ngIf=\"!field.readonly\">\r\n <mat-option *ngFor=\"let item of lookupItems$ | async\" [value]=\"item\"\r\n [disabled]=\"field.readonly || isSelected(item)\">\r\n {{ itemNameByLag(item) }}\r\n </mat-option>\r\n </ng-container>\r\n </mat-autocomplete>\r\n <ng-content select=\"mat-error\"></ng-content>\r\n </mat-form-field>\r\n </div>\r\n</ng-container>\r\n", styles: ["::ng-deep .main-multi-auto{.matField{margin-bottom:24px!important;.mat-form-field-wrapper{padding:0!important;margin-bottom:0!important}}}.full-width{width:100%}.chip-input{flex:1 1 auto}\n"] }]
|
|
1562
|
+
], template: "<ng-container *ngIf=\"this.field\" class=\"main-multi-auto\">\r\n <div class=\"matField\">\r\n <mat-form-field class=\"full-width\" appearance=\"outline\" floatLabel=\"always\">\r\n <mat-label>{{ getLabel() }}</mat-label>\r\n <mat-chip-listbox #chipList [selectable]=\"true\">\r\n <mat-chip\r\n *ngFor=\"let item of selectedItems\"\r\n [removable]=\"true\"\r\n (removed)=\"remove(item)\">\r\n {{ itemNameByLag(item) }}\r\n <mat-icon *ngIf=\"!this.field.readonly\" matChipRemove>cancel</mat-icon>\r\n </mat-chip>\r\n <input class=\"chip-input\" type=\"text\"\r\n [id]=\"getId()\" #itemInput\r\n [formControl]=\"multiControl\"\r\n [matAutocomplete]=\"auto\" matInput\r\n [readonly]=\"readonly\"\r\n [required]=\"isRequired\"\r\n (keydown)=\"onKeydown($event, autocompleteTrigger)\"\r\n [disabled]=\"field.readonly\"\r\n #autocompleteTrigger=\"matAutocompleteTrigger\"\r\n [attr.aria-describedby]=\"matErrorDescribedBy\"\r\n >\r\n </mat-chip-listbox>\r\n\r\n <button\r\n type=\"button\"\r\n mat-icon-button\r\n class=\"arrow_drop_down_autocomplete\"\r\n [attr.aria-label]=\"'BASE_TABLE.openLookupOptions' | translate\"\r\n (click)=\"openLookupPanel(autocompleteTrigger)\">\r\n <mat-icon aria-hidden=\"true\">arrow_drop_down</mat-icon>\r\n </button>\r\n <mat-autocomplete #auto=\"matAutocomplete\" autoActiveFirstOption [displayWith]=\"displayFn\"\r\n (optionSelected)=\"selected($event.option.value)\">\r\n <ng-container *ngIf=\"!field.readonly\">\r\n <mat-option *ngFor=\"let item of lookupItems$ | async\" [value]=\"item\"\r\n [disabled]=\"field.readonly || isSelected(item)\">\r\n {{ itemNameByLag(item) }}\r\n </mat-option>\r\n </ng-container>\r\n </mat-autocomplete>\r\n <ng-content select=\"mat-error\"></ng-content>\r\n </mat-form-field>\r\n </div>\r\n</ng-container>\r\n", styles: ["::ng-deep .main-multi-auto{.matField{margin-bottom:24px!important;.mat-form-field-wrapper{padding:0!important;margin-bottom:0!important}}}.full-width{width:100%}.chip-input{flex:1 1 auto}\n"] }]
|
|
1558
1563
|
}], ctorParameters: () => [{ type: BackendService }, { type: i2.TranslateService }], propDecorators: { itemInput: [{
|
|
1559
1564
|
type: ViewChild,
|
|
1560
1565
|
args: ['itemInput']
|
|
@@ -2264,8 +2269,9 @@ class BaseFormCanvasComponent {
|
|
|
2264
2269
|
if (v) {
|
|
2265
2270
|
let split = v.split(":");
|
|
2266
2271
|
fromTime.setHours(split[0], split[1]);
|
|
2272
|
+
return new Date(fromTime.getTime());
|
|
2267
2273
|
}
|
|
2268
|
-
return
|
|
2274
|
+
return "";
|
|
2269
2275
|
}
|
|
2270
2276
|
patchLookupValue($event, fieldName) {
|
|
2271
2277
|
if ($event?.id !== -1 && this.defaults) {
|
|
@@ -2312,6 +2318,7 @@ class BaseFormCanvasComponent {
|
|
|
2312
2318
|
return x;
|
|
2313
2319
|
}
|
|
2314
2320
|
showMultiSelectValuesAsReadonly(field) {
|
|
2321
|
+
console.log(".03151251564");
|
|
2315
2322
|
const viewProp = this.translateService.getDefaultLang() === 'en' ? 'englishName' : 'arabicName';
|
|
2316
2323
|
return this.extractFieldName(this.defaults, field.property)?.map((a) => a[viewProp]);
|
|
2317
2324
|
}
|
|
@@ -5012,6 +5019,7 @@ class SectionFormCanvasComponent {
|
|
|
5012
5019
|
this.hideToggle = true;
|
|
5013
5020
|
this.isExpanded = true;
|
|
5014
5021
|
this.alwaysOpen = true;
|
|
5022
|
+
this.attachmentEmitter = new EventEmitter();
|
|
5015
5023
|
this.expansionHeaderTabIndex = -1;
|
|
5016
5024
|
this.actionEdit = new EventEmitter();
|
|
5017
5025
|
this.formEdit = new EventEmitter();
|
|
@@ -5038,8 +5046,11 @@ class SectionFormCanvasComponent {
|
|
|
5038
5046
|
getMenuButtons() {
|
|
5039
5047
|
return this.buttons.filter(btn => btn.id !== 'download');
|
|
5040
5048
|
}
|
|
5049
|
+
attachmentHandler($event) {
|
|
5050
|
+
this.attachmentEmitter.emit($event);
|
|
5051
|
+
}
|
|
5041
5052
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SectionFormCanvasComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5042
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SectionFormCanvasComponent, isStandalone: true, selector: "lib-section-form-canvas", inputs: { pageInfo: "pageInfo", fields: "fields", itemId: "itemId", editable: "editable", hideBackButton: "hideBackButton", item: "item", title: "title", subtitle: "subtitle", isTranslateTitle: "isTranslateTitle", isTranslateSubtitle: "isTranslateSubtitle", key: "key", hideToggle: "hideToggle", isExpanded: "isExpanded", alwaysOpen: "alwaysOpen", expansionHeaderTabIndex: "expansionHeaderTabIndex", buttons: "buttons", itemStatus: "itemStatus" }, outputs: { actionEdit: "actionEdit", formEdit: "formEdit", buttonClicked: "buttonClicked" }, ngImport: i0, template: "<mat-expansion-panel class=\"location-card\"\r\n #panel=\"matExpansionPanel\"\r\n [expanded]=\"isExpanded\"\r\n [hideToggle]=\"hideToggle\"\r\n (opened)=\"alwaysOpen ? panel.open() : null\"\r\n (closed)=\"alwaysOpen ? panel.open() : null\">\r\n <mat-expansion-panel-header\r\n class=\"card-header\"\r\n (click)=\"toggleExpand()\"\r\n [tabIndex]=\"expansionHeaderTabIndex\">\r\n <mat-panel-title>\r\n <div class=\"title-container\">\r\n <h3 class=\"card-title\" *ngIf=\"isTranslateTitle\">\r\n {{ pageInfo.labelsSection + '.' + title | translate }}\r\n </h3>\r\n <h3 class=\"card-title\" *ngIf=\"!isTranslateTitle\">{{ title }}</h3>\r\n <p class=\"card-subtitle\" *ngIf=\"subtitle\">\r\n <span *ngIf=\"isTranslateSubtitle\">{{ pageInfo.labelsSection + '.' + subtitle | translate }}</span>\r\n <span *ngIf=\"!isTranslateSubtitle\">{{ subtitle }}</span>\r\n </p>\r\n <button\r\n mat-button\r\n *ngIf=\"itemStatus\"\r\n type=\"button\"\r\n class=\"stateType\"\r\n [ngClass]=\"itemStatus\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\">\r\n {{ pageInfo.labelsSection + '.' + itemStatus | translate }}\r\n </button>\r\n </div>\r\n </mat-panel-title>\r\n\r\n <mat-panel-description class=\"panel-description\" *ngIf=\"buttons && buttons.length > 0\">\r\n <div class=\"row flex-auto buttons-wrapper desktop-buttons\" [class.show-on-mobile]=\"!getDownloadButton()\">\r\n <button\r\n mat-flat-button\r\n *ngFor=\"let btn of buttons\"\r\n type=\"button\"\r\n [color]=\"btn.color || 'primary'\"\r\n (click)=\"onButtonClick(btn , key); $event.stopPropagation()\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-none-background-primary action\"\r\n [attr.id]=\"btn.id || ('section-btn-' + (btn.action || btn.label || btn.key))\"\r\n >\r\n <div class=\"button-text\">\r\n <mat-icon *ngIf=\"btn.icon\">{{ btn.icon }}</mat-icon>\r\n <span>{{ btn.label | translate }}</span>\r\n </div>\r\n </button>\r\n </div>\r\n \r\n <div class=\"mobile-buttons\" *ngIf=\"getDownloadButton()\">\r\n <button\r\n mat-flat-button\r\n type=\"button\"\r\n color=\"primary\"\r\n (click)=\"onButtonClick(getDownloadButton()!, key); $event.stopPropagation()\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-download-mobile\"\r\n [attr.id]=\"getDownloadButton()?.id\"\r\n [attr.aria-label]=\"'BASE_TABLE.downloadAction' | translate\"\r\n >\r\n <mat-icon aria-hidden=\"true\">{{ getDownloadButton()?.icon }}</mat-icon>\r\n </button>\r\n <button\r\n *ngIf=\"getMenuButtons().length > 0\"\r\n mat-stroked-button\r\n type=\"button\"\r\n [matMenuTriggerFor]=\"menu\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-menu-mobile\"\r\n >\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n <button\r\n mat-menu-item\r\n *ngFor=\"let btn of getMenuButtons()\"\r\n (click)=\"onButtonClick(btn, key); $event.stopPropagation()\"\r\n [attr.id]=\"btn.id\"\r\n >\r\n <mat-icon>{{ btn.icon }}</mat-icon>\r\n <span>{{ btn.label | translate }}</span>\r\n </button>\r\n </mat-menu>\r\n </div>\r\n </mat-panel-description>\r\n </mat-expansion-panel-header>\r\n <div class=\"panel-body\">\r\n <hr class=\"divider\"/>\r\n <ng-content></ng-content>\r\n <app-base-form-canvas\r\n [pageInfo]=\"pageInfo\"\r\n [fields]=\"fields\"\r\n [editable]=\"editable\"\r\n [item]=\"item\"\r\n (formUpdated)=\"formUpdated($event)\"\r\n ></app-base-form-canvas>\r\n </div>\r\n</mat-expansion-panel>\r\n", styles: [".location-card{border:1px solid #dcdcdc;border-radius:8px;background:#fff;margin:18px auto;overflow:hidden}.location-card .mat-expansion-panel-header{padding:0 15px}.location-card .mat-expansion-panel-header ::ng-deep .mat-content{margin:0!important}@media (max-width: 450px){.location-card .mat-expansion-panel-header ::ng-deep .mat-content{flex-direction:column!important;align-items:stretch;gap:12px}.location-card .panel-description{justify-content:flex-start!important;width:100%}.location-card .buttons-wrapper{justify-content:flex-start;width:100%}}.location-card .panel-body{padding:20px 15px;padding-top:0!important}.location-card .panel-body ::ng-deep app-base-form-canvas .main-form-canvas{margin-top:20px!important}.location-card .panel-description{justify-content:end!important;margin:0!important}.location-card .card-header{display:flex;justify-content:space-between;align-items:center;padding:16px!important;cursor:default}.location-card .card-header .title-container{display:flex;flex-direction:column;gap:8px;align-items:flex-start;justify-content:center}.location-card .card-header .card-title{margin:0;font-size:24px;font-weight:700;line-height:1.2;color:#000;width:fit-content;white-space:nowrap}.location-card .card-header .card-subtitle{margin:0;font-family:lusail-light,sans-serif;font-weight:300;font-size:16px;line-height:1.2;color:#888;width:fit-content}.location-card .card-header .btn-edit{width:120px;min-height:32px!important;border-radius:9999px!important;font-size:16px!important}.location-card .card-header .expand-icon{color:#339dff;font-size:16px}.location-card .divider{border:none;border-top:2px solid var(--primary-color-3nd);margin-bottom:20px;margin-top:0}.flex-auto{flex:1 1 auto;display:flex;flex-direction:column}.row{display:flex;flex-direction:row;width:100%}.gap-20{gap:20px}.buttons-wrapper{display:flex;text-align-last:end;margin:0!important;gap:16px;justify-content:flex-end}.buttons-wrapper .action{min-height:44px!important;min-width:135px!important;width:auto!important}.button-text span{font-size:18px}.button-text mat-icon{font-size:18px!important}.btn-none-background-primary{margin:0!important}@media (max-width: 768px){.desktop-buttons{display:none!important}.desktop-buttons.show-on-mobile{display:flex!important}.mobile-buttons{display:flex;gap:12px;align-items:center;justify-content:flex-end}.btn-download-mobile{width:45px!important;height:44px!important;min-width:45px!important;padding:0!important;border-radius:8px!important;background:#0d4261!important;display:flex;align-items:center;justify-content:center}.btn-download-mobile mat-icon{color:#fff!important;font-size:24px!important;width:24px!important;height:28px!important;margin:0!important}.btn-download-mobile .mdc-button__label{padding:0!important}.btn-menu-mobile{width:44px!important;height:44px!important;min-width:44px!important;padding:0!important;border-radius:8px!important;border:1px solid #3e627b!important;background:#fff!important;display:flex;align-items:center;justify-content:center}.btn-menu-mobile mat-icon{color:#0d4261!important;font-size:24px!important;width:25px!important;height:24px!important;margin:0!important;rotate:90deg}.btn-menu-mobile .mdc-button__label{padding:0!important}}@media (min-width: 769px){.mobile-buttons{display:none!important}}@media (max-width: 600px){::ng-deep .main-form-canvas{display:block!important}}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: BaseFormCanvasComponent, selector: "app-base-form-canvas", inputs: ["pageInfo", "currency", "fields", "errors", "workflowEditableFields", "isWorkflowEditableManaged", "supportingAttributes", "editable", "emitOnValueChanges", "filterResetNonce", "item", "equationSuggestedFields", "currentEquationValue"], outputs: ["attachmentEmitter", "actionEmitter", "formUpdated", "hyperTextEvent", "currentEquationValueChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "component", type: MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }] }); }
|
|
5053
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SectionFormCanvasComponent, isStandalone: true, selector: "lib-section-form-canvas", inputs: { pageInfo: "pageInfo", fields: "fields", itemId: "itemId", editable: "editable", hideBackButton: "hideBackButton", item: "item", title: "title", subtitle: "subtitle", isTranslateTitle: "isTranslateTitle", isTranslateSubtitle: "isTranslateSubtitle", key: "key", hideToggle: "hideToggle", isExpanded: "isExpanded", alwaysOpen: "alwaysOpen", expansionHeaderTabIndex: "expansionHeaderTabIndex", buttons: "buttons", itemStatus: "itemStatus" }, outputs: { attachmentEmitter: "attachmentEmitter", actionEdit: "actionEdit", formEdit: "formEdit", buttonClicked: "buttonClicked" }, ngImport: i0, template: "<mat-expansion-panel class=\"location-card\"\r\n #panel=\"matExpansionPanel\"\r\n [expanded]=\"isExpanded\"\r\n [hideToggle]=\"hideToggle\"\r\n (opened)=\"alwaysOpen ? panel.open() : null\"\r\n (closed)=\"alwaysOpen ? panel.open() : null\">\r\n <mat-expansion-panel-header\r\n class=\"card-header\"\r\n (click)=\"toggleExpand()\"\r\n [tabIndex]=\"expansionHeaderTabIndex\">\r\n <mat-panel-title>\r\n <div class=\"title-container\">\r\n <h3 class=\"card-title\" *ngIf=\"isTranslateTitle\">\r\n {{ pageInfo.labelsSection + '.' + title | translate }}\r\n </h3>\r\n <h3 class=\"card-title\" *ngIf=\"!isTranslateTitle\">{{ title }}</h3>\r\n <p class=\"card-subtitle\" *ngIf=\"subtitle\">\r\n <span *ngIf=\"isTranslateSubtitle\">{{ pageInfo.labelsSection + '.' + subtitle | translate }}</span>\r\n <span *ngIf=\"!isTranslateSubtitle\">{{ subtitle }}</span>\r\n </p>\r\n <button\r\n mat-button\r\n *ngIf=\"itemStatus\"\r\n type=\"button\"\r\n class=\"stateType\"\r\n [ngClass]=\"itemStatus\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\">\r\n {{ pageInfo.labelsSection + '.' + itemStatus | translate }}\r\n </button>\r\n </div>\r\n </mat-panel-title>\r\n\r\n <mat-panel-description class=\"panel-description\" *ngIf=\"buttons && buttons.length > 0\">\r\n <div class=\"row flex-auto buttons-wrapper desktop-buttons\" [class.show-on-mobile]=\"!getDownloadButton()\">\r\n <button\r\n mat-flat-button\r\n *ngFor=\"let btn of buttons\"\r\n type=\"button\"\r\n [color]=\"btn.color || 'primary'\"\r\n (click)=\"onButtonClick(btn , key); $event.stopPropagation()\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-none-background-primary action\"\r\n [attr.id]=\"btn.id || ('section-btn-' + (btn.action || btn.label || btn.key))\"\r\n >\r\n <div class=\"button-text\">\r\n <mat-icon *ngIf=\"btn.icon\">{{ btn.icon }}</mat-icon>\r\n <span>{{ btn.label | translate }}</span>\r\n </div>\r\n </button>\r\n </div>\r\n\r\n <div class=\"mobile-buttons\" *ngIf=\"getDownloadButton()\">\r\n <button\r\n mat-flat-button\r\n type=\"button\"\r\n color=\"primary\"\r\n (click)=\"onButtonClick(getDownloadButton()!, key); $event.stopPropagation()\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-download-mobile\"\r\n [attr.id]=\"getDownloadButton()?.id\"\r\n [attr.aria-label]=\"'BASE_TABLE.downloadAction' | translate\"\r\n >\r\n <mat-icon aria-hidden=\"true\">{{ getDownloadButton()?.icon }}</mat-icon>\r\n </button>\r\n <button\r\n *ngIf=\"getMenuButtons().length > 0\"\r\n mat-stroked-button\r\n type=\"button\"\r\n [matMenuTriggerFor]=\"menu\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-menu-mobile\"\r\n >\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n <button\r\n mat-menu-item\r\n *ngFor=\"let btn of getMenuButtons()\"\r\n (click)=\"onButtonClick(btn, key); $event.stopPropagation()\"\r\n [attr.id]=\"btn.id\"\r\n >\r\n <mat-icon>{{ btn.icon }}</mat-icon>\r\n <span>{{ btn.label | translate }}</span>\r\n </button>\r\n </mat-menu>\r\n </div>\r\n </mat-panel-description>\r\n </mat-expansion-panel-header>\r\n <div class=\"panel-body\">\r\n <hr class=\"divider\"/>\r\n <ng-content></ng-content>\r\n <app-base-form-canvas\r\n [pageInfo]=\"pageInfo\"\r\n [fields]=\"fields\"\r\n [editable]=\"editable\"\r\n [item]=\"item\"\r\n (attachmentEmitter)=\"attachmentHandler($event)\"\r\n (formUpdated)=\"formUpdated($event)\"\r\n ></app-base-form-canvas>\r\n </div>\r\n</mat-expansion-panel>\r\n", styles: [".location-card{border:1px solid #dcdcdc;border-radius:8px;background:#fff;margin:18px auto;overflow:hidden}.location-card .mat-expansion-panel-header{padding:0 15px}.location-card .mat-expansion-panel-header ::ng-deep .mat-content{margin:0!important}@media (max-width: 450px){.location-card .mat-expansion-panel-header ::ng-deep .mat-content{flex-direction:column!important;align-items:stretch;gap:12px}.location-card .panel-description{justify-content:flex-start!important;width:100%}.location-card .buttons-wrapper{justify-content:flex-start;width:100%}}.location-card .panel-body{padding:20px 15px;padding-top:0!important}.location-card .panel-body ::ng-deep app-base-form-canvas .main-form-canvas{margin-top:20px!important}.location-card .panel-description{justify-content:end!important;margin:0!important}.location-card .card-header{display:flex;justify-content:space-between;align-items:center;padding:16px!important;cursor:default}.location-card .card-header .title-container{display:flex;flex-direction:column;gap:8px;align-items:flex-start;justify-content:center}.location-card .card-header .card-title{margin:0;font-size:24px;font-weight:700;line-height:1.2;color:#000;width:fit-content;white-space:nowrap}.location-card .card-header .card-subtitle{margin:0;font-family:lusail-light,sans-serif;font-weight:300;font-size:16px;line-height:1.2;color:#888;width:fit-content}.location-card .card-header .btn-edit{width:120px;min-height:32px!important;border-radius:9999px!important;font-size:16px!important}.location-card .card-header .expand-icon{color:#339dff;font-size:16px}.location-card .divider{border:none;border-top:2px solid var(--primary-color-3nd);margin-bottom:20px;margin-top:0}.flex-auto{flex:1 1 auto;display:flex;flex-direction:column}.row{display:flex;flex-direction:row;width:100%}.gap-20{gap:20px}.buttons-wrapper{display:flex;text-align-last:end;margin:0!important;gap:16px;justify-content:flex-end}.buttons-wrapper .action{min-height:44px!important;min-width:135px!important;width:auto!important}.button-text span{font-size:18px}.button-text mat-icon{font-size:18px!important}.btn-none-background-primary{margin:0!important}@media (max-width: 768px){.desktop-buttons{display:none!important}.desktop-buttons.show-on-mobile{display:flex!important}.mobile-buttons{display:flex;gap:12px;align-items:center;justify-content:flex-end}.btn-download-mobile{width:45px!important;height:44px!important;min-width:45px!important;padding:0!important;border-radius:8px!important;background:#0d4261!important;display:flex;align-items:center;justify-content:center}.btn-download-mobile mat-icon{color:#fff!important;font-size:24px!important;width:24px!important;height:28px!important;margin:0!important}.btn-download-mobile .mdc-button__label{padding:0!important}.btn-menu-mobile{width:44px!important;height:44px!important;min-width:44px!important;padding:0!important;border-radius:8px!important;border:1px solid #3e627b!important;background:#fff!important;display:flex;align-items:center;justify-content:center}.btn-menu-mobile mat-icon{color:#0d4261!important;font-size:24px!important;width:25px!important;height:24px!important;margin:0!important;rotate:90deg}.btn-menu-mobile .mdc-button__label{padding:0!important}}@media (min-width: 769px){.mobile-buttons{display:none!important}}@media (max-width: 600px){::ng-deep .main-form-canvas{display:block!important}}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: BaseFormCanvasComponent, selector: "app-base-form-canvas", inputs: ["pageInfo", "currency", "fields", "errors", "workflowEditableFields", "isWorkflowEditableManaged", "supportingAttributes", "editable", "emitOnValueChanges", "filterResetNonce", "item", "equationSuggestedFields", "currentEquationValue"], outputs: ["attachmentEmitter", "actionEmitter", "formUpdated", "hyperTextEvent", "currentEquationValueChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "component", type: MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }] }); }
|
|
5043
5054
|
}
|
|
5044
5055
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SectionFormCanvasComponent, decorators: [{
|
|
5045
5056
|
type: Component,
|
|
@@ -5059,7 +5070,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
5059
5070
|
MatMenu,
|
|
5060
5071
|
MatMenuTrigger,
|
|
5061
5072
|
MatMenuItem
|
|
5062
|
-
], template: "<mat-expansion-panel class=\"location-card\"\r\n #panel=\"matExpansionPanel\"\r\n [expanded]=\"isExpanded\"\r\n [hideToggle]=\"hideToggle\"\r\n (opened)=\"alwaysOpen ? panel.open() : null\"\r\n (closed)=\"alwaysOpen ? panel.open() : null\">\r\n <mat-expansion-panel-header\r\n class=\"card-header\"\r\n (click)=\"toggleExpand()\"\r\n [tabIndex]=\"expansionHeaderTabIndex\">\r\n <mat-panel-title>\r\n <div class=\"title-container\">\r\n <h3 class=\"card-title\" *ngIf=\"isTranslateTitle\">\r\n {{ pageInfo.labelsSection + '.' + title | translate }}\r\n </h3>\r\n <h3 class=\"card-title\" *ngIf=\"!isTranslateTitle\">{{ title }}</h3>\r\n <p class=\"card-subtitle\" *ngIf=\"subtitle\">\r\n <span *ngIf=\"isTranslateSubtitle\">{{ pageInfo.labelsSection + '.' + subtitle | translate }}</span>\r\n <span *ngIf=\"!isTranslateSubtitle\">{{ subtitle }}</span>\r\n </p>\r\n <button\r\n mat-button\r\n *ngIf=\"itemStatus\"\r\n type=\"button\"\r\n class=\"stateType\"\r\n [ngClass]=\"itemStatus\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\">\r\n {{ pageInfo.labelsSection + '.' + itemStatus | translate }}\r\n </button>\r\n </div>\r\n </mat-panel-title>\r\n\r\n <mat-panel-description class=\"panel-description\" *ngIf=\"buttons && buttons.length > 0\">\r\n <div class=\"row flex-auto buttons-wrapper desktop-buttons\" [class.show-on-mobile]=\"!getDownloadButton()\">\r\n <button\r\n mat-flat-button\r\n *ngFor=\"let btn of buttons\"\r\n type=\"button\"\r\n [color]=\"btn.color || 'primary'\"\r\n (click)=\"onButtonClick(btn , key); $event.stopPropagation()\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-none-background-primary action\"\r\n [attr.id]=\"btn.id || ('section-btn-' + (btn.action || btn.label || btn.key))\"\r\n >\r\n <div class=\"button-text\">\r\n <mat-icon *ngIf=\"btn.icon\">{{ btn.icon }}</mat-icon>\r\n <span>{{ btn.label | translate }}</span>\r\n </div>\r\n </button>\r\n </div>\r\n
|
|
5073
|
+
], template: "<mat-expansion-panel class=\"location-card\"\r\n #panel=\"matExpansionPanel\"\r\n [expanded]=\"isExpanded\"\r\n [hideToggle]=\"hideToggle\"\r\n (opened)=\"alwaysOpen ? panel.open() : null\"\r\n (closed)=\"alwaysOpen ? panel.open() : null\">\r\n <mat-expansion-panel-header\r\n class=\"card-header\"\r\n (click)=\"toggleExpand()\"\r\n [tabIndex]=\"expansionHeaderTabIndex\">\r\n <mat-panel-title>\r\n <div class=\"title-container\">\r\n <h3 class=\"card-title\" *ngIf=\"isTranslateTitle\">\r\n {{ pageInfo.labelsSection + '.' + title | translate }}\r\n </h3>\r\n <h3 class=\"card-title\" *ngIf=\"!isTranslateTitle\">{{ title }}</h3>\r\n <p class=\"card-subtitle\" *ngIf=\"subtitle\">\r\n <span *ngIf=\"isTranslateSubtitle\">{{ pageInfo.labelsSection + '.' + subtitle | translate }}</span>\r\n <span *ngIf=\"!isTranslateSubtitle\">{{ subtitle }}</span>\r\n </p>\r\n <button\r\n mat-button\r\n *ngIf=\"itemStatus\"\r\n type=\"button\"\r\n class=\"stateType\"\r\n [ngClass]=\"itemStatus\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\">\r\n {{ pageInfo.labelsSection + '.' + itemStatus | translate }}\r\n </button>\r\n </div>\r\n </mat-panel-title>\r\n\r\n <mat-panel-description class=\"panel-description\" *ngIf=\"buttons && buttons.length > 0\">\r\n <div class=\"row flex-auto buttons-wrapper desktop-buttons\" [class.show-on-mobile]=\"!getDownloadButton()\">\r\n <button\r\n mat-flat-button\r\n *ngFor=\"let btn of buttons\"\r\n type=\"button\"\r\n [color]=\"btn.color || 'primary'\"\r\n (click)=\"onButtonClick(btn , key); $event.stopPropagation()\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-none-background-primary action\"\r\n [attr.id]=\"btn.id || ('section-btn-' + (btn.action || btn.label || btn.key))\"\r\n >\r\n <div class=\"button-text\">\r\n <mat-icon *ngIf=\"btn.icon\">{{ btn.icon }}</mat-icon>\r\n <span>{{ btn.label | translate }}</span>\r\n </div>\r\n </button>\r\n </div>\r\n\r\n <div class=\"mobile-buttons\" *ngIf=\"getDownloadButton()\">\r\n <button\r\n mat-flat-button\r\n type=\"button\"\r\n color=\"primary\"\r\n (click)=\"onButtonClick(getDownloadButton()!, key); $event.stopPropagation()\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-download-mobile\"\r\n [attr.id]=\"getDownloadButton()?.id\"\r\n [attr.aria-label]=\"'BASE_TABLE.downloadAction' | translate\"\r\n >\r\n <mat-icon aria-hidden=\"true\">{{ getDownloadButton()?.icon }}</mat-icon>\r\n </button>\r\n <button\r\n *ngIf=\"getMenuButtons().length > 0\"\r\n mat-stroked-button\r\n type=\"button\"\r\n [matMenuTriggerFor]=\"menu\"\r\n (keydown)=\"onPanelHeaderChildKeydown($event)\"\r\n class=\"btn-menu-mobile\"\r\n >\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\">\r\n <button\r\n mat-menu-item\r\n *ngFor=\"let btn of getMenuButtons()\"\r\n (click)=\"onButtonClick(btn, key); $event.stopPropagation()\"\r\n [attr.id]=\"btn.id\"\r\n >\r\n <mat-icon>{{ btn.icon }}</mat-icon>\r\n <span>{{ btn.label | translate }}</span>\r\n </button>\r\n </mat-menu>\r\n </div>\r\n </mat-panel-description>\r\n </mat-expansion-panel-header>\r\n <div class=\"panel-body\">\r\n <hr class=\"divider\"/>\r\n <ng-content></ng-content>\r\n <app-base-form-canvas\r\n [pageInfo]=\"pageInfo\"\r\n [fields]=\"fields\"\r\n [editable]=\"editable\"\r\n [item]=\"item\"\r\n (attachmentEmitter)=\"attachmentHandler($event)\"\r\n (formUpdated)=\"formUpdated($event)\"\r\n ></app-base-form-canvas>\r\n </div>\r\n</mat-expansion-panel>\r\n", styles: [".location-card{border:1px solid #dcdcdc;border-radius:8px;background:#fff;margin:18px auto;overflow:hidden}.location-card .mat-expansion-panel-header{padding:0 15px}.location-card .mat-expansion-panel-header ::ng-deep .mat-content{margin:0!important}@media (max-width: 450px){.location-card .mat-expansion-panel-header ::ng-deep .mat-content{flex-direction:column!important;align-items:stretch;gap:12px}.location-card .panel-description{justify-content:flex-start!important;width:100%}.location-card .buttons-wrapper{justify-content:flex-start;width:100%}}.location-card .panel-body{padding:20px 15px;padding-top:0!important}.location-card .panel-body ::ng-deep app-base-form-canvas .main-form-canvas{margin-top:20px!important}.location-card .panel-description{justify-content:end!important;margin:0!important}.location-card .card-header{display:flex;justify-content:space-between;align-items:center;padding:16px!important;cursor:default}.location-card .card-header .title-container{display:flex;flex-direction:column;gap:8px;align-items:flex-start;justify-content:center}.location-card .card-header .card-title{margin:0;font-size:24px;font-weight:700;line-height:1.2;color:#000;width:fit-content;white-space:nowrap}.location-card .card-header .card-subtitle{margin:0;font-family:lusail-light,sans-serif;font-weight:300;font-size:16px;line-height:1.2;color:#888;width:fit-content}.location-card .card-header .btn-edit{width:120px;min-height:32px!important;border-radius:9999px!important;font-size:16px!important}.location-card .card-header .expand-icon{color:#339dff;font-size:16px}.location-card .divider{border:none;border-top:2px solid var(--primary-color-3nd);margin-bottom:20px;margin-top:0}.flex-auto{flex:1 1 auto;display:flex;flex-direction:column}.row{display:flex;flex-direction:row;width:100%}.gap-20{gap:20px}.buttons-wrapper{display:flex;text-align-last:end;margin:0!important;gap:16px;justify-content:flex-end}.buttons-wrapper .action{min-height:44px!important;min-width:135px!important;width:auto!important}.button-text span{font-size:18px}.button-text mat-icon{font-size:18px!important}.btn-none-background-primary{margin:0!important}@media (max-width: 768px){.desktop-buttons{display:none!important}.desktop-buttons.show-on-mobile{display:flex!important}.mobile-buttons{display:flex;gap:12px;align-items:center;justify-content:flex-end}.btn-download-mobile{width:45px!important;height:44px!important;min-width:45px!important;padding:0!important;border-radius:8px!important;background:#0d4261!important;display:flex;align-items:center;justify-content:center}.btn-download-mobile mat-icon{color:#fff!important;font-size:24px!important;width:24px!important;height:28px!important;margin:0!important}.btn-download-mobile .mdc-button__label{padding:0!important}.btn-menu-mobile{width:44px!important;height:44px!important;min-width:44px!important;padding:0!important;border-radius:8px!important;border:1px solid #3e627b!important;background:#fff!important;display:flex;align-items:center;justify-content:center}.btn-menu-mobile mat-icon{color:#0d4261!important;font-size:24px!important;width:25px!important;height:24px!important;margin:0!important;rotate:90deg}.btn-menu-mobile .mdc-button__label{padding:0!important}}@media (min-width: 769px){.mobile-buttons{display:none!important}}@media (max-width: 600px){::ng-deep .main-form-canvas{display:block!important}}\n"] }]
|
|
5063
5074
|
}], propDecorators: { pageInfo: [{
|
|
5064
5075
|
type: Input
|
|
5065
5076
|
}], fields: [{
|
|
@@ -5088,6 +5099,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
5088
5099
|
type: Input
|
|
5089
5100
|
}], alwaysOpen: [{
|
|
5090
5101
|
type: Input
|
|
5102
|
+
}], attachmentEmitter: [{
|
|
5103
|
+
type: Output
|
|
5091
5104
|
}], expansionHeaderTabIndex: [{
|
|
5092
5105
|
type: Input
|
|
5093
5106
|
}], actionEdit: [{
|