@brggroup/share-lib 0.1.24 → 0.1.25
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.
|
@@ -2251,6 +2251,9 @@ class ExtendDatePicker {
|
|
|
2251
2251
|
if (this.maxDate && value && new Date(value) > new Date(this.maxDate)) {
|
|
2252
2252
|
return `Ngày không được lớn hơn ${this.formatDate(this.maxDate)}`;
|
|
2253
2253
|
}
|
|
2254
|
+
if (this.isTouched && this.inputErrorMessage) {
|
|
2255
|
+
return this.inputErrorMessage;
|
|
2256
|
+
}
|
|
2254
2257
|
return '';
|
|
2255
2258
|
}
|
|
2256
2259
|
formatDate(date) {
|
|
@@ -2271,6 +2274,7 @@ class ExtendDatePicker {
|
|
|
2271
2274
|
this.isTouched = true;
|
|
2272
2275
|
}
|
|
2273
2276
|
isTouched = false;
|
|
2277
|
+
inputErrorMessage = '';
|
|
2274
2278
|
checkValid = new EventEmitter();
|
|
2275
2279
|
get customValidateStatus() {
|
|
2276
2280
|
const msg = this.errorMessage;
|
|
@@ -2280,8 +2284,12 @@ class ExtendDatePicker {
|
|
|
2280
2284
|
}
|
|
2281
2285
|
return '';
|
|
2282
2286
|
}
|
|
2287
|
+
errorMessages = {
|
|
2288
|
+
required: 'Trường yêu cầu nhập',
|
|
2289
|
+
invalidDate: 'Ngày không hợp lệ',
|
|
2290
|
+
};
|
|
2283
2291
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ExtendDatePicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2284
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.7", type: ExtendDatePicker, isStandalone: true, selector: "extend-date-picker", inputs: { dateFormat: "dateFormat", layOutType: "layOutType", label: "label", placeHolder: "placeHolder", labelAlign: "labelAlign", floatingLabel: "floatingLabel", labelSpan: "labelSpan", labelFlex: "labelFlex", inputFlex: "inputFlex", disabled: "disabled", required: "required", isSubmited: "isSubmited", noBottom: "noBottom", selectModeType: "selectModeType", inputWidth: "inputWidth", inputHeight: "inputHeight", borderBottomOnly: "borderBottomOnly", displayInline: "displayInline", size: "size", minDate: "minDate", maxDate: "maxDate", lstItem: "lstItem", displayField: "displayField", valueField: "valueField", formData: "formData", controlName: "controlName", _ngModel: "_ngModel", isTouched: "isTouched" }, outputs: { _ngModelChange: "_ngModelChange", checkValid: "checkValid" }, ngImport: i0, template: "<div\n class=\"extend-wrapper\"\n [ngClass]=\"[layOutType, floatingLabel ? 'floating-label' : '']\"\n [ngStyle]=\"{ display: displayInline ? 'inline' : null }\"\n>\n @if (controlName) {\n <div [formGroup]=\"formData\">\n <nz-form-item>\n <nz-form-label\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? labelSpan : null\"\n [nzFlex]=\"labelFlex\"\n [nzLabelAlign]=\"labelAlign\"\n [nzRequired]=\"required\"\n [nzFor]=\"controlName\"\n nzNoColon\n nzLabelWrap\n >\n {{ label }}\n </nz-form-label>\n <nz-form-control\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? 24 - labelSpan : null\"\n [nzFlex]=\"inputFlex\"\n [ngClass]=\"{ 'full-width': layOutType == 'vertical' }\"\n [nzErrorTip]=\"
|
|
2292
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.7", type: ExtendDatePicker, isStandalone: true, selector: "extend-date-picker", inputs: { dateFormat: "dateFormat", layOutType: "layOutType", label: "label", placeHolder: "placeHolder", labelAlign: "labelAlign", floatingLabel: "floatingLabel", labelSpan: "labelSpan", labelFlex: "labelFlex", inputFlex: "inputFlex", disabled: "disabled", required: "required", isSubmited: "isSubmited", noBottom: "noBottom", selectModeType: "selectModeType", inputWidth: "inputWidth", inputHeight: "inputHeight", borderBottomOnly: "borderBottomOnly", displayInline: "displayInline", size: "size", minDate: "minDate", maxDate: "maxDate", lstItem: "lstItem", displayField: "displayField", valueField: "valueField", formData: "formData", controlName: "controlName", _ngModel: "_ngModel", isTouched: "isTouched", inputErrorMessage: "inputErrorMessage", errorMessages: "errorMessages" }, outputs: { _ngModelChange: "_ngModelChange", checkValid: "checkValid" }, ngImport: i0, template: "<div\n class=\"extend-wrapper\"\n [ngClass]=\"[layOutType, floatingLabel ? 'floating-label' : '']\"\n [ngStyle]=\"{ display: displayInline ? 'inline' : null }\"\n>\n @if (controlName) {\n <div [formGroup]=\"formData\">\n <nz-form-item>\n <nz-form-label\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? labelSpan : null\"\n [nzFlex]=\"labelFlex\"\n [nzLabelAlign]=\"labelAlign\"\n [nzRequired]=\"required\"\n [nzFor]=\"controlName\"\n nzNoColon\n nzLabelWrap\n >\n {{ label }}\n </nz-form-label>\n <nz-form-control\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? 24 - labelSpan : null\"\n [nzFlex]=\"inputFlex\"\n [ngClass]=\"{ 'full-width': layOutType == 'vertical' }\"\n [nzErrorTip]=\"dynamicErrorTemplate\"\n >\n <nz-date-picker\n class=\"full-width\"\n [nzPlaceHolder]=\"placeHolder || ' '\"\n [nzFormat]=\"dateFormat\"\n [nzSize]=\"size\"\n [formControlName]=\"controlName\"\n [ngStyle]=\"{\n width: inputWidth,\n height: inputHeight,\n }\"\n [ngClass]=\"{\n 'border-bottom-only': borderBottomOnly,\n }\"\n ></nz-date-picker>\n </nz-form-control>\n </nz-form-item>\n\n <ng-template #dynamicErrorTemplate let-control>\n <ng-container *ngFor=\"let error of errorMessages | keyvalue\">\n <ng-container *ngIf=\"control.hasError(error.key)\">\n {{ error.value }}\n </ng-container>\n </ng-container>\n </ng-template>\n </div>\n } @else {\n @if (label) {\n <nz-form-item>\n <nz-form-label\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? labelSpan : null\"\n [nzFlex]=\"labelFlex\"\n [nzLabelAlign]=\"labelAlign\"\n [nzRequired]=\"required\"\n [nzFor]=\"controlName\"\n nzNoColon\n nzLabelWrap\n >\n {{ label }}\n </nz-form-label>\n <nz-form-control\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? 24 - labelSpan : null\"\n [nzFlex]=\"inputFlex\"\n [ngClass]=\"{ 'full-width': layOutType == 'vertical' }\"\n [nzErrorTip]=\"customValidateStatus\"\n [nzValidateStatus]=\"customValidateStatus ? 'error' : ''\"\n >\n <nz-date-picker\n class=\"full-width\"\n [nzPlaceHolder]=\"placeHolder || ' '\"\n [nzFormat]=\"dateFormat\"\n [nzSize]=\"size\"\n [disabled]=\"disabled\"\n [nzDisabledDate]=\"disabledDate\"\n [ngStyle]=\"{\n width: inputWidth,\n height: inputHeight,\n }\"\n [ngClass]=\"{\n 'border-bottom-only': borderBottomOnly,\n }\"\n [(ngModel)]=\"_ngModel\"\n (ngModelChange)=\"onNgModelChange($event)\"\n (blur)=\"onBlur()\"\n ></nz-date-picker>\n </nz-form-control>\n </nz-form-item>\n } @else {\n <nz-date-picker\n class=\"full-width\"\n [ngStyle]=\"{\n width: inputWidth,\n height: inputHeight,\n }\"\n [ngClass]=\"{\n 'border-bottom-only': borderBottomOnly,\n }\"\n [nzSize]=\"size\"\n [nzPlaceHolder]=\"placeHolder || ' '\"\n [nzFormat]=\"dateFormat\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"_ngModel\"\n (ngModelChange)=\"onNgModelChange($event)\"\n ></nz-date-picker>\n }\n }\n</div>\n", styles: ["::ng-deep .extend-wrapper.vertical .ant-form-vertical .ant-form-item-label,::ng-deep .extend-wrapper.vertical .ant-col-24.ant-form-item-label,::ng-deep .extend-wrapper.vertical .ant-col-xl-24.ant-form-item-label{padding:0}::ng-deep .floating-label{position:relative;padding-top:14px}::ng-deep .floating-label nz-form-item nz-form-label{position:absolute;top:0;left:6px;background:#fff;z-index:10;font-weight:700;height:18px}::ng-deep .floating-label nz-form-item nz-form-label label{font-size:12px;color:#595959;padding:0 6px;height:18px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1$3.KeyValuePipe, name: "keyvalue" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: NzFormModule }, { kind: "directive", type: i4.NzColDirective, selector: "[nz-col],nz-col,nz-form-control,nz-form-label", inputs: ["nzFlex", "nzSpan", "nzOrder", "nzOffset", "nzPush", "nzPull", "nzXs", "nzSm", "nzMd", "nzLg", "nzXl", "nzXXl"], exportAs: ["nzCol"] }, { kind: "directive", type: i4.NzRowDirective, selector: "[nz-row],nz-row,nz-form-item", inputs: ["nzAlign", "nzJustify", "nzGutter"], exportAs: ["nzRow"] }, { kind: "component", type: i5.NzFormItemComponent, selector: "nz-form-item", exportAs: ["nzFormItem"] }, { kind: "component", type: i5.NzFormLabelComponent, selector: "nz-form-label", inputs: ["nzFor", "nzRequired", "nzNoColon", "nzTooltipTitle", "nzTooltipIcon", "nzLabelAlign", "nzLabelWrap"], exportAs: ["nzFormLabel"] }, { kind: "component", type: i5.NzFormControlComponent, selector: "nz-form-control", inputs: ["nzSuccessTip", "nzWarningTip", "nzErrorTip", "nzValidatingTip", "nzExtra", "nzAutoTips", "nzDisableAutoTips", "nzHasFeedback", "nzValidateStatus"], exportAs: ["nzFormControl"] }, { kind: "ngmodule", type: NzDatePickerModule }, { kind: "component", type: i5$1.NzDatePickerComponent, selector: "nz-date-picker,nz-week-picker,nz-month-picker,nz-quarter-picker,nz-year-picker,nz-range-picker", inputs: ["nzAllowClear", "nzAutoFocus", "nzDisabled", "nzBorderless", "nzInputReadOnly", "nzInline", "nzOpen", "nzDisabledDate", "nzLocale", "nzPlaceHolder", "nzPopupStyle", "nzDropdownClassName", "nzSize", "nzStatus", "nzFormat", "nzDateRender", "nzDisabledTime", "nzRenderExtraFooter", "nzShowToday", "nzMode", "nzShowNow", "nzRanges", "nzDefaultPickerValue", "nzSeparator", "nzSuffixIcon", "nzBackdrop", "nzId", "nzPlacement", "nzShowWeekNumber", "nzShowTime"], outputs: ["nzOnPanelChange", "nzOnCalendarChange", "nzOnOk", "nzOnOpenChange"], exportAs: ["nzDatePicker"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: DateInputParserDirective, selector: "nz-date-picker", inputs: ["format"] }] });
|
|
2285
2293
|
}
|
|
2286
2294
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ExtendDatePicker, decorators: [{
|
|
2287
2295
|
type: Component,
|
|
@@ -2293,7 +2301,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
|
|
|
2293
2301
|
NzDatePickerModule,
|
|
2294
2302
|
TranslateModule,
|
|
2295
2303
|
DateInputParserDirective,
|
|
2296
|
-
], template: "<div\n class=\"extend-wrapper\"\n [ngClass]=\"[layOutType, floatingLabel ? 'floating-label' : '']\"\n [ngStyle]=\"{ display: displayInline ? 'inline' : null }\"\n>\n @if (controlName) {\n <div [formGroup]=\"formData\">\n <nz-form-item>\n <nz-form-label\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? labelSpan : null\"\n [nzFlex]=\"labelFlex\"\n [nzLabelAlign]=\"labelAlign\"\n [nzRequired]=\"required\"\n [nzFor]=\"controlName\"\n nzNoColon\n nzLabelWrap\n >\n {{ label }}\n </nz-form-label>\n <nz-form-control\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? 24 - labelSpan : null\"\n [nzFlex]=\"inputFlex\"\n [ngClass]=\"{ 'full-width': layOutType == 'vertical' }\"\n [nzErrorTip]=\"
|
|
2304
|
+
], template: "<div\n class=\"extend-wrapper\"\n [ngClass]=\"[layOutType, floatingLabel ? 'floating-label' : '']\"\n [ngStyle]=\"{ display: displayInline ? 'inline' : null }\"\n>\n @if (controlName) {\n <div [formGroup]=\"formData\">\n <nz-form-item>\n <nz-form-label\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? labelSpan : null\"\n [nzFlex]=\"labelFlex\"\n [nzLabelAlign]=\"labelAlign\"\n [nzRequired]=\"required\"\n [nzFor]=\"controlName\"\n nzNoColon\n nzLabelWrap\n >\n {{ label }}\n </nz-form-label>\n <nz-form-control\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? 24 - labelSpan : null\"\n [nzFlex]=\"inputFlex\"\n [ngClass]=\"{ 'full-width': layOutType == 'vertical' }\"\n [nzErrorTip]=\"dynamicErrorTemplate\"\n >\n <nz-date-picker\n class=\"full-width\"\n [nzPlaceHolder]=\"placeHolder || ' '\"\n [nzFormat]=\"dateFormat\"\n [nzSize]=\"size\"\n [formControlName]=\"controlName\"\n [ngStyle]=\"{\n width: inputWidth,\n height: inputHeight,\n }\"\n [ngClass]=\"{\n 'border-bottom-only': borderBottomOnly,\n }\"\n ></nz-date-picker>\n </nz-form-control>\n </nz-form-item>\n\n <ng-template #dynamicErrorTemplate let-control>\n <ng-container *ngFor=\"let error of errorMessages | keyvalue\">\n <ng-container *ngIf=\"control.hasError(error.key)\">\n {{ error.value }}\n </ng-container>\n </ng-container>\n </ng-template>\n </div>\n } @else {\n @if (label) {\n <nz-form-item>\n <nz-form-label\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? labelSpan : null\"\n [nzFlex]=\"labelFlex\"\n [nzLabelAlign]=\"labelAlign\"\n [nzRequired]=\"required\"\n [nzFor]=\"controlName\"\n nzNoColon\n nzLabelWrap\n >\n {{ label }}\n </nz-form-label>\n <nz-form-control\n [nzSpan]=\"layOutType == 'horizontal' && !labelFlex ? 24 - labelSpan : null\"\n [nzFlex]=\"inputFlex\"\n [ngClass]=\"{ 'full-width': layOutType == 'vertical' }\"\n [nzErrorTip]=\"customValidateStatus\"\n [nzValidateStatus]=\"customValidateStatus ? 'error' : ''\"\n >\n <nz-date-picker\n class=\"full-width\"\n [nzPlaceHolder]=\"placeHolder || ' '\"\n [nzFormat]=\"dateFormat\"\n [nzSize]=\"size\"\n [disabled]=\"disabled\"\n [nzDisabledDate]=\"disabledDate\"\n [ngStyle]=\"{\n width: inputWidth,\n height: inputHeight,\n }\"\n [ngClass]=\"{\n 'border-bottom-only': borderBottomOnly,\n }\"\n [(ngModel)]=\"_ngModel\"\n (ngModelChange)=\"onNgModelChange($event)\"\n (blur)=\"onBlur()\"\n ></nz-date-picker>\n </nz-form-control>\n </nz-form-item>\n } @else {\n <nz-date-picker\n class=\"full-width\"\n [ngStyle]=\"{\n width: inputWidth,\n height: inputHeight,\n }\"\n [ngClass]=\"{\n 'border-bottom-only': borderBottomOnly,\n }\"\n [nzSize]=\"size\"\n [nzPlaceHolder]=\"placeHolder || ' '\"\n [nzFormat]=\"dateFormat\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"_ngModel\"\n (ngModelChange)=\"onNgModelChange($event)\"\n ></nz-date-picker>\n }\n }\n</div>\n", styles: ["::ng-deep .extend-wrapper.vertical .ant-form-vertical .ant-form-item-label,::ng-deep .extend-wrapper.vertical .ant-col-24.ant-form-item-label,::ng-deep .extend-wrapper.vertical .ant-col-xl-24.ant-form-item-label{padding:0}::ng-deep .floating-label{position:relative;padding-top:14px}::ng-deep .floating-label nz-form-item nz-form-label{position:absolute;top:0;left:6px;background:#fff;z-index:10;font-weight:700;height:18px}::ng-deep .floating-label nz-form-item nz-form-label label{font-size:12px;color:#595959;padding:0 6px;height:18px}\n"] }]
|
|
2297
2305
|
}], propDecorators: { dateFormat: [{
|
|
2298
2306
|
type: Input
|
|
2299
2307
|
}], layOutType: [{
|
|
@@ -2352,8 +2360,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
|
|
|
2352
2360
|
type: Output
|
|
2353
2361
|
}], isTouched: [{
|
|
2354
2362
|
type: Input
|
|
2363
|
+
}], inputErrorMessage: [{
|
|
2364
|
+
type: Input
|
|
2355
2365
|
}], checkValid: [{
|
|
2356
2366
|
type: Output
|
|
2367
|
+
}], errorMessages: [{
|
|
2368
|
+
type: Input
|
|
2357
2369
|
}] } });
|
|
2358
2370
|
|
|
2359
2371
|
class ExtendDateRangePicker {
|