@brggroup/share-lib 0.1.26 → 0.1.28

package/fesm2022/brggroup-share-lib.mjs

@@ -30,7 +30,7 @@ import * as i5 from 'ng-zorro-antd/form';
 import { NzFormModule } from 'ng-zorro-antd/form';
 import * as i5$1 from 'ng-zorro-antd/date-picker';
 import { NzDatePickerModule } from 'ng-zorro-antd/date-picker';
-import { startOfWeek, endOfWeek, subWeeks, startOfMonth, endOfMonth, subMonths } from 'date-fns';
+import { parse, isValid, startOfWeek, endOfWeek, subWeeks, startOfMonth, endOfMonth, subMonths } from 'date-fns';
 import * as i6 from 'ng-zorro-antd/input-number';
 import { NzInputNumberModule } from 'ng-zorro-antd/input-number';
 import * as i6$1 from 'ng-zorro-antd/input';
@@ -1979,10 +1979,27 @@ class DateTimeHelper {
         return n.toString().padStart(2, '0');
     }
     static parser(dateStr) {
-        if (!dateStr.includes('/')) {
-            dateStr = this.formatNumberToDate(dateStr);
-        }
-        const parts = dateStr.split('/');
+        if (!dateStr)
+            return '';
+        dateStr = dateStr.trim();
+        let timeStr = '00:00'; // Mặc định giờ/phút nếu người dùng không nhập
+        let datePart = dateStr;
+        // 1. Tách phần Giờ và phần Ngày nếu chuỗi có chứa khoảng trắng
+        if (dateStr.includes(' ')) {
+            const splitBySpace = dateStr.split(' ');
+            // Tìm xem phần nào chứa ':' (giờ) và phần nào chứa '/' (ngày) hoặc số
+            const hasTime = splitBySpace.find((s) => s.includes(':'));
+            const hasDate = splitBySpace.find((s) => !s.includes(':'));
+            if (hasTime)
+                timeStr = hasTime;
+            if (hasDate)
+                datePart = hasDate;
+        }
+        // 2. Xử lý DatePart (Logic cũ của bạn)
+        if (!datePart.includes('/')) {
+            datePart = this.formatNumberToDate(datePart);
+        }
+        const parts = datePart.split('/');
         const current = new Date();
         let normalizedValue = '';
         if (parts.length === 1 && /^\d{1,2}$/.test(parts[0])) {
@@ -1995,15 +2012,28 @@ class DateTimeHelper {
         }
         else {
             // Đã đủ 3 phần
-            normalizedValue = dateStr;
+            normalizedValue = datePart;
         }
+        // 3. Xử lý TimePart & Parse thành Date
         if (normalizedValue) {
-            const parts = normalizedValue.split('/');
-            const day = +parts[0];
-            const month = +parts[1];
-            const year = +parts[2];
+            const dateParts = normalizedValue.split('/');
+            const day = +dateParts[0];
+            const month = +dateParts[1];
+            const year = +dateParts[2];
+            let hours = 0;
+            let minutes = 0;
+            if (timeStr.includes(':')) {
+                const timeParts = timeStr.split(':');
+                hours = +timeParts[0] || 0;
+                minutes = +timeParts[1] || 0;
+            }
+            // Giả định DateTimeHelper.isValidDate của bạn vẫn chỉ check valid ngày/tháng/năm
             if (DateTimeHelper.isValidDate(year, month, day)) {
-                return DateTimeHelper.createDate(year, month, day);
+                // Lưu ý: Nếu DateTimeHelper.createDate của bạn chưa hỗ trợ truyền hours/minutes,
+                // bạn có thể trả về trực tiếp new Date() như sau:
+                return new Date(year, month - 1, day, hours, minutes);
+                // Hoặc nếu bạn nâng cấp hàm createDate:
+                // return DateTimeHelper.createDate(year, month, day, hours, minutes);
             }
         }
         return '';
@@ -2131,34 +2161,43 @@ class DateInputParserDirective {
         this.ngControl = ngControl;
     }
     ngAfterViewInit() {
-        // Tìm thẻ input bên trong nz-date-picker
         this.inputElement = this.el.nativeElement.querySelector('input');
-        // Gắn listener blur vào input
         if (this.inputElement) {
             this.inputElement.addEventListener('blur', this.blurHandler);
         }
     }
     ngOnDestroy() {
-        // Cleanup blur listener để tránh memory leak
         if (this.inputElement) {
             this.inputElement.removeEventListener('blur', this.blurHandler);
         }
     }
     onEnter() {
         this.tryParseAndSet();
-        this.inputElement?.blur(); // Blur sau khi enter nếu muốn trigger binding ngoài
+        this.inputElement?.blur();
     }
     tryParseAndSet() {
         if (!this.inputElement)
             return;
         const rawValue = this.inputElement.value.trim();
-        const parsed = DateTimeHelper.parser(rawValue);
-        if (parsed) {
-            this.ngControl?.control?.setValue(parsed);
+        if (!rawValue)
+            return;
+        // 1. Cố gắng parse bằng date-fns với format truyền vào (ví dụ: 'HH:mm dd/MM/yyyy')
+        const parsedDate = parse(rawValue, this.format, new Date());
+        if (isValid(parsedDate)) {
+            // Nếu parse thành công theo format -> set value
+            this.ngControl?.control?.setValue(parsedDate);
+        }
+        else {
+            // 2. (Tùy chọn) Fallback lại hàm parser cũ nếu người dùng nhập sai format
+            // nhưng helper của bạn có khả năng "đoán" được
+            const fallbackParsed = DateTimeHelper.parser(rawValue);
+            if (fallbackParsed) {
+                this.ngControl?.control?.setValue(fallbackParsed);
+            }
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DateInputParserDirective, deps: [{ token: i0.ElementRef }, { token: i2$1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.7", type: DateInputParserDirective, isStandalone: true, selector: "nz-date-picker", inputs: { format: "format" }, host: { listeners: { "keyup.enter": "onEnter()" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.7", type: DateInputParserDirective, isStandalone: true, selector: "nz-date-picker", inputs: { format: ["nzFormat", "format"] }, host: { listeners: { "keyup.enter": "onEnter()" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: DateInputParserDirective, decorators: [{
             type: Directive,
@@ -2171,7 +2210,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
                     type: Self
                 }] }], propDecorators: { format: [{
                 type: Input,
-                args: ['format']
+                args: ['nzFormat']
             }], onEnter: [{
                 type: HostListener,
                 args: ['keyup.enter']
@@ -2184,6 +2223,7 @@ class ExtendDatePicker {
     placeHolder = '';
     labelAlign = 'left';
     floatingLabel = false;
+    showTime = false;
     /**
      * default = 8
      */
@@ -2291,7 +2331,7 @@ class ExtendDatePicker {
         invalidDate: 'Ngày không hợp lệ',
     };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ExtendDatePicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    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" }, 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"] }] });
+    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", showTime: "showTime", 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" }, 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            [nzShowTime]=\"showTime\"\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            [nzShowTime]=\"showTime\"\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        [nzShowTime]=\"showTime\"\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: ["nzFormat"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ExtendDatePicker, decorators: [{
             type: Component,
@@ -2303,7 +2343,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
                         NzDatePickerModule,
                         TranslateModule,
                         DateInputParserDirective,
-                    ], 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"] }]
+                    ], 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            [nzShowTime]=\"showTime\"\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            [nzShowTime]=\"showTime\"\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        [nzShowTime]=\"showTime\"\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"] }]
         }], propDecorators: { dateFormat: [{
                 type: Input
             }], layOutType: [{
@@ -2316,6 +2356,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
                 type: Input
             }], floatingLabel: [{
                 type: Input
+            }], showTime: [{
+                type: Input
             }], labelSpan: [{
                 type: Input
             }], labelFlex: [{
@@ -6585,68 +6627,6 @@ const fadeSlide = trigger('fadeSlide', [
     ]),
 ]);
 
-class LayoutUser extends BaseComponent {
-    cms = inject(CommonService);
-    authService = inject(AuthService);
-    sessionManager = inject(SessionManagerService);
-    breakpointObserver = inject(BreakpointObserver);
-    TokenStorage = TokenStorage;
-    isXSmall = false;
-    lstOrg = [];
-    ngOnInit() {
-        this.breakpointObserver.observe([Breakpoints.XSmall, Breakpoints.Small]).subscribe((result) => {
-            this.isXSmall = result.matches;
-        });
-        this.getLstOrg();
-    }
-    getLstOrg() {
-        this.cms
-            .ESP({
-            SPN: 'App_User_getLstOrg',
-        })
-            .then((res) => (this.lstOrg = res.Data), (err) => this.handleError(err));
-    }
-    async changeOrg(org) {
-        if (await this.confirm(`Chuyển sang đơn vị: ${org.Name}`)) {
-            this.authService.changeOrg(org).then(async (res) => {
-                if (res) {
-                    await this.notiService.success(`Đã chuyển sang đơn vị: ${org.Name}`, '', true);
-                    window.location.reload();
-                }
-            }, (err) => this.handleError(err));
-        }
-    }
-    gotoSetting() {
-        this.goto('/admin/user_profile');
-    }
-    logout() {
-        this.sessionManager.logout();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: LayoutUser, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.7", type: LayoutUser, isStandalone: true, selector: "layout-user", usesInheritance: true, ngImport: i0, template: "<nz-badge [nzSize]=\"'small'\" [nzCount]=\"0\">\n  <button nz-button nzType=\"text\" nzSize=\"small\">\n    <nz-icon nzType=\"bell\" nzTheme=\"outline\" style=\"color: #ffffff\" />\n  </button>\n</nz-badge>\n\n<button\n  *ngIf=\"!isXSmall && TokenStorage.getOrgName()\"\n  [@fadeInOut]\n  nz-button\n  nzType=\"text\"\n  nz-dropdown\n  [nzDropdownMenu]=\"menuOrg\"\n  [nzTrigger]=\"'click'\"\n  style=\"height: 50px; color: #ffffff\"\n>\n  <nz-icon nzType=\"cluster\" nzTheme=\"outline\" />\n  {{ TokenStorage.getOrgName() }}\n</button>\n\n<nz-dropdown-menu #menuOrg=\"nzDropdownMenu\">\n  <ul nz-menu>\n    @for (org of lstOrg; track $index) {\n      <li *ngIf=\"$index > 0\" nz-menu-divider></li>\n      <li nz-menu-item (click)=\"changeOrg(org)\">\n        <nz-icon nzType=\"swap\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ org.Name }}\n      </li>\n    }\n  </ul>\n</nz-dropdown-menu>\n\n<button\n  nz-button\n  nzType=\"text\"\n  nz-dropdown\n  [nzDropdownMenu]=\"menuUser\"\n  [nzTrigger]=\"'click'\"\n  style=\"height: 50px; color: #ffffff\"\n>\n  <nz-icon nzType=\"user\" nzTheme=\"outline\" />\n  {{ TokenStorage.getUserFullname() }}\n</button>\n\n<nz-dropdown-menu #menuUser=\"nzDropdownMenu\">\n  <ul nz-menu>\n    <li *ngIf=\"!(!isXSmall && TokenStorage.getOrgName())\" nz-menu-item>\n      <nz-icon nzType=\"cluster\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TokenStorage.getOrgName() }}\n    </li>\n    <li *ngIf=\"!(!isXSmall && TokenStorage.getOrgName())\" nz-menu-divider></li>\n    <li nz-menu-item (click)=\"gotoSetting()\">\n      <nz-icon nzType=\"setting\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TranslateKey.SETTING | translate }}\n    </li>\n    <li nz-menu-divider></li>\n    <li nz-menu-item (click)=\"logout()\">\n      <nz-icon nzType=\"logout\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TranslateKey.LOGOUT | translate }}\n    </li>\n  </ul>\n</nz-dropdown-menu>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: NzLayoutModule }, { kind: "ngmodule", type: NzIconModule }, { kind: "directive", type: i1$2.NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "ngmodule", type: NzDropDownModule }, { kind: "directive", type: i4$2.NzMenuDirective, selector: "[nz-menu]", inputs: ["nzInlineIndent", "nzTheme", "nzMode", "nzInlineCollapsed", "nzSelectable"], outputs: ["nzClick"], exportAs: ["nzMenu"] }, { kind: "component", type: i4$2.NzMenuItemComponent, selector: "[nz-menu-item]", inputs: ["nzPaddingLeft", "nzDisabled", "nzSelected", "nzDanger", "nzMatchRouterExact", "nzMatchRouter"], exportAs: ["nzMenuItem"] }, { kind: "directive", type: i4$2.NzMenuDividerDirective, selector: "[nz-menu-divider]", exportAs: ["nzMenuDivider"] }, { kind: "directive", type: i5$3.NzDropDownDirective, selector: "[nz-dropdown]", inputs: ["nzDropdownMenu", "nzTrigger", "nzMatchWidthElement", "nzBackdrop", "nzClickHide", "nzDisabled", "nzVisible", "nzOverlayClassName", "nzOverlayStyle", "nzPlacement"], outputs: ["nzVisibleChange"], exportAs: ["nzDropdown"] }, { kind: "component", type: i5$3.NzDropdownMenuComponent, selector: "nz-dropdown-menu", exportAs: ["nzDropdownMenu"] }, { kind: "directive", type: i5$3.NzDropdownButtonDirective, selector: "[nz-button][nz-dropdown]" }, { kind: "ngmodule", type: NzGridModule }, { kind: "ngmodule", type: NzFlexModule }, { kind: "ngmodule", type: NzButtonModule }, { kind: "component", type: i8.NzButtonComponent, selector: "button[nz-button], a[nz-button]", inputs: ["nzBlock", "nzGhost", "nzSearch", "nzLoading", "nzDanger", "disabled", "tabIndex", "nzType", "nzShape", "nzSize"], exportAs: ["nzButton"] }, { kind: "directive", type: i9.ɵNzTransitionPatchDirective, selector: "[nz-button], nz-button-group, [nz-icon], nz-icon, [nz-menu-item], [nz-submenu], nz-select-top-control, nz-select-placeholder, nz-input-group", inputs: ["hidden"] }, { kind: "ngmodule", type: NzTreeModule }, { kind: "ngmodule", type: NzBackTopModule }, { kind: "ngmodule", type: NzDrawerModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: NzInputModule }, { kind: "ngmodule", type: NzSegmentedModule }, { kind: "ngmodule", type: NzBadgeModule }, { kind: "component", type: i8$1.NzBadgeComponent, selector: "nz-badge", inputs: ["nzShowZero", "nzShowDot", "nzStandalone", "nzDot", "nzOverflowCount", "nzColor", "nzStyle", "nzText", "nzTitle", "nzStatus", "nzCount", "nzOffset", "nzSize"], exportAs: ["nzBadge"] }], animations: [fadeInOut] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: LayoutUser, decorators: [{
-            type: Component,
-            args: [{ selector: 'layout-user', imports: [
-                        CommonModule,
-                        TranslateModule,
-                        NzLayoutModule,
-                        NzIconModule,
-                        NzDropDownModule,
-                        NzGridModule,
-                        NzFlexModule,
-                        NzButtonModule,
-                        NzTreeModule,
-                        NzBackTopModule,
-                        NzDrawerModule,
-                        FormsModule,
-                        NzInputModule,
-                        NzTreeModule,
-                        NzSegmentedModule,
-                        NzBadgeModule,
-                    ], animations: [fadeInOut], template: "<nz-badge [nzSize]=\"'small'\" [nzCount]=\"0\">\n  <button nz-button nzType=\"text\" nzSize=\"small\">\n    <nz-icon nzType=\"bell\" nzTheme=\"outline\" style=\"color: #ffffff\" />\n  </button>\n</nz-badge>\n\n<button\n  *ngIf=\"!isXSmall && TokenStorage.getOrgName()\"\n  [@fadeInOut]\n  nz-button\n  nzType=\"text\"\n  nz-dropdown\n  [nzDropdownMenu]=\"menuOrg\"\n  [nzTrigger]=\"'click'\"\n  style=\"height: 50px; color: #ffffff\"\n>\n  <nz-icon nzType=\"cluster\" nzTheme=\"outline\" />\n  {{ TokenStorage.getOrgName() }}\n</button>\n\n<nz-dropdown-menu #menuOrg=\"nzDropdownMenu\">\n  <ul nz-menu>\n    @for (org of lstOrg; track $index) {\n      <li *ngIf=\"$index > 0\" nz-menu-divider></li>\n      <li nz-menu-item (click)=\"changeOrg(org)\">\n        <nz-icon nzType=\"swap\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ org.Name }}\n      </li>\n    }\n  </ul>\n</nz-dropdown-menu>\n\n<button\n  nz-button\n  nzType=\"text\"\n  nz-dropdown\n  [nzDropdownMenu]=\"menuUser\"\n  [nzTrigger]=\"'click'\"\n  style=\"height: 50px; color: #ffffff\"\n>\n  <nz-icon nzType=\"user\" nzTheme=\"outline\" />\n  {{ TokenStorage.getUserFullname() }}\n</button>\n\n<nz-dropdown-menu #menuUser=\"nzDropdownMenu\">\n  <ul nz-menu>\n    <li *ngIf=\"!(!isXSmall && TokenStorage.getOrgName())\" nz-menu-item>\n      <nz-icon nzType=\"cluster\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TokenStorage.getOrgName() }}\n    </li>\n    <li *ngIf=\"!(!isXSmall && TokenStorage.getOrgName())\" nz-menu-divider></li>\n    <li nz-menu-item (click)=\"gotoSetting()\">\n      <nz-icon nzType=\"setting\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TranslateKey.SETTING | translate }}\n    </li>\n    <li nz-menu-divider></li>\n    <li nz-menu-item (click)=\"logout()\">\n      <nz-icon nzType=\"logout\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TranslateKey.LOGOUT | translate }}\n    </li>\n  </ul>\n</nz-dropdown-menu>\n" }]
-        }] });
-
 const URLs$2 = {
     getById: '/api/App_Setting/GetById',
     getAll: '/api/App_Setting/GetAll',
@@ -6716,6 +6696,77 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
                 }]
         }] });
 
+class LayoutUser extends BaseComponent {
+    cms = inject(CommonService);
+    authService = inject(AuthService);
+    sessionManager = inject(SessionManagerService);
+    breakpointObserver = inject(BreakpointObserver);
+    settingService = inject(SettingService);
+    TokenStorage = TokenStorage;
+    isXSmall = false;
+    lstOrg = [];
+    isOneUserMultiOrgs = false;
+    ngOnInit() {
+        this.breakpointObserver.observe([Breakpoints.XSmall, Breakpoints.Small]).subscribe((result) => {
+            this.isXSmall = result.matches;
+        });
+        this.settingService.getByCodeAnonymous('ONE_USER_MULTI_ORGS').then((res) => {
+            if (res?.Data) {
+                if (res.Data == '1') {
+                    this.isOneUserMultiOrgs = true;
+                    this.getLstOrg();
+                }
+            }
+        }, (err) => this.handleError(err));
+    }
+    getLstOrg() {
+        this.cms
+            .ESP({
+            SPN: 'App_User_getLstOrg',
+        })
+            .then((res) => (this.lstOrg = res.Data), (err) => this.handleError(err));
+    }
+    async changeOrg(org) {
+        if (await this.confirm(`Chuyển sang đơn vị: ${org.Name}`)) {
+            this.authService.changeOrg(org).then(async (res) => {
+                if (res) {
+                    await this.notiService.success(`Đã chuyển sang đơn vị: ${org.Name}`, '', true);
+                    window.location.reload();
+                }
+            }, (err) => this.handleError(err));
+        }
+    }
+    gotoSetting() {
+        this.goto('/admin/user_profile');
+    }
+    logout() {
+        this.sessionManager.logout();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: LayoutUser, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.7", type: LayoutUser, isStandalone: true, selector: "layout-user", usesInheritance: true, ngImport: i0, template: "<nz-badge [nzSize]=\"'small'\" [nzCount]=\"0\">\n  <button nz-button nzType=\"text\" nzSize=\"small\">\n    <nz-icon nzType=\"bell\" nzTheme=\"outline\" style=\"color: #ffffff\" />\n  </button>\n</nz-badge>\n\n<button\n  *ngIf=\"!isXSmall && TokenStorage.getOrgName()\"\n  [@fadeInOut]\n  nz-button\n  nzType=\"text\"\n  nz-dropdown\n  [nzDropdownMenu]=\"isOneUserMultiOrgs ? menuOrg : null\"\n  [nzTrigger]=\"'click'\"\n  style=\"height: 50px; color: #ffffff\"\n>\n  <nz-icon nzType=\"cluster\" nzTheme=\"outline\" />\n  {{ TokenStorage.getOrgName() }}\n</button>\n\n<nz-dropdown-menu #menuOrg=\"nzDropdownMenu\">\n  <ul nz-menu>\n    @for (org of lstOrg; track $index) {\n      <li *ngIf=\"$index > 0\" nz-menu-divider></li>\n      <li nz-menu-item (click)=\"changeOrg(org)\">\n        <nz-icon nzType=\"swap\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ org.Name }}\n      </li>\n    }\n  </ul>\n</nz-dropdown-menu>\n\n<button\n  nz-button\n  nzType=\"text\"\n  nz-dropdown\n  [nzDropdownMenu]=\"menuUser\"\n  [nzTrigger]=\"'click'\"\n  style=\"height: 50px; color: #ffffff\"\n>\n  <nz-icon nzType=\"user\" nzTheme=\"outline\" />\n  {{ TokenStorage.getUserFullname() }}\n</button>\n\n<nz-dropdown-menu #menuUser=\"nzDropdownMenu\">\n  <ul nz-menu>\n    <li *ngIf=\"!(!isXSmall && TokenStorage.getOrgName())\" nz-menu-item>\n      <nz-icon nzType=\"cluster\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TokenStorage.getOrgName() }}\n    </li>\n    <li *ngIf=\"!(!isXSmall && TokenStorage.getOrgName())\" nz-menu-divider></li>\n    <li nz-menu-item (click)=\"gotoSetting()\">\n      <nz-icon nzType=\"setting\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TranslateKey.SETTING | translate }}\n    </li>\n    <li nz-menu-divider></li>\n    <li nz-menu-item (click)=\"logout()\">\n      <nz-icon nzType=\"logout\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TranslateKey.LOGOUT | translate }}\n    </li>\n  </ul>\n</nz-dropdown-menu>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: NzLayoutModule }, { kind: "ngmodule", type: NzIconModule }, { kind: "directive", type: i1$2.NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "ngmodule", type: NzDropDownModule }, { kind: "directive", type: i4$2.NzMenuDirective, selector: "[nz-menu]", inputs: ["nzInlineIndent", "nzTheme", "nzMode", "nzInlineCollapsed", "nzSelectable"], outputs: ["nzClick"], exportAs: ["nzMenu"] }, { kind: "component", type: i4$2.NzMenuItemComponent, selector: "[nz-menu-item]", inputs: ["nzPaddingLeft", "nzDisabled", "nzSelected", "nzDanger", "nzMatchRouterExact", "nzMatchRouter"], exportAs: ["nzMenuItem"] }, { kind: "directive", type: i4$2.NzMenuDividerDirective, selector: "[nz-menu-divider]", exportAs: ["nzMenuDivider"] }, { kind: "directive", type: i5$3.NzDropDownDirective, selector: "[nz-dropdown]", inputs: ["nzDropdownMenu", "nzTrigger", "nzMatchWidthElement", "nzBackdrop", "nzClickHide", "nzDisabled", "nzVisible", "nzOverlayClassName", "nzOverlayStyle", "nzPlacement"], outputs: ["nzVisibleChange"], exportAs: ["nzDropdown"] }, { kind: "component", type: i5$3.NzDropdownMenuComponent, selector: "nz-dropdown-menu", exportAs: ["nzDropdownMenu"] }, { kind: "directive", type: i5$3.NzDropdownButtonDirective, selector: "[nz-button][nz-dropdown]" }, { kind: "ngmodule", type: NzGridModule }, { kind: "ngmodule", type: NzFlexModule }, { kind: "ngmodule", type: NzButtonModule }, { kind: "component", type: i8.NzButtonComponent, selector: "button[nz-button], a[nz-button]", inputs: ["nzBlock", "nzGhost", "nzSearch", "nzLoading", "nzDanger", "disabled", "tabIndex", "nzType", "nzShape", "nzSize"], exportAs: ["nzButton"] }, { kind: "directive", type: i9.ɵNzTransitionPatchDirective, selector: "[nz-button], nz-button-group, [nz-icon], nz-icon, [nz-menu-item], [nz-submenu], nz-select-top-control, nz-select-placeholder, nz-input-group", inputs: ["hidden"] }, { kind: "ngmodule", type: NzTreeModule }, { kind: "ngmodule", type: NzBackTopModule }, { kind: "ngmodule", type: NzDrawerModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: NzInputModule }, { kind: "ngmodule", type: NzSegmentedModule }, { kind: "ngmodule", type: NzBadgeModule }, { kind: "component", type: i8$1.NzBadgeComponent, selector: "nz-badge", inputs: ["nzShowZero", "nzShowDot", "nzStandalone", "nzDot", "nzOverflowCount", "nzColor", "nzStyle", "nzText", "nzTitle", "nzStatus", "nzCount", "nzOffset", "nzSize"], exportAs: ["nzBadge"] }], animations: [fadeInOut] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: LayoutUser, decorators: [{
+            type: Component,
+            args: [{ selector: 'layout-user', imports: [
+                        CommonModule,
+                        TranslateModule,
+                        NzLayoutModule,
+                        NzIconModule,
+                        NzDropDownModule,
+                        NzGridModule,
+                        NzFlexModule,
+                        NzButtonModule,
+                        NzTreeModule,
+                        NzBackTopModule,
+                        NzDrawerModule,
+                        FormsModule,
+                        NzInputModule,
+                        NzTreeModule,
+                        NzSegmentedModule,
+                        NzBadgeModule,
+                    ], animations: [fadeInOut], template: "<nz-badge [nzSize]=\"'small'\" [nzCount]=\"0\">\n  <button nz-button nzType=\"text\" nzSize=\"small\">\n    <nz-icon nzType=\"bell\" nzTheme=\"outline\" style=\"color: #ffffff\" />\n  </button>\n</nz-badge>\n\n<button\n  *ngIf=\"!isXSmall && TokenStorage.getOrgName()\"\n  [@fadeInOut]\n  nz-button\n  nzType=\"text\"\n  nz-dropdown\n  [nzDropdownMenu]=\"isOneUserMultiOrgs ? menuOrg : null\"\n  [nzTrigger]=\"'click'\"\n  style=\"height: 50px; color: #ffffff\"\n>\n  <nz-icon nzType=\"cluster\" nzTheme=\"outline\" />\n  {{ TokenStorage.getOrgName() }}\n</button>\n\n<nz-dropdown-menu #menuOrg=\"nzDropdownMenu\">\n  <ul nz-menu>\n    @for (org of lstOrg; track $index) {\n      <li *ngIf=\"$index > 0\" nz-menu-divider></li>\n      <li nz-menu-item (click)=\"changeOrg(org)\">\n        <nz-icon nzType=\"swap\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ org.Name }}\n      </li>\n    }\n  </ul>\n</nz-dropdown-menu>\n\n<button\n  nz-button\n  nzType=\"text\"\n  nz-dropdown\n  [nzDropdownMenu]=\"menuUser\"\n  [nzTrigger]=\"'click'\"\n  style=\"height: 50px; color: #ffffff\"\n>\n  <nz-icon nzType=\"user\" nzTheme=\"outline\" />\n  {{ TokenStorage.getUserFullname() }}\n</button>\n\n<nz-dropdown-menu #menuUser=\"nzDropdownMenu\">\n  <ul nz-menu>\n    <li *ngIf=\"!(!isXSmall && TokenStorage.getOrgName())\" nz-menu-item>\n      <nz-icon nzType=\"cluster\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TokenStorage.getOrgName() }}\n    </li>\n    <li *ngIf=\"!(!isXSmall && TokenStorage.getOrgName())\" nz-menu-divider></li>\n    <li nz-menu-item (click)=\"gotoSetting()\">\n      <nz-icon nzType=\"setting\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TranslateKey.SETTING | translate }}\n    </li>\n    <li nz-menu-divider></li>\n    <li nz-menu-item (click)=\"logout()\">\n      <nz-icon nzType=\"logout\" nzTheme=\"outline\" />&nbsp;&nbsp; {{ TranslateKey.LOGOUT | translate }}\n    </li>\n  </ul>\n</nz-dropdown-menu>\n" }]
+        }] });
+
 const URLs$1 = {
     getById: '/api/file/GetById',
     getAll: '/api/file/GetAll',