@smartbit4all/ng-client 3.1.24 → 3.1.26
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/esm2020/lib/smart-form/services/smartform.service.mjs +31 -9
- package/esm2020/lib/smart-form/widgets/components/smart-month-picker/smart-month-picker.component.mjs +18 -22
- package/esm2020/lib/smart-grid/components/table-layout-definer/table-layout-definer.component.mjs +3 -3
- package/fesm2015/smartbit4all-ng-client.mjs +44 -27
- package/fesm2015/smartbit4all-ng-client.mjs.map +1 -1
- package/fesm2020/smartbit4all-ng-client.mjs +43 -25
- package/fesm2020/smartbit4all-ng-client.mjs.map +1 -1
- package/lib/smart-form/services/smartform.service.d.ts +1 -0
- package/lib/smart-form/widgets/components/smart-month-picker/smart-month-picker.component.d.ts +7 -8
- package/package.json +1 -1
- package/smartbit4all-ng-client-3.1.26.tgz +0 -0
- package/smartbit4all-ng-client-3.1.24.tgz +0 -0
|
@@ -3799,26 +3799,41 @@ class SmartFormService {
|
|
|
3799
3799
|
widget.type === SmartFormWidgetType.CHECK_BOX_2 ||
|
|
3800
3800
|
widget.type === SmartFormWidgetType.TEXT_FIELD) {
|
|
3801
3801
|
if (widget.selection && valueSets) {
|
|
3802
|
+
let valueSetData = valueSets[widget.selection.valueSetName].valueSetData;
|
|
3803
|
+
let values = valueSetData.values;
|
|
3804
|
+
let displayProperty = widget.selection?.displayProperty ?? 'displayValue';
|
|
3805
|
+
// check is displayProperty exists, fallback for common display properties
|
|
3806
|
+
if (!this.checkProperty(values, displayProperty)) {
|
|
3807
|
+
displayProperty = 'name'; // GenericValue.name
|
|
3808
|
+
if (!this.checkProperty(values, displayProperty)) {
|
|
3809
|
+
displayProperty = 'displayValue'; // Value.displayValue
|
|
3810
|
+
}
|
|
3811
|
+
}
|
|
3802
3812
|
if (widget.selection.type === SelectionDefinition.TypeEnum.Property &&
|
|
3803
3813
|
!widget.selection.mapping.length) {
|
|
3804
|
-
let
|
|
3805
|
-
|
|
3814
|
+
let keyProperty = valueSetData.keyProperty ?? 'objectUri';
|
|
3815
|
+
if (!this.checkProperty(values, keyProperty)) {
|
|
3816
|
+
keyProperty = 'uri'; // GenericValue.uri
|
|
3817
|
+
if (!this.checkProperty(values, keyProperty)) {
|
|
3818
|
+
keyProperty = 'objectUri'; // Value.objectUri
|
|
3819
|
+
}
|
|
3820
|
+
}
|
|
3821
|
+
widget.valueList = values.map((value) => {
|
|
3806
3822
|
return {
|
|
3807
|
-
key: value[
|
|
3808
|
-
label: value[
|
|
3823
|
+
key: value[keyProperty],
|
|
3824
|
+
label: value[displayProperty],
|
|
3809
3825
|
type: SmartFormWidgetType.ITEM,
|
|
3810
|
-
value: value[
|
|
3826
|
+
value: value[keyProperty],
|
|
3811
3827
|
};
|
|
3812
3828
|
});
|
|
3813
3829
|
this.addEmptyItemToValueList(widget, widget.selection.emptyLabel);
|
|
3814
3830
|
}
|
|
3815
3831
|
else if (widget.selection.type === SelectionDefinition.TypeEnum.Object &&
|
|
3816
3832
|
!widget.selection.mapping.length) {
|
|
3817
|
-
|
|
3818
|
-
widget.valueList = valueSetData.values.map((value, index) => {
|
|
3833
|
+
widget.valueList = values.map((value, index) => {
|
|
3819
3834
|
return {
|
|
3820
3835
|
key: `${index}`,
|
|
3821
|
-
label: value[
|
|
3836
|
+
label: value[displayProperty],
|
|
3822
3837
|
type: SmartFormWidgetType.ITEM,
|
|
3823
3838
|
value: value,
|
|
3824
3839
|
};
|
|
@@ -3828,6 +3843,13 @@ class SmartFormService {
|
|
|
3828
3843
|
}
|
|
3829
3844
|
}
|
|
3830
3845
|
}
|
|
3846
|
+
checkProperty(values, property) {
|
|
3847
|
+
if (!values?.length) {
|
|
3848
|
+
// no sample data, assume existance
|
|
3849
|
+
return true;
|
|
3850
|
+
}
|
|
3851
|
+
return property in values[0];
|
|
3852
|
+
}
|
|
3831
3853
|
toFormGroup() {
|
|
3832
3854
|
this.createFormControls(this.smartForm.widgets);
|
|
3833
3855
|
let formGroup = new FormGroup(this.group);
|
|
@@ -4444,13 +4466,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
4444
4466
|
|
|
4445
4467
|
const YEARH_MONTH_FORMAT = {
|
|
4446
4468
|
parse: {
|
|
4447
|
-
dateInput:
|
|
4469
|
+
dateInput: 'MM/YYYY',
|
|
4448
4470
|
},
|
|
4449
4471
|
display: {
|
|
4450
|
-
dateInput:
|
|
4451
|
-
monthYearLabel:
|
|
4452
|
-
dateA11yLabel:
|
|
4453
|
-
monthYearA11yLabel:
|
|
4472
|
+
dateInput: 'MM/YYYY',
|
|
4473
|
+
monthYearLabel: 'MMM YYYY',
|
|
4474
|
+
dateA11yLabel: 'LL',
|
|
4475
|
+
monthYearA11yLabel: 'MMMM YYYY',
|
|
4454
4476
|
},
|
|
4455
4477
|
};
|
|
4456
4478
|
class SmartMonthPickerComponent {
|
|
@@ -4468,14 +4490,10 @@ class SmartMonthPickerComponent {
|
|
|
4468
4490
|
this.date = new FormControl(moment());
|
|
4469
4491
|
}
|
|
4470
4492
|
}
|
|
4471
|
-
|
|
4472
|
-
const ctrlValue = this.date.value;
|
|
4473
|
-
ctrlValue.year(normalizedYear.year());
|
|
4474
|
-
this.date.setValue(ctrlValue);
|
|
4475
|
-
}
|
|
4476
|
-
chosenMonthHandler(normalizedMonth, datepicker) {
|
|
4493
|
+
chosenMonthHandler(moment, datepicker) {
|
|
4477
4494
|
const ctrlValue = this.date.value;
|
|
4478
|
-
ctrlValue.month(
|
|
4495
|
+
ctrlValue.month(moment.month());
|
|
4496
|
+
ctrlValue.year(moment.year());
|
|
4479
4497
|
this.date.setValue(ctrlValue);
|
|
4480
4498
|
this.valueChange.next(ctrlValue);
|
|
4481
4499
|
datepicker.close();
|
|
@@ -4489,17 +4507,17 @@ SmartMonthPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
|
|
|
4489
4507
|
deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
|
|
4490
4508
|
},
|
|
4491
4509
|
{ provide: MAT_DATE_FORMATS, useValue: YEARH_MONTH_FORMAT },
|
|
4492
|
-
], ngImport: i0, template: "<div class=\"smart-month-picker-container\">\r\n <mat-form-field appearance=\"outline\">\r\n <input
|
|
4510
|
+
], ngImport: i0, template: "<div class=\"smart-month-picker-container\">\r\n <mat-form-field appearance=\"outline\">\r\n <input matInput [matDatepicker]=\"dp\" placeholder=\"Month and Year\" [formControl]=\"date\" />\r\n <mat-datepicker-toggle matSuffix [for]=\"dp\"></mat-datepicker-toggle>\r\n <mat-datepicker\r\n #dp\r\n startView=\"multi-year\"\r\n (monthSelected)=\"chosenMonthHandler($event, dp)\"\r\n panelClass=\"example-month-picker\"\r\n >\r\n </mat-datepicker>\r\n </mat-form-field>\r\n <div class=\"smart-month-picker-hint\">\r\n <mat-hint\r\n *ngIf=\"\r\n !widgetInstance?.hintConfig ||\r\n widgetInstance?.hintConfig?.position === SmartWidgetHintPosition.UNDER_INPUT\r\n \"\r\n >{{ widgetInstance.hint }}</mat-hint\r\n >\r\n </div>\r\n</div>\r\n", styles: [""], components: [{ type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i2$3.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }], directives: [{ type: i3$3.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"] }, { type: i2$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { type: i20.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i20.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i20.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$2.MatSuffix, selector: "[matSuffix]" }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }] });
|
|
4493
4511
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: SmartMonthPickerComponent, decorators: [{
|
|
4494
4512
|
type: Component,
|
|
4495
|
-
args: [{ selector:
|
|
4513
|
+
args: [{ selector: 'lib-smart-month-picker', providers: [
|
|
4496
4514
|
{
|
|
4497
4515
|
provide: DateAdapter,
|
|
4498
4516
|
useClass: MomentDateAdapter,
|
|
4499
4517
|
deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
|
|
4500
4518
|
},
|
|
4501
4519
|
{ provide: MAT_DATE_FORMATS, useValue: YEARH_MONTH_FORMAT },
|
|
4502
|
-
], template: "<div class=\"smart-month-picker-container\">\r\n <mat-form-field appearance=\"outline\">\r\n <input
|
|
4520
|
+
], template: "<div class=\"smart-month-picker-container\">\r\n <mat-form-field appearance=\"outline\">\r\n <input matInput [matDatepicker]=\"dp\" placeholder=\"Month and Year\" [formControl]=\"date\" />\r\n <mat-datepicker-toggle matSuffix [for]=\"dp\"></mat-datepicker-toggle>\r\n <mat-datepicker\r\n #dp\r\n startView=\"multi-year\"\r\n (monthSelected)=\"chosenMonthHandler($event, dp)\"\r\n panelClass=\"example-month-picker\"\r\n >\r\n </mat-datepicker>\r\n </mat-form-field>\r\n <div class=\"smart-month-picker-hint\">\r\n <mat-hint\r\n *ngIf=\"\r\n !widgetInstance?.hintConfig ||\r\n widgetInstance?.hintConfig?.position === SmartWidgetHintPosition.UNDER_INPUT\r\n \"\r\n >{{ widgetInstance.hint }}</mat-hint\r\n >\r\n </div>\r\n</div>\r\n", styles: [""] }]
|
|
4503
4521
|
}], propDecorators: { widgetInstance: [{
|
|
4504
4522
|
type: Input
|
|
4505
4523
|
}], valueChange: [{
|
|
@@ -10727,10 +10745,10 @@ class TableLayoutDefinerComponent {
|
|
|
10727
10745
|
}
|
|
10728
10746
|
}
|
|
10729
10747
|
TableLayoutDefinerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TableLayoutDefinerComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$2.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
10730
|
-
TableLayoutDefinerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TableLayoutDefinerComponent, selector: "app-table-layout-definer", viewQueries: [{ propertyName: "formChildren", predicate: ["forms"], descendants: true }], ngImport: i0, template: "<div class=\"edit-columns-container\">\r\n <div class=\"example-list\" cdkDropList (cdkDropListDropped)=\"drop($event)\">\r\n <div class=\"column-meta-row\" *ngFor=\"let col of forms\" cdkDrag cdkDragLockAxis=\"y\">\r\n <smart-icon color=\"primary\" icon=\"drag_handle\"></smart-icon>\r\n <smartform class=\"form\" #forms [smartForm]=\"col\"></smartform>\r\n <button\r\n *ngIf=\"isAlwaysShow(col) && (view?.orderedColumnNames)!.length > 1\"\r\n (click)=\"removeColumn(col)\"\r\n mat-icon-button\r\n color=\"primary\"\r\n >\r\n <mat-icon>delete_outline</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"add-btn\">\r\n <button mat-icon-button color=\"primary\" [disabled]=\"addDisabled\" (click)=\"addColumn()\">\r\n <mat-icon>add</mat-icon>\r\n </button>\r\n </div>\r\n <div class=\"button-toolbar\">\r\n <button mat-
|
|
10748
|
+
TableLayoutDefinerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TableLayoutDefinerComponent, selector: "app-table-layout-definer", viewQueries: [{ propertyName: "formChildren", predicate: ["forms"], descendants: true }], ngImport: i0, template: "<div class=\"edit-columns-container\">\r\n <div class=\"example-list\" cdkDropList (cdkDropListDropped)=\"drop($event)\">\r\n <div class=\"column-meta-row\" *ngFor=\"let col of forms\" cdkDrag cdkDragLockAxis=\"y\">\r\n <smart-icon color=\"primary\" icon=\"drag_handle\"></smart-icon>\r\n <smartform class=\"form\" #forms [smartForm]=\"col\"></smartform>\r\n <button\r\n *ngIf=\"isAlwaysShow(col) && (view?.orderedColumnNames)!.length > 1\"\r\n (click)=\"removeColumn(col)\"\r\n mat-icon-button\r\n color=\"primary\"\r\n >\r\n <mat-icon>delete_outline</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"add-btn\">\r\n <button mat-icon-button color=\"primary\" [disabled]=\"addDisabled\" (click)=\"addColumn()\">\r\n <mat-icon>add</mat-icon>\r\n </button>\r\n </div>\r\n <div class=\"button-toolbar\">\r\n <button mat-button color=\"primary\" (click)=\"cancel()\"> M\u00E9gsem </button>\r\n <button mat-raised-button color=\"primary\" [disabled]=\"disableSave\" (click)=\"submit()\">\r\n Ment\u00E9s\r\n </button>\r\n </div>\r\n</div>\r\n", styles: [".edit-columns-container{padding:1rem;display:flex;flex-direction:column;gap:1rem}.row{display:flex;flex-direction:row;gap:.5rem}.form{flex:1}.fields{padding:1rem 0;display:flex;flex-direction:column;gap:.5rem}.example-list{display:flex;flex-direction:column;gap:1rem;width:500px;max-width:100%;max-height:80vh;overflow:auto}.column-meta-row{display:flex;flex-direction:row;gap:1rem;justify-content:space-between;border:solid 1px #ccc;padding:1rem}.buttonsContainer{display:flex;flex-direction:row;justify-content:space-between}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}h2{margin:0}.button-toolbar{display:flex;flex-direction:row;justify-content:space-between;padding:.5rem}.add-btn{display:flex;flex-direction:column;align-items:center}\n"], components: [{ type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color"] }, { type: SmartformComponent, selector: "smartform", inputs: ["smartForm"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
10731
10749
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TableLayoutDefinerComponent, decorators: [{
|
|
10732
10750
|
type: Component,
|
|
10733
|
-
args: [{ selector: 'app-table-layout-definer', template: "<div class=\"edit-columns-container\">\r\n <div class=\"example-list\" cdkDropList (cdkDropListDropped)=\"drop($event)\">\r\n <div class=\"column-meta-row\" *ngFor=\"let col of forms\" cdkDrag cdkDragLockAxis=\"y\">\r\n <smart-icon color=\"primary\" icon=\"drag_handle\"></smart-icon>\r\n <smartform class=\"form\" #forms [smartForm]=\"col\"></smartform>\r\n <button\r\n *ngIf=\"isAlwaysShow(col) && (view?.orderedColumnNames)!.length > 1\"\r\n (click)=\"removeColumn(col)\"\r\n mat-icon-button\r\n color=\"primary\"\r\n >\r\n <mat-icon>delete_outline</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"add-btn\">\r\n <button mat-icon-button color=\"primary\" [disabled]=\"addDisabled\" (click)=\"addColumn()\">\r\n <mat-icon>add</mat-icon>\r\n </button>\r\n </div>\r\n <div class=\"button-toolbar\">\r\n <button mat-
|
|
10751
|
+
args: [{ selector: 'app-table-layout-definer', template: "<div class=\"edit-columns-container\">\r\n <div class=\"example-list\" cdkDropList (cdkDropListDropped)=\"drop($event)\">\r\n <div class=\"column-meta-row\" *ngFor=\"let col of forms\" cdkDrag cdkDragLockAxis=\"y\">\r\n <smart-icon color=\"primary\" icon=\"drag_handle\"></smart-icon>\r\n <smartform class=\"form\" #forms [smartForm]=\"col\"></smartform>\r\n <button\r\n *ngIf=\"isAlwaysShow(col) && (view?.orderedColumnNames)!.length > 1\"\r\n (click)=\"removeColumn(col)\"\r\n mat-icon-button\r\n color=\"primary\"\r\n >\r\n <mat-icon>delete_outline</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"add-btn\">\r\n <button mat-icon-button color=\"primary\" [disabled]=\"addDisabled\" (click)=\"addColumn()\">\r\n <mat-icon>add</mat-icon>\r\n </button>\r\n </div>\r\n <div class=\"button-toolbar\">\r\n <button mat-button color=\"primary\" (click)=\"cancel()\"> M\u00E9gsem </button>\r\n <button mat-raised-button color=\"primary\" [disabled]=\"disableSave\" (click)=\"submit()\">\r\n Ment\u00E9s\r\n </button>\r\n </div>\r\n</div>\r\n", styles: [".edit-columns-container{padding:1rem;display:flex;flex-direction:column;gap:1rem}.row{display:flex;flex-direction:row;gap:.5rem}.form{flex:1}.fields{padding:1rem 0;display:flex;flex-direction:column;gap:.5rem}.example-list{display:flex;flex-direction:column;gap:1rem;width:500px;max-width:100%;max-height:80vh;overflow:auto}.column-meta-row{display:flex;flex-direction:row;gap:1rem;justify-content:space-between;border:solid 1px #ccc;padding:1rem}.buttonsContainer{display:flex;flex-direction:row;justify-content:space-between}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}h2{margin:0}.button-toolbar{display:flex;flex-direction:row;justify-content:space-between;padding:.5rem}.add-btn{display:flex;flex-direction:column;align-items:center}\n"] }]
|
|
10734
10752
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
10735
10753
|
type: Inject,
|
|
10736
10754
|
args: [MAT_DIALOG_DATA]
|