ng-ipa-library 6.2.18 → 6.2.20
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.
|
@@ -1056,10 +1056,8 @@ class DatepickerComponent {
|
|
|
1056
1056
|
this.cd.detectChanges();
|
|
1057
1057
|
if (this.isPlatformCodeDesignSystem) {
|
|
1058
1058
|
this.initCustomDropdowns();
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
this.generateYearsRange();
|
|
1062
|
-
}
|
|
1059
|
+
this.years = [];
|
|
1060
|
+
this.generateYearsRange();
|
|
1063
1061
|
}
|
|
1064
1062
|
}
|
|
1065
1063
|
ngOnInit() {
|
|
@@ -1186,11 +1184,11 @@ class DatepickerComponent {
|
|
|
1186
1184
|
});
|
|
1187
1185
|
}
|
|
1188
1186
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DatepickerComponent, deps: [{ token: IPAFormService }, { token: i2.NgbCalendar }, { token: i2$1.NgControl, self: true }, { token: i2.NgbInputDatepickerConfig }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1189
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: DatepickerComponent, isStandalone: false, selector: "ipa-datepicker", inputs: { isPlatformCodeDesignSystem: "isPlatformCodeDesignSystem", id: "id", label: "label", patternErrorMsg: "patternErrorMsg", required: "required", maxDate: "maxDate", minDate: "minDate", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["d"], descendants: true }], ngImport: i0, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': +dp.state.focusedDate.year <= minYear && +dp.state.focusedDate.month <= minDate.month}\">\r\n <img src=\"
|
|
1187
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: DatepickerComponent, isStandalone: false, selector: "ipa-datepicker", inputs: { isPlatformCodeDesignSystem: "isPlatformCodeDesignSystem", id: "id", label: "label", patternErrorMsg: "patternErrorMsg", required: "required", maxDate: "maxDate", minDate: "minDate", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["d"], descendants: true }], ngImport: i0, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month.month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year <= minYear) && (minDate?.month && (+dp.state.focusedDate.month <= minDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" style=\"transform: rotate(-180deg);\" />\r\n </button>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, 1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year >= maxYear) && (maxDate?.month && (+dp.state.focusedDate.month >= maxDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" />\r\n </button>\r\n </div>\r\n </div>\r\n <ngb-datepicker-month [month]=\"month\"></ngb-datepicker-month>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n</div>", styles: [".calenderBtn{cursor:pointer;background-color:transparent;color:#6c757d;border-top-left-radius:.25rem!important;border-bottom-left-radius:.25rem!important}.calenderBtn:hover{color:#fff;background-color:#6c757d;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}\n"], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "component", type: i2.NgbDatepickerMonth, selector: "ngb-datepicker-month", inputs: ["month"] }] }); }
|
|
1190
1188
|
}
|
|
1191
1189
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DatepickerComponent, decorators: [{
|
|
1192
1190
|
type: Component,
|
|
1193
|
-
args: [{ selector: 'ipa-datepicker', standalone: false, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': +dp.state.focusedDate.year <= minYear && +dp.state.focusedDate.month <= minDate.month}\">\r\n <img src=\"
|
|
1191
|
+
args: [{ selector: 'ipa-datepicker', standalone: false, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month.month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year <= minYear) && (minDate?.month && (+dp.state.focusedDate.month <= minDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" style=\"transform: rotate(-180deg);\" />\r\n </button>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, 1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year >= maxYear) && (maxDate?.month && (+dp.state.focusedDate.month >= maxDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" />\r\n </button>\r\n </div>\r\n </div>\r\n <ngb-datepicker-month [month]=\"month\"></ngb-datepicker-month>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n</div>", styles: [".calenderBtn{cursor:pointer;background-color:transparent;color:#6c757d;border-top-left-radius:.25rem!important;border-bottom-left-radius:.25rem!important}.calenderBtn:hover{color:#fff;background-color:#6c757d;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}\n"] }]
|
|
1194
1192
|
}], ctorParameters: () => [{ type: IPAFormService }, { type: i2.NgbCalendar }, { type: i2$1.NgControl, decorators: [{
|
|
1195
1193
|
type: Self
|
|
1196
1194
|
}] }, { type: i2.NgbInputDatepickerConfig }, { type: i0.ChangeDetectorRef }], propDecorators: { datepicker: [{
|
|
@@ -1262,14 +1260,14 @@ class HijriDatepickerComponent extends DatepickerComponent {
|
|
|
1262
1260
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: HijriDatepickerComponent, isStandalone: false, selector: "ipa-hijri-datepicker", providers: [
|
|
1263
1261
|
{ provide: NgbCalendar, useClass: NgbCalendarIslamicUmalqura },
|
|
1264
1262
|
{ provide: NgbDatepickerI18n, useClass: IslamicI18n },
|
|
1265
|
-
], usesInheritance: true, ngImport: i0, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': +dp.state.focusedDate.year <= minYear && +dp.state.focusedDate.month <= minDate.month}\">\r\n <img src=\"
|
|
1263
|
+
], usesInheritance: true, ngImport: i0, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month.month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year <= minYear) && (minDate?.month && (+dp.state.focusedDate.month <= minDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" style=\"transform: rotate(-180deg);\" />\r\n </button>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, 1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year >= maxYear) && (maxDate?.month && (+dp.state.focusedDate.month >= maxDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" />\r\n </button>\r\n </div>\r\n </div>\r\n <ngb-datepicker-month [month]=\"month\"></ngb-datepicker-month>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n</div>", styles: [".calenderBtn{cursor:pointer;background-color:transparent;color:#6c757d;border-top-left-radius:.25rem!important;border-bottom-left-radius:.25rem!important}.calenderBtn:hover{color:#fff;background-color:#6c757d;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}\n"], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "component", type: i2.NgbDatepickerMonth, selector: "ngb-datepicker-month", inputs: ["month"] }] }); }
|
|
1266
1264
|
}
|
|
1267
1265
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: HijriDatepickerComponent, decorators: [{
|
|
1268
1266
|
type: Component,
|
|
1269
1267
|
args: [{ selector: 'ipa-hijri-datepicker', providers: [
|
|
1270
1268
|
{ provide: NgbCalendar, useClass: NgbCalendarIslamicUmalqura },
|
|
1271
1269
|
{ provide: NgbDatepickerI18n, useClass: IslamicI18n },
|
|
1272
|
-
], standalone: false, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': +dp.state.focusedDate.year <= minYear && +dp.state.focusedDate.month <= minDate.month}\">\r\n <img src=\"
|
|
1270
|
+
], standalone: false, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month.month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year <= minYear) && (minDate?.month && (+dp.state.focusedDate.month <= minDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" style=\"transform: rotate(-180deg);\" />\r\n </button>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, 1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year >= maxYear) && (maxDate?.month && (+dp.state.focusedDate.month >= maxDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" />\r\n </button>\r\n </div>\r\n </div>\r\n <ngb-datepicker-month [month]=\"month\"></ngb-datepicker-month>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n</div>", styles: [".calenderBtn{cursor:pointer;background-color:transparent;color:#6c757d;border-top-left-radius:.25rem!important;border-bottom-left-radius:.25rem!important}.calenderBtn:hover{color:#fff;background-color:#6c757d;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}\n"] }]
|
|
1273
1271
|
}] });
|
|
1274
1272
|
|
|
1275
1273
|
const WEEKDAYS = ['أثنين', 'ثلاثاء', 'أربعاء', 'خميس', 'جمعة', 'سبت', 'أحد'];
|
|
@@ -1316,14 +1314,14 @@ class GregorianDatepickerComponent extends DatepickerComponent {
|
|
|
1316
1314
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: GregorianDatepickerComponent, isStandalone: false, selector: "ipa-gregorian-datepicker", providers: [
|
|
1317
1315
|
{ provide: NgbCalendar, useClass: NgbCalendarGregorian },
|
|
1318
1316
|
{ provide: NgbDatepickerI18n, useClass: Gregorian18n },
|
|
1319
|
-
], usesInheritance: true, ngImport: i0, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': +dp.state.focusedDate.year <= minYear && +dp.state.focusedDate.month <= minDate.month}\">\r\n <img src=\"
|
|
1317
|
+
], usesInheritance: true, ngImport: i0, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month.month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year <= minYear) && (minDate?.month && (+dp.state.focusedDate.month <= minDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" style=\"transform: rotate(-180deg);\" />\r\n </button>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, 1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year >= maxYear) && (maxDate?.month && (+dp.state.focusedDate.month >= maxDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" />\r\n </button>\r\n </div>\r\n </div>\r\n <ngb-datepicker-month [month]=\"month\"></ngb-datepicker-month>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n</div>", styles: [".calenderBtn{cursor:pointer;background-color:transparent;color:#6c757d;border-top-left-radius:.25rem!important;border-bottom-left-radius:.25rem!important}.calenderBtn:hover{color:#fff;background-color:#6c757d;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}\n"], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "component", type: i2.NgbDatepickerMonth, selector: "ngb-datepicker-month", inputs: ["month"] }] }); }
|
|
1320
1318
|
}
|
|
1321
1319
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: GregorianDatepickerComponent, decorators: [{
|
|
1322
1320
|
type: Component,
|
|
1323
1321
|
args: [{ selector: 'ipa-gregorian-datepicker', providers: [
|
|
1324
1322
|
{ provide: NgbCalendar, useClass: NgbCalendarGregorian },
|
|
1325
1323
|
{ provide: NgbDatepickerI18n, useClass: Gregorian18n },
|
|
1326
|
-
], standalone: false, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': +dp.state.focusedDate.year <= minYear && +dp.state.focusedDate.month <= minDate.month}\">\r\n <img src=\"
|
|
1324
|
+
], standalone: false, template: "<div class=\"form-floating input-group {{containerClasses}}\" *ngIf=\"!isPlatformCodeDesignSystem\">\r\n <input id=\"{{id}}\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\"\r\n class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker #d=\"ngbDatepicker\"\r\n [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <span class=\"input-group-text calenderBtn\" (click)=\"openDatepicker($event)\">\r\n <i class=\"far fa-calendar-alt fa-lg\"></i>\r\n </span>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #footerTemplate style=\"text-align: center;\">\r\n <hr>\r\n <div class=\"d-flex justify-content-end\">\r\n <button type=\"button\" class=\"btn btn-primary m-2 w-25\"\r\n (click)=\"formControl.patchValue(today);d.navigateTo(today);d.close()\">\u0627\u0644\u064A\u0648\u0645</button>\r\n <button type=\"button\" class=\"btn btn-secondary m-2 w-25\"\r\n (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n </div>\r\n </ng-template>\r\n</div>\r\n<div class=\"{{containerClasses}}\" *ngIf=\"isPlatformCodeDesignSystem\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}} </label>\r\n <input id=\"{{id}}\" class=\"form-control {{classes}}\" [formControl]=\"formControl\" [firstDayOfWeek]=\"7\" ngbDatepicker\r\n #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [required]=\"required\"\r\n style=\"outline: unset; z-index: unset !important;\" autocomplete=\"off\" (blur)=\"onTouched()\" placeholder=\"{{label}}\"\r\n (click)=\"openDatepicker($event)\" [contentTemplate]=\"contentTemplate\" [navigation]=\"'none'\"\r\n [placement]=\"'bottom-end'\" [autoClose]=\"true\" [dayTemplate]=\"dayTemplate\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n <ng-template #dayTemplate let-date let-currentMonth=\"currentMonth\" let-selected=\"selected\" let-disabled=\"disabled\"\r\n let-focused=\"focused\">\r\n <div ngbdatepickerdayview [class.bg-primary]=\"selected\" [class.outside]=\"date.month !== currentMonth\">\r\n {{ date.day }}\r\n </div>\r\n </ng-template>\r\n <ng-template #contentTemplate let-dp>\r\n <div class=\"p-2\">\r\n <div class=\"custom-month-grid\">\r\n @for (month of dp.state.months; track month.month) {\r\n <div class=\"d-flex justify-content-between\" style=\"height: 40px;\">\r\n <div class=\"d-inline-flex\">\r\n <span class=\"align-content-center me-2\">{{ dp.i18n.getMonthShortName(month.month) }}</span>\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}}\">\r\n <button\r\n class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center\"\r\n type=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <span class=\"selected-text\">{{dp.state.focusedDate.year}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-50\" style=\"max-height: 360px; overflow-y: auto;\">\r\n <li *ngFor=\"let year of years; let i = index;\" (click)=\"navigateYear(dp, year);\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\" [attr.data-value]=\"year\"\r\n [ngClass]=\"{'active': dp.state.focusedDate.year === year}\">\r\n {{year}}\r\n </span>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, -1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year <= minYear) && (minDate?.month && (+dp.state.focusedDate.month <= minDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" style=\"transform: rotate(-180deg);\" />\r\n </button>\r\n <button type=\"button\" class=\"tp-link tp-link-subtle\" (click)=\"navigate(dp, 1)\"\r\n [ngClass]=\"{'disabled': (+dp.state.focusedDate.year >= maxYear) && (maxDate?.month && (+dp.state.focusedDate.month >= maxDate.month))}\">\r\n <img src=\"/_catalogs/masterpage/ar-sa/CPS/assets/img/arrow.svg\"\r\n alt=\"Calender Icon\" />\r\n </button>\r\n </div>\r\n </div>\r\n <ngb-datepicker-month [month]=\"month\"></ngb-datepicker-month>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n</div>", styles: [".calenderBtn{cursor:pointer;background-color:transparent;color:#6c757d;border-top-left-radius:.25rem!important;border-bottom-left-radius:.25rem!important}.calenderBtn:hover{color:#fff;background-color:#6c757d;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}\n"] }]
|
|
1327
1325
|
}] });
|
|
1328
1326
|
|
|
1329
1327
|
class ShareButtonComponent {
|