+
@if (labelView) {
} @else {
diff --git a/src/app/utils/date-formatter.utils.ts b/src/app/utils/date-formatter.utils.ts
index d89719c..11f9126 100644
--- a/src/app/utils/date-formatter.utils.ts
+++ b/src/app/utils/date-formatter.utils.ts
@@ -1,7 +1,9 @@
-import jalaliPlugin from '@zoomit/dayjs-jalali-plugin';
import dayjs, { Dayjs } from 'dayjs';
import 'dayjs/locale/fa';
import relativeTime from 'dayjs/plugin/relativeTime';
+import jalaliPlugin from 'jalaliday';
+
+type dateInput = string | Date | Dayjs | number;
// Extend dayjs with plugins
dayjs.extend(jalaliPlugin);
@@ -80,7 +82,7 @@ export const GREGORIAN_DATE_FORMATS = {
* formatJalali(new Date(), JALALI_DATE_FORMATS.FULL_WITH_WEEKDAY) // 'پنجشنبه، ۱۳ شهریور ۱۳۹۷'
*/
export function formatJalali(
- date: string | Date | Dayjs | number,
+ date: dateInput,
format: string = JALALI_DATE_FORMATS.NUMERIC
): string {
return dayjs(date).calendar('jalali').locale('fa').format(format);
@@ -98,7 +100,7 @@ export function formatJalali(
* formatGregorian(new Date(), GREGORIAN_DATE_FORMATS.NUMERIC_WITH_TIME) // '2018-09-04 16:30'
*/
export function formatGregorian(
- date: string | Date | Dayjs | number,
+ date: dateInput,
format: string = GREGORIAN_DATE_FORMATS.NUMERIC
): string {
return dayjs(date).calendar('gregory').locale('en').format(format);
@@ -115,7 +117,7 @@ export function formatGregorian(
* parseJalali('1398-10-17') // Dayjs instance
* parseJalali('1398/10/17') // Dayjs instance
*/
-export function parseJalali(jalaliDate: string | Date | Dayjs | number, format?: string): Dayjs {
+export function parseJalali(jalaliDate: dateInput, format?: string): Dayjs {
return dayjs(jalaliDate, { jalali: true, ...(format && { format }) });
}
@@ -192,7 +194,7 @@ export function nowGregorian(format: string = GREGORIAN_DATE_FORMATS.NUMERIC_WIT
* @example
* relativeTimeJalali(dayjs().subtract(2, 'day')) // '۲ روز پیش'
*/
-export function relativeTimeJalali(date: string | Date | Dayjs | number): string {
+export function relativeTimeJalali(date: dateInput): string {
return dayjs(date).locale('fa').fromNow();
}
@@ -219,7 +221,7 @@ export function isValidJalaliDate(jalaliDate: string): boolean {
* @example
* startOfDayJalali('1398-10-17') // Dayjs instance at 00:00:00
*/
-export function startOfDayJalali(date: string | Date | Dayjs | number): Dayjs {
+export function startOfDayJalali(date: dateInput): Dayjs {
return dayjs(date).calendar('jalali').startOf('day');
}
@@ -232,7 +234,7 @@ export function startOfDayJalali(date: string | Date | Dayjs | number): Dayjs {
* @example
* endOfDayJalali('1398-10-17') // Dayjs instance at 23:59:59
*/
-export function endOfDayJalali(date: string | Date | Dayjs | number): Dayjs {
+export function endOfDayJalali(date: dateInput): Dayjs {
return dayjs(date).calendar('jalali').endOf('day');
}
@@ -250,7 +252,7 @@ export function endOfDayJalali(date: string | Date | Dayjs | number): Dayjs {
* formatDate('2018-09-04', 'gregory', 'en', 'MMMM DD YYYY') // 'September 04 2018'
*/
export function formatDate(
- date: string | Date | Dayjs | number,
+ date: dateInput,
calendar: 'jalali' | 'gregory',
locale: 'fa' | 'en',
format: string
@@ -302,28 +304,38 @@ export function getJalaliWeekdayName(dayNumber: number): string {
}
export function jalaliDiff(
- date1: string | number | Date | Dayjs,
- date2: string | number | Date | Dayjs,
+ date1: dateInput,
+ date2: dateInput,
unit: dayjs.OpUnitType = 'day'
): number {
return toJalali(date1).diff(toJalali(date2), unit);
}
-export function isJalaliBefore(
- date1: string | number | Date | Dayjs,
- date2: string | number | Date | Dayjs
-): boolean {
+export function jalaliAddUnit(
+ date: dateInput,
+ count: number,
+ unit: dayjs.ManipulateType = 'days'
+): Dayjs {
+ return dayjs(date, { jalali: true }).add(count, unit);
+}
+
+export function gregorianAddUnit(
+ date: dateInput,
+ count: number,
+ unit: dayjs.ManipulateType = 'days'
+): Dayjs {
+ return dayjs(date).add(count, unit);
+}
+
+export function isJalaliBefore(date1: dateInput, date2: dateInput): boolean {
return toJalali(date1).isBefore(toJalali(date2));
}
-export function isJalaliAfter(
- date1: string | number | Date | Dayjs,
- date2: string | number | Date | Dayjs
-): boolean {
+export function isJalaliAfter(date1: dateInput, date2: dateInput): boolean {
return toJalali(date1).isAfter(toJalali(date2));
}
-export function toJalali(date: string | number | Date | Dayjs, format = 'YYYY/MM/DD'): Dayjs {
+export function toJalali(date: dateInput, format = 'YYYY/MM/DD'): Dayjs {
return dayjs(date).calendar('jalali');
}
diff --git a/src/assets/flatpicker.css b/src/assets/flatpicker.css
deleted file mode 100644
index 8f68eda..0000000
--- a/src/assets/flatpicker.css
+++ /dev/null
@@ -1,282 +0,0 @@
-.flatpickr-calendar {
- direction: rtl;
- background: var(--color-surface-ground);
-}
-.flatpickr-time {
- direction: ltr;
-}
-
-.flat {
- display: flex;
-}
-
-.flatpickr-calendar .hasWeeks .dayContainer {
- /*border-left: 0; */
-}
-
-.flatpickr-calendar:before,
-.flatpickr-calendar:after {
- /*left: 22px; */
-}
-
-.flatpickr-calendar.rightMost:before,
-.flatpickr-calendar.arrowRight:before,
-.flatpickr-calendar.rightMost:after,
-.flatpickr-calendar.arrowRight:after {
- /*left: auto;*/
- /*right: 22px;*/
-}
-
-.flatpickr-calendar.arrowTop:before {
- /*border-bottom-color: #e6e6e6;*/
-}
-.flatpickr-calendar.arrowTop:after {
- /*border-bottom-color: #fff;*/
-}
-
-.flatpickr-calendar.arrowBottom:before {
- /*border-top-color: #e6e6e6;*/
-}
-.flatpickr-calendar.arrowBottom:after {
- /*border-top-color: #fff;*/
-}
-
-.flatpickr-months {
- display: flex;
- align-items: center;
-}
-
-.flatpickr-months .flatpickr-month {
- color: var(--p-text-muted-color);
- fill: var(--p-text-muted-color);
- height: 40px;
-}
-
-.flatpickr-months .flatpickr-prev-month,
-.flatpickr-months .flatpickr-next-month {
- color: var(--p-text-muted-color);
- fill: var(--p-text-muted-color);
- position: relative !important;
- rotate: 180deg;
-}
-
-.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
-.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
- right: 0;
- left: auto;
-}
-.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
-.flatpickr-months .flatpickr-next-month.flatpickr-next-month {
- left: 0;
- right: auto;
-}
-.flatpickr-months .flatpickr-prev-month:hover,
-.flatpickr-months .flatpickr-next-month:hover {
- /*color: #959ea9;*/
-}
-.flatpickr-months .flatpickr-prev-month:hover svg,
-.flatpickr-months .flatpickr-next-month:hover svg {
- /*fill: #f64747;*/
-}
-.numInputWrapper span {
- right: auto;
- left: 0;
- /*border: 1px solid rgba(57,57,57,0.15);*/
-}
-
-.numInputWrapper span:hover {
- /*background: rgba(0,0,0,0.1);*/
-}
-.numInputWrapper span:active {
- /*background: rgba(0,0,0,0.2);*/
-}
-
-.numInputWrapper span.arrowUp:after {
- /*border-bottom: 4px solid rgba(57,57,57,0.6);*/
-}
-
-.numInputWrapper span.arrowDown:after {
- /*border-top: 4px solid rgba(57,57,57,0.6);*/
-}
-
-.numInputWrapper span svg path {
- /*fill: rgba(0,0,0,0.5);*/
-}
-.numInputWrapper:hover {
- /*background: rgba(0,0,0,0.05);*/
-}
-.flatpickr-current-month {
- padding: 0;
- position: relative;
- left: auto;
- right: auto;
- display: flex;
- margin: auto;
- gap: 8px;
- height: 100%;
-}
-.flatpickr-current-month > * {
- flex: 1;
-}
-.flatpickr-current-month span.cur-month {
- /*margin-left: 0.5ch;*/
-}
-.flatpickr-current-month span.cur-month:hover {
- /*background: rgba(0,0,0,0.05);*/
-}
-
-.flatpickr-current-month .numInputWrapper span.arrowUp:after {
- border-bottom-color: var(--p-text-color);
-}
-.flatpickr-current-month .numInputWrapper span.arrowDown:after {
- border-top-color: var(--p-text-color);
-}
-
-.flatpickr-current-month input.cur-year {
- font-size: 16px;
- display: flex;
- align-items: center;
- height: 100%;
- padding: 0 0 0 20px;
-}
-.flatpickr-current-month input.cur-year[disabled],
-.flatpickr-current-month input.cur-year[disabled]:hover {
- /*color: rgba(0,0,0,0.5);*/
-}
-
-.flatpickr-current-month .flatpickr-monthDropdown-months {
- font-size: 16px;
- height: 100%;
-}
-.flatpickr-current-month .flatpickr-monthDropdown-months:hover {
- /*background: rgba(0,0,0,0.05);*/
-}
-
-span.flatpickr-weekday {
- color: var(--p-text-muted-color);
-}
-
-.dayContainer {
- text-align: left;
-}
-/*.dayContainer + .dayContainer {*/
-/* -webkit-box-shadow: -1px 0 0 #e6e6e6;*/
-/* box-shadow: -1px 0 0 #e6e6e6;*/
-/*}*/
-
-.flatpickr-day {
- color: var(--p-text-color);
-}
-
-.flatpickr-day.inRange,
-.flatpickr-day.prevMonthDay.inRange,
-.flatpickr-day.nextMonthDay.inRange,
-.flatpickr-day.today.inRange,
-.flatpickr-day.prevMonthDay.today.inRange,
-.flatpickr-day.nextMonthDay.today.inRange,
-.flatpickr-day:hover,
-.flatpickr-day.prevMonthDay:hover,
-.flatpickr-day.nextMonthDay:hover,
-.flatpickr-day:focus,
-.flatpickr-day.prevMonthDay:focus,
-.flatpickr-day.nextMonthDay:focus {
- background: var(--p-blue-300);
- border-color: var(--focus-ring-color);
-}
-
-.flatpickr-day.today {
- /*border-color: #959ea9;*/
-}
-
-.flatpickr-day.today:hover,
-.flatpickr-day.today:focus {
- /*border-color: #959ea9;*/
- /*background: #959ea9;*/
- /*color: #fff;*/
-}
-.flatpickr-day.selected,
-.flatpickr-day.startRange,
-.flatpickr-day.endRange,
-.flatpickr-day.selected.inRange,
-.flatpickr-day.startRange.inRange,
-.flatpickr-day.endRange.inRange,
-.flatpickr-day.selected:focus,
-.flatpickr-day.startRange:focus,
-.flatpickr-day.endRange:focus,
-.flatpickr-day.selected:hover,
-.flatpickr-day.startRange:hover,
-.flatpickr-day.endRange:hover,
-.flatpickr-day.selected.prevMonthDay,
-.flatpickr-day.startRange.prevMonthDay,
-.flatpickr-day.endRange.prevMonthDay,
-.flatpickr-day.selected.nextMonthDay,
-.flatpickr-day.startRange.nextMonthDay,
-.flatpickr-day.endRange.nextMonthDay {
- background: var(--color-primary);
- color: #fff;
- border-color: var(--focus-ring-color);
-}
-
-.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n + 1)),
-.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n + 1)),
-.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n + 1)) {
- /*-webkit-box-shadow: -10px 0 0 #569ff7;*/
- /*box-shadow: -10px 0 0 #569ff7;*/
-}
-
-.flatpickr-day.inRange {
- /*-webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;*/
- /* box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;*/
-}
-.flatpickr-day.flatpickr-disabled,
-.flatpickr-day.flatpickr-disabled:hover,
-.flatpickr-day.prevMonthDay,
-.flatpickr-day.nextMonthDay,
-.flatpickr-day.notAllowed,
-.flatpickr-day.notAllowed.prevMonthDay,
-.flatpickr-day.notAllowed.nextMonthDay {
- color: var(--p-text-color);
- opacity: 0.4;
-}
-.flatpickr-day.flatpickr-disabled,
-.flatpickr-day.flatpickr-disabled:hover {
- /*color: rgba(57,57,57,0.1);*/
-}
-.flatpickr-day.week.selected {
- /*-webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;*/
- /* box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;*/
-}
-.flatpickr-weekwrapper {
- /*float: left;*/
-}
-.flatpickr-weekwrapper .flatpickr-weeks {
- /*-webkit-box-shadow: 1px 0 0 #e6e6e6;*/
- /* box-shadow: 1px 0 0 #e6e6e6;*/
-}
-.flatpickr-weekwrapper span.flatpickr-day,
-.flatpickr-weekwrapper span.flatpickr-day:hover {
- /*color: rgba(57,57,57,0.3);*/
-}
-.flatpickr-time .numInputWrapper {
- /*float: left;*/
-}
-.flatpickr-time .numInputWrapper span.arrowUp:after {
- border-bottom-color: var(--p-text-color);
-}
-.flatpickr-time .numInputWrapper span.arrowDown:after {
- border-top-color: var(--p-text-color);
-}
-.flatpickr-time input {
- color: var(--p-text-color);
-}
-.flatpickr-time .flatpickr-time-separator,
-.flatpickr-time .flatpickr-am-pm {
- /*float: left;*/
- color: var(--p-text-color);
-}
-.flatpickr-time input:hover,
-.flatpickr-time .flatpickr-am-pm:hover,
-.flatpickr-time input:focus,
-.flatpickr-time .flatpickr-am-pm:focus {
- background: var(--color-surface-hover);
-}
diff --git a/src/assets/styles.scss b/src/assets/styles.scss
index 9788151..5b13eb6 100644
--- a/src/assets/styles.scss
+++ b/src/assets/styles.scss
@@ -1,8 +1,5 @@
/* You can add global styles to this file, and also import other style files */
@use "./tailwind.css";
-@use "flatpickr-wrap/dist/themes/confetti.css";
-@use "flatpickr-wrap/dist/flatpickr.css";
-@use "./flatpicker.css";
@use "./layout/layout.scss";
@use "primeicons/primeicons.css";
@use "./rtlSupport.scss";
diff --git a/src/main.ts b/src/main.ts
index 9d997c6..3f37829 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -4,21 +4,6 @@ import { appConfig } from './app.config';
import { brandingConfig } from './app/branding/branding.config';
import config from './config';
-// flatpickr.localize(faLocales.fa!);
-
-// // Apply default configuration requested by the project
-// if (flatpickr.defaultConfig) {
-// Object.assign(flatpickr.defaultConfig, {
-// altInput: true,
-// altFormat: 'F j, Y H:i',
-// dateFormat: 'Y-m-d',
-// time_24hr: true,
-// time_format: 'H:i',
-// wrap: true,
-// clickOpens: true,
-// });
-// }
-
document.title = brandingConfig.appTitle;
const manifestLink = document.querySelector('link[rel="manifest"]');