@licklist/design 0.44.550 → 0.44.551-dev.1
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.
- package/dist/assets/dashboard/info.svg +8 -0
- package/dist/assets/dashboard/info.svg.js +1 -0
- package/dist/calendar/components/CalendarDates/CalendarDates.d.ts.map +1 -1
- package/dist/calendar/components/CalendarDates/CalendarDates.js +1 -1
- package/dist/date-time-button/DateContent.d.ts +2 -2
- package/dist/date-time-button/DateContent.d.ts.map +1 -1
- package/dist/date-time-button/DateContent.js +1 -1
- package/dist/date-time-button/DateTimeButton.d.ts +10 -6
- package/dist/date-time-button/DateTimeButton.d.ts.map +1 -1
- package/dist/date-time-button/DateTimeButton.js +1 -1
- package/dist/events/event-card/utils.d.ts.map +1 -1
- package/dist/events/event-card/utils.js +1 -1
- package/dist/events/event-statistic-modal/utils/index.d.ts +10 -4
- package/dist/events/event-statistic-modal/utils/index.d.ts.map +1 -1
- package/dist/events/event-statistic-modal/utils/index.js +1 -1
- package/dist/events/event-venue-map/components/MapPoint/MapPoint.d.ts +1 -1
- package/dist/events/event-venue-map/components/MapPoint/MapPoint.d.ts.map +1 -1
- package/dist/iframe/event/event-booking-products/EventBookingProducts.d.ts +4 -2
- package/dist/iframe/event/event-booking-products/EventBookingProducts.d.ts.map +1 -1
- package/dist/iframe/event/event-booking-products/components/AccordionItem/AccordionItem.d.ts +4 -2
- package/dist/iframe/event/event-booking-products/components/AccordionItem/AccordionItem.d.ts.map +1 -1
- package/dist/iframe/event/event-order-summary/EventOrderSummary.d.ts +1 -1
- package/dist/iframe/event/event-order-summary/EventOrderSummary.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/BookingSummary.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/BookingSummary.js +1 -1
- package/dist/iframe/order-process/components/BookingSummary/components/ProductSummary/ProductSummary.d.ts +10 -0
- package/dist/iframe/order-process/components/BookingSummary/components/ProductSummary/ProductSummary.d.ts.map +1 -0
- package/dist/iframe/order-process/components/BookingSummary/components/ProductSummary/ProductSummary.js +1 -0
- package/dist/iframe/order-process/components/BookingSummary/components/ProductSummary/index.d.ts +2 -0
- package/dist/iframe/order-process/components/BookingSummary/components/ProductSummary/index.d.ts.map +1 -0
- package/dist/iframe/order-process/components/BookingSummary/components/ProductsByMenuStep/ProductsByMenuStep.d.ts +4 -3
- package/dist/iframe/order-process/components/BookingSummary/components/ProductsByMenuStep/ProductsByMenuStep.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/components/ProductsByMenuStep/ProductsByMenuStep.js +1 -1
- package/dist/iframe/order-process/components/BookingSummary/types/index.d.ts +3 -4
- package/dist/iframe/order-process/components/BookingSummary/types/index.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/utils/index.d.ts +4 -2
- package/dist/iframe/order-process/components/BookingSummary/utils/index.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/utils/index.js +1 -1
- package/dist/iframe/order-process/components/CalendarStepsForm/components/Category.d.ts +1 -1
- package/dist/iframe/order-process/components/CalendarStepsForm/components/Category.d.ts.map +1 -1
- package/dist/iframe/order-process/components/CalendarStepsForm/components/CategoryProductModal.d.ts +1 -1
- package/dist/iframe/order-process/components/CalendarStepsForm/components/CategoryProductModal.d.ts.map +1 -1
- package/dist/iframe/order-process/components/CategoryProduct/CategoryProduct.d.ts +1 -1
- package/dist/iframe/order-process/components/CategoryProduct/CategoryProduct.d.ts.map +1 -1
- package/dist/iframe/order-process/components/CategoryProduct/components/ProductQuantityInput/ProductQuantityInput.d.ts +1 -1
- package/dist/iframe/order-process/components/CategoryProduct/components/ProductQuantityInput/ProductQuantityInput.d.ts.map +1 -1
- package/dist/iframe/order-process/components/utils/useCategoryVerification.d.ts +2 -2
- package/dist/iframe/order-process/components/utils/useCategoryVerification.d.ts.map +1 -1
- package/dist/iframe/payment/payment-page/PaymentPage.d.ts.map +1 -1
- package/dist/iframe/payment/payment-page/PaymentPage.js +1 -1
- package/dist/iframe/payment/payment-status-page/PaymentStatusPage.d.ts +2 -2
- package/dist/iframe/payment/payment-status-page/PaymentStatusPage.d.ts.map +1 -1
- package/dist/iframe/payment/payment-status-page/PaymentStatusPage.js +1 -1
- package/dist/iframe/payment/payment-status-page/component/PaymentStatusBody.d.ts +2 -2
- package/dist/iframe/payment/payment-status-page/component/PaymentStatusBody.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/product-set/control/DateAndRecurrenceInput.d.ts.map +1 -1
- package/dist/report/DataFieldsSelector/DataFieldsSelector.d.ts +13 -0
- package/dist/report/DataFieldsSelector/DataFieldsSelector.d.ts.map +1 -0
- package/dist/report/DataFieldsSelector/DataFieldsSelector.js +1 -0
- package/dist/report/DataFieldsSelector/index.d.ts +2 -0
- package/dist/report/DataFieldsSelector/index.d.ts.map +1 -0
- package/dist/report/ReportRunnerModal/ReportRunnerModal.d.ts +22 -0
- package/dist/report/ReportRunnerModal/ReportRunnerModal.d.ts.map +1 -0
- package/dist/report/ReportRunnerModal/ReportRunnerModal.js +1 -0
- package/dist/report/ReportRunnerModal/index.d.ts +2 -0
- package/dist/report/ReportRunnerModal/index.d.ts.map +1 -0
- package/dist/report/ReportTypeSelect/ReportTypeSelect.d.ts +3 -0
- package/dist/report/ReportTypeSelect/ReportTypeSelect.d.ts.map +1 -0
- package/dist/report/ReportTypeSelect/ReportTypeSelect.js +1 -0
- package/dist/report/ReportTypeSelect/index.d.ts +2 -0
- package/dist/report/ReportTypeSelect/index.d.ts.map +1 -0
- package/dist/report/index.d.ts +3 -0
- package/dist/report/index.d.ts.map +1 -1
- package/dist/sales/manual-booking/number-input-horizontal/NumberInputHorizontal.d.ts +3 -1
- package/dist/sales/manual-booking/number-input-horizontal/NumberInputHorizontal.d.ts.map +1 -1
- package/dist/sales/manual-booking/number-input-horizontal/NumberInputHorizontal.js +1 -1
- package/dist/styles/iframe-order-process/IframeOrderProcess.scss +6 -4
- package/dist/styles/report/ReportEditorModal.scss +98 -0
- package/dist/styles/report/ReportRunnerModal.scss +95 -0
- package/dist/styles/report/_index.scss +3 -1
- package/dist/styles/sales/BookingResults.scss +1 -1
- package/dist/types/iframe.d.ts +2 -50
- package/dist/types/iframe.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/assets/dashboard/info.svg +8 -0
- package/src/calendar/components/CalendarDates/CalendarDates.tsx +3 -4
- package/src/date-time-button/DateContent.tsx +27 -9
- package/src/date-time-button/DateTimeButton.stories.tsx +13 -14
- package/src/date-time-button/DateTimeButton.tsx +35 -26
- package/src/events/event-card/utils.ts +10 -2
- package/src/events/event-statistic-modal/EventStatisticModal.stories.tsx +51 -0
- package/src/events/event-statistic-modal/utils/index.ts +81 -45
- package/src/events/event-venue-map/components/MapPoint/MapPoint.tsx +1 -1
- package/src/iframe/event/event-booking-products/EventBookingProducts.tsx +4 -3
- package/src/iframe/event/event-booking-products/components/AccordionItem/AccordionItem.tsx +8 -4
- package/src/iframe/event/event-order-summary/EventOrderSummary.tsx +0 -2
- package/src/iframe/order-process/components/BookingSummary/BookingSummary.stories.tsx +46 -31
- package/src/iframe/order-process/components/BookingSummary/BookingSummary.tsx +12 -19
- package/src/iframe/order-process/components/BookingSummary/components/ProductSummary/ProductSummary.tsx +43 -0
- package/src/iframe/order-process/components/BookingSummary/components/ProductSummary/index.ts +1 -0
- package/src/iframe/order-process/components/BookingSummary/components/ProductsByMenuStep/ProductsByMenuStep.tsx +48 -66
- package/src/iframe/order-process/components/BookingSummary/types/index.ts +3 -4
- package/src/iframe/order-process/components/BookingSummary/utils/index.ts +11 -2
- package/src/iframe/order-process/components/CalendarStepsForm/components/Category.tsx +1 -1
- package/src/iframe/order-process/components/CalendarStepsForm/components/CategoryProductModal.tsx +4 -1
- package/src/iframe/order-process/components/CategoryProduct/CategoryProduct.tsx +4 -1
- package/src/iframe/order-process/components/CategoryProduct/components/ProductQuantityInput/ProductQuantityInput.tsx +4 -1
- package/src/iframe/order-process/components/utils/useCategoryVerification.ts +3 -2
- package/src/iframe/payment/payment-page/PaymentPage.tsx +5 -6
- package/src/iframe/payment/payment-status-page/PaymentStatusPage.tsx +13 -26
- package/src/iframe/payment/payment-status-page/component/PaymentStatusBody.tsx +2 -2
- package/src/product-set/control/DateAndRecurrenceInput.tsx +2 -1
- package/src/report/DataFieldsSelector/DataFieldsSelector.tsx +112 -0
- package/src/report/DataFieldsSelector/index.ts +1 -0
- package/src/report/ReportRunnerModal/ReportRunnerModal.tsx +183 -0
- package/src/report/ReportRunnerModal/index.ts +1 -0
- package/src/report/ReportTypeSelect/ReportTypeSelect.tsx +67 -0
- package/src/report/ReportTypeSelect/index.ts +1 -0
- package/src/report/index.ts +3 -0
- package/src/sales/manual-booking/number-input-horizontal/NumberInputHorizontal.stories.tsx +48 -0
- package/src/sales/manual-booking/number-input-horizontal/NumberInputHorizontal.tsx +17 -4
- package/src/styles/iframe-order-process/IframeOrderProcess.scss +6 -4
- package/src/styles/report/ReportEditorModal.scss +98 -0
- package/src/styles/report/ReportRunnerModal.scss +95 -0
- package/src/styles/report/_index.scss +3 -1
- package/src/styles/sales/BookingResults.scss +1 -1
- package/src/types/iframe.ts +2 -58
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"iframe.d.ts","sourceRoot":"","sources":["../../src/types/iframe.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"iframe.d.ts","sourceRoot":"","sources":["../../src/types/iframe.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,wDAAwD,CAAC;AAEpF,MAAM,MAAM,UAAU,GAAG,CACvB,GAAG,EAAE,UAAU,GAAG,CAAC,CAAC,OAAO,EAAE,UAAU,KAAK,UAAU,CAAC,KACpD,IAAI,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@licklist/design",
|
|
3
|
-
"version": "0.44.
|
|
3
|
+
"version": "0.44.551-dev.1",
|
|
4
4
|
"repository": {
|
|
5
5
|
"type": "git",
|
|
6
6
|
"url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"
|
|
@@ -53,9 +53,9 @@
|
|
|
53
53
|
"@fortawesome/free-brands-svg-icons": "5.15.2",
|
|
54
54
|
"@fortawesome/free-solid-svg-icons": "5.15.2",
|
|
55
55
|
"@fortawesome/react-fontawesome": "0.1.9",
|
|
56
|
-
"@licklist/core": "0.15.
|
|
56
|
+
"@licklist/core": ">=0.15.41-dev.0 < 0.15.41",
|
|
57
57
|
"@licklist/eslint-config": "0.3.4",
|
|
58
|
-
"@licklist/plugins": "0.20.
|
|
58
|
+
"@licklist/plugins": ">=0.20.133-dev.5 < 0.20.133",
|
|
59
59
|
"@mdx-js/react": "1.6.22",
|
|
60
60
|
"@popperjs/core": "2.11.8",
|
|
61
61
|
"@react-aria/utils": "3.9.0",
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
|
2
|
+
xmlns="http://www.w3.org/2000/svg">
|
|
3
|
+
<g id="Info icon">
|
|
4
|
+
<circle id="Oval" cx="10" cy="6" r="1.25" fill="#0E8CE2"/>
|
|
5
|
+
<rect id="Rectangle" x="9" y="8" width="2" height="7" fill="#0E8CE2"/>
|
|
6
|
+
<circle id="Oval_2" cx="10" cy="10" r="9" stroke="#0E8CE2" stroke-width="2"/>
|
|
7
|
+
</g>
|
|
8
|
+
</svg>
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import React, { useMemo } from "react";
|
|
2
2
|
import { DateTime } from "luxon";
|
|
3
|
-
import {
|
|
4
|
-
import { DateTimeButton } from "../../../date-time-button";
|
|
3
|
+
import { DateTimeButton, Variant } from "../../../date-time-button";
|
|
5
4
|
import { CalendarWeekdays } from "../CalendarWeekdays";
|
|
6
5
|
import { isSelectedDateDisabled } from "../../utils";
|
|
7
6
|
import { CalendarProps } from "../../Calendar";
|
|
@@ -55,12 +54,12 @@ export const CalendarDates = ({
|
|
|
55
54
|
isSelected={
|
|
56
55
|
selectedDate ? date.hasSame(selectedDate, "day") : undefined
|
|
57
56
|
}
|
|
58
|
-
date={date
|
|
57
|
+
date={date}
|
|
59
58
|
onSelect={() => setSelectedDate(date)}
|
|
60
59
|
price={fromPrice}
|
|
61
60
|
resources={getAvailability?.(date)}
|
|
62
61
|
showResources={includeAvailability}
|
|
63
|
-
|
|
62
|
+
variant={Variant.month}
|
|
64
63
|
/>
|
|
65
64
|
);
|
|
66
65
|
})}
|
|
@@ -1,37 +1,47 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
DAY_OF_WEEK,
|
|
3
|
+
DAY_NUMBER_WITH_MONTH,
|
|
4
|
+
TIME_FORMAT,
|
|
5
|
+
DAY_NUMBER,
|
|
6
|
+
} from "@licklist/core/dist/Config";
|
|
2
7
|
import { getDayWithOrdinal } from "@licklist/plugins/dist/utils/formatDate";
|
|
3
8
|
import clsx from "clsx";
|
|
4
9
|
import { isToday, isTomorrow } from "date-fns";
|
|
5
10
|
import { DateTime } from "luxon";
|
|
6
11
|
import React from "react";
|
|
7
12
|
import { useTranslation } from "react-i18next";
|
|
8
|
-
import { DateTimeButtonProps } from "./DateTimeButton";
|
|
13
|
+
import { DateTimeButtonProps, Variant } from "./DateTimeButton";
|
|
9
14
|
|
|
10
15
|
type DateContentProps = Pick<
|
|
11
16
|
DateTimeButtonProps,
|
|
12
|
-
"isDisabled" | "isSelected"
|
|
17
|
+
"isDisabled" | "isSelected" | "variant"
|
|
13
18
|
> & {
|
|
14
19
|
date: DateTime;
|
|
15
20
|
};
|
|
16
21
|
|
|
17
22
|
export const DateContent = ({
|
|
18
23
|
date,
|
|
24
|
+
variant,
|
|
19
25
|
isDisabled,
|
|
20
26
|
isSelected,
|
|
21
27
|
}: DateContentProps) => {
|
|
22
28
|
const { t } = useTranslation("Design");
|
|
23
29
|
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
30
|
+
if (variant === Variant.time) {
|
|
31
|
+
return <>{date.toFormat(TIME_FORMAT)}</>;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
if (variant === Variant.month) {
|
|
35
|
+
return <>{date.toFormat(DAY_NUMBER)}</>;
|
|
36
|
+
}
|
|
29
37
|
|
|
30
38
|
const [day, month] = date.toFormat(DAY_NUMBER_WITH_MONTH).split(" ");
|
|
31
39
|
|
|
40
|
+
const label = t(getDate(date));
|
|
41
|
+
|
|
32
42
|
return (
|
|
33
43
|
<div className="weekday-info">
|
|
34
|
-
<div>{
|
|
44
|
+
<div>{label}</div>
|
|
35
45
|
<div
|
|
36
46
|
className={clsx(
|
|
37
47
|
"descriptions",
|
|
@@ -44,3 +54,11 @@ export const DateContent = ({
|
|
|
44
54
|
</div>
|
|
45
55
|
);
|
|
46
56
|
};
|
|
57
|
+
|
|
58
|
+
const getDate = (date: DateTime): string => {
|
|
59
|
+
if (isToday(date.toJSDate())) return "today";
|
|
60
|
+
|
|
61
|
+
if (isTomorrow(date.toJSDate())) return "tomorrow";
|
|
62
|
+
|
|
63
|
+
return date.toFormat(DAY_OF_WEEK);
|
|
64
|
+
};
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { Meta, Story } from "@storybook/react";
|
|
3
3
|
import { DateTime } from "luxon";
|
|
4
|
-
import { DateTimeButton, DateTimeButtonProps } from "./DateTimeButton";
|
|
4
|
+
import { DateTimeButton, DateTimeButtonProps, Variant } from "./DateTimeButton";
|
|
5
5
|
|
|
6
6
|
export default {
|
|
7
7
|
title: "DateTimeButton",
|
|
8
8
|
component: DateTimeButton,
|
|
9
9
|
} as Meta;
|
|
10
10
|
|
|
11
|
-
const date = DateTime.
|
|
11
|
+
const date = DateTime.now();
|
|
12
12
|
|
|
13
13
|
export const Default: Story<DateTimeButtonProps> = (args) => {
|
|
14
14
|
return <DateTimeButton {...args} />;
|
|
@@ -48,22 +48,23 @@ export const Time: Story<DateTimeButtonProps> = (args) => {
|
|
|
48
48
|
};
|
|
49
49
|
|
|
50
50
|
Time.args = {
|
|
51
|
-
date:
|
|
51
|
+
date: DateTime.now().plus({ hours: 10 }),
|
|
52
52
|
isSelected: false,
|
|
53
|
-
isDisabled:
|
|
53
|
+
isDisabled: false,
|
|
54
54
|
onSelect: () => null,
|
|
55
|
+
variant: Variant.time,
|
|
55
56
|
};
|
|
56
57
|
|
|
57
|
-
export const
|
|
58
|
+
export const Calendar: Story<DateTimeButtonProps> = (args) => {
|
|
58
59
|
return <DateTimeButton {...args} />;
|
|
59
60
|
};
|
|
60
61
|
|
|
61
|
-
|
|
62
|
-
date:
|
|
62
|
+
Calendar.args = {
|
|
63
|
+
date: DateTime.now(),
|
|
63
64
|
isSelected: false,
|
|
64
|
-
isDisabled:
|
|
65
|
+
isDisabled: false,
|
|
65
66
|
onSelect: () => null,
|
|
66
|
-
|
|
67
|
+
variant: Variant.month,
|
|
67
68
|
};
|
|
68
69
|
|
|
69
70
|
export const WithPrice: Story<DateTimeButtonProps> = (args) => {
|
|
@@ -75,7 +76,6 @@ WithPrice.args = {
|
|
|
75
76
|
isSelected: false,
|
|
76
77
|
isDisabled: false,
|
|
77
78
|
onSelect: () => null,
|
|
78
|
-
isOnlyTimeContainer: false,
|
|
79
79
|
price: "from $8000",
|
|
80
80
|
};
|
|
81
81
|
|
|
@@ -88,10 +88,9 @@ WithAvailability.args = {
|
|
|
88
88
|
isSelected: false,
|
|
89
89
|
isDisabled: false,
|
|
90
90
|
onSelect: () => null,
|
|
91
|
-
|
|
92
|
-
price: "from $8000",
|
|
91
|
+
showResources: true,
|
|
93
92
|
resources: {
|
|
94
|
-
|
|
95
|
-
|
|
93
|
+
bookedResources: 1,
|
|
94
|
+
totalResources: 3,
|
|
96
95
|
},
|
|
97
96
|
};
|
|
@@ -5,36 +5,44 @@ import { ZoneResourcesAvailability } from "@licklist/core/dist/DataMapper/Order/
|
|
|
5
5
|
import { AvailabilityIndicator } from "../availability-indicator";
|
|
6
6
|
import { DateContent } from "./DateContent";
|
|
7
7
|
|
|
8
|
-
export
|
|
9
|
-
|
|
8
|
+
export enum Variant {
|
|
9
|
+
week = "week",
|
|
10
|
+
month = "month",
|
|
11
|
+
time = "time",
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
export type DateTimeButtonProps = {
|
|
15
|
+
date: DateTime;
|
|
10
16
|
isSelected?: boolean;
|
|
11
17
|
isDisabled?: boolean;
|
|
12
18
|
isSoldOut?: boolean;
|
|
13
|
-
onSelect: (date:
|
|
14
|
-
isOnlyTimeContainer?: boolean;
|
|
19
|
+
onSelect: (date: DateTime) => void;
|
|
15
20
|
price?: string | number | ReactElement | null;
|
|
16
21
|
resources?: ZoneResourcesAvailability | null;
|
|
17
|
-
calendarView?: boolean;
|
|
18
22
|
showResources?: boolean;
|
|
23
|
+
variant: Variant;
|
|
19
24
|
};
|
|
20
25
|
|
|
21
|
-
export const DateTimeButton =
|
|
26
|
+
export const DateTimeButton = ({
|
|
22
27
|
date,
|
|
23
28
|
isDisabled: _isDisabled,
|
|
24
29
|
isSelected,
|
|
25
|
-
isSoldOut,
|
|
30
|
+
isSoldOut: _isSoldOut,
|
|
26
31
|
onSelect,
|
|
27
|
-
isOnlyTimeContainer,
|
|
28
32
|
price,
|
|
29
33
|
resources,
|
|
30
|
-
calendarView,
|
|
31
34
|
showResources,
|
|
32
|
-
|
|
33
|
-
|
|
35
|
+
variant = Variant.week,
|
|
36
|
+
}: DateTimeButtonProps) => {
|
|
37
|
+
const isSoldOut =
|
|
38
|
+
_isSoldOut ||
|
|
39
|
+
(resources && resources.bookedResources >= resources.totalResources);
|
|
40
|
+
|
|
41
|
+
const isTimeVariant = variant === Variant.time;
|
|
42
|
+
|
|
43
|
+
const isTimeInPast = isTimeVariant && isDateInPast(date);
|
|
34
44
|
|
|
35
|
-
const isDisabled =
|
|
36
|
-
_isDisabled ||
|
|
37
|
-
(resources && resources.bookedResources === resources.totalResources);
|
|
45
|
+
const isDisabled = _isDisabled || isSoldOut || isTimeInPast;
|
|
38
46
|
|
|
39
47
|
return (
|
|
40
48
|
<button
|
|
@@ -45,31 +53,32 @@ export const DateTimeButton = <T extends DateTime | string>({
|
|
|
45
53
|
"date-time-button",
|
|
46
54
|
isDisabled && "disabled",
|
|
47
55
|
isSelected && "selected",
|
|
56
|
+
// TODO refactor this
|
|
48
57
|
isTimeVariant && "time-button",
|
|
49
|
-
|
|
58
|
+
isTimeVariant && "only-time-container",
|
|
50
59
|
!isTimeVariant && "today",
|
|
51
|
-
|
|
60
|
+
variant === Variant.month && "calendar-view"
|
|
52
61
|
)}
|
|
53
62
|
>
|
|
54
|
-
|
|
55
|
-
date
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
isSelected={isSelected}
|
|
61
|
-
/>
|
|
62
|
-
)}
|
|
63
|
+
<DateContent
|
|
64
|
+
date={date}
|
|
65
|
+
isDisabled={isDisabled}
|
|
66
|
+
isSelected={isSelected}
|
|
67
|
+
variant={variant}
|
|
68
|
+
/>
|
|
63
69
|
|
|
64
70
|
{price && !isDisabled && <div className="price">{price}</div>}
|
|
65
71
|
|
|
66
72
|
{showResources && resources && (
|
|
67
73
|
<AvailabilityIndicator
|
|
68
74
|
resources={resources}
|
|
69
|
-
isUnavailable={_isDisabled}
|
|
75
|
+
isUnavailable={_isDisabled || isTimeInPast}
|
|
70
76
|
isSoldOut={isSoldOut}
|
|
71
77
|
/>
|
|
72
78
|
)}
|
|
73
79
|
</button>
|
|
74
80
|
);
|
|
75
81
|
};
|
|
82
|
+
|
|
83
|
+
const isDateInPast = (date: DateTime): boolean =>
|
|
84
|
+
date.toUTC() <= DateTime.now().toUTC();
|
|
@@ -103,11 +103,19 @@ export const getStatisticInfo = (
|
|
|
103
103
|
.toFormat(DATE_FORMAT);
|
|
104
104
|
const summaryFormattedDate = DateTime.fromISO(date)
|
|
105
105
|
.toUTC()
|
|
106
|
-
.toFormat(
|
|
106
|
+
.toFormat(DATE_FORMAT);
|
|
107
|
+
|
|
108
|
+
const summaryDays =
|
|
109
|
+
Object.keys(eventStatistic?.productCategorySummary)?.filter(
|
|
110
|
+
(date) =>
|
|
111
|
+
DateTime.fromFormat(date, DATE_TIME_FULL_FORMAT).toFormat(
|
|
112
|
+
DATE_FORMAT
|
|
113
|
+
) === summaryFormattedDate
|
|
114
|
+
) ?? [];
|
|
107
115
|
|
|
108
116
|
const totalViews = calculateTotalViews([viewsFormattedDate], eventStatistic);
|
|
109
117
|
const [totalSold, totalAmount] = calculateTotalSoldAndAmount(
|
|
110
|
-
|
|
118
|
+
summaryDays,
|
|
111
119
|
eventStatistic
|
|
112
120
|
);
|
|
113
121
|
|
|
@@ -91,6 +91,57 @@ Default.args = {
|
|
|
91
91
|
],
|
|
92
92
|
},
|
|
93
93
|
],
|
|
94
|
+
"2023-08-31 10:35:00": [
|
|
95
|
+
{
|
|
96
|
+
eventId: 1236,
|
|
97
|
+
categoryName: "ticket",
|
|
98
|
+
totalPerCategory: 1300,
|
|
99
|
+
productsSummary: [
|
|
100
|
+
{
|
|
101
|
+
id: 221,
|
|
102
|
+
name: "VIP",
|
|
103
|
+
productsSold: 13,
|
|
104
|
+
totalQuantity: 25,
|
|
105
|
+
total: 1300,
|
|
106
|
+
},
|
|
107
|
+
],
|
|
108
|
+
},
|
|
109
|
+
{
|
|
110
|
+
eventId: 1236,
|
|
111
|
+
categoryName: "booking cat",
|
|
112
|
+
totalPerCategory: 275,
|
|
113
|
+
productsSummary: [
|
|
114
|
+
{
|
|
115
|
+
id: 222,
|
|
116
|
+
name: "Table booking",
|
|
117
|
+
productsSold: 11,
|
|
118
|
+
totalQuantity: null,
|
|
119
|
+
total: 275,
|
|
120
|
+
},
|
|
121
|
+
],
|
|
122
|
+
},
|
|
123
|
+
{
|
|
124
|
+
eventId: 1236,
|
|
125
|
+
categoryName: "Menu",
|
|
126
|
+
totalPerCategory: 450,
|
|
127
|
+
productsSummary: [
|
|
128
|
+
{
|
|
129
|
+
id: 223,
|
|
130
|
+
name: "Wine 1 bottle",
|
|
131
|
+
productsSold: 9,
|
|
132
|
+
totalQuantity: null,
|
|
133
|
+
total: 360,
|
|
134
|
+
},
|
|
135
|
+
{
|
|
136
|
+
id: 224,
|
|
137
|
+
name: "caesar salad",
|
|
138
|
+
productsSold: 9,
|
|
139
|
+
totalQuantity: null,
|
|
140
|
+
total: 90,
|
|
141
|
+
},
|
|
142
|
+
],
|
|
143
|
+
},
|
|
144
|
+
],
|
|
94
145
|
},
|
|
95
146
|
},
|
|
96
147
|
};
|
|
@@ -8,6 +8,19 @@ export const TRANSLATION_KEYS = {
|
|
|
8
8
|
totalPerCategory: "totalPerCategory",
|
|
9
9
|
};
|
|
10
10
|
|
|
11
|
+
type TableDataRecord = {
|
|
12
|
+
name: string;
|
|
13
|
+
key: string;
|
|
14
|
+
isHeader?: boolean;
|
|
15
|
+
isBold?: boolean;
|
|
16
|
+
quantity: string;
|
|
17
|
+
total: string;
|
|
18
|
+
metadata?: {
|
|
19
|
+
_productsSold: number;
|
|
20
|
+
_total: number;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
|
|
11
24
|
export const convertEventStatisticToTableData = (
|
|
12
25
|
date: string,
|
|
13
26
|
eventStatistic: EventStatistic
|
|
@@ -19,15 +32,6 @@ export const convertEventStatisticToTableData = (
|
|
|
19
32
|
return [];
|
|
20
33
|
}
|
|
21
34
|
|
|
22
|
-
const tableDataArray: {
|
|
23
|
-
name: string;
|
|
24
|
-
key: string;
|
|
25
|
-
isHeader?: boolean;
|
|
26
|
-
isBold?: boolean;
|
|
27
|
-
quantity: string | number;
|
|
28
|
-
total: string | number;
|
|
29
|
-
}[] = [];
|
|
30
|
-
|
|
31
35
|
const summaryFormattedDate = DateTime.fromISO(date)
|
|
32
36
|
.toUTC()
|
|
33
37
|
.toFormat(DATE_FORMAT);
|
|
@@ -40,16 +44,26 @@ export const convertEventStatisticToTableData = (
|
|
|
40
44
|
) === summaryFormattedDate
|
|
41
45
|
) ?? [];
|
|
42
46
|
|
|
47
|
+
const summaryMap = new Map<string, TableDataRecord>();
|
|
48
|
+
|
|
43
49
|
summaryDays
|
|
44
50
|
.map((day) => eventStatistic?.productCategorySummary[day])
|
|
45
|
-
.
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
51
|
+
.flat()
|
|
52
|
+
.sort((prev, next) =>
|
|
53
|
+
prev.categoryName === next.categoryName
|
|
54
|
+
? 0
|
|
55
|
+
: prev.categoryName > next.categoryName
|
|
56
|
+
? 1
|
|
57
|
+
: -1
|
|
58
|
+
)
|
|
59
|
+
.forEach(
|
|
60
|
+
({ totalPerCategory, productsSummary = [], categoryName, eventId }) => {
|
|
61
|
+
let quantity = 0;
|
|
49
62
|
|
|
50
|
-
|
|
63
|
+
totalAmount += totalPerCategory || 0;
|
|
51
64
|
|
|
52
|
-
|
|
65
|
+
if (!summaryMap.has(`${categoryName}`)) {
|
|
66
|
+
summaryMap.set(`${categoryName}`, {
|
|
53
67
|
name: categoryName,
|
|
54
68
|
key: `${eventId}.${categoryName}`,
|
|
55
69
|
isBold: true,
|
|
@@ -57,42 +71,64 @@ export const convertEventStatisticToTableData = (
|
|
|
57
71
|
quantity: TRANSLATION_KEYS.shortQuantity,
|
|
58
72
|
total: TRANSLATION_KEYS.total,
|
|
59
73
|
});
|
|
74
|
+
}
|
|
60
75
|
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
tableDataArray.push({
|
|
66
|
-
name,
|
|
67
|
-
key: `${eventId}.${categoryName}.${name}`,
|
|
68
|
-
quantity: totalQuantity
|
|
69
|
-
? `${productsSold} / ${totalQuantity}`
|
|
70
|
-
: String(productsSold),
|
|
71
|
-
total: String(total),
|
|
72
|
-
});
|
|
73
|
-
}
|
|
74
|
-
);
|
|
75
|
-
|
|
76
|
-
tableDataArray.push({
|
|
77
|
-
name: TRANSLATION_KEYS.totalPerCategory,
|
|
78
|
-
key: `${eventId}.${categoryName}.${TRANSLATION_KEYS.totalPerCategory}`,
|
|
79
|
-
quantity,
|
|
80
|
-
total: totalPerCategory,
|
|
81
|
-
isBold: true,
|
|
82
|
-
});
|
|
76
|
+
productsSummary?.forEach(
|
|
77
|
+
({ productsSold, name, totalQuantity, total }) => {
|
|
78
|
+
quantity += productsSold;
|
|
83
79
|
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
80
|
+
const existingProduct = summaryMap.get(
|
|
81
|
+
`${categoryName}.${name}`
|
|
82
|
+
) ?? {
|
|
83
|
+
metadata: {
|
|
84
|
+
_productsSold: 0,
|
|
85
|
+
_total: 0,
|
|
86
|
+
},
|
|
87
|
+
};
|
|
88
|
+
|
|
89
|
+
summaryMap.set(`${categoryName}.${name}`, {
|
|
90
|
+
name,
|
|
91
|
+
key: `${eventId}.${categoryName}.${name}`,
|
|
92
|
+
quantity: totalQuantity
|
|
93
|
+
? `${
|
|
94
|
+
existingProduct.metadata._productsSold + productsSold
|
|
95
|
+
} / ${totalQuantity}`
|
|
96
|
+
: String(existingProduct.metadata._productsSold + productsSold),
|
|
97
|
+
total: String(existingProduct.metadata._total + total),
|
|
98
|
+
metadata: {
|
|
99
|
+
_productsSold:
|
|
100
|
+
existingProduct.metadata._productsSold + productsSold,
|
|
101
|
+
_total: existingProduct.metadata._total + total,
|
|
102
|
+
},
|
|
103
|
+
});
|
|
104
|
+
}
|
|
105
|
+
);
|
|
106
|
+
|
|
107
|
+
const prevTotalPerCategory = summaryMap.get(
|
|
108
|
+
`${categoryName}.${TRANSLATION_KEYS.totalPerCategory}`
|
|
109
|
+
) ?? {
|
|
110
|
+
quantity: 0,
|
|
111
|
+
total: 0,
|
|
112
|
+
};
|
|
113
|
+
summaryMap.set(`${categoryName}.${TRANSLATION_KEYS.totalPerCategory}`, {
|
|
114
|
+
name: TRANSLATION_KEYS.totalPerCategory,
|
|
115
|
+
key: `${eventId}.${categoryName}.${TRANSLATION_KEYS.totalPerCategory}`,
|
|
116
|
+
quantity: String(Number(prevTotalPerCategory.quantity) + quantity),
|
|
117
|
+
total: String(Number(prevTotalPerCategory.total) + totalPerCategory),
|
|
118
|
+
isBold: true,
|
|
119
|
+
});
|
|
120
|
+
|
|
121
|
+
totalQuantity += quantity;
|
|
122
|
+
}
|
|
123
|
+
);
|
|
88
124
|
|
|
89
|
-
|
|
125
|
+
summaryMap.set(`${TRANSLATION_KEYS.total}.${totalAmount}`, {
|
|
90
126
|
name: TRANSLATION_KEYS.total,
|
|
91
127
|
key: `${TRANSLATION_KEYS.total}.${totalAmount}`,
|
|
92
|
-
quantity: totalQuantity,
|
|
93
|
-
total: totalAmount,
|
|
128
|
+
quantity: String(totalQuantity),
|
|
129
|
+
total: String(totalAmount),
|
|
94
130
|
isBold: true,
|
|
95
131
|
});
|
|
96
132
|
|
|
97
|
-
return
|
|
133
|
+
return [...summaryMap.values()];
|
|
98
134
|
};
|
|
@@ -3,6 +3,7 @@ import { Group } from "react-konva";
|
|
|
3
3
|
import Konva from "konva";
|
|
4
4
|
import { EventVenueMapContext } from "@licklist/plugins/dist/context/event/EventVenueMapContext";
|
|
5
5
|
import { Point } from "@licklist/plugins/dist/types/context/event/point";
|
|
6
|
+
import { Product } from "@licklist/plugins/dist/types/context/sale/menuSteps";
|
|
6
7
|
import { ImageOffset } from "../../types";
|
|
7
8
|
import { PointIcon } from "./components/PointIcon";
|
|
8
9
|
import {
|
|
@@ -10,7 +11,6 @@ import {
|
|
|
10
11
|
calculatePointsCoordinates,
|
|
11
12
|
} from "../../utils";
|
|
12
13
|
import { ProductIcon } from "./components/ProductIcon";
|
|
13
|
-
import { Product } from "../../../../types";
|
|
14
14
|
|
|
15
15
|
type MapPointProps = Partial<Point> &
|
|
16
16
|
ImageOffset & {
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
|
|
3
2
|
import Accordion from "react-bootstrap/Accordion";
|
|
4
|
-
import {
|
|
3
|
+
import { OrderItems } from "@licklist/plugins/dist/types/context/Iframe/orderItems";
|
|
4
|
+
import { ProductCategory } from "@licklist/plugins/dist/types/context/sale/menuSteps";
|
|
5
|
+
import { SetOrderFn } from "../../../types";
|
|
5
6
|
import { AccordionItem } from "./components/AccordionItem";
|
|
6
7
|
|
|
7
8
|
export interface EventBookingProductsProps {
|
|
8
9
|
productsCategories?: ProductCategory[];
|
|
9
10
|
setOrder: SetOrderFn;
|
|
10
|
-
order:
|
|
11
|
+
order: OrderItems;
|
|
11
12
|
}
|
|
12
13
|
|
|
13
14
|
export function EventBookingProducts({
|
|
@@ -1,14 +1,18 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import clsx from "clsx";
|
|
3
3
|
import { useIntl } from "react-intl";
|
|
4
|
-
|
|
5
4
|
import Accordion from "react-bootstrap/Accordion";
|
|
6
5
|
import Card from "react-bootstrap/Card";
|
|
7
6
|
import { useAccordionToggle } from "react-bootstrap/AccordionToggle";
|
|
8
7
|
import AccordionContext from "react-bootstrap/AccordionContext";
|
|
8
|
+
import {
|
|
9
|
+
OrderItem,
|
|
10
|
+
OrderItems,
|
|
11
|
+
} from "@licklist/plugins/dist/types/context/Iframe/orderItems";
|
|
12
|
+
import { Product } from "@licklist/plugins/dist/types/context/sale/menuSteps";
|
|
9
13
|
import { NumberInput } from "../../../../../static";
|
|
10
14
|
import Icon from "../../../../../static/Icon";
|
|
11
|
-
import {
|
|
15
|
+
import { SetOrderFn } from "../../../../../types";
|
|
12
16
|
|
|
13
17
|
interface CustomToggleProps {
|
|
14
18
|
eventKey: string;
|
|
@@ -19,7 +23,7 @@ interface AccordionItemProps {
|
|
|
19
23
|
name: string;
|
|
20
24
|
products: Product[];
|
|
21
25
|
setOrder: SetOrderFn;
|
|
22
|
-
order: Record<number,
|
|
26
|
+
order: Record<number, OrderItem>;
|
|
23
27
|
productsCategoryId: number;
|
|
24
28
|
}
|
|
25
29
|
|
|
@@ -86,7 +90,7 @@ interface ProductItemProps {
|
|
|
86
90
|
name: string;
|
|
87
91
|
price: number;
|
|
88
92
|
description: string;
|
|
89
|
-
order:
|
|
93
|
+
order: OrderItems;
|
|
90
94
|
setOrder: SetOrderFn;
|
|
91
95
|
productsCategoryId: number;
|
|
92
96
|
}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { useTranslation } from "react-i18next";
|
|
3
|
-
|
|
4
3
|
import { StaticTable, StaticTableData } from "../../../table/StaticTable";
|
|
5
4
|
|
|
6
|
-
export { Order } from "../../../types";
|
|
7
5
|
interface EventOrderSummaryProps {
|
|
8
6
|
data: StaticTableData[];
|
|
9
7
|
tableName?: string;
|