ng-ipa-library 6.2.19 → 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.
|
@@ -1184,11 +1184,11 @@ class DatepickerComponent {
|
|
|
1184
1184
|
});
|
|
1185
1185
|
}
|
|
1186
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 }); }
|
|
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=\"
|
|
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"] }] }); }
|
|
1188
1188
|
}
|
|
1189
1189
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DatepickerComponent, decorators: [{
|
|
1190
1190
|
type: Component,
|
|
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=\"
|
|
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"] }]
|
|
1192
1192
|
}], ctorParameters: () => [{ type: IPAFormService }, { type: i2.NgbCalendar }, { type: i2$1.NgControl, decorators: [{
|
|
1193
1193
|
type: Self
|
|
1194
1194
|
}] }, { type: i2.NgbInputDatepickerConfig }, { type: i0.ChangeDetectorRef }], propDecorators: { datepicker: [{
|
|
@@ -1260,14 +1260,14 @@ class HijriDatepickerComponent extends DatepickerComponent {
|
|
|
1260
1260
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: HijriDatepickerComponent, isStandalone: false, selector: "ipa-hijri-datepicker", providers: [
|
|
1261
1261
|
{ provide: NgbCalendar, useClass: NgbCalendarIslamicUmalqura },
|
|
1262
1262
|
{ provide: NgbDatepickerI18n, useClass: IslamicI18n },
|
|
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=\"
|
|
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"] }] }); }
|
|
1264
1264
|
}
|
|
1265
1265
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: HijriDatepickerComponent, decorators: [{
|
|
1266
1266
|
type: Component,
|
|
1267
1267
|
args: [{ selector: 'ipa-hijri-datepicker', providers: [
|
|
1268
1268
|
{ provide: NgbCalendar, useClass: NgbCalendarIslamicUmalqura },
|
|
1269
1269
|
{ provide: NgbDatepickerI18n, useClass: IslamicI18n },
|
|
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=\"
|
|
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"] }]
|
|
1271
1271
|
}] });
|
|
1272
1272
|
|
|
1273
1273
|
const WEEKDAYS = ['أثنين', 'ثلاثاء', 'أربعاء', 'خميس', 'جمعة', 'سبت', 'أحد'];
|
|
@@ -1314,14 +1314,14 @@ class GregorianDatepickerComponent extends DatepickerComponent {
|
|
|
1314
1314
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: GregorianDatepickerComponent, isStandalone: false, selector: "ipa-gregorian-datepicker", providers: [
|
|
1315
1315
|
{ provide: NgbCalendar, useClass: NgbCalendarGregorian },
|
|
1316
1316
|
{ provide: NgbDatepickerI18n, useClass: Gregorian18n },
|
|
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=\"
|
|
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"] }] }); }
|
|
1318
1318
|
}
|
|
1319
1319
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: GregorianDatepickerComponent, decorators: [{
|
|
1320
1320
|
type: Component,
|
|
1321
1321
|
args: [{ selector: 'ipa-gregorian-datepicker', providers: [
|
|
1322
1322
|
{ provide: NgbCalendar, useClass: NgbCalendarGregorian },
|
|
1323
1323
|
{ provide: NgbDatepickerI18n, useClass: Gregorian18n },
|
|
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=\"
|
|
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"] }]
|
|
1325
1325
|
}] });
|
|
1326
1326
|
|
|
1327
1327
|
class ShareButtonComponent {
|