s-platform-landing-section 0.1.10-alpha.1 → 0.1.10-alpha.3

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.
Files changed (7) hide show
  1. package/dist/index.css +479 -0
  2. package/dist/index.js +2558 -1158
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.modern.js +2862 -1285
  5. package/dist/index.modern.js.map +1 -1
  6. package/package.json +2 -1
  7. package/dist/no-photo~QhcVGlPG.svg +0 -7
package/dist/index.modern.js CHANGED
@@ -1,96 +1,81 @@
1
- import React__default, { useRef, useState, useEffect, createElement, forwardRef, useImperativeHandle } from 'react';
2
- import { IoCartOutline, IoLocationOutline } from 'react-icons/io5';
3
- import { FaUserCircle, FaPhone, FaChevronLeft, FaChevronRight, FaArrowLeft, FaArrowRight as FaArrowRight$1, FaFacebookSquare, FaFacebookMessenger } from 'react-icons/fa';
1
+ import React__default, { useState, useEffect, useRef, createElement, forwardRef, useImperativeHandle, memo } from 'react';
2
+ import { IoCartOutline, IoLocationOutline, IoChevronBackOutline, IoChevronForwardOutline, IoCallOutline } from 'react-icons/io5';
3
+ import { FaUserCircle, FaPhone, FaChevronLeft, FaChevronRight, FaAngleUp, FaAngleDown, FaCheckCircle, FaArrowLeft, FaArrowRight as FaArrowRight$1, FaFacebookSquare, FaFacebookMessenger, FaFacebookF } from 'react-icons/fa';
4
4
  import { FiMenu } from 'react-icons/fi';
5
5
  import { RxCross2 } from 'react-icons/rx';
6
6
  import { PiHandbagSimpleLight } from 'react-icons/pi';
7
7
  import { CiSearch } from 'react-icons/ci';
8
8
  import { BsFilterLeft, BsCurrencyDollar } from 'react-icons/bs';
9
+ import { FaMinus, FaPlus, FaArrowsRotate, FaStar, FaRegStarHalfStroke, FaRegStar } from 'react-icons/fa6';
10
+ import { LuSearch } from 'react-icons/lu';
9
11
  import DatePicker from 'react-datepicker';
10
12
  import 'react-datepicker/dist/react-datepicker.css';
11
- import { FaArrowsRotate, FaStar, FaRegStarHalfStroke, FaRegStar } from 'react-icons/fa6';
12
- import 'react-icons/lu';
13
- import 'react-icons/io';
13
+ import { IoMdCheckmark, IoIosHeartEmpty } from 'react-icons/io';
14
14
  import { SiVisa, SiZalo } from 'react-icons/si';
15
15
  import { GoCreditCard } from 'react-icons/go';
16
16
 
17
- const Button = props => {
18
- var _shopConfigStyle$colo;
19
- const {
20
- label = "",
21
- className = "",
22
- style = {},
23
- shopConfigStyle = {},
24
- onClick = () => {}
25
- } = props;
26
- const _className = `text-white font-medium rounded-lg text-sm px-4 py-2.5 ${(shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.buttonClass) || ""} ${className}`;
27
- const _style = {
28
- backgroundColor: shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : (_shopConfigStyle$colo = shopConfigStyle.color) === null || _shopConfigStyle$colo === void 0 ? void 0 : _shopConfigStyle$colo.primary,
29
- ...style
30
- };
17
+ var Button = function Button(props) {
18
+ var _props$label = props.label,
19
+ label = _props$label === void 0 ? "" : _props$label,
20
+ _props$className = props.className,
21
+ className = _props$className === void 0 ? "" : _props$className,
22
+ _props$style = props.style,
23
+ style = _props$style === void 0 ? {} : _props$style,
24
+ _props$shopConfigStyl = props.shopConfigStyle,
25
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
26
+ _props$onClick = props.onClick,
27
+ onClick = _props$onClick === void 0 ? function () {} : _props$onClick,
28
+ _props$type = props.type,
29
+ type = _props$type === void 0 ? "primary" : _props$type;
30
+ var _className = type === "primary" ? "text-textButton bg-primary" : "text-primary bg-transparent border border-primary";
31
+ _className = "font-medium rounded-lg text-sm px-4 py-2.5 hover:text-textButton hover:bg-primary hover:opacity-80 " + _className + " " + ((shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.buttonClass) || "") + " " + className;
31
32
  return /*#__PURE__*/React__default.createElement("button", {
32
33
  type: "button",
33
34
  className: _className,
34
- style: _style,
35
+ style: style,
35
36
  onClick: onClick
36
37
  }, label);
37
38
  };
38
39
 
39
- const NavBar7 = props => {
40
- const listRef = useRef(null);
41
- const [isOpen, setIsOpen] = useState(false);
42
- const {
43
- shopConfig = {},
44
- shopConfigStyle,
45
- data,
46
- routes = [],
47
- section = {},
48
- userInfo = null,
49
- cartItems = [],
50
- navToLogin = () => {},
51
- navToRegister = () => {}
52
- } = props;
53
- const {
54
- primary = "#000",
55
- textHeading = "#000",
56
- textBody = "#000",
57
- background = "#fff",
58
- bgSecondary = "#fff",
59
- textButton = "#fff"
60
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
61
- let totalItem = cartItems.reduce((total, item) => total + item.quantity, 0);
40
+ var NavBar7 = function NavBar7(props) {
41
+ var _routes$filter;
42
+ var _useState = useState(false),
43
+ isOpen = _useState[0],
44
+ setIsOpen = _useState[1];
45
+ var _props$shopConfig = props.shopConfig,
46
+ shopConfig = _props$shopConfig === void 0 ? {} : _props$shopConfig,
47
+ shopConfigStyle = props.shopConfigStyle,
48
+ _props$routes = props.routes,
49
+ routes = _props$routes === void 0 ? [] : _props$routes,
50
+ _props$section = props.section,
51
+ section = _props$section === void 0 ? {} : _props$section,
52
+ _props$userInfo = props.userInfo,
53
+ userInfo = _props$userInfo === void 0 ? null : _props$userInfo,
54
+ _props$cartItems = props.cartItems,
55
+ cartItems = _props$cartItems === void 0 ? [] : _props$cartItems;
56
+ console.log("cartItems", cartItems);
57
+ var totalItem = cartItems.reduce(function (total, item) {
58
+ return total + item.quantity;
59
+ }, 0);
62
60
  if (totalItem > 9) {
63
61
  totalItem = "9+";
64
62
  }
65
- const cart = () => {
66
- return /*#__PURE__*/React__default.createElement("div", {
67
- className: "flex"
63
+ var cart = function cart() {
64
+ return /*#__PURE__*/React__default.createElement("a", {
65
+ href: "/carts"
68
66
  }, /*#__PURE__*/React__default.createElement("div", {
69
67
  className: "relative cursor-pointer"
70
68
  }, /*#__PURE__*/React__default.createElement(IoCartOutline, {
71
- style: {
72
- fontSize: "30px",
73
- color: primary
74
- }
69
+ className: "text-primary",
70
+ size: 30
75
71
  }), totalItem ? /*#__PURE__*/React__default.createElement("small", {
76
- className: "absolute aspect-square flex items-center bg-danger px-[2px] text-xs rounded-full",
77
- style: {
78
- color: textButton,
79
- top: 0,
80
- right: 0
81
- }
72
+ className: "absolute aspect-square flex items-center justify-center bg-danger w-5 text-xs rounded-full text-white -top-1 -right-1"
82
73
  }, totalItem) : null));
83
74
  };
84
75
  return /*#__PURE__*/React__default.createElement("div", {
85
- className: "w-full sticky top-0 shadow z-50",
86
- style: {
87
- background: background
88
- }
76
+ className: "w-full sticky top-0 shadow z-50 bg-background"
89
77
  }, /*#__PURE__*/React__default.createElement("div", {
90
- className: "hidden lg:flex gap-6 justify-between items-center py-2 px-4 xl:px-20",
91
- style: {
92
- color: textBody
93
- }
78
+ className: "hidden lg:flex gap-6 justify-between items-center py-2 px-4 xl:px-20"
94
79
  }, /*#__PURE__*/React__default.createElement("a", {
95
80
  href: "/",
96
81
  className: "flex items-center gap-2"
@@ -99,52 +84,46 @@ const NavBar7 = props => {
99
84
  src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
100
85
  alt: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName
101
86
  }), /*#__PURE__*/React__default.createElement("h3", {
102
- className: "text-xl md:text-2xl whitespace-nowrap font-semibold",
103
- style: {
104
- color: primary
105
- }
87
+ className: "text-xl md:text-2xl whitespace-nowrap font-semibold text-primary"
106
88
  }, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName)), /*#__PURE__*/React__default.createElement("div", {
107
89
  className: "hidden lg:flex flex-1 items-center gap-4"
108
- }, routes === null || routes === void 0 ? void 0 : routes.map((route, index) => /*#__PURE__*/React__default.createElement("a", {
109
- href: route === null || route === void 0 ? void 0 : route.route
110
- }, (section === null || section === void 0 ? void 0 : section.pageRoute) === (route === null || route === void 0 ? void 0 : route.name) ? /*#__PURE__*/React__default.createElement("div", {
111
- className: `py-1 border-b`,
112
- style: {
113
- color: textHeading,
114
- borderColor: textHeading
115
- }
116
- }, route === null || route === void 0 ? void 0 : route.label) : /*#__PURE__*/React__default.createElement("div", {
117
- className: `py-1`
118
- }, route === null || route === void 0 ? void 0 : route.label)))), cart(), !userInfo ?
90
+ }, routes === null || routes === void 0 ? void 0 : (_routes$filter = routes.filter(function (e) {
91
+ return e === null || e === void 0 ? void 0 : e.isShow;
92
+ })) === null || _routes$filter === void 0 ? void 0 : _routes$filter.map(function (route, index) {
93
+ return /*#__PURE__*/React__default.createElement("a", {
94
+ href: route === null || route === void 0 ? void 0 : route.route
95
+ }, (section === null || section === void 0 ? void 0 : section.pageRoute) === (route === null || route === void 0 ? void 0 : route.name) ? /*#__PURE__*/React__default.createElement("div", {
96
+ className: "py-1 border-b text-textHeading border-textHeading"
97
+ }, route === null || route === void 0 ? void 0 : route.label) : /*#__PURE__*/React__default.createElement("div", {
98
+ className: "py-1"
99
+ }, route === null || route === void 0 ? void 0 : route.label));
100
+ })), cart(), userInfo ?
119
101
  /*#__PURE__*/
120
102
  React__default.createElement("div", {
121
103
  className: "flex justify-center"
122
104
  }, /*#__PURE__*/React__default.createElement(FaUserCircle, {
123
- color: "#fff",
105
+ className: "text-bgSecondary",
124
106
  size: 48
125
107
  }), /*#__PURE__*/React__default.createElement("div", {
126
108
  className: "flex flex-col ml-2"
127
109
  }, /*#__PURE__*/React__default.createElement("label", null, "Xin ch\xE0o!"), /*#__PURE__*/React__default.createElement("label", {
128
110
  className: "font-semibold"
129
- }, userInfo === null || userInfo === void 0 ? void 0 : userInfo.name, "Nguyen Thanh Tung"))) :
111
+ }, userInfo === null || userInfo === void 0 ? void 0 : userInfo.name))) :
130
112
  /*#__PURE__*/
131
113
  React__default.createElement("div", {
132
114
  className: "flex gap-2"
115
+ }, /*#__PURE__*/React__default.createElement("a", {
116
+ href: "/account"
133
117
  }, /*#__PURE__*/React__default.createElement(Button, {
134
118
  label: "Đăng nhập",
135
- shopConfigStyle: shopConfigStyle,
136
- onClick: () => navToLogin()
137
- }), /*#__PURE__*/React__default.createElement(Button, {
119
+ shopConfigStyle: shopConfigStyle
120
+ })), /*#__PURE__*/React__default.createElement("a", {
121
+ href: "/account"
122
+ }, /*#__PURE__*/React__default.createElement(Button, {
138
123
  label: "Đăng ký",
139
124
  shopConfigStyle: shopConfigStyle,
140
- style: {
141
- backgroundColor: "transparent",
142
- borderColor: primary,
143
- color: primary
144
- },
145
- className: "border",
146
- onClick: () => navToRegister()
147
- }))), /*#__PURE__*/React__default.createElement("div", {
125
+ type: 'outline'
126
+ })))), /*#__PURE__*/React__default.createElement("div", {
148
127
  className: "relative lg:hidden flex gap-4 items-center px-4 py-2"
149
128
  }, /*#__PURE__*/React__default.createElement("a", {
150
129
  href: "/",
@@ -154,57 +133,51 @@ const NavBar7 = props => {
154
133
  src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
155
134
  alt: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName
156
135
  }), /*#__PURE__*/React__default.createElement("h3", {
157
- className: "text-xl md:text-2xl font-semibold",
158
- style: {
159
- color: primary
160
- }
161
- }, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName)), /*#__PURE__*/React__default.createElement("button", {
136
+ className: "text-xl md:text-2xl font-semibold text-primary"
137
+ }, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName)), cart(), /*#__PURE__*/React__default.createElement("button", {
162
138
  type: "button",
163
- onClick: () => {
139
+ onClick: function onClick() {
164
140
  setIsOpen(true);
165
141
  }
166
142
  }, /*#__PURE__*/React__default.createElement(FiMenu, {
167
143
  size: 32,
168
- color: primary
144
+ className: "text-primary"
169
145
  })), isOpen ? /*#__PURE__*/React__default.createElement("div", {
170
146
  className: "absolute bg-[rgba(0,0,0,0.5)] h-screen w-full top-0 left-0 z-50 flex justify-end",
171
- onClick: () => {
147
+ onClick: function onClick() {
172
148
  setIsOpen(false);
173
149
  }
174
150
  }, /*#__PURE__*/React__default.createElement("div", {
175
- className: "h-full w-[80vw] max-w-[320px] p-4",
176
- style: {
177
- background: bgSecondary
178
- },
179
- onClick: event => event.stopPropagation()
151
+ className: "h-full w-[80vw] max-w-[320px] p-4 bg-bgSecondary",
152
+ onClick: function onClick(event) {
153
+ return event.stopPropagation();
154
+ }
180
155
  }, /*#__PURE__*/React__default.createElement("button", {
181
156
  className: "flex w-full justify-end text-gray4",
182
- onClick: () => {
157
+ onClick: function onClick() {
183
158
  setIsOpen(false);
184
159
  }
185
160
  }, /*#__PURE__*/React__default.createElement(RxCross2, {
186
161
  size: 24
187
- })), /*#__PURE__*/React__default.createElement("div", null, routes === null || routes === void 0 ? void 0 : routes.map((route, index) => /*#__PURE__*/React__default.createElement("a", {
188
- href: route === null || route === void 0 ? void 0 : route.route
189
- }, /*#__PURE__*/React__default.createElement("div", {
190
- className: `py-2`,
191
- style: (section === null || section === void 0 ? void 0 : section.pageRoute) === (route === null || route === void 0 ? void 0 : route.name) ? {
192
- color: textHeading
193
- } : null
194
- }, route === null || route === void 0 ? void 0 : route.label)))))) : null, cart()));
162
+ })), /*#__PURE__*/React__default.createElement("div", null, routes === null || routes === void 0 ? void 0 : routes.map(function (route, index) {
163
+ return /*#__PURE__*/React__default.createElement("a", {
164
+ href: route === null || route === void 0 ? void 0 : route.route
165
+ }, /*#__PURE__*/React__default.createElement("div", {
166
+ className: "py-2 " + ((section === null || section === void 0 ? void 0 : section.pageRoute) === (route === null || route === void 0 ? void 0 : route.name) ? "text-textHeading" : "")
167
+ }, route === null || route === void 0 ? void 0 : route.label));
168
+ })))) : null));
195
169
  };
196
170
 
197
- const SvgIcon = ({
198
- className,
199
- style
200
- }) => {
171
+ var SvgIcon = function SvgIcon(_ref) {
172
+ var className = _ref.className,
173
+ style = _ref.style;
201
174
  return /*#__PURE__*/React__default.createElement("svg", {
202
175
  width: "42",
203
176
  height: "42",
204
177
  viewBox: "0 0 42 42",
205
178
  fill: "none",
206
179
  xmlns: "http://www.w3.org/2000/svg",
207
- className: `${className}`,
180
+ className: "" + className,
208
181
  style: style
209
182
  }, /*#__PURE__*/React__default.createElement("path", {
210
183
  d: "M21.0006 3C18.7312 3 15.091 6.90509 14.572 11.5982C10.1417 10.0788 5.15787 11.9531 4.22675 14.0991C3.22704 16.4034 5.59115 22.0699 10.1707 24.1839C10.2897 24.2388 10.417 24.2778 10.5387 24.3279C10.4967 24.3782 10.4491 24.4219 10.408 24.4731C7.21527 28.4646 7.53641 34.625 9.42347 36.2318C10.0159 36.7357 11.0046 37 12.183 37C14.7586 36.9993 18.2373 35.7431 20.4297 33.0032C20.6374 32.7437 20.8279 32.4797 21.0019 32.2141C21.181 32.4887 21.3716 32.7533 21.5728 33.0045C23.7645 35.7431 27.2401 37 29.817 37C30.9954 37 31.9853 36.7363 32.5778 36.2331C34.4648 34.625 34.7847 28.4646 31.592 24.4744C31.5521 24.4247 31.5092 24.3829 31.4689 24.3344C31.5897 24.2846 31.713 24.2382 31.8305 24.1839C36.4094 22.0699 38.7729 16.4027 37.7732 14.0991C36.8378 11.9444 31.8174 10.0959 27.4267 11.5916C26.9098 6.86354 23.2507 3 21.0006 3ZM21.0006 4.34011C22.3907 4.34011 25.8805 7.69855 26.1694 12.136C24.0016 13.2466 22.6195 14.9602 21.838 16.2414C21.647 16.5543 21.7382 16.9684 22.0422 17.1654C22.3462 17.3624 22.747 17.2689 22.938 16.9547C23.9669 15.2668 25.4278 13.9249 27.0524 13.1751C31.2559 11.2333 35.9724 13.2276 36.5882 14.6461C37.204 16.0646 35.503 21.0198 31.2989 22.9603C31.0314 23.084 30.7493 23.1895 30.4628 23.2861C29.0772 22.0357 27.5654 21.3484 26.4308 20.9855C26.0865 20.8769 25.7234 21.074 25.6175 21.4278C25.511 21.7809 25.7034 22.1555 26.0463 22.2654C27.3306 22.6761 29.1619 23.542 30.5897 25.3277C33.5213 28.9902 32.9127 34.2083 31.7505 35.1979C30.5884 36.1856 25.5067 35.8138 22.5738 32.15C22.2616 31.7601 21.9827 31.3316 21.7339 30.8805C22.3864 29.478 22.6678 28.11 22.7756 27.0657C22.8132 26.6978 22.5556 26.3684 22.1983 26.3289C21.8449 26.2893 21.5223 26.5558 21.484 26.9243C21.3404 28.3147 20.8663 30.3502 19.4261 32.15C16.4945 35.8138 11.4115 36.1883 10.2507 35.1979C9.08856 34.2089 8.4787 28.9903 11.4103 25.3264C11.5663 25.1318 11.737 24.9533 11.9064 24.7754C12.7322 24.9798 13.5911 25.0961 14.4667 25.0961C15.1448 25.0961 15.8317 25.0343 16.5119 24.9076C16.8652 24.842 17.0995 24.4928 17.0358 24.1289C16.9722 23.7644 16.6343 23.5201 16.2822 23.5871C14.3412 23.9476 12.3588 23.7248 10.7011 22.959C6.49758 21.0185 4.7972 16.0633 5.41301 14.6448C5.98748 13.3195 10.4467 11.3878 14.5174 12.9985C14.5864 15.5355 15.5457 17.5709 16.3634 18.8444C16.4881 19.0394 16.6947 19.1441 16.9052 19.1441C17.0286 19.1441 17.1538 19.1079 17.2642 19.0329C17.5637 18.8285 17.645 18.4132 17.4469 18.105C16.6973 16.9371 15.8039 15.0529 15.8039 12.7158C15.8039 7.9651 19.4936 4.34011 21.0006 4.34011Z",
@@ -217,109 +190,85 @@ const SvgIcon = ({
217
190
  fill: "currentColor"
218
191
  }));
219
192
  };
220
- const SectionTitle1 = props => {
221
- const {
222
- shopConfigStyle = {},
223
- data = {}
224
- } = props;
225
- const {
226
- textHeading = "#000",
227
- secondary = "#000",
228
- textSecondary = "#000"
229
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
193
+ var SectionTitle1 = function SectionTitle1(props) {
194
+ var _props$data = props.data,
195
+ data = _props$data === void 0 ? {} : _props$data;
230
196
  return /*#__PURE__*/React__default.createElement("div", null, data !== null && data !== void 0 && data.sectionTitle ? /*#__PURE__*/React__default.createElement("div", {
231
- className: "text-center text-2xl md:text-4xl font-merienda font-semibold leading-relaxed",
232
- style: {
233
- color: textHeading
234
- }
197
+ className: "text-center text-2xl md:text-4xl font-headingFont font-semibold leading-relaxed text-textHeading"
235
198
  }, data === null || data === void 0 ? void 0 : data.sectionTitle) : null, /*#__PURE__*/React__default.createElement("div", {
236
- className: `flex items-center justify-center`
199
+ className: "flex items-center justify-center"
237
200
  }, /*#__PURE__*/React__default.createElement("div", {
238
- className: "w-32 h-0.5 rounded-full",
239
- style: {
240
- backgroundColor: secondary
241
- }
201
+ className: "w-32 h-0.5 rounded-full bg-secondary"
242
202
  }), /*#__PURE__*/React__default.createElement(SvgIcon, {
243
- className: "w-9 h-9",
244
- style: {
245
- color: secondary
246
- }
203
+ className: "w-9 h-9 text-secondary"
247
204
  }), /*#__PURE__*/React__default.createElement("div", {
248
- className: " w-32 h-0.5 rounded-full",
249
- style: {
250
- backgroundColor: secondary
251
- }
205
+ className: " w-32 h-0.5 rounded-full bg-secondary"
252
206
  })), data !== null && data !== void 0 && data.sectionDescription ? /*#__PURE__*/React__default.createElement("div", {
253
- className: "text-xl font-medium text-center leading-relaxed",
254
- style: {
255
- color: textSecondary
256
- }
207
+ className: "text-xl font-medium text-center leading-relaxed text-textSecondary"
257
208
  }, data === null || data === void 0 ? void 0 : data.sectionDescription) : null);
258
209
  };
259
210
 
260
- const Hero10 = props => {
211
+ var Hero10 = function Hero10(props) {
261
212
  var _data$data, _data$data$, _data$data$$srcImages, _sectionData$, _sectionData$2, _sectionData$2$button;
262
- const {
263
- shopConfigStyle,
264
- data
265
- } = props;
266
- const sectionData = data === null || data === void 0 ? void 0 : data.data;
213
+ var shopConfigStyle = props.shopConfigStyle,
214
+ data = props.data;
215
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
267
216
  return /*#__PURE__*/React__default.createElement("div", {
268
217
  className: "relative w-full bg-cover bg-center bg-no-repeat ",
269
218
  style: {
270
- backgroundImage: `url(${data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : (_data$data$ = _data$data[0]) === null || _data$data$ === void 0 ? void 0 : (_data$data$$srcImages = _data$data$.srcImages) === null || _data$data$$srcImages === void 0 ? void 0 : _data$data$$srcImages[0]})`
219
+ backgroundImage: "url(" + (data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : (_data$data$ = _data$data[0]) === null || _data$data$ === void 0 ? void 0 : (_data$data$$srcImages = _data$data$.srcImages) === null || _data$data$$srcImages === void 0 ? void 0 : _data$data$$srcImages[0]) + ")"
271
220
  }
272
221
  }, /*#__PURE__*/React__default.createElement("div", {
273
222
  className: "absolute top-0 w-full h-full bg-black opacity-40 z-0"
274
223
  }), /*#__PURE__*/React__default.createElement("div", {
275
224
  className: "relative w-full min-h-[540px] p-12 z-10 flex flex-col gap-6 items-center justify-center"
276
225
  }, /*#__PURE__*/React__default.createElement("div", {
277
- className: `text-3xl md:text-5xl text-white leading-[1.6] md:leading-[1.6] text-center ${shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.headingFont}`
278
- }, sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$ = sectionData[0]) === null || _sectionData$ === void 0 ? void 0 : _sectionData$.title), sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$2 = sectionData[0]) === null || _sectionData$2 === void 0 ? void 0 : (_sectionData$2$button = _sectionData$2.buttons) === null || _sectionData$2$button === void 0 ? void 0 : _sectionData$2$button.map(button => /*#__PURE__*/React__default.createElement(Button, {
279
- label: button === null || button === void 0 ? void 0 : button.label,
280
- shopConfigStyle: shopConfigStyle
281
- }))));
226
+ className: "text-3xl md:text-5xl text-white leading-[1.6] md:leading-[1.6] text-center font-headingFont"
227
+ }, sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$ = sectionData[0]) === null || _sectionData$ === void 0 ? void 0 : _sectionData$.title), sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$2 = sectionData[0]) === null || _sectionData$2 === void 0 ? void 0 : (_sectionData$2$button = _sectionData$2.buttons) === null || _sectionData$2$button === void 0 ? void 0 : _sectionData$2$button.map(function (button) {
228
+ return /*#__PURE__*/React__default.createElement("a", {
229
+ href: (button === null || button === void 0 ? void 0 : button.route) || (button === null || button === void 0 ? void 0 : button.link) || "#"
230
+ }, /*#__PURE__*/React__default.createElement(Button, {
231
+ label: button === null || button === void 0 ? void 0 : button.label,
232
+ shopConfigStyle: shopConfigStyle
233
+ }));
234
+ })));
282
235
  };
283
236
 
284
- const Dash = props => {
285
- const {
286
- color = "#ccc",
287
- className = ""
288
- } = props;
237
+ var Dash = function Dash(props) {
238
+ var _props$color = props.color,
239
+ color = _props$color === void 0 ? "#ccc" : _props$color,
240
+ _props$className = props.className,
241
+ className = _props$className === void 0 ? "" : _props$className;
289
242
  return /*#__PURE__*/React__default.createElement("div", {
290
- className: `mx-auto w-full max-w-[240px] md:max-w-[720px] border-b-0 ${className}`,
243
+ className: "mx-auto w-full max-w-[240px] md:max-w-[720px] border-b-0 " + className,
291
244
  style: {
292
- backgroundImage: `repeating-linear-gradient(to right, ${color} 0, ${color} 10px, transparent 10px, transparent 20px)`,
245
+ backgroundImage: "repeating-linear-gradient(to right, " + color + " 0, " + color + " 10px, transparent 10px, transparent 20px)",
293
246
  height: "1px"
294
247
  }
295
248
  });
296
249
  };
297
250
 
298
- const Hero11 = props => {
251
+ var SECTION_DEFAULT_CLASS = "my-12 mx-4 xl:mx-20 bg-background";
252
+
253
+ var Hero11 = function Hero11(props) {
299
254
  var _data$data;
300
- const {
301
- shopConfigStyle = {},
302
- shopConfig = {},
303
- data = {},
304
- SectionTitle = null
305
- } = props;
306
- const {
307
- primary = "#000",
308
- secondary = "#000",
309
- textBody = "#000",
310
- background = "#fff"
311
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
255
+ var _props$shopConfigStyl = props.shopConfigStyle,
256
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
257
+ _props$data = props.data,
258
+ data = _props$data === void 0 ? {} : _props$data,
259
+ _props$SectionTitle = props.SectionTitle,
260
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
261
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
262
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
263
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
312
264
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
313
- className: "relative w-full py-12 px-4 xl:px-20",
314
- style: {
315
- backgroundColor: background
316
- }
265
+ className: "" + SECTION_DEFAULT_CLASS
317
266
  }, /*#__PURE__*/React__default.createElement(SectionTitle, {
318
267
  data: data,
319
268
  shopConfigStyle: shopConfigStyle
320
269
  }), /*#__PURE__*/React__default.createElement("div", {
321
270
  className: "mt-6 grid grid-cols-2 md:grid-cols-4 gap-1 md:gap-2"
322
- }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map((it, index) => {
271
+ }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map(function (it, index) {
323
272
  var _it$srcImages;
324
273
  return /*#__PURE__*/React__default.createElement("div", {
325
274
  key: index
@@ -331,26 +280,14 @@ const Hero11 = props => {
331
280
  }));
332
281
  };
333
282
 
334
- const Hero11$1 = props => {
283
+ var Hero11$1 = function Hero11(props) {
335
284
  var _data$data, _data$data$, _data$data$$srcImages, _data$data2, _data$data2$, _data$data3, _data$data3$;
336
- const {
337
- shopConfigStyle = {},
338
- shopConfig = {},
339
- data = {},
340
- SectionTitle = null
341
- } = props;
342
- const {
343
- textHeading = "#000",
344
- primary = "#000",
345
- secondary = "#000",
346
- textBody = "#000",
347
- background = "#fff"
348
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
349
- console.log("Hero11 data", data);
285
+ var _props$data = props.data,
286
+ data = _props$data === void 0 ? {} : _props$data;
350
287
  return /*#__PURE__*/React__default.createElement("div", {
351
288
  className: "relative w-full bg-cover bg-center bg-no-repeat grid grid-cols-1 md:grid-cols-2",
352
289
  style: {
353
- backgroundImage: `url(${data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : (_data$data$ = _data$data[0]) === null || _data$data$ === void 0 ? void 0 : (_data$data$$srcImages = _data$data$.srcImages) === null || _data$data$$srcImages === void 0 ? void 0 : _data$data$$srcImages[0]})`
290
+ backgroundImage: "url(" + (data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : (_data$data$ = _data$data[0]) === null || _data$data$ === void 0 ? void 0 : (_data$data$$srcImages = _data$data$.srcImages) === null || _data$data$$srcImages === void 0 ? void 0 : _data$data$$srcImages[0]) + ")"
354
291
  }
355
292
  }, /*#__PURE__*/React__default.createElement("div", {
356
293
  className: "absolute top-0 w-full h-full bg-white opacity-60 z-0 md:hidden"
@@ -359,15 +296,82 @@ const Hero11$1 = props => {
359
296
  }), /*#__PURE__*/React__default.createElement("div", {
360
297
  className: "relative p-12 z-1"
361
298
  }, /*#__PURE__*/React__default.createElement("div", {
362
- className: `text-2xl md:text-4xl leading-[1.6] ${shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.headingFont}`,
363
- style: {
364
- color: textHeading
365
- }
299
+ className: "text-2xl md:text-4xl leading-[1.6] font-headingFont text-textHeading"
366
300
  }, data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : (_data$data2$ = _data$data2[0]) === null || _data$data2$ === void 0 ? void 0 : _data$data2$.title), /*#__PURE__*/React__default.createElement("div", {
367
301
  className: "pt-6"
368
302
  }, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : (_data$data3$ = _data$data3[0]) === null || _data$data3$ === void 0 ? void 0 : _data$data3$.description)));
369
303
  };
370
304
 
305
+ // A type of promise-like that resolves synchronously and supports only one observer
306
+
307
+ const _iteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.iterator || (Symbol.iterator = Symbol("Symbol.iterator"))) : "@@iterator";
308
+
309
+ const _asyncIteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.asyncIterator || (Symbol.asyncIterator = Symbol("Symbol.asyncIterator"))) : "@@asyncIterator";
310
+
311
+ // Asynchronously call a function and send errors to recovery continuation
312
+ function _catch(body, recover) {
313
+ try {
314
+ var result = body();
315
+ } catch(e) {
316
+ return recover(e);
317
+ }
318
+ if (result && result.then) {
319
+ return result.then(void 0, recover);
320
+ }
321
+ return result;
322
+ }
323
+
324
+ function _arrayLikeToArray(r, a) {
325
+ (null == a || a > r.length) && (a = r.length);
326
+ for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
327
+ return n;
328
+ }
329
+ function _createForOfIteratorHelperLoose(r, e) {
330
+ var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
331
+ if (t) return (t = t.call(r)).next.bind(t);
332
+ if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) {
333
+ t && (r = t);
334
+ var o = 0;
335
+ return function () {
336
+ return o >= r.length ? {
337
+ done: !0
338
+ } : {
339
+ done: !1,
340
+ value: r[o++]
341
+ };
342
+ };
343
+ }
344
+ throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
345
+ }
346
+ function _extends() {
347
+ return _extends = Object.assign ? Object.assign.bind() : function (n) {
348
+ for (var e = 1; e < arguments.length; e++) {
349
+ var t = arguments[e];
350
+ for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
351
+ }
352
+ return n;
353
+ }, _extends.apply(null, arguments);
354
+ }
355
+ function _objectDestructuringEmpty(t) {
356
+ if (null == t) throw new TypeError("Cannot destructure " + t);
357
+ }
358
+ function _objectWithoutPropertiesLoose(r, e) {
359
+ if (null == r) return {};
360
+ var t = {};
361
+ for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
362
+ if (e.includes(n)) continue;
363
+ t[n] = r[n];
364
+ }
365
+ return t;
366
+ }
367
+ function _unsupportedIterableToArray(r, a) {
368
+ if (r) {
369
+ if ("string" == typeof r) return _arrayLikeToArray(r, a);
370
+ var t = {}.toString.call(r).slice(8, -1);
371
+ return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
372
+ }
373
+ }
374
+
371
375
  function bind(fn, thisArg) {
372
376
  return function wrap() {
373
377
  return fn.apply(thisArg, arguments);
@@ -6419,116 +6423,134 @@ var lib = {
6419
6423
  stringify: stringify_1
6420
6424
  };
6421
6425
 
6422
- const getBaseUrl = () => {
6426
+ var getBaseUrl = function getBaseUrl() {
6423
6427
  return process.env.NEXT_PUBLIC_BASE_URL || "https://test-apigateway.sfin.vn";
6424
6428
  };
6425
- const request = axios.create();
6426
- request.interceptors.request.use(config => {
6429
+ var request = axios.create();
6430
+ request.interceptors.request.use(function (config) {
6427
6431
  return config;
6428
- }, error => {
6432
+ }, function (error) {
6429
6433
  return Promise.reject(error.response || {
6430
6434
  data: {}
6431
6435
  });
6432
6436
  });
6433
- request.interceptors.response.use(response => {
6437
+ request.interceptors.response.use(function (response) {
6434
6438
  return response;
6435
- }, error => {
6439
+ }, function (error) {
6436
6440
  return Promise.reject((error === null || error === void 0 ? void 0 : error.response) || {
6437
6441
  data: {}
6438
6442
  });
6439
6443
  });
6440
- const api = options => {
6441
- let config = {
6442
- baseURL: getBaseUrl(),
6443
- ...options,
6444
- paramsSerializer: params => lib.stringify(params, {
6445
- arrayFormat: "repeat"
6446
- }),
6447
- headers: {
6448
- ...options.headers
6449
- }
6450
- };
6444
+ var api = function api(options) {
6445
+ var config = _extends({
6446
+ baseURL: getBaseUrl()
6447
+ }, options, {
6448
+ paramsSerializer: function paramsSerializer(params) {
6449
+ return lib.stringify(params, {
6450
+ arrayFormat: "repeat"
6451
+ });
6452
+ },
6453
+ headers: _extends({}, options.headers)
6454
+ });
6451
6455
  return request(config);
6452
6456
  };
6453
6457
 
6454
- const getShopCategoriesApi = (shopId, types) => {
6458
+ var getShopCategoriesApi = function getShopCategoriesApi(shopId, types) {
6455
6459
  return api({
6456
6460
  method: "get",
6457
- url: `/landing-shop/get-product-category-on-landing`,
6461
+ url: "/landing-shop/get-product-category-on-landing",
6458
6462
  params: {
6459
- shopId,
6460
- types,
6463
+ shopId: shopId,
6464
+ types: types,
6461
6465
  isShowOnLanding: true
6462
6466
  },
6463
6467
  headers: {
6464
- shopId
6468
+ shopId: shopId
6465
6469
  }
6466
6470
  });
6467
6471
  };
6468
- const getProductListApi = (shopId, params = {}) => {
6472
+ var getProductListApi = function getProductListApi(shopId, params) {
6473
+ if (params === void 0) {
6474
+ params = {};
6475
+ }
6469
6476
  return api({
6470
6477
  method: "get",
6471
- url: `/landing-shop/get-product-on-landing`,
6472
- params: {
6473
- shopId,
6474
- isShowOnLanding: true,
6475
- ...params
6476
- },
6478
+ url: "/landing-shop/get-product-on-landing",
6479
+ params: _extends({
6480
+ shopId: shopId,
6481
+ isShowOnLanding: true
6482
+ }, params),
6483
+ headers: {
6484
+ shopId: shopId
6485
+ }
6486
+ });
6487
+ };
6488
+ var getDetailProductApi = function getDetailProductApi(shopId, productId) {
6489
+ return api({
6490
+ method: "get",
6491
+ url: "/products/" + productId + "/shops/" + shopId + "/info",
6477
6492
  headers: {
6478
- shopId
6493
+ shopId: shopId
6479
6494
  }
6480
6495
  });
6481
6496
  };
6482
6497
 
6483
- const CategoryController = props => {
6484
- const {
6485
- shopConfig,
6486
- params
6487
- } = props;
6488
- const [categories, setCategories] = useState([]);
6489
- const defaultParams = {};
6490
- useEffect(() => {
6498
+ var CategoryController = function CategoryController(props) {
6499
+ var shopConfig = props.shopConfig,
6500
+ _props$types = props.types,
6501
+ types = _props$types === void 0 ? "" : _props$types;
6502
+ var _useState = useState([]),
6503
+ categories = _useState[0],
6504
+ setCategories = _useState[1];
6505
+ useEffect(function () {
6491
6506
  getCategoryList();
6492
6507
  }, []);
6493
- const getCategoryList = async () => {
6508
+ var getCategoryList = function getCategoryList() {
6494
6509
  try {
6495
- var _res$data, _res$data$status;
6496
- const res = await getShopCategoriesApi(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId, {
6497
- ...defaultParams,
6498
- ...params
6510
+ var _temp = _catch(function () {
6511
+ return Promise.resolve(getShopCategoriesApi(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId, types)).then(function (res) {
6512
+ var _res$data, _res$data$status;
6513
+ if ((res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$status = _res$data.status) === null || _res$data$status === void 0 ? void 0 : _res$data$status.code) == 200) {
6514
+ var _res$data2;
6515
+ setCategories(res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data);
6516
+ }
6517
+ });
6518
+ }, function (e) {
6519
+ console.log(e);
6499
6520
  });
6500
- if ((res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$status = _res$data.status) === null || _res$data$status === void 0 ? void 0 : _res$data$status.code) == 200) {
6501
- var _res$data2;
6502
- setCategories(res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data);
6503
- }
6521
+ return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
6504
6522
  } catch (e) {
6505
- console.log(e);
6523
+ return Promise.reject(e);
6506
6524
  }
6507
6525
  };
6508
6526
  return {
6509
- categories
6527
+ categories: categories
6510
6528
  };
6511
6529
  };
6512
6530
 
6513
- const Hero13 = props => {
6514
- const listRef = useRef(null);
6515
- const [isOpen, setIsOpen] = useState(false);
6516
- const {
6517
- shopConfigStyle,
6518
- data
6519
- } = props;
6520
- const sectionData = data === null || data === void 0 ? void 0 : data.data;
6521
- const {
6522
- categories = []
6523
- } = CategoryController(props);
6524
- const {
6525
- primary = "#000",
6526
- textBody = "#000",
6527
- background = "#fff",
6528
- bgSecondary = "#fff",
6529
- textButton = "#fff"
6530
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
6531
- const handleClickPrevImg = () => {
6531
+ var Hero13 = function Hero13(props) {
6532
+ var listRef = useRef(null);
6533
+ var _useState = useState(false),
6534
+ isOpen = _useState[0],
6535
+ setIsOpen = _useState[1];
6536
+ var shopConfigStyle = props.shopConfigStyle,
6537
+ data = props.data;
6538
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
6539
+ var _CategoryController = CategoryController(props),
6540
+ _CategoryController$c = _CategoryController.categories,
6541
+ categories = _CategoryController$c === void 0 ? [] : _CategoryController$c;
6542
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
6543
+ _shopConfigStyle$colo2 = _shopConfigStyle$colo.primary,
6544
+ primary = _shopConfigStyle$colo2 === void 0 ? "#000" : _shopConfigStyle$colo2,
6545
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.textBody,
6546
+ textBody = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3,
6547
+ _shopConfigStyle$colo4 = _shopConfigStyle$colo.background,
6548
+ background = _shopConfigStyle$colo4 === void 0 ? "#fff" : _shopConfigStyle$colo4,
6549
+ _shopConfigStyle$colo5 = _shopConfigStyle$colo.bgSecondary,
6550
+ bgSecondary = _shopConfigStyle$colo5 === void 0 ? "#fff" : _shopConfigStyle$colo5,
6551
+ _shopConfigStyle$colo6 = _shopConfigStyle$colo.textButton,
6552
+ textButton = _shopConfigStyle$colo6 === void 0 ? "#fff" : _shopConfigStyle$colo6;
6553
+ var handleClickPrevImg = function handleClickPrevImg() {
6532
6554
  if (listRef.current) {
6533
6555
  listRef.current.scrollBy({
6534
6556
  left: -90,
@@ -6536,7 +6558,7 @@ const Hero13 = props => {
6536
6558
  });
6537
6559
  }
6538
6560
  };
6539
- const handleClickNextImg = () => {
6561
+ var handleClickNextImg = function handleClickNextImg() {
6540
6562
  if (listRef.current) {
6541
6563
  listRef.current.scrollBy({
6542
6564
  left: 90,
@@ -6571,7 +6593,7 @@ const Hero13 = props => {
6571
6593
  }, /*#__PURE__*/React__default.createElement("a", {
6572
6594
  href: "/"
6573
6595
  }, /*#__PURE__*/React__default.createElement("div", {
6574
- className: `border-b-2`,
6596
+ className: "border-b-2",
6575
6597
  style: {
6576
6598
  color: primary,
6577
6599
  borderColor: primary
@@ -6579,18 +6601,18 @@ const Hero13 = props => {
6579
6601
  }, "Trang ch\u1EE7")), /*#__PURE__*/React__default.createElement("div", {
6580
6602
  className: "relative group "
6581
6603
  }, /*#__PURE__*/React__default.createElement("div", {
6582
- className: ` mx-4 `
6604
+ className: " mx-4 "
6583
6605
  }, "Danh m\u1EE5c"), /*#__PURE__*/React__default.createElement("div", {
6584
6606
  className: "absolute hidden grid group-hover:grid grid-cols-3 lg:w-[400px] 2xl:w-[600px] ms-4 py-2 px-2 gap-2 leading-10 rounded-xl z-50",
6585
6607
  style: {
6586
6608
  background: bgSecondary
6587
6609
  }
6588
- }, categories && categories.length > 0 && categories.map(item => {
6610
+ }, categories && categories.length > 0 && categories.map(function (item) {
6589
6611
  return /*#__PURE__*/React__default.createElement("div", {
6590
- key: `hover-${item.categoryId}`,
6612
+ key: "hover-" + item.categoryId,
6591
6613
  className: "hover:bg-gray4 hover:text-white mx-auto px-6"
6592
6614
  }, /*#__PURE__*/React__default.createElement("a", {
6593
- href: `#`
6615
+ href: "#"
6594
6616
  }, /*#__PURE__*/React__default.createElement("div", null, item.cateName)));
6595
6617
  }))), /*#__PURE__*/React__default.createElement("a", {
6596
6618
  href: "/introduction"
@@ -6652,7 +6674,7 @@ const Hero13 = props => {
6652
6674
  className: ""
6653
6675
  }, isOpen === false ? /*#__PURE__*/React__default.createElement("button", {
6654
6676
  type: "button",
6655
- onClick: () => {
6677
+ onClick: function onClick() {
6656
6678
  setIsOpen(true);
6657
6679
  }
6658
6680
  }, /*#__PURE__*/React__default.createElement(FiMenu, {
@@ -6678,7 +6700,7 @@ const Hero13 = props => {
6678
6700
  }
6679
6701
  }, data !== null && data !== void 0 && data.sectionTitle ? data.sectionTitle : "Điện thoại Hải Anh")), /*#__PURE__*/React__default.createElement("button", {
6680
6702
  className: "text-4xl text-gray3",
6681
- onClick: () => {
6703
+ onClick: function onClick() {
6682
6704
  setIsOpen(false);
6683
6705
  }
6684
6706
  }, /*#__PURE__*/React__default.createElement(RxCross2, null))), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
@@ -6688,15 +6710,15 @@ const Hero13 = props => {
6688
6710
  }, /*#__PURE__*/React__default.createElement("a", {
6689
6711
  href: "/"
6690
6712
  }, /*#__PURE__*/React__default.createElement("div", {
6691
- className: ` border-2 rounded-lg p-4`
6713
+ className: " border-2 rounded-lg p-4"
6692
6714
  }, "Trang ch\u1EE7")), /*#__PURE__*/React__default.createElement("a", {
6693
6715
  href: "/product/category"
6694
6716
  }, /*#__PURE__*/React__default.createElement("div", {
6695
- className: `border-2 rounded-lg p-4`
6717
+ className: "border-2 rounded-lg p-4"
6696
6718
  }, "Danh m\u1EE5c")), /*#__PURE__*/React__default.createElement("a", {
6697
6719
  href: "/introduction"
6698
6720
  }, /*#__PURE__*/React__default.createElement("div", {
6699
- className: `border-2 rounded-lg p-4`
6721
+ className: "border-2 rounded-lg p-4"
6700
6722
  }, "Gi\u1EDBi thi\u1EC7u"))))))), /*#__PURE__*/React__default.createElement("a", {
6701
6723
  href: "/",
6702
6724
  className: "flex items-center"
@@ -6745,12 +6767,12 @@ const Hero13 = props => {
6745
6767
  }, /*#__PURE__*/React__default.createElement("div", {
6746
6768
  className: " flex my-auto h-full overflow-x-auto hide-scrollbar",
6747
6769
  ref: listRef
6748
- }, categories && categories.length > 0 && categories.map(item => {
6770
+ }, categories && categories.length > 0 && categories.map(function (item) {
6749
6771
  return /*#__PURE__*/React__default.createElement("button", {
6750
- key: `cateN-${item.categoryId}`,
6772
+ key: "cateN-" + item.categoryId,
6751
6773
  className: "items whitespace-nowrap border-r-2 border-r-white px-6 "
6752
6774
  }, /*#__PURE__*/React__default.createElement("a", {
6753
- href: `/products/category?id=${item.categoryId}`
6775
+ href: "/products/category?id=" + item.categoryId
6754
6776
  }, item.cateName));
6755
6777
  }))), /*#__PURE__*/React__default.createElement("div", {
6756
6778
  className: "lg:block hidden lg:col-span-1 my-auto flex "
@@ -6778,125 +6800,82 @@ const Hero13 = props => {
6778
6800
  })));
6779
6801
  };
6780
6802
 
6781
- const Features1 = props => {
6803
+ var Features1 = function Features1(props) {
6782
6804
  var _data$data;
6783
- const {
6784
- shopConfigStyle = {},
6785
- shopConfig = {},
6786
- data = {},
6787
- SectionTitle = null
6788
- } = props;
6789
- const {
6790
- primary = "#000",
6791
- secondary = "#000",
6792
- textBody = "#000",
6793
- background = "#fff"
6794
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
6805
+ var _props$shopConfigStyl = props.shopConfigStyle,
6806
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
6807
+ _props$data = props.data,
6808
+ data = _props$data === void 0 ? {} : _props$data,
6809
+ _props$SectionTitle = props.SectionTitle,
6810
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
6811
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
6812
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
6813
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
6795
6814
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
6796
- className: "relative w-full py-12 px-4 xl:px-20",
6797
- style: {
6798
- backgroundColor: background
6799
- }
6815
+ className: SECTION_DEFAULT_CLASS + " relative"
6800
6816
  }, /*#__PURE__*/React__default.createElement(SectionTitle, {
6801
- data: data,
6802
- shopConfigStyle: shopConfigStyle
6817
+ data: data
6803
6818
  }), /*#__PURE__*/React__default.createElement("div", {
6804
6819
  className: "mt-6 grid grid-cols-3 gap-4 md:gap-8"
6805
- }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map((it, index) => /*#__PURE__*/React__default.createElement("div", {
6806
- key: index,
6807
- className: "pt-6 col-span-3 md:col-span-1"
6808
- }, /*#__PURE__*/React__default.createElement("div", {
6809
- className: "relative w-40 h-24 flex items-center justify-center m-auto md:m-0"
6810
- }, /*#__PURE__*/React__default.createElement("div", {
6811
- className: "absolute w-40 h-24 rounded-2xl z-10",
6812
- style: {
6813
- backgroundColor: primary
6814
- }
6815
- }), /*#__PURE__*/React__default.createElement("div", {
6816
- className: "absolute w-24 h-16 rounded-2xl -right-2 -top-2 z-0",
6817
- style: {
6818
- backgroundColor: secondary
6819
- }
6820
- }), /*#__PURE__*/React__default.createElement("div", {
6821
- className: "h-16 m-auto bg-center w-16 bg-cover bg-no-repeat z-20",
6822
- style: {
6823
- backgroundImage: `url(${it.srcImage})`
6824
- }
6825
- })), /*#__PURE__*/React__default.createElement("p", {
6826
- className: "mx-auto md:mt-3 md:mx-0 text-xl py-2 font-medium w-fit rounded-lg",
6827
- style: {
6828
- color: textBody
6829
- }
6830
- }, it.title), /*#__PURE__*/React__default.createElement("div", {
6831
- className: "mx-auto md:mx-0 mb-2 w-28 h-2px rounded-full",
6832
- style: {
6833
- backgroundColor: secondary
6834
- }
6835
- }), /*#__PURE__*/React__default.createElement("p", {
6836
- className: "text-base mx-auto md:mx-0 text-center md:text-start",
6837
- style: {
6838
- color: textBody
6839
- }
6840
- }, it.description))))), /*#__PURE__*/React__default.createElement(Dash, {
6820
+ }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map(function (it, index) {
6821
+ return /*#__PURE__*/React__default.createElement("div", {
6822
+ key: index,
6823
+ className: "pt-6 col-span-3 md:col-span-1"
6824
+ }, /*#__PURE__*/React__default.createElement("div", {
6825
+ className: "relative w-40 h-24 flex items-center justify-center m-auto md:m-0"
6826
+ }, /*#__PURE__*/React__default.createElement("div", {
6827
+ className: "absolute w-40 h-24 rounded-2xl z-10 bg-primary"
6828
+ }), /*#__PURE__*/React__default.createElement("div", {
6829
+ className: "absolute w-24 h-16 rounded-2xl -right-2 -top-2 z-0 bg-secondary"
6830
+ }), /*#__PURE__*/React__default.createElement("div", {
6831
+ className: "h-16 m-auto bg-center w-16 bg-cover bg-no-repeat z-20",
6832
+ style: {
6833
+ backgroundImage: "url(" + it.srcImage + ")"
6834
+ }
6835
+ })), /*#__PURE__*/React__default.createElement("p", {
6836
+ className: "mx-auto md:mt-3 md:mx-0 text-xl py-2 font-medium w-fit rounded-lg"
6837
+ }, it.title), /*#__PURE__*/React__default.createElement("div", {
6838
+ className: "mx-auto md:mx-0 mb-2 w-28 h-2px rounded-full bg-secondary"
6839
+ }), /*#__PURE__*/React__default.createElement("p", {
6840
+ className: "text-base mx-auto md:mx-0 text-center md:text-start"
6841
+ }, it.description));
6842
+ }))), /*#__PURE__*/React__default.createElement(Dash, {
6841
6843
  color: secondary
6842
6844
  }));
6843
6845
  };
6844
6846
 
6845
- const Features2 = props => {
6846
- const {
6847
- data,
6848
- shopConfigStyle
6849
- } = props;
6850
- const {
6851
- primary = "#000",
6852
- textBody = "#000",
6853
- background = "#fff",
6854
- bgSecondary = "#fff"
6855
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
6856
- const sectionData = data === null || data === void 0 ? void 0 : data.data;
6847
+ var Features2 = function Features2(props) {
6848
+ var data = props.data;
6849
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
6857
6850
  return /*#__PURE__*/React__default.createElement("div", {
6858
- className: "w-full pt-10 px-4 xl:px-20",
6859
- style: {
6860
- background: background,
6861
- color: textBody
6862
- }
6851
+ className: "" + SECTION_DEFAULT_CLASS
6863
6852
  }, /*#__PURE__*/React__default.createElement("div", {
6864
- className: "p-6 grid grid-cols-4 gap-8 rounded-xl",
6865
- style: {
6866
- background: bgSecondary
6867
- }
6868
- }, sectionData && sectionData.length > 0 && sectionData.map((item, index) => {
6853
+ className: "p-6 grid grid-cols-4 gap-8 rounded-xl bg-bgSecondary"
6854
+ }, sectionData && sectionData.length > 0 && sectionData.map(function (item, index) {
6869
6855
  return /*#__PURE__*/React__default.createElement("div", {
6870
6856
  className: "flex flex-col gap-2 items-center text-sm lg:text-lg font-semibold text-center",
6871
- key: `dfgg-${index}`,
6872
- style: {
6873
- color: textBody
6874
- }
6857
+ key: "dfgg-" + index
6875
6858
  }, /*#__PURE__*/React__default.createElement("img", {
6876
6859
  src: item === null || item === void 0 ? void 0 : item.svgImage,
6877
- className: "w-12 md:w-16 lg:w-20 xl:w-24",
6878
- alt: "logo",
6879
- style: {
6880
- color: primary
6881
- }
6860
+ className: "w-12 md:w-16 lg:w-20 xl:w-24 text-primary",
6861
+ alt: "logo"
6882
6862
  }), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.title));
6883
6863
  })));
6884
6864
  };
6885
6865
 
6886
- const Features3 = props => {
6887
- const {
6888
- shopConfigStyle,
6889
- shopConfig,
6890
- data
6891
- } = props;
6892
- const sectionData = data === null || data === void 0 ? void 0 : data.data;
6866
+ var Features3 = function Features3(props) {
6867
+ var shopConfigStyle = props.shopConfigStyle,
6868
+ shopConfig = props.shopConfig,
6869
+ data = props.data;
6870
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
6893
6871
  data.sectionTitle = data.sectionTitle.replace("{shopName}", shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName);
6894
- const {
6895
- primary = "#000",
6896
- textBody = "#000",
6897
- background = "#fff",
6898
- bgSecondary = "#fff"
6899
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
6872
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
6873
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.textBody,
6874
+ textBody = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3,
6875
+ _shopConfigStyle$colo4 = _shopConfigStyle$colo.background,
6876
+ background = _shopConfigStyle$colo4 === void 0 ? "#fff" : _shopConfigStyle$colo4,
6877
+ _shopConfigStyle$colo5 = _shopConfigStyle$colo.bgSecondary,
6878
+ bgSecondary = _shopConfigStyle$colo5 === void 0 ? "#fff" : _shopConfigStyle$colo5;
6900
6879
  return /*#__PURE__*/React__default.createElement("div", {
6901
6880
  className: " w-full pt-10 px-4 xl:px-20",
6902
6881
  style: {
@@ -6909,10 +6888,10 @@ const Features3 = props => {
6909
6888
  className: "text-gray3 text-lg sm:text-xl md:text-2xl"
6910
6889
  }, data === null || data === void 0 ? void 0 : data.sectionDescription), /*#__PURE__*/React__default.createElement("div", {
6911
6890
  className: "grid grid-cols-2 sm:grid-cols-4 gap-6 mt-6 text-sm md:text-base"
6912
- }, sectionData && sectionData.length > 0 && sectionData.map((item, index) => {
6891
+ }, sectionData && sectionData.length > 0 && sectionData.map(function (item, index) {
6913
6892
  return /*#__PURE__*/React__default.createElement("div", {
6914
6893
  className: "grid grid-cols-2 p-3 rounded-lg font-semibold",
6915
- key: `dfsdfj-${index}`,
6894
+ key: "dfsdfj-" + index,
6916
6895
  style: {
6917
6896
  background: bgSecondary
6918
6897
  }
@@ -6923,55 +6902,73 @@ const Features3 = props => {
6923
6902
  })));
6924
6903
  };
6925
6904
 
6926
- const ProductController = props => {
6927
- const {
6928
- shopConfig,
6929
- params,
6930
- isAutoGetList = true
6931
- } = props;
6932
- const [products, setProducts] = useState([]);
6933
- const defaultParams = {
6905
+ var ProductController = function ProductController(props) {
6906
+ var shopConfig = props.shopConfig,
6907
+ params = props.params,
6908
+ _props$isAutoGetList = props.isAutoGetList,
6909
+ isAutoGetList = _props$isAutoGetList === void 0 ? true : _props$isAutoGetList;
6910
+ var _useState = useState([]),
6911
+ products = _useState[0],
6912
+ setProducts = _useState[1];
6913
+ var _useState2 = useState(true),
6914
+ loading = _useState2[0],
6915
+ setLoading = _useState2[1];
6916
+ var _useState3 = useState(),
6917
+ page = _useState3[0],
6918
+ setPage = _useState3[1];
6919
+ var defaultParams = {
6934
6920
  page: 0,
6935
6921
  size: 8,
6936
6922
  types: "0"
6937
6923
  };
6938
- useEffect(() => {
6924
+ useEffect(function () {
6939
6925
  if (isAutoGetList) {
6940
6926
  getProductList();
6941
6927
  }
6942
6928
  }, [params, isAutoGetList]);
6943
- const getProductList = async () => {
6929
+ var getProductList = function getProductList() {
6944
6930
  try {
6945
- var _res$data, _res$data$status;
6946
- const res = await getProductListApi(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId, {
6947
- ...defaultParams,
6948
- ...params
6931
+ var _temp = _catch(function () {
6932
+ setLoading(true);
6933
+ var filterParams = _extends({}, defaultParams, params);
6934
+ console.log("filterParams params", params);
6935
+ console.log("filterParams", filterParams);
6936
+ return Promise.resolve(getProductListApi(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId, filterParams)).then(function (res) {
6937
+ var _res$data, _res$data$status;
6938
+ if ((res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$status = _res$data.status) === null || _res$data$status === void 0 ? void 0 : _res$data$status.code) == 200) {
6939
+ var _res$data2, _res$data3;
6940
+ setProducts(res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data);
6941
+ setPage(res === null || res === void 0 ? void 0 : (_res$data3 = res.data) === null || _res$data3 === void 0 ? void 0 : _res$data3.page);
6942
+ }
6943
+ setLoading(false);
6944
+ });
6945
+ }, function (e) {
6946
+ console.log(e);
6949
6947
  });
6950
- if ((res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$status = _res$data.status) === null || _res$data$status === void 0 ? void 0 : _res$data$status.code) == 200) {
6951
- var _res$data2;
6952
- setProducts(res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data);
6953
- }
6948
+ return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
6954
6949
  } catch (e) {
6955
- console.log(e);
6950
+ return Promise.reject(e);
6956
6951
  }
6957
6952
  };
6958
6953
  return {
6959
- products
6954
+ products: products,
6955
+ loading: loading,
6956
+ page: page
6960
6957
  };
6961
6958
  };
6962
6959
 
6963
6960
  var _path, _path2, _path3;
6964
- function _extends() {
6965
- return _extends = Object.assign ? Object.assign.bind() : function (n) {
6961
+ function _extends$1() {
6962
+ return _extends$1 = Object.assign ? Object.assign.bind() : function (n) {
6966
6963
  for (var e = 1; e < arguments.length; e++) {
6967
6964
  var t = arguments[e];
6968
6965
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
6969
6966
  }
6970
6967
  return n;
6971
- }, _extends.apply(null, arguments);
6968
+ }, _extends$1.apply(null, arguments);
6972
6969
  }
6973
6970
  function SvgImageGallery(props) {
6974
- return /*#__PURE__*/createElement("svg", _extends({
6971
+ return /*#__PURE__*/createElement("svg", _extends$1({
6975
6972
  height: 512,
6976
6973
  viewBox: "0 0 24 24",
6977
6974
  width: 512,
@@ -6985,13 +6982,11 @@ function SvgImageGallery(props) {
6985
6982
  })));
6986
6983
  }
6987
6984
 
6988
- const DefaultImage = props => {
6989
- const {
6990
- size = 0,
6991
- className = ""
6992
- } = props;
6985
+ var DefaultImage = function DefaultImage(props) {
6986
+ var _props$className = props.className,
6987
+ className = _props$className === void 0 ? "" : _props$className;
6993
6988
  return /*#__PURE__*/React__default.createElement("div", {
6994
- className: `flex justify-center items-center w-full aspect-square ${className}`,
6989
+ className: "flex justify-center items-center w-full aspect-square " + className,
6995
6990
  style: {
6996
6991
  backgroundColor: "#FAFAFA"
6997
6992
  }
@@ -7001,24 +6996,26 @@ const DefaultImage = props => {
7001
6996
  fill: "#D9D9D9"
7002
6997
  }));
7003
6998
  };
7004
- const ProductImage = props => {
7005
- const {
7006
- size = 0,
7007
- className = "",
7008
- product
7009
- } = props;
7010
- const [src, setSrc] = useState("");
7011
- useEffect(() => {
6999
+ var ProductImage = function ProductImage(props) {
7000
+ var _props$size2 = props.size,
7001
+ size = _props$size2 === void 0 ? 0 : _props$size2,
7002
+ _props$className2 = props.className,
7003
+ className = _props$className2 === void 0 ? "" : _props$className2,
7004
+ product = props.product;
7005
+ var _useState = useState(""),
7006
+ src = _useState[0],
7007
+ setSrc = _useState[1];
7008
+ useEffect(function () {
7012
7009
  getProductImage();
7013
7010
  }, [product]);
7014
- const getProductImage = () => {
7011
+ var getProductImage = function getProductImage() {
7015
7012
  var _JSON$parse, _JSON$parse$;
7016
- const src = (_JSON$parse = JSON.parse((product === null || product === void 0 ? void 0 : product.imagesUrl) || "[]")) === null || _JSON$parse === void 0 ? void 0 : (_JSON$parse$ = _JSON$parse[0]) === null || _JSON$parse$ === void 0 ? void 0 : _JSON$parse$.imageUrl;
7013
+ var src = (_JSON$parse = JSON.parse((product === null || product === void 0 ? void 0 : product.imagesUrl) || "[]")) === null || _JSON$parse === void 0 ? void 0 : (_JSON$parse$ = _JSON$parse[0]) === null || _JSON$parse$ === void 0 ? void 0 : _JSON$parse$.imageUrl;
7017
7014
  setSrc(src);
7018
7015
  };
7019
7016
  return src ? /*#__PURE__*/React__default.createElement("img", {
7020
7017
  src: src,
7021
- className: `w-full aspect-square ${className}`,
7018
+ className: "w-full aspect-square " + className,
7022
7019
  style: size ? {
7023
7020
  width: size,
7024
7021
  height: size
@@ -7029,138 +7026,1151 @@ const ProductImage = props => {
7029
7026
  });
7030
7027
  };
7031
7028
 
7032
- const Treatments1 = props => {
7033
- const {
7034
- shopConfigStyle = {},
7035
- shopConfig = {},
7036
- data = {},
7037
- SectionTitle = null
7038
- } = props;
7039
- const {
7040
- primary = "#000",
7041
- secondary = "#000",
7042
- textBody = "#000",
7043
- background = "#fff"
7044
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
7045
- const [params, setParams] = useState({
7046
- size: 1
7047
- });
7048
- const {
7049
- products = []
7050
- } = ProductController({
7051
- ...props,
7052
- params
7053
- });
7054
- console.log("Treatments1 products 1", products);
7055
- return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
7056
- className: "relative w-full py-12 px-4 xl:px-20",
7057
- style: {
7058
- backgroundColor: background
7059
- }
7060
- }, /*#__PURE__*/React__default.createElement(SectionTitle, {
7061
- data: data,
7062
- shopConfigStyle: shopConfigStyle
7063
- }), products === null || products === void 0 ? void 0 : products.map((product, index) => {
7064
- var _product$productInfo, _product$productInfo2;
7065
- return /*#__PURE__*/React__default.createElement("div", {
7066
- className: "grid grid-cols-1 md:grid-cols-2 gap-6 mt-12",
7067
- key: index
7068
- }, index % 2 ? null : /*#__PURE__*/React__default.createElement(ProductImage, {
7069
- product: product === null || product === void 0 ? void 0 : product.productInfo,
7070
- className: "aspect-video rounded-2xl"
7071
- }), /*#__PURE__*/React__default.createElement("div", {
7072
- className: `${index % 2 ? "text-right" : "text-left"}`
7073
- }, /*#__PURE__*/React__default.createElement("div", {
7074
- className: "font-medium text-2xl",
7075
- style: {
7076
- color: textBody
7077
- }
7078
- }, product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.productName), /*#__PURE__*/React__default.createElement("div", {
7079
- className: "mt-4",
7080
- style: {
7081
- color: textBody
7082
- },
7083
- dangerouslySetInnerHTML: {
7084
- __html: product === null || product === void 0 ? void 0 : (_product$productInfo2 = product.productInfo) === null || _product$productInfo2 === void 0 ? void 0 : _product$productInfo2.description
7029
+ var ModalNotification = function ModalNotification(props) {
7030
+ var modalRef = useRef(null);
7031
+ var onClose = props.onClose,
7032
+ onCloseFormBooking = props.onCloseFormBooking;
7033
+ var handleClickOutside = function handleClickOutside(event) {
7034
+ if (modalRef.current && !modalRef.current.contains(event.target)) {
7035
+ onClose();
7036
+ if (onCloseFormBooking && typeof onCloseFormBooking === 'function') {
7037
+ console.log("đóng nhá");
7038
+ onCloseFormBooking();
7085
7039
  }
7086
- }), /*#__PURE__*/React__default.createElement(Button, {
7087
- label: "Đặt lịch ngay",
7088
- shopConfigStyle: shopConfigStyle,
7089
- className: "mt-4"
7090
- })), index % 2 ? /*#__PURE__*/React__default.createElement(ProductImage, {
7091
- product: product === null || product === void 0 ? void 0 : product.productInfo,
7092
- className: "aspect-video rounded-2xl"
7093
- }) : null);
7094
- })), /*#__PURE__*/React__default.createElement(Dash, {
7095
- color: secondary
7096
- }));
7040
+ }
7041
+ };
7042
+ useEffect(function () {
7043
+ document.addEventListener('click', handleClickOutside);
7044
+ return function () {
7045
+ document.removeEventListener('click', handleClickOutside);
7046
+ };
7047
+ }, []);
7048
+ return /*#__PURE__*/React__default.createElement("div", {
7049
+ className: "fixed inset-0 bg-black flex items-center justify-center bg-opacity-50 z-50 "
7050
+ }, /*#__PURE__*/React__default.createElement("div", {
7051
+ className: " flex items-center justify-center relative bg-red",
7052
+ ref: modalRef
7053
+ }, props === null || props === void 0 ? void 0 : props.children, /*#__PURE__*/React__default.createElement("button", {
7054
+ className: "absolute top-4 right-4",
7055
+ onClick: onClose
7056
+ }, /*#__PURE__*/React__default.createElement(RxCross2, null))));
7097
7057
  };
7098
7058
 
7099
- var _path$1;
7100
- function _extends$1() {
7101
- return _extends$1 = Object.assign ? Object.assign.bind() : function (n) {
7102
- for (var e = 1; e < arguments.length; e++) {
7103
- var t = arguments[e];
7104
- for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
7059
+ var getEmployeeListApi = function getEmployeeListApi(shopId) {
7060
+ return api({
7061
+ method: "get",
7062
+ url: "/chain-employment-profile/filter-employ-by-customer",
7063
+ params: {
7064
+ shopIds: shopId
7065
+ },
7066
+ headers: {
7067
+ shopId: shopId
7105
7068
  }
7106
- return n;
7107
- }, _extends$1.apply(null, arguments);
7108
- }
7109
- function SvgAngleSmallLeft(props) {
7110
- return /*#__PURE__*/createElement("svg", _extends$1({
7111
- xmlns: "http://www.w3.org/2000/svg",
7112
- viewBox: "0 0 24 24",
7113
- width: 512,
7114
- height: 512
7115
- }, props), _path$1 || (_path$1 = /*#__PURE__*/createElement("path", {
7116
- d: "M10.6 12.71a1 1 0 010-1.42l4.59-4.58a1 1 0 000-1.42 1 1 0 00-1.41 0L9.19 9.88a3 3 0 000 4.24l4.59 4.59a1 1 0 00.7.29 1 1 0 00.71-.29 1 1 0 000-1.42z"
7117
- })));
7118
- }
7069
+ });
7070
+ };
7119
7071
 
7120
- var _path$2;
7121
- function _extends$2() {
7122
- return _extends$2 = Object.assign ? Object.assign.bind() : function (n) {
7123
- for (var e = 1; e < arguments.length; e++) {
7124
- var t = arguments[e];
7125
- for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
7072
+ var EmployeeController = function EmployeeController(props) {
7073
+ var _props$isAutoGetList = props.isAutoGetList,
7074
+ isAutoGetList = _props$isAutoGetList === void 0 ? true : _props$isAutoGetList,
7075
+ shopConfig = props.shopConfig;
7076
+ var _useState = useState([]),
7077
+ listEmployment = _useState[0],
7078
+ setListEmployment = _useState[1];
7079
+ useEffect(function () {
7080
+ if (isAutoGetList) {
7081
+ getListEmployee();
7126
7082
  }
7127
- return n;
7128
- }, _extends$2.apply(null, arguments);
7129
- }
7130
- function SvgAngleSmallRight(props) {
7131
- return /*#__PURE__*/createElement("svg", _extends$2({
7132
- xmlns: "http://www.w3.org/2000/svg",
7133
- viewBox: "0 0 24 24",
7134
- width: 512,
7135
- height: 512
7136
- }, props), _path$2 || (_path$2 = /*#__PURE__*/createElement("path", {
7137
- d: "M15.4 9.88l-4.59-4.59a1 1 0 00-1.41 0 1 1 0 000 1.42l4.6 4.58a1 1 0 010 1.42l-4.6 4.58a1 1 0 001.41 1.42l4.59-4.59a3 3 0 000-4.24z"
7083
+ }, [isAutoGetList]);
7084
+ var getListEmployee = function getListEmployee() {
7085
+ try {
7086
+ return Promise.resolve(_catch(function () {
7087
+ return Promise.resolve(getEmployeeListApi(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId)).then(function (res) {
7088
+ var _res$data, _res$data$status;
7089
+ if ((res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$status = _res$data.status) === null || _res$data$status === void 0 ? void 0 : _res$data$status.code) == 200) {
7090
+ var _res$data2;
7091
+ setListEmployment((res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data) || []);
7092
+ }
7093
+ return res;
7094
+ });
7095
+ }, function (e) {
7096
+ console.log(e);
7097
+ }));
7098
+ } catch (e) {
7099
+ return Promise.reject(e);
7100
+ }
7101
+ };
7102
+ return {
7103
+ listEmployment: listEmployment,
7104
+ getListEmployee: getListEmployee
7105
+ };
7106
+ };
7107
+
7108
+ var createSpaScheduleApi = function createSpaScheduleApi(shopId, data) {
7109
+ return api({
7110
+ method: "post",
7111
+ url: "/spa-schedule/customer/create",
7112
+ data: data,
7113
+ headers: {
7114
+ shopId: shopId
7115
+ }
7116
+ });
7117
+ };
7118
+
7119
+ var _excluded = ["productName"];
7120
+ var BookingController = function BookingController(props) {
7121
+ _objectDestructuringEmpty(props);
7122
+ var createSchedule = function createSchedule(customerName, customerPhone, scheduleDate, services, shopId) {
7123
+ try {
7124
+ return Promise.resolve(_catch(function () {
7125
+ var data = {
7126
+ appId: "SSPA",
7127
+ customerName: customerName,
7128
+ customerPhone: customerPhone.replace("+", ""),
7129
+ isSellService: true,
7130
+ scheduleDate: new Date(scheduleDate).getTime(),
7131
+ services: services === null || services === void 0 ? void 0 : services.map(function (_ref) {
7132
+ var productName = _ref.productName,
7133
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded);
7134
+ return rest;
7135
+ }),
7136
+ shopId: shopId
7137
+ };
7138
+ return Promise.resolve(createSpaScheduleApi(shopId, data));
7139
+ }, function (e) {
7140
+ console.log(e);
7141
+ }));
7142
+ } catch (e) {
7143
+ return Promise.reject(e);
7144
+ }
7145
+ };
7146
+ return {
7147
+ createSchedule: createSchedule
7148
+ };
7149
+ };
7150
+
7151
+ var Input = forwardRef(function (props, ref) {
7152
+ var _props$label = props.label,
7153
+ label = _props$label === void 0 ? "" : _props$label,
7154
+ _props$placeholder = props.placeholder,
7155
+ placeholder = _props$placeholder === void 0 ? "" : _props$placeholder,
7156
+ _props$className = props.className,
7157
+ className = _props$className === void 0 ? "" : _props$className,
7158
+ _props$inputClassName = props.inputClassName,
7159
+ inputClassName = _props$inputClassName === void 0 ? "" : _props$inputClassName,
7160
+ _props$wrapClassName = props.wrapClassName,
7161
+ wrapClassName = _props$wrapClassName === void 0 ? "" : _props$wrapClassName,
7162
+ _props$labelClassName = props.labelClassName,
7163
+ labelClassName = _props$labelClassName === void 0 ? "" : _props$labelClassName,
7164
+ _props$name = props.name,
7165
+ name = _props$name === void 0 ? "" : _props$name,
7166
+ _props$onChange = props.onChange,
7167
+ onChange = _props$onChange === void 0 ? function () {} : _props$onChange,
7168
+ _props$defaultValue = props.defaultValue,
7169
+ defaultValue = _props$defaultValue === void 0 ? "" : _props$defaultValue,
7170
+ _props$type = props.type,
7171
+ type = _props$type === void 0 ? "text" : _props$type,
7172
+ _props$rules = props.rules,
7173
+ rules = _props$rules === void 0 ? [] : _props$rules,
7174
+ _props$isQuantity = props.isQuantity,
7175
+ isQuantity = _props$isQuantity === void 0 ? false : _props$isQuantity,
7176
+ _props$min = props.min,
7177
+ min = _props$min === void 0 ? 0 : _props$min,
7178
+ _props$max = props.max,
7179
+ max = _props$max === void 0 ? null : _props$max;
7180
+ var _useState = useState(defaultValue),
7181
+ value = _useState[0],
7182
+ _setValue = _useState[1];
7183
+ var _useState2 = useState(""),
7184
+ error = _useState2[0],
7185
+ _setError = _useState2[1];
7186
+ var refInput = useRef();
7187
+ useImperativeHandle(ref, function () {
7188
+ return {
7189
+ validateData: function validateData() {
7190
+ return _validateData();
7191
+ },
7192
+ setValue: function setValue(text) {
7193
+ return _setValue(text);
7194
+ },
7195
+ getValue: function getValue() {
7196
+ return value;
7197
+ },
7198
+ setError: function setError(err) {
7199
+ return _setError(err);
7200
+ }
7201
+ };
7202
+ });
7203
+ var _validateData = function _validateData() {
7204
+ var count = 0;
7205
+ for (var _iterator = _createForOfIteratorHelperLoose(rules), _step; !(_step = _iterator()).done;) {
7206
+ var _e$pattern;
7207
+ var e = _step.value;
7208
+ if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && value === '') {
7209
+ _setError(e === null || e === void 0 ? void 0 : e.message);
7210
+ count++;
7211
+ break;
7212
+ } else if ((e === null || e === void 0 ? void 0 : e.type) === 'pattern' && !(e !== null && e !== void 0 && (_e$pattern = e.pattern) !== null && _e$pattern !== void 0 && _e$pattern.test(value))) {
7213
+ _setError(e === null || e === void 0 ? void 0 : e.message);
7214
+ count++;
7215
+ break;
7216
+ }
7217
+ }
7218
+ if (count) {
7219
+ return false;
7220
+ } else {
7221
+ _setError('');
7222
+ return true;
7223
+ }
7224
+ };
7225
+ var handleOnChange = function handleOnChange(event) {
7226
+ var value = event.target.value;
7227
+ if (isQuantity) {
7228
+ value = parseInt(value) || 1;
7229
+ }
7230
+ _setValue(value);
7231
+ onChange === null || onChange === void 0 ? void 0 : onChange(value);
7232
+ };
7233
+ var changeQuantity = function changeQuantity(quantity) {
7234
+ var newValue = parseInt(value) + quantity;
7235
+ if (newValue > min && (max === null || newValue <= max)) {
7236
+ _setValue(newValue);
7237
+ onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
7238
+ }
7239
+ };
7240
+ var _className = "h-10 py-1 px-2 border border-stroke rounded focus:outline-none focus:ring-0 " + className;
7241
+ var _inputClassName = (isQuantity ? "text-center w-12" : "") + " " + inputClassName;
7242
+ var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
7243
+ return (e === null || e === void 0 ? void 0 : e.type) === "required";
7244
+ }));
7245
+ var labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
7246
+ className: "text-danger"
7247
+ }, " *") : null;
7248
+ return /*#__PURE__*/React__default.createElement("div", {
7249
+ className: wrapClassName
7250
+ }, label ? /*#__PURE__*/React__default.createElement("div", {
7251
+ className: "mb-1 " + labelClassName
7252
+ }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
7253
+ className: "flex gap-2 " + _className
7254
+ }, isQuantity ? /*#__PURE__*/React__default.createElement("button", {
7255
+ onClick: function onClick() {
7256
+ return changeQuantity(-1);
7257
+ }
7258
+ }, /*#__PURE__*/React__default.createElement(FaMinus, null)) : null, /*#__PURE__*/React__default.createElement("input", {
7259
+ type: type,
7260
+ name: name,
7261
+ value: value,
7262
+ placeholder: placeholder,
7263
+ onChange: handleOnChange,
7264
+ required: required,
7265
+ className: _inputClassName,
7266
+ ref: refInput
7267
+ }), isQuantity ? /*#__PURE__*/React__default.createElement("button", {
7268
+ onClick: function onClick() {
7269
+ return changeQuantity(1);
7270
+ }
7271
+ }, /*#__PURE__*/React__default.createElement(FaPlus, null)) : null), error ? /*#__PURE__*/React__default.createElement("div", {
7272
+ className: "text-danger"
7273
+ }, error) : null);
7274
+ });
7275
+
7276
+ var Select = forwardRef(function (props, ref) {
7277
+ var _Object$keys;
7278
+ var _useState = useState(false),
7279
+ isOpen = _useState[0],
7280
+ setIsOpen = _useState[1];
7281
+ var _useState2 = useState([]),
7282
+ listOptions = _useState2[0],
7283
+ setListOptions = _useState2[1];
7284
+ var selectRef = useRef(null);
7285
+ var _useState3 = useState(""),
7286
+ error = _useState3[0],
7287
+ _setError = _useState3[1];
7288
+ var _props$label = props.label,
7289
+ label = _props$label === void 0 ? "" : _props$label,
7290
+ _props$placeholder = props.placeholder,
7291
+ placeholder = _props$placeholder === void 0 ? "" : _props$placeholder,
7292
+ _props$className = props.className,
7293
+ className = _props$className === void 0 ? "" : _props$className,
7294
+ _props$rules = props.rules,
7295
+ rules = _props$rules === void 0 ? [] : _props$rules,
7296
+ _props$options = props.options,
7297
+ options = _props$options === void 0 ? [] : _props$options,
7298
+ _props$value = props.value,
7299
+ value = _props$value === void 0 ? [] : _props$value,
7300
+ _props$renderItem = props.renderItem,
7301
+ renderItem = _props$renderItem === void 0 ? function () {} : _props$renderItem,
7302
+ displayItem = props.displayItem,
7303
+ searchOption = props.searchOption,
7304
+ handleSearchOption = props.handleSearchOption;
7305
+ var dropdownRef = useRef(null);
7306
+ var _useState4 = useState('bottom'),
7307
+ dropdownPosition = _useState4[0],
7308
+ setDropdownPosition = _useState4[1];
7309
+ useEffect(function () {
7310
+ var updateDropdownPosition = function updateDropdownPosition() {
7311
+ if (selectRef.current && dropdownRef.current) {
7312
+ var selectRect = selectRef.current.getBoundingClientRect();
7313
+ var spaceBelow = window.innerHeight - selectRect.bottom;
7314
+ var spaceAbove = selectRect.top;
7315
+ if (spaceBelow < spaceAbove) {
7316
+ setDropdownPosition('top');
7317
+ } else {
7318
+ setDropdownPosition('bottom');
7319
+ }
7320
+ }
7321
+ };
7322
+ if (isOpen) {
7323
+ updateDropdownPosition();
7324
+ window.addEventListener('resize', updateDropdownPosition);
7325
+ }
7326
+ return function () {
7327
+ window.removeEventListener('resize', updateDropdownPosition);
7328
+ };
7329
+ }, [isOpen]);
7330
+ var handleClickOutside = function handleClickOutside(event) {
7331
+ if (selectRef.current && !selectRef.current.contains(event.target)) {
7332
+ setIsOpen(false);
7333
+ }
7334
+ };
7335
+ useEffect(function () {
7336
+ setListOptions(options);
7337
+ document.addEventListener('click', handleClickOutside);
7338
+ return function () {
7339
+ document.removeEventListener('click', handleClickOutside);
7340
+ };
7341
+ }, [options]);
7342
+ useImperativeHandle(ref, function () {
7343
+ return {
7344
+ validateData: function validateData() {
7345
+ return _validateData();
7346
+ },
7347
+ setError: function setError(err) {
7348
+ return _setError(err);
7349
+ }
7350
+ };
7351
+ });
7352
+ var _validateData = function _validateData() {
7353
+ var count = 0;
7354
+ for (var _iterator = _createForOfIteratorHelperLoose(rules), _step; !(_step = _iterator()).done;) {
7355
+ var _e$pattern;
7356
+ var e = _step.value;
7357
+ if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && (value === null || value === void 0 ? void 0 : value.length) <= 0) {
7358
+ console.log("chưa chọn gì");
7359
+ _setError(e === null || e === void 0 ? void 0 : e.message);
7360
+ count++;
7361
+ break;
7362
+ } else if ((e === null || e === void 0 ? void 0 : e.type) === 'pattern' && !(e !== null && e !== void 0 && (_e$pattern = e.pattern) !== null && _e$pattern !== void 0 && _e$pattern.test(value))) {
7363
+ _setError(e === null || e === void 0 ? void 0 : e.message);
7364
+ count++;
7365
+ break;
7366
+ }
7367
+ }
7368
+ if (count) {
7369
+ return false;
7370
+ } else {
7371
+ _setError('');
7372
+ return true;
7373
+ }
7374
+ };
7375
+ var handleSearch = function handleSearch(e) {
7376
+ var listOptions = handleSearchOption(e);
7377
+ setListOptions(listOptions);
7378
+ };
7379
+ var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
7380
+ return (e === null || e === void 0 ? void 0 : e.type) === "required";
7381
+ }));
7382
+ var labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
7383
+ className: "text-danger"
7384
+ }, " *") : null;
7385
+ return /*#__PURE__*/React__default.createElement("div", {
7386
+ ref: selectRef,
7387
+ className: className + " relative "
7388
+ }, label ? /*#__PURE__*/React__default.createElement("div", {
7389
+ className: "mb-1"
7390
+ }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
7391
+ className: className + " bg-white rounded-lg"
7392
+ }, /*#__PURE__*/React__default.createElement("button", {
7393
+ className: "w-full h-10 bg-transparent flex justify-between items-center px-3 py-2",
7394
+ onClick: function onClick() {
7395
+ setIsOpen(!isOpen);
7396
+ }
7397
+ }, displayItem && (Object === null || Object === void 0 ? void 0 : (_Object$keys = Object.keys(value)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.length) > 0 && typeof displayItem === "function" ? displayItem(value) : /*#__PURE__*/React__default.createElement("div", {
7398
+ className: "flex justify-between items-center w-full"
7399
+ }, /*#__PURE__*/React__default.createElement("div", {
7400
+ className: "text-gray3 line-clamp-1"
7401
+ }, placeholder), /*#__PURE__*/React__default.createElement("div", {
7402
+ className: "ms-1"
7403
+ }, /*#__PURE__*/React__default.createElement(FaAngleUp, {
7404
+ className: "text-xs"
7405
+ }), /*#__PURE__*/React__default.createElement(FaAngleDown, {
7406
+ className: "text-xs"
7407
+ })))), isOpen ? /*#__PURE__*/React__default.createElement("div", {
7408
+ ref: dropdownRef,
7409
+ style: {
7410
+ background: "#FFFFFF"
7411
+ },
7412
+ className: className + " absolute p-1 my-2 rounded-2xl w-full z-50 border " + (dropdownPosition === 'top' ? 'bottom-full mb-2' : 'top-full mt-2')
7413
+ }, /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
7414
+ className: "px-3 flex items-center border-b-[1px]"
7415
+ }, /*#__PURE__*/React__default.createElement(LuSearch, {
7416
+ className: "inline text-gray3 me-2"
7417
+ }), /*#__PURE__*/React__default.createElement("input", {
7418
+ type: "text",
7419
+ className: "py-2 w-full border-0 focus:outline-none focus:ring-0",
7420
+ placeholder: "T\xECm ki\u1EBFm",
7421
+ value: searchOption,
7422
+ onChange: function onChange(e) {
7423
+ handleSearch(e);
7424
+ }
7425
+ })), /*#__PURE__*/React__default.createElement("div", null, listOptions && listOptions.length > 0 ? listOptions.map(function (item, index) {
7426
+ return renderItem(item, index);
7427
+ }) : /*#__PURE__*/React__default.createElement("div", {
7428
+ className: "py-6 text-center"
7429
+ }, "Kh\xF4ng c\xF3 k\u1EBFt qu\u1EA3")))) : null), error ? /*#__PURE__*/React__default.createElement("div", {
7430
+ className: "text-danger"
7431
+ }, error) : null);
7432
+ });
7433
+ var Select$1 = memo(Select);
7434
+
7435
+ var DateTimePicker = forwardRef(function (props, ref) {
7436
+ var _props$label = props.label,
7437
+ label = _props$label === void 0 ? "" : _props$label,
7438
+ _props$className = props.className,
7439
+ className = _props$className === void 0 ? "" : _props$className,
7440
+ _props$defaultValue = props.defaultValue,
7441
+ defaultValue = _props$defaultValue === void 0 ? new Date() : _props$defaultValue,
7442
+ rules = props.rules;
7443
+ var _useState = useState(defaultValue),
7444
+ value = _useState[0],
7445
+ _setValue = _useState[1];
7446
+ var _useState2 = useState(""),
7447
+ error = _useState2[0],
7448
+ _setError = _useState2[1];
7449
+ var _className = "h-10 flex items-center py-1 px-2 border border-stroke rounded bg-white cursor-pointer " + className;
7450
+ var CustomInput = forwardRef(function (_ref, ref) {
7451
+ var value = _ref.value,
7452
+ onClick = _ref.onClick,
7453
+ className = _ref.className;
7454
+ return /*#__PURE__*/React__default.createElement("div", {
7455
+ className: className,
7456
+ onClick: onClick,
7457
+ ref: ref
7458
+ }, value);
7459
+ });
7460
+ useImperativeHandle(ref, function () {
7461
+ return {
7462
+ validateData: function validateData() {
7463
+ return _validateData();
7464
+ },
7465
+ setValue: function setValue(text) {
7466
+ return _setValue(text);
7467
+ },
7468
+ getValue: function getValue() {
7469
+ return value;
7470
+ },
7471
+ setError: function setError(err) {
7472
+ return _setError(err);
7473
+ }
7474
+ };
7475
+ });
7476
+ var _validateData = function _validateData() {
7477
+ var count = 0;
7478
+ rules.forEach(function (e) {
7479
+ var _e$pattern;
7480
+ if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && value === '') {
7481
+ _setError(e === null || e === void 0 ? void 0 : e.message);
7482
+ count++;
7483
+ return false;
7484
+ } else if ((e === null || e === void 0 ? void 0 : e.type) === 'pattern' && !(e !== null && e !== void 0 && (_e$pattern = e.pattern) !== null && _e$pattern !== void 0 && _e$pattern.test(value))) {
7485
+ _setError(e === null || e === void 0 ? void 0 : e.message);
7486
+ count++;
7487
+ return false;
7488
+ }
7489
+ });
7490
+ if (count) {
7491
+ return false;
7492
+ } else {
7493
+ _setError('');
7494
+ return true;
7495
+ }
7496
+ };
7497
+ var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
7498
+ return (e === null || e === void 0 ? void 0 : e.type) === "required";
7499
+ }));
7500
+ var labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
7501
+ className: "text-danger"
7502
+ }, " *") : null;
7503
+ return /*#__PURE__*/React__default.createElement("div", {
7504
+ className: "w-full"
7505
+ }, label ? /*#__PURE__*/React__default.createElement("div", {
7506
+ className: "mb-1"
7507
+ }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement(DatePicker, {
7508
+ selected: value,
7509
+ onChange: function onChange(date) {
7510
+ _setValue(date);
7511
+ console.log("check date: ", date);
7512
+ },
7513
+ customInput: /*#__PURE__*/React__default.createElement(CustomInput, {
7514
+ className: _className
7515
+ }),
7516
+ wrapperClassName: "w-full"
7517
+ }), error ? /*#__PURE__*/React__default.createElement("div", null, error) : null);
7518
+ });
7519
+
7520
+ var InputPhoneNumber = forwardRef(function (props, ref) {
7521
+ var _props$label = props.label,
7522
+ label = _props$label === void 0 ? "" : _props$label,
7523
+ _props$placeholder = props.placeholder,
7524
+ placeholder = _props$placeholder === void 0 ? "" : _props$placeholder,
7525
+ _props$className = props.className,
7526
+ className = _props$className === void 0 ? "" : _props$className,
7527
+ _props$name = props.name,
7528
+ name = _props$name === void 0 ? "" : _props$name,
7529
+ _props$onChange = props.onChange,
7530
+ onChange = _props$onChange === void 0 ? function () {} : _props$onChange,
7531
+ _props$defaultValue = props.defaultValue,
7532
+ defaultValue = _props$defaultValue === void 0 ? "" : _props$defaultValue,
7533
+ _props$type = props.type,
7534
+ type = _props$type === void 0 ? "text" : _props$type,
7535
+ _props$rules = props.rules,
7536
+ rules = _props$rules === void 0 ? [] : _props$rules;
7537
+ var _useState = useState(defaultValue),
7538
+ value = _useState[0],
7539
+ _setValue = _useState[1];
7540
+ var _useState2 = useState(""),
7541
+ error = _useState2[0],
7542
+ _setError = _useState2[1];
7543
+ var handleOnChange = function handleOnChange(event) {
7544
+ var value = event.target.value;
7545
+ _setValue(value);
7546
+ onChange === null || onChange === void 0 ? void 0 : onChange(value);
7547
+ };
7548
+ useImperativeHandle(ref, function () {
7549
+ return {
7550
+ validateData: function validateData() {
7551
+ return _validateData();
7552
+ },
7553
+ setValue: function setValue(text) {
7554
+ return _setValue(text);
7555
+ },
7556
+ getValue: function getValue() {
7557
+ return value;
7558
+ },
7559
+ setError: function setError(err) {
7560
+ return _setError(err);
7561
+ }
7562
+ };
7563
+ });
7564
+ var _validateData = function _validateData() {
7565
+ var count = 0;
7566
+ for (var _iterator = _createForOfIteratorHelperLoose(rules), _step; !(_step = _iterator()).done;) {
7567
+ var _e$pattern;
7568
+ var e = _step.value;
7569
+ if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && value === '') {
7570
+ _setError(e === null || e === void 0 ? void 0 : e.message);
7571
+ count++;
7572
+ break;
7573
+ } else if ((e === null || e === void 0 ? void 0 : e.type) === 'pattern' && !(e !== null && e !== void 0 && (_e$pattern = e.pattern) !== null && _e$pattern !== void 0 && _e$pattern.test(value))) {
7574
+ _setError(e === null || e === void 0 ? void 0 : e.message);
7575
+ count++;
7576
+ break;
7577
+ }
7578
+ }
7579
+ if (count) {
7580
+ return false;
7581
+ } else {
7582
+ _setError('');
7583
+ return true;
7584
+ }
7585
+ };
7586
+ var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
7587
+ return (e === null || e === void 0 ? void 0 : e.type) === "required";
7588
+ }));
7589
+ var labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
7590
+ className: "text-danger"
7591
+ }, " *") : null;
7592
+ var _className = "h-10 px-2 focus:outline-none focus:ring-0 " + className;
7593
+ var data = [{
7594
+ country: "Việt Nam",
7595
+ code: "+84"
7596
+ }];
7597
+ return /*#__PURE__*/React__default.createElement("div", {
7598
+ className: "flex flex-col px-2 py-1"
7599
+ }, label ? /*#__PURE__*/React__default.createElement("label", null, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
7600
+ className: "flex items-center h-10 bg-white rounded-lg"
7601
+ }, /*#__PURE__*/React__default.createElement("button", {
7602
+ className: "flex items-center border-r-2"
7603
+ }, /*#__PURE__*/React__default.createElement(Select$1, {
7604
+ className: 'w-max',
7605
+ options: data,
7606
+ placeholder: "+84",
7607
+ renderItem: function renderItem(item, index) {
7608
+ return /*#__PURE__*/React__default.createElement("div", {
7609
+ key: "dd\u01B0vhu-" + index,
7610
+ className: "px-2 flex items-center hover:bg-gray-200 rounded-lg whitespace-nowrap v-max"
7611
+ }, item === null || item === void 0 ? void 0 : item.code, "-", item === null || item === void 0 ? void 0 : item.country);
7612
+ }
7613
+ })), /*#__PURE__*/React__default.createElement("input", {
7614
+ type: type,
7615
+ name: name,
7616
+ value: value,
7617
+ placeholder: placeholder,
7618
+ onChange: handleOnChange,
7619
+ required: required,
7620
+ className: _className
7621
+ })), error ? /*#__PURE__*/React__default.createElement("div", {
7622
+ className: "text-danger"
7623
+ }, error) : null);
7624
+ });
7625
+
7626
+ var formatCurrency = function formatCurrency(amount) {
7627
+ if (isNaN(amount)) {
7628
+ return '0 ₫';
7629
+ }
7630
+ var roundedAmount = Math.round(amount);
7631
+ var formattedAmount = roundedAmount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.');
7632
+ return formattedAmount + " \u20AB";
7633
+ };
7634
+ var pattern = {
7635
+ phoneNumberPattern: /^0[0-9]{9}$/
7636
+ };
7637
+ var numberPattern = /^\d+$/;
7638
+
7639
+ var dayjs_min = createCommonjsModule(function (module, exports) {
7640
+ !function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",c="month",f="quarter",h="year",d="date",l="Invalid Date",$=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(t){var e=["th","st","nd","rd"],n=t%100;return "["+t+(e[(n-20)%10]||e[n]||e[0])+"]"}},m=function(t,e,n){var r=String(t);return !r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return (e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()<n.date())return -t(n,e);var r=12*(n.year()-e.year())+(n.month()-e.month()),i=e.clone().add(r,c),s=n-i<0,u=e.clone().add(r+(s?-1:1),c);return +(-(r+(n-i)/(s?i-u:u-i))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(t){return {M:c,y:h,w:o,d:a,D:d,h:u,m:s,s:i,ms:r,Q:f}[t]||String(t||"").toLowerCase().replace(/s$/,"")},u:function(t){return void 0===t}},g="en",D={};D[g]=M;var p="$isDayjsObject",S=function(t){return t instanceof _||!(!t||!t[p])},w=function t(e,n,r){var i;if(!e)return g;if("string"==typeof e){var s=e.toLowerCase();D[s]&&(i=s),n&&(D[s]=n,i=s);var u=e.split("-");if(!i&&u.length>1)return t(u[0])}else {var a=e.name;D[a]=e,i=a;}return !r&&i&&(g=i),i||!r&&g},O=function(t,e){if(S(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},b=v;b.l=w,b.i=S,b.w=function(t,e){return O(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=w(t.locale,null,!0),this.parse(t),this.$x=this.$x||t.x||{},this[p]=!0;}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(b.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match($);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.init();},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds();},m.$utils=function(){return b},m.isValid=function(){return !(this.$d.toString()===l)},m.isSame=function(t,e){var n=O(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return O(t)<this.startOf(e)},m.isBefore=function(t,e){return this.endOf(e)<O(t)},m.$g=function(t,e,n){return b.u(t)?this[e]:this.set(n,t)},m.unix=function(){return Math.floor(this.valueOf()/1e3)},m.valueOf=function(){return this.$d.getTime()},m.startOf=function(t,e){var n=this,r=!!b.u(e)||e,f=b.p(t),l=function(t,e){var i=b.w(n.$u?Date.UTC(n.$y,e,t):new Date(n.$y,e,t),n);return r?i:i.endOf(a)},$=function(t,e){return b.w(n.toDate()[t].apply(n.toDate("s"),(r?[0,0,0,0]:[23,59,59,999]).slice(e)),n)},y=this.$W,M=this.$M,m=this.$D,v="set"+(this.$u?"UTC":"");switch(f){case h:return r?l(1,0):l(31,11);case c:return r?l(1,M):l(0,M+1);case o:var g=this.$locale().weekStart||0,D=(y<g?y+7:y)-g;return l(r?m-D:m+(6-D),M);case a:case d:return $(v+"Hours",0);case u:return $(v+"Minutes",1);case s:return $(v+"Seconds",2);case i:return $(v+"Milliseconds",3);default:return this.clone()}},m.endOf=function(t){return this.startOf(t,!1)},m.$set=function(t,e){var n,o=b.p(t),f="set"+(this.$u?"UTC":""),l=(n={},n[a]=f+"Date",n[d]=f+"Date",n[c]=f+"Month",n[h]=f+"FullYear",n[u]=f+"Hours",n[s]=f+"Minutes",n[i]=f+"Seconds",n[r]=f+"Milliseconds",n)[o],$=o===a?this.$D+(e-this.$W):e;if(o===c||o===h){var y=this.clone().set(d,1);y.$d[l]($),y.init(),this.$d=y.set(d,Math.min(this.$D,y.daysInMonth())).$d;}else l&&this.$d[l]($);return this.init(),this},m.set=function(t,e){return this.clone().$set(t,e)},m.get=function(t){return this[b.p(t)]()},m.add=function(r,f){var d,l=this;r=Number(r);var $=b.p(f),y=function(t){var e=O(l);return b.w(e.date(e.date()+Math.round(t*r)),l)};if($===c)return this.set(c,this.$M+r);if($===h)return this.set(h,this.$y+r);if($===a)return y(1);if($===o)return y(7);var M=(d={},d[s]=e,d[u]=n,d[i]=t,d)[$]||1,m=this.$d.getTime()+r*M;return b.w(m,this)},m.subtract=function(t,e){return this.add(-1*t,e)},m.format=function(t){var e=this,n=this.$locale();if(!this.isValid())return n.invalidDate||l;var r=t||"YYYY-MM-DDTHH:mm:ssZ",i=b.z(this),s=this.$H,u=this.$m,a=this.$M,o=n.weekdays,c=n.months,f=n.meridiem,h=function(t,n,i,s){return t&&(t[n]||t(e,r))||i[n].slice(0,s)},d=function(t){return b.s(s%12||12,t,"0")},$=f||function(t,e,n){var r=t<12?"AM":"PM";return n?r.toLowerCase():r};return r.replace(y,(function(t,r){return r||function(t){switch(t){case"YY":return String(e.$y).slice(-2);case"YYYY":return b.s(e.$y,4,"0");case"M":return a+1;case"MM":return b.s(a+1,2,"0");case"MMM":return h(n.monthsShort,a,c,3);case"MMMM":return h(c,a);case"D":return e.$D;case"DD":return b.s(e.$D,2,"0");case"d":return String(e.$W);case"dd":return h(n.weekdaysMin,e.$W,o,2);case"ddd":return h(n.weekdaysShort,e.$W,o,3);case"dddd":return o[e.$W];case"H":return String(s);case"HH":return b.s(s,2,"0");case"h":return d(1);case"hh":return d(2);case"a":return $(s,u,!0);case"A":return $(s,u,!1);case"m":return String(u);case"mm":return b.s(u,2,"0");case"s":return String(e.$s);case"ss":return b.s(e.$s,2,"0");case"SSS":return b.s(e.$ms,3,"0");case"Z":return i}return null}(t)||i.replace(":","")}))},m.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},m.diff=function(r,d,l){var $,y=this,M=b.p(d),m=O(r),v=(m.utcOffset()-this.utcOffset())*e,g=this-m,D=function(){return b.m(y,m)};switch(M){case h:$=D()/12;break;case c:$=D();break;case f:$=D()/3;break;case o:$=(g-v)/6048e5;break;case a:$=(g-v)/864e5;break;case u:$=g/n;break;case s:$=g/e;break;case i:$=g/t;break;default:$=g;}return l?$:b.a($)},m.daysInMonth=function(){return this.endOf(c).$D},m.$locale=function(){return D[this.$L]},m.locale=function(t,e){if(!t)return this.$L;var n=this.clone(),r=w(t,e,!0);return r&&(n.$L=r),n},m.clone=function(){return b.w(this.$d,this)},m.toDate=function(){return new Date(this.valueOf())},m.toJSON=function(){return this.isValid()?this.toISOString():null},m.toISOString=function(){return this.$d.toISOString()},m.toString=function(){return this.$d.toUTCString()},M}(),k=_.prototype;return O.prototype=k,[["$ms",r],["$s",i],["$m",s],["$H",u],["$W",a],["$M",c],["$y",h],["$D",d]].forEach((function(t){k[t[1]]=function(e){return this.$g(e,t[0],t[1])};})),O.extend=function(t,e){return t.$i||(t(e,_,O),t.$i=!0),O},O.locale=w,O.isDayjs=S,O.unix=function(t){return O(1e3*t)},O.en=D[g],O.Ls=D,O.p={},O}));
7641
+ });
7642
+
7643
+ var BookingForm = function BookingForm(props) {
7644
+ var _props$shopConfig = props.shopConfig,
7645
+ shopConfig = _props$shopConfig === void 0 ? {} : _props$shopConfig,
7646
+ _props$shopConfigStyl = props.shopConfigStyle,
7647
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
7648
+ _props$onCloseFormBoo = props.onCloseFormBooking,
7649
+ onCloseFormBooking = _props$onCloseFormBoo === void 0 ? function () {} : _props$onCloseFormBoo,
7650
+ _props$defaultValue = props.defaultValue,
7651
+ defaultValue = _props$defaultValue === void 0 ? [] : _props$defaultValue,
7652
+ _props$className = props.className,
7653
+ className = _props$className === void 0 ? "" : _props$className;
7654
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
7655
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
7656
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
7657
+ var _useState = useState(false);
7658
+ var _useState2 = useState({
7659
+ types: "1,10"
7660
+ }),
7661
+ productsParams = _useState2[0];
7662
+ var _useState3 = useState(false);
7663
+ var _useState4 = useState(new Date());
7664
+ var _useState5 = useState(defaultValue),
7665
+ listProductSelected = _useState5[0],
7666
+ setListProductSelected = _useState5[1];
7667
+ var _useState6 = useState(""),
7668
+ searchOption = _useState6[0],
7669
+ setSearchOption = _useState6[1];
7670
+ var inputNameRef = useRef(null);
7671
+ var inputDateRef = useRef(null);
7672
+ var inputPhoneNumberRef = useRef(null);
7673
+ var inputSelectedRef = useRef(null);
7674
+ var _useState7 = useState(false),
7675
+ isOpenPopup = _useState7[0],
7676
+ setIsOpenPopup = _useState7[1];
7677
+ var _useState8 = useState({}),
7678
+ dataBooking = _useState8[0],
7679
+ setDataBooking = _useState8[1];
7680
+ var _EmployeeController = EmployeeController(_extends({}, props)),
7681
+ _EmployeeController$l = _EmployeeController.listEmployment,
7682
+ listEmployment = _EmployeeController$l === void 0 ? [] : _EmployeeController$l;
7683
+ var _ProductController = ProductController(_extends({}, props, {
7684
+ params: productsParams
7685
+ })),
7686
+ products = _ProductController.products;
7687
+ console.log("BookingForm products", products);
7688
+ var _BookingController = BookingController(props),
7689
+ _BookingController$cr = _BookingController.createSchedule,
7690
+ createSchedule = _BookingController$cr === void 0 ? function () {} : _BookingController$cr;
7691
+ var handleSelectedProduct = function handleSelectedProduct(event, productSelected) {
7692
+ event.stopPropagation();
7693
+ console.log("check:", listProductSelected);
7694
+ var isExist = listProductSelected.some(function (item) {
7695
+ var _item$product;
7696
+ return (item === null || item === void 0 ? void 0 : (_item$product = item.product) === null || _item$product === void 0 ? void 0 : _item$product.productId) === (productSelected === null || productSelected === void 0 ? void 0 : productSelected.productId);
7697
+ });
7698
+ if (isExist) {
7699
+ setListProductSelected(function (prev) {
7700
+ return prev.filter(function (item) {
7701
+ var _item$product2;
7702
+ return (item === null || item === void 0 ? void 0 : (_item$product2 = item.product) === null || _item$product2 === void 0 ? void 0 : _item$product2.productId) !== (productSelected === null || productSelected === void 0 ? void 0 : productSelected.productId);
7703
+ });
7704
+ });
7705
+ } else {
7706
+ setListProductSelected(function (prev) {
7707
+ return [].concat(prev, [{
7708
+ product: productSelected,
7709
+ quantity: 1,
7710
+ technical: {},
7711
+ oldService: false
7712
+ }]);
7713
+ });
7714
+ }
7715
+ };
7716
+ var checkProductSelected = function checkProductSelected(productId) {
7717
+ if (listProductSelected && listProductSelected.length > 0) return listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.some(function (item) {
7718
+ var _item$product3;
7719
+ return (item === null || item === void 0 ? void 0 : (_item$product3 = item.product) === null || _item$product3 === void 0 ? void 0 : _item$product3.productId) === productId;
7720
+ });
7721
+ };
7722
+ var handleChooseTechnical = function handleChooseTechnical(technicalSelected, index) {
7723
+ setListProductSelected(function (prev) {
7724
+ var updateListSelected = [].concat(prev);
7725
+ updateListSelected[index] = _extends({}, updateListSelected[index], {
7726
+ technical: technicalSelected
7727
+ });
7728
+ return updateListSelected;
7729
+ });
7730
+ };
7731
+ var handleOnChangeQuantity = function handleOnChangeQuantity(index, value) {
7732
+ if (!isNaN(value) && value >= 0) {
7733
+ setListProductSelected(function (prev) {
7734
+ var updateListSelected = [].concat(prev);
7735
+ updateListSelected[index] = _extends({}, updateListSelected[index], {
7736
+ quantity: value
7737
+ });
7738
+ return updateListSelected;
7739
+ });
7740
+ }
7741
+ };
7742
+ var checkTechnicalSelected = function checkTechnicalSelected(technicalStaffIds, index) {
7743
+ var _listProductSelected$, _listProductSelected$2;
7744
+ if (listProductSelected && (listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.length) > 0) return (listProductSelected === null || listProductSelected === void 0 ? void 0 : (_listProductSelected$ = listProductSelected[index]) === null || _listProductSelected$ === void 0 ? void 0 : (_listProductSelected$2 = _listProductSelected$.technical) === null || _listProductSelected$2 === void 0 ? void 0 : _listProductSelected$2.sysUserId) === technicalStaffIds;
7745
+ };
7746
+ var removeTechnicalSelected = function removeTechnicalSelected(event, index) {
7747
+ event.stopPropagation();
7748
+ setListProductSelected(function (prev) {
7749
+ var updateListSelected = [].concat(prev);
7750
+ updateListSelected[index] = _extends({}, updateListSelected[index], {
7751
+ technical: {}
7752
+ });
7753
+ return updateListSelected;
7754
+ });
7755
+ };
7756
+ var handleSearchService = function handleSearchService(e) {
7757
+ var searchValue = e.target.value;
7758
+ setSearchOption(searchValue);
7759
+ var listCopy = products.filter(function (item) {
7760
+ var _item$productInfo, _item$productInfo$pro;
7761
+ return item === null || item === void 0 ? void 0 : (_item$productInfo = item.productInfo) === null || _item$productInfo === void 0 ? void 0 : (_item$productInfo$pro = _item$productInfo.productName) === null || _item$productInfo$pro === void 0 ? void 0 : _item$productInfo$pro.toLowerCase().includes(searchValue.toLowerCase());
7762
+ });
7763
+ return listCopy;
7764
+ };
7765
+ var handleSearchTechnical = function handleSearchTechnical(e) {
7766
+ var searchValue = e.target.value;
7767
+ setSearchOption(searchValue);
7768
+ var listCopy = listEmployment.filter(function (item) {
7769
+ var _item$name;
7770
+ return item === null || item === void 0 ? void 0 : (_item$name = item.name) === null || _item$name === void 0 ? void 0 : _item$name.toLowerCase().includes(searchValue.toLowerCase());
7771
+ });
7772
+ return listCopy;
7773
+ };
7774
+ var handleSubmit = function handleSubmit() {
7775
+ try {
7776
+ var _inputNameRef$current, _inputPhoneNumberRef$, _inputDateRef$current, _inputSelectedRef$cur;
7777
+ var validateName = inputNameRef === null || inputNameRef === void 0 ? void 0 : (_inputNameRef$current = inputNameRef.current) === null || _inputNameRef$current === void 0 ? void 0 : _inputNameRef$current.validateData();
7778
+ var validatePhoneNumber = inputPhoneNumberRef === null || inputPhoneNumberRef === void 0 ? void 0 : (_inputPhoneNumberRef$ = inputPhoneNumberRef.current) === null || _inputPhoneNumberRef$ === void 0 ? void 0 : _inputPhoneNumberRef$.validateData();
7779
+ var validateDate = inputDateRef === null || inputDateRef === void 0 ? void 0 : (_inputDateRef$current = inputDateRef.current) === null || _inputDateRef$current === void 0 ? void 0 : _inputDateRef$current.validateData();
7780
+ var validateService = inputSelectedRef === null || inputSelectedRef === void 0 ? void 0 : (_inputSelectedRef$cur = inputSelectedRef.current) === null || _inputSelectedRef$cur === void 0 ? void 0 : _inputSelectedRef$cur.validateData();
7781
+ var _temp = function () {
7782
+ if (validateName && validatePhoneNumber && validateDate && validateService) {
7783
+ var _inputPhoneNumberRef$2, _inputNameRef$current2, _inputDateRef$current2;
7784
+ var customerPhone = inputPhoneNumberRef === null || inputPhoneNumberRef === void 0 ? void 0 : (_inputPhoneNumberRef$2 = inputPhoneNumberRef.current) === null || _inputPhoneNumberRef$2 === void 0 ? void 0 : _inputPhoneNumberRef$2.getValue();
7785
+ var customerName = inputNameRef === null || inputNameRef === void 0 ? void 0 : (_inputNameRef$current2 = inputNameRef.current) === null || _inputNameRef$current2 === void 0 ? void 0 : _inputNameRef$current2.getValue();
7786
+ var scheduleDate = inputDateRef === null || inputDateRef === void 0 ? void 0 : (_inputDateRef$current2 = inputDateRef.current) === null || _inputDateRef$current2 === void 0 ? void 0 : _inputDateRef$current2.getValue();
7787
+ var services = listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.map(function (item) {
7788
+ var _item$product4, _item$technical;
7789
+ return {
7790
+ productId: item === null || item === void 0 ? void 0 : (_item$product4 = item.product) === null || _item$product4 === void 0 ? void 0 : _item$product4.productId,
7791
+ technicalStaffIds: [item === null || item === void 0 ? void 0 : (_item$technical = item.technical) === null || _item$technical === void 0 ? void 0 : _item$technical.sysUserId],
7792
+ quantity: item === null || item === void 0 ? void 0 : item.quantity,
7793
+ oldService: item === null || item === void 0 ? void 0 : item.oldService
7794
+ };
7795
+ });
7796
+ var shopId = shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId;
7797
+ console.log("check payload:::", services);
7798
+ return Promise.resolve(createSchedule(customerName, customerPhone, scheduleDate, services, shopId)).then(function (response) {
7799
+ var _response$data, _response$data$status;
7800
+ if ((response === null || response === void 0 ? void 0 : (_response$data = response.data) === null || _response$data === void 0 ? void 0 : (_response$data$status = _response$data.status) === null || _response$data$status === void 0 ? void 0 : _response$data$status.code) === '200') {
7801
+ var _response$data2, _inputPhoneNumberRef$3, _inputNameRef$current3;
7802
+ setDataBooking(response === null || response === void 0 ? void 0 : (_response$data2 = response.data) === null || _response$data2 === void 0 ? void 0 : _response$data2.data);
7803
+ setIsOpenPopup(true);
7804
+ inputPhoneNumberRef === null || inputPhoneNumberRef === void 0 ? void 0 : (_inputPhoneNumberRef$3 = inputPhoneNumberRef.current) === null || _inputPhoneNumberRef$3 === void 0 ? void 0 : _inputPhoneNumberRef$3.setValue("");
7805
+ inputNameRef === null || inputNameRef === void 0 ? void 0 : (_inputNameRef$current3 = inputNameRef.current) === null || _inputNameRef$current3 === void 0 ? void 0 : _inputNameRef$current3.setValue("");
7806
+ setListProductSelected([]);
7807
+ }
7808
+ });
7809
+ }
7810
+ }();
7811
+ return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
7812
+ } catch (e) {
7813
+ return Promise.reject(e);
7814
+ }
7815
+ };
7816
+ var handleClosePopup = function handleClosePopup() {
7817
+ setIsOpenPopup(false);
7818
+ setDataBooking({});
7819
+ };
7820
+ return /*#__PURE__*/React__default.createElement("div", {
7821
+ className: "grid gap-4 rounded-lg p-6 " + className,
7822
+ style: {
7823
+ backgroundColor: secondary
7824
+ }
7825
+ }, /*#__PURE__*/React__default.createElement("div", {
7826
+ className: "grid grid-cols-1 md:grid-cols-2 gap-4"
7827
+ }, /*#__PURE__*/React__default.createElement(Input, {
7828
+ ref: inputNameRef,
7829
+ label: "Họ tên",
7830
+ placeholder: "Nhập họ tên",
7831
+ rules: [{
7832
+ type: "required",
7833
+ message: "Bắt buộc nhập họ tên"
7834
+ }],
7835
+ className: "w-full rounded-lg bg-white",
7836
+ inputClassName: "w-full focus:outline-none focus:ring-0"
7837
+ }), /*#__PURE__*/React__default.createElement(InputPhoneNumber, {
7838
+ ref: inputPhoneNumberRef,
7839
+ label: "Số điện thoại",
7840
+ placeholder: "Nhập số điện thoại",
7841
+ rules: [{
7842
+ type: "required",
7843
+ message: "Bắt buộc nhập số điện thoại"
7844
+ }, {
7845
+ type: "pattern",
7846
+ pattern: pattern === null || pattern === void 0 ? void 0 : pattern.phoneNumberPattern,
7847
+ message: "Số điện thoại không hợp lệ!"
7848
+ }],
7849
+ className: "w-full rounded-lg"
7850
+ })), /*#__PURE__*/React__default.createElement("div", {
7851
+ className: "grid grid-cols-1 gap-4"
7852
+ }, /*#__PURE__*/React__default.createElement("div", {
7853
+ className: "relative"
7854
+ }, /*#__PURE__*/React__default.createElement(Select$1, {
7855
+ ref: inputSelectedRef,
7856
+ searchOption: searchOption,
7857
+ handleSearchOption: handleSearchService,
7858
+ value: listProductSelected,
7859
+ rules: [{
7860
+ type: "required",
7861
+ message: "Bắt buộc chọn dịch vụ"
7862
+ }],
7863
+ label: "Dịch vụ",
7864
+ placeholder: "Chọn dịch vụ",
7865
+ options: products,
7866
+ renderItem: function renderItem(item, index) {
7867
+ var _item$productInfo2, _item$productInfo3;
7868
+ return /*#__PURE__*/React__default.createElement("div", {
7869
+ key: "dfjsvsjvhu-" + index,
7870
+ className: "px-2 py-1.5 flex items-center hover:bg-gray-100 rounded-lg",
7871
+ onClick: function onClick(event) {
7872
+ handleSelectedProduct(event, item === null || item === void 0 ? void 0 : item.productInfo);
7873
+ }
7874
+ }, /*#__PURE__*/React__default.createElement(IoMdCheckmark, {
7875
+ className: (checkProductSelected(item === null || item === void 0 ? void 0 : (_item$productInfo2 = item.productInfo) === null || _item$productInfo2 === void 0 ? void 0 : _item$productInfo2.productId) ? "" : "invisible") + " inline me-2 w-4"
7876
+ }), /*#__PURE__*/React__default.createElement("div", {
7877
+ className: " whitespace-nowrap line-clamp-1"
7878
+ }, item === null || item === void 0 ? void 0 : (_item$productInfo3 = item.productInfo) === null || _item$productInfo3 === void 0 ? void 0 : _item$productInfo3.productName));
7879
+ }
7880
+ })), /*#__PURE__*/React__default.createElement(DateTimePicker, {
7881
+ ref: inputDateRef,
7882
+ label: "Thời gian",
7883
+ className: "w-full rounded-lg",
7884
+ placeholder: "Chọn thời gian",
7885
+ rules: [{
7886
+ type: "required",
7887
+ message: "Bắt buộc chọn ngày đặt"
7888
+ }]
7889
+ })), (listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
7890
+ className: "grid grid-cols-1"
7891
+ }, /*#__PURE__*/React__default.createElement("div", null, "D\u1ECBch v\u1EE5 \u0111\xE3 ch\u1ECDn"), listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.map(function (item, optionIndex) {
7892
+ var _item$product5;
7893
+ return /*#__PURE__*/React__default.createElement("div", {
7894
+ className: "w-full bg-transparent border-b-2 py-3 grid grid-col-12 gap-2",
7895
+ key: "ohoihtr-" + optionIndex
7896
+ }, /*#__PURE__*/React__default.createElement("div", {
7897
+ className: "col-span-12 grid grid-cols-12"
7898
+ }, /*#__PURE__*/React__default.createElement("div", {
7899
+ className: "col-span-1 "
7900
+ }, /*#__PURE__*/React__default.createElement("div", null, optionIndex + 1, ".")), /*#__PURE__*/React__default.createElement("div", {
7901
+ className: "col-span-10"
7902
+ }, /*#__PURE__*/React__default.createElement("div", {
7903
+ className: "col-span-10 font-semibold "
7904
+ }, item === null || item === void 0 ? void 0 : (_item$product5 = item.product) === null || _item$product5 === void 0 ? void 0 : _item$product5.productName)), /*#__PURE__*/React__default.createElement("div", {
7905
+ className: "col-span-1 flex justify-center px-2"
7906
+ }, /*#__PURE__*/React__default.createElement("div", {
7907
+ className: "flex items-center justify-center cursor-pointer",
7908
+ onClick: function onClick(event) {
7909
+ handleSelectedProduct(event, item === null || item === void 0 ? void 0 : item.product);
7910
+ }
7911
+ }, /*#__PURE__*/React__default.createElement(RxCross2, {
7912
+ className: "text-base ",
7913
+ style: {
7914
+ color: "rgb(220, 38, 38)"
7915
+ }
7916
+ })))), /*#__PURE__*/React__default.createElement("div", {
7917
+ className: "col-span-12 grid grid-cols-12 gap-6"
7918
+ }, /*#__PURE__*/React__default.createElement("div", {
7919
+ className: "col-span-4 lg:col-start-2 lg:col-end-5 flex flex-col gap-2"
7920
+ }, /*#__PURE__*/React__default.createElement(Input, {
7921
+ isQuantity: true,
7922
+ labelClassName: "text-sm font-semibold ",
7923
+ wrapClassName: "w-full flex flex-col gap-2",
7924
+ label: "Số lượng",
7925
+ placeholder: "Nhập số lượng",
7926
+ rules: [{
7927
+ type: "required",
7928
+ message: "Bắt buộc nhập số lượng"
7929
+ }],
7930
+ defaultValue: item === null || item === void 0 ? void 0 : item.quantity,
7931
+ className: "w-full rounded-lg bg-bgSecondary ",
7932
+ inputClassName: "w-full focus:outline-none focus:ring-0",
7933
+ onChange: function onChange(value) {
7934
+ handleOnChangeQuantity(optionIndex, value);
7935
+ }
7936
+ })), /*#__PURE__*/React__default.createElement("div", {
7937
+ className: "col-end-13 col-span-8 flex flex-col gap-2 "
7938
+ }, /*#__PURE__*/React__default.createElement("div", {
7939
+ className: "font-semibold text-sm mb-1"
7940
+ }, "K\u1EF9 thu\u1EADt vi\xEAn"), /*#__PURE__*/React__default.createElement(Select$1, {
7941
+ placeholder: "Ch\u1ECDn k\u1EF9 thu\u1EADt vi\xEAn",
7942
+ searchOption: searchOption,
7943
+ handleSearchOption: handleSearchTechnical,
7944
+ value: item === null || item === void 0 ? void 0 : item.technical,
7945
+ className: "w-full border rounded-lg",
7946
+ displayItem: function displayItem(technicalSelected) {
7947
+ return /*#__PURE__*/React__default.createElement("div", {
7948
+ className: "flex justify-between items-center w-full"
7949
+ }, /*#__PURE__*/React__default.createElement("div", {
7950
+ className: "line-clamp-1 text-start "
7951
+ }, technicalSelected === null || technicalSelected === void 0 ? void 0 : technicalSelected.name, "(", technicalSelected === null || technicalSelected === void 0 ? void 0 : technicalSelected.roleName, ")"), /*#__PURE__*/React__default.createElement("div", {
7952
+ onClick: function onClick(event) {
7953
+ removeTechnicalSelected(event, optionIndex);
7954
+ }
7955
+ }, /*#__PURE__*/React__default.createElement(RxCross2, {
7956
+ className: "text-xs"
7957
+ })));
7958
+ },
7959
+ options: listEmployment,
7960
+ renderItem: function renderItem(employee, index) {
7961
+ return /*#__PURE__*/React__default.createElement("div", {
7962
+ key: "dds32vsjvhu-" + index,
7963
+ className: (checkTechnicalSelected(employee === null || employee === void 0 ? void 0 : employee.sysUserId, optionIndex) ? "bg-gray-100" : "") + " px-2 py-1.5 flex items-center hover:bg-gray-100 rounded-lg",
7964
+ onClick: function onClick() {
7965
+ handleChooseTechnical(employee, optionIndex);
7966
+ }
7967
+ }, /*#__PURE__*/React__default.createElement(IoMdCheckmark, {
7968
+ className: (checkTechnicalSelected(employee === null || employee === void 0 ? void 0 : employee.sysUserId, optionIndex) ? "" : "invisible") + " inline me-2 min-w-2 md:min-w-4 h-auto"
7969
+ }), /*#__PURE__*/React__default.createElement("div", {
7970
+ className: "hover:bg-gray-100 rounded-lg text-wrap md:text-base text-xs"
7971
+ }, employee === null || employee === void 0 ? void 0 : employee.name, "(", employee === null || employee === void 0 ? void 0 : employee.roleName, ")"));
7972
+ }
7973
+ }))));
7974
+ })) : null, /*#__PURE__*/React__default.createElement("div", {
7975
+ className: "text-center"
7976
+ }, /*#__PURE__*/React__default.createElement(Button, {
7977
+ label: "Đặt lịch ngay",
7978
+ shopConfigStyle: shopConfigStyle,
7979
+ onClick: handleSubmit
7980
+ })), isOpenPopup && /*#__PURE__*/React__default.createElement(ModalNotification, {
7981
+ onCloseFormBooking: onCloseFormBooking,
7982
+ onClose: handleClosePopup
7983
+ }, /*#__PURE__*/React__default.createElement("div", {
7984
+ className: "bg-white rounded-lg shadow-lg p-6 max-w-sm text-center md:min-w-[650px] min-h-[420px] md:min-h-[380px] lg:h-auto "
7985
+ }, /*#__PURE__*/React__default.createElement("div", {
7986
+ className: "h-20 mb-4 flex items-center justify-center"
7987
+ }, /*#__PURE__*/React__default.createElement(FaCheckCircle, {
7988
+ className: "h-full text-green-500",
7989
+ style: {
7990
+ fontSize: "150px"
7991
+ }
7992
+ })), /*#__PURE__*/React__default.createElement("div", {
7993
+ className: "mb-2"
7994
+ }, "Kh\xE1ch h\xE0ng: ", dataBooking === null || dataBooking === void 0 ? void 0 : dataBooking.customerName), /*#__PURE__*/React__default.createElement("div", {
7995
+ className: "mb-2"
7996
+ }, "S\u1ED1 \u0111i\u1EC7n tho\u1EA1i: ", dataBooking === null || dataBooking === void 0 ? void 0 : dataBooking.customerPhone), /*#__PURE__*/React__default.createElement("div", {
7997
+ className: "mb-4"
7998
+ }, "Th\u1EDDi gian: ", dayjs_min(dataBooking === null || dataBooking === void 0 ? void 0 : dataBooking.scheduleDate).format("DD/MM/YYYY")), /*#__PURE__*/React__default.createElement("p", {
7999
+ className: "mb-4"
8000
+ }, "B\u1EA1n \u0111\xE3 c\xF3 t\xE0i kho\u1EA3n, vui l\xF2ng \u0111\u0103ng nh\u1EADp \u0111\u1EC3 xem chi ti\u1EBFt c\xE1c s\u1EA3n ph\u1EA9m, d\u1ECBch v\u1EE5 li\u1EC7u tr\xECnh m\xE0 b\u1EA1n \u0111ang s\u1EDF h\u1EEFu"), /*#__PURE__*/React__default.createElement(Button, {
8001
+ label: "Đăng nhập",
8002
+ shopConfigStyle: shopConfigStyle
8003
+ }))));
8004
+ };
8005
+
8006
+ var Treatments1 = function Treatments1(props) {
8007
+ var _props$shopConfigStyl = props.shopConfigStyle,
8008
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
8009
+ _props$shopConfig = props.shopConfig,
8010
+ shopConfig = _props$shopConfig === void 0 ? {} : _props$shopConfig,
8011
+ _props$data = props.data,
8012
+ data = _props$data === void 0 ? {} : _props$data,
8013
+ _props$SectionTitle = props.SectionTitle,
8014
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
8015
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
8016
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
8017
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
8018
+ var _useState = useState({
8019
+ size: 10,
8020
+ types: "1,10",
8021
+ isHighlight: true
8022
+ }),
8023
+ params = _useState[0];
8024
+ var _useState2 = useState(false),
8025
+ isOpenModal = _useState2[0],
8026
+ setIsOpenModal = _useState2[1];
8027
+ var _useState3 = useState([]),
8028
+ dataBooking = _useState3[0],
8029
+ setDataBooking = _useState3[1];
8030
+ var _ProductController = ProductController(_extends({}, props, {
8031
+ params: params
8032
+ })),
8033
+ _ProductController$pr = _ProductController.products,
8034
+ products = _ProductController$pr === void 0 ? [] : _ProductController$pr;
8035
+ console.log("treatment1:", products);
8036
+ var handleOpenModalBooking = function handleOpenModalBooking(event, data) {
8037
+ try {
8038
+ event.stopPropagation();
8039
+ setDataBooking([{
8040
+ product: data,
8041
+ quantity: 1,
8042
+ technical: {},
8043
+ oldService: false
8044
+ }]);
8045
+ setIsOpenModal(true);
8046
+ } catch (error) {
8047
+ console.log("::::::::::errrorrrrr::::::", error);
8048
+ }
8049
+ };
8050
+ var handleCloseModal = function handleCloseModal() {
8051
+ setIsOpenModal(false);
8052
+ console.log("đóng::::");
8053
+ setDataBooking([]);
8054
+ };
8055
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
8056
+ className: "" + SECTION_DEFAULT_CLASS
8057
+ }, /*#__PURE__*/React__default.createElement(SectionTitle, {
8058
+ data: data,
8059
+ shopConfigStyle: shopConfigStyle
8060
+ }), products === null || products === void 0 ? void 0 : products.map(function (product, index) {
8061
+ var _product$productInfo, _product$productInfo2;
8062
+ return /*#__PURE__*/React__default.createElement("div", {
8063
+ className: "grid grid-cols-1 md:grid-cols-2 gap-6 mt-12",
8064
+ key: "rthirr-" + index
8065
+ }, /*#__PURE__*/React__default.createElement("div", {
8066
+ className: "block " + (index % 2 ? "md:hidden" : "")
8067
+ }, /*#__PURE__*/React__default.createElement(ProductImage, {
8068
+ product: product === null || product === void 0 ? void 0 : product.productInfo,
8069
+ className: "aspect-video rounded-2xl"
8070
+ })), /*#__PURE__*/React__default.createElement("div", {
8071
+ className: "text-left " + (index % 2 ? "md:text-right" : "")
8072
+ }, /*#__PURE__*/React__default.createElement("div", {
8073
+ className: "font-medium text-2xl"
8074
+ }, product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.productName), /*#__PURE__*/React__default.createElement("div", {
8075
+ className: "mt-4 text-textBody",
8076
+ dangerouslySetInnerHTML: {
8077
+ __html: product === null || product === void 0 ? void 0 : (_product$productInfo2 = product.productInfo) === null || _product$productInfo2 === void 0 ? void 0 : _product$productInfo2.description
8078
+ }
8079
+ }), /*#__PURE__*/React__default.createElement(Button, {
8080
+ label: "Đặt lịch ngay",
8081
+ shopConfigStyle: shopConfigStyle,
8082
+ className: "mt-4",
8083
+ onClick: function onClick(event) {
8084
+ handleOpenModalBooking(event, product === null || product === void 0 ? void 0 : product.productInfo);
8085
+ }
8086
+ })), /*#__PURE__*/React__default.createElement("div", {
8087
+ className: "hidden " + (index % 2 ? "md:block" : "")
8088
+ }, /*#__PURE__*/React__default.createElement(ProductImage, {
8089
+ product: product === null || product === void 0 ? void 0 : product.productInfo,
8090
+ className: "aspect-video rounded-2xl"
8091
+ })));
8092
+ })), /*#__PURE__*/React__default.createElement(Dash, {
8093
+ color: secondary
8094
+ }), isOpenModal ? /*#__PURE__*/React__default.createElement(ModalNotification, {
8095
+ onClose: handleCloseModal
8096
+ }, /*#__PURE__*/React__default.createElement(BookingForm, {
8097
+ className: "overflow-y-scroll hide-scrollbar max-h-[80vh]",
8098
+ onCloseFormBooking: handleCloseModal,
8099
+ defaultValue: dataBooking,
8100
+ shopConfig: shopConfig,
8101
+ shopConfigStyle: shopConfigStyle
8102
+ })) : null);
8103
+ };
8104
+
8105
+ var _path$1;
8106
+ function _extends$2() {
8107
+ return _extends$2 = Object.assign ? Object.assign.bind() : function (n) {
8108
+ for (var e = 1; e < arguments.length; e++) {
8109
+ var t = arguments[e];
8110
+ for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
8111
+ }
8112
+ return n;
8113
+ }, _extends$2.apply(null, arguments);
8114
+ }
8115
+ function SvgAngleSmallLeft(props) {
8116
+ return /*#__PURE__*/createElement("svg", _extends$2({
8117
+ xmlns: "http://www.w3.org/2000/svg",
8118
+ viewBox: "0 0 24 24",
8119
+ width: 512,
8120
+ height: 512
8121
+ }, props), _path$1 || (_path$1 = /*#__PURE__*/createElement("path", {
8122
+ d: "M10.6 12.71a1 1 0 010-1.42l4.59-4.58a1 1 0 000-1.42 1 1 0 00-1.41 0L9.19 9.88a3 3 0 000 4.24l4.59 4.59a1 1 0 00.7.29 1 1 0 00.71-.29 1 1 0 000-1.42z"
8123
+ })));
8124
+ }
8125
+
8126
+ var _path$2;
8127
+ function _extends$3() {
8128
+ return _extends$3 = Object.assign ? Object.assign.bind() : function (n) {
8129
+ for (var e = 1; e < arguments.length; e++) {
8130
+ var t = arguments[e];
8131
+ for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
8132
+ }
8133
+ return n;
8134
+ }, _extends$3.apply(null, arguments);
8135
+ }
8136
+ function SvgAngleSmallRight(props) {
8137
+ return /*#__PURE__*/createElement("svg", _extends$3({
8138
+ xmlns: "http://www.w3.org/2000/svg",
8139
+ viewBox: "0 0 24 24",
8140
+ width: 512,
8141
+ height: 512
8142
+ }, props), _path$2 || (_path$2 = /*#__PURE__*/createElement("path", {
8143
+ d: "M15.4 9.88l-4.59-4.59a1 1 0 00-1.41 0 1 1 0 000 1.42l4.6 4.58a1 1 0 010 1.42l-4.6 4.58a1 1 0 001.41 1.42l4.59-4.59a3 3 0 000-4.24z"
7138
8144
  })));
7139
8145
  }
7140
8146
 
7141
- const ScrollHorizontal = props => {
7142
- const {
7143
- datas = [],
7144
- className = "",
7145
- style = {},
7146
- primaryColor = "",
7147
- renderItem = () => {}
7148
- } = props;
7149
- const scrollContainerRef = useRef(null);
7150
- const [isScrolledToLeft, setIsScrolledToLeft] = useState(true);
7151
- const [isScrolledToRight, setIsScrolledToRight] = useState(false);
7152
- const checkScrollPosition = () => {
8147
+ var ScrollHorizontal = function ScrollHorizontal(props) {
8148
+ var _props$datas = props.datas,
8149
+ datas = _props$datas === void 0 ? [] : _props$datas,
8150
+ _props$className = props.className,
8151
+ className = _props$className === void 0 ? "" : _props$className,
8152
+ _props$style = props.style,
8153
+ style = _props$style === void 0 ? {} : _props$style,
8154
+ _props$renderItem = props.renderItem,
8155
+ renderItem = _props$renderItem === void 0 ? function () {} : _props$renderItem;
8156
+ var scrollContainerRef = useRef(null);
8157
+ var _useState = useState(true),
8158
+ isScrolledToLeft = _useState[0],
8159
+ setIsScrolledToLeft = _useState[1];
8160
+ var _useState2 = useState(false),
8161
+ isScrolledToRight = _useState2[0],
8162
+ setIsScrolledToRight = _useState2[1];
8163
+ var checkScrollPosition = function checkScrollPosition() {
7153
8164
  if (scrollContainerRef.current) {
7154
- const {
7155
- scrollLeft,
7156
- scrollWidth,
7157
- clientWidth
7158
- } = scrollContainerRef.current;
7159
- setIsScrolledToLeft(scrollLeft === 0);
7160
- setIsScrolledToRight(scrollLeft + clientWidth >= scrollWidth);
8165
+ var _scrollContainerRef$c = scrollContainerRef.current,
8166
+ _scrollLeft = _scrollContainerRef$c.scrollLeft,
8167
+ scrollWidth = _scrollContainerRef$c.scrollWidth,
8168
+ clientWidth = _scrollContainerRef$c.clientWidth;
8169
+ setIsScrolledToLeft(_scrollLeft === 0);
8170
+ setIsScrolledToRight(_scrollLeft + clientWidth >= scrollWidth);
7161
8171
  }
7162
8172
  };
7163
- const scrollLeft = () => {
8173
+ var scrollLeft = function scrollLeft() {
7164
8174
  if (scrollContainerRef.current) {
7165
8175
  scrollContainerRef.current.scrollBy({
7166
8176
  left: -200,
@@ -7169,7 +8179,7 @@ const ScrollHorizontal = props => {
7169
8179
  setTimeout(checkScrollPosition, 300);
7170
8180
  }
7171
8181
  };
7172
- const scrollRight = () => {
8182
+ var scrollRight = function scrollRight() {
7173
8183
  if (scrollContainerRef.current) {
7174
8184
  scrollContainerRef.current.scrollBy({
7175
8185
  left: 200,
@@ -7178,34 +8188,30 @@ const ScrollHorizontal = props => {
7178
8188
  setTimeout(checkScrollPosition, 300);
7179
8189
  }
7180
8190
  };
7181
- useEffect(() => {
8191
+ useEffect(function () {
7182
8192
  checkScrollPosition();
7183
8193
  }, [datas]);
7184
8194
  return /*#__PURE__*/React__default.createElement("div", {
7185
- className: `flex ${className}`,
8195
+ className: "flex " + className,
7186
8196
  style: style
7187
8197
  }, /*#__PURE__*/React__default.createElement("div", {
7188
- className: `flex w-full overflow-x-hidden`,
8198
+ className: "flex w-full overflow-x-hidden",
7189
8199
  ref: scrollContainerRef,
7190
8200
  onScroll: checkScrollPosition
7191
- }, datas === null || datas === void 0 ? void 0 : datas.map((item, index) => renderItem(item, index))), /*#__PURE__*/React__default.createElement("div", {
8201
+ }, datas === null || datas === void 0 ? void 0 : datas.map(function (item, index) {
8202
+ return renderItem(item, index);
8203
+ })), /*#__PURE__*/React__default.createElement("div", {
7192
8204
  className: "flex gap-2 items-center px-4"
7193
8205
  }, /*#__PURE__*/React__default.createElement("div", {
7194
8206
  onClick: scrollLeft,
7195
- className: "cursor-pointer w-8 h-8 rounded-full flex justify-center items-center",
7196
- style: {
7197
- backgroundColor: isScrolledToLeft ? "#BDBDBD" : primaryColor
7198
- }
8207
+ className: "cursor-pointer w-8 h-8 rounded-full flex justify-center items-center " + (isScrolledToLeft ? "bg-gray4" : "bg-primary")
7199
8208
  }, /*#__PURE__*/React__default.createElement(SvgAngleSmallLeft, {
7200
8209
  width: 24,
7201
8210
  height: 24,
7202
8211
  fill: "#fff"
7203
8212
  })), /*#__PURE__*/React__default.createElement("div", {
7204
8213
  onClick: scrollRight,
7205
- className: "cursor-pointer w-8 h-8 rounded-full flex justify-center items-center",
7206
- style: {
7207
- backgroundColor: isScrolledToRight ? "#BDBDBD" : primaryColor
7208
- }
8214
+ className: "cursor-pointer w-8 h-8 rounded-full flex justify-center items-center " + (isScrolledToRight ? "bg-gray4" : "bg-primary")
7209
8215
  }, /*#__PURE__*/React__default.createElement(SvgAngleSmallRight, {
7210
8216
  width: 24,
7211
8217
  height: 24,
@@ -7213,41 +8219,108 @@ const ScrollHorizontal = props => {
7213
8219
  }))));
7214
8220
  };
7215
8221
 
7216
- const getDurationValue = attributes => {
7217
- var _parsedAttributes$fin;
7218
- const parsedAttributes = JSON.parse(attributes || "[]");
7219
- return ((_parsedAttributes$fin = parsedAttributes.find(attr => attr.name === "Thời lượng (phút) / buổi")) === null || _parsedAttributes$fin === void 0 ? void 0 : _parsedAttributes$fin.value[0]) || "0";
7220
- };
7221
-
7222
- const formatCurrency = amount => {
7223
- if (isNaN(amount)) {
7224
- return '0 ₫';
8222
+ var getDurationValue = function getDurationValue(attributes) {
8223
+ var _durationAtt$value, _durationAtt$unit;
8224
+ if (!attributes) {
8225
+ return "";
7225
8226
  }
7226
- const roundedAmount = Math.round(amount);
7227
- const formattedAmount = roundedAmount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.');
7228
- return `${formattedAmount} ₫`;
7229
- };
7230
-
7231
- const ProductPrice = props => {
7232
- const {
7233
- product,
7234
- className = "",
7235
- style = {}
7236
- } = props;
8227
+ if (typeof attributes === "string") {
8228
+ attributes = JSON.parse(attributes || "[]");
8229
+ }
8230
+ var durationAtt = attributes.find(function (attr) {
8231
+ return attr.name === "Thời lượng (phút) / buổi";
8232
+ });
8233
+ return durationAtt ? ((durationAtt === null || durationAtt === void 0 ? void 0 : (_durationAtt$value = durationAtt.value) === null || _durationAtt$value === void 0 ? void 0 : _durationAtt$value[0]) || "0") + " " + ((durationAtt === null || durationAtt === void 0 ? void 0 : (_durationAtt$unit = durationAtt.unit) === null || _durationAtt$unit === void 0 ? void 0 : _durationAtt$unit[0]) || "") : "";
8234
+ };
8235
+ var genProductSlug = function genProductSlug(productName, id) {
8236
+ var slug = productName.toLowerCase();
8237
+ slug = slug.replace(/(à|á|ạ|ả|ã|â|ầ|ấ|ậ|ẩ|ẫ|ă|ằ|ắ|ặ|ẳ|ẵ)/g, "a");
8238
+ slug = slug.replace(/(è|é|ẹ|ẻ|ẽ|ê|ề|ế|ệ|ể|ễ)/g, "e");
8239
+ slug = slug.replace(/(ì|í|ị|ỉ|ĩ)/g, "i");
8240
+ slug = slug.replace(/(ò|ó|ọ|ỏ|õ|ô|ồ|ố|ộ|ổ|ỗ|ơ|ờ|ớ|ợ|ở|ỡ)/g, "o");
8241
+ slug = slug.replace(/(ù|ú|ụ|ủ|ũ|ư|ừ|ứ|ự|ử|ữ)/g, "u");
8242
+ slug = slug.replace(/(ỳ|ý|ỵ|ỷ|ỹ)/g, "y");
8243
+ slug = slug.replace(/(đ)/g, "d");
8244
+ slug = slug.replace(/([^0-9a-z-\s])/g, "");
8245
+ slug = slug.replace(/(\s+)/g, "-");
8246
+ slug = slug.replace(/^-+/g, "");
8247
+ slug = slug.replace(/-+$/g, "");
8248
+ return slug + "-" + id;
8249
+ };
8250
+ var getLinkProductDetail = function getLinkProductDetail(product) {
8251
+ var slug = genProductSlug(product === null || product === void 0 ? void 0 : product.productName, product === null || product === void 0 ? void 0 : product.productId);
8252
+ return "/product/" + slug + "/" + (product === null || product === void 0 ? void 0 : product.shopId);
8253
+ };
8254
+
8255
+ function getMinMax(array, field) {
8256
+ if (!(array !== null && array !== void 0 && array.length) || !array[0].hasOwnProperty(field)) {
8257
+ return null;
8258
+ }
8259
+ var _array$reduce = array.reduce(function (acc, obj) {
8260
+ var value = obj[field];
8261
+ return {
8262
+ min: value < acc.min ? value : acc.min,
8263
+ max: value > acc.max ? value : acc.max
8264
+ };
8265
+ }, {
8266
+ min: array[0][field],
8267
+ max: array[0][field]
8268
+ }),
8269
+ min = _array$reduce.min,
8270
+ max = _array$reduce.max;
8271
+ return {
8272
+ min: min,
8273
+ max: max
8274
+ };
8275
+ }
8276
+ var ProductPrice = function ProductPrice(props) {
8277
+ var product = props.product,
8278
+ variant = props.variant,
8279
+ _props$className = props.className,
8280
+ className = _props$className === void 0 ? "" : _props$className,
8281
+ _props$style = props.style,
8282
+ style = _props$style === void 0 ? {} : _props$style;
8283
+ var _useState = useState(),
8284
+ displayPrice = _useState[0],
8285
+ setDisplayPrice = _useState[1];
8286
+ var _useState2 = useState(),
8287
+ displayPriceBeforeDiscount = _useState2[0],
8288
+ setDisplayPriceBeforeDiscount = _useState2[1];
8289
+ useEffect(function () {
8290
+ if (variant) {
8291
+ genProductPrice([variant]);
8292
+ } else if (product) {
8293
+ genProductPrice(product.variants);
8294
+ }
8295
+ }, [product, variant]);
8296
+ var genProductPrice = function genProductPrice(variants) {
8297
+ var mPrice = getMinMax(variants, 'price');
8298
+ var mPriceBeforeDiscount = getMinMax(variants, 'priceBeforeDiscount');
8299
+ if (mPrice && mPriceBeforeDiscount) {
8300
+ var _displayPriceBeforeDiscount = formatCurrency(mPriceBeforeDiscount.min);
8301
+ var _displayPrice = formatCurrency(mPrice.min);
8302
+ if (mPrice.min !== mPrice.max) {
8303
+ _displayPrice += " - " + formatCurrency(mPrice.max);
8304
+ }
8305
+ if (mPriceBeforeDiscount.min !== mPriceBeforeDiscount.max) {
8306
+ _displayPriceBeforeDiscount += " - " + formatCurrency(mPriceBeforeDiscount.max);
8307
+ }
8308
+ setDisplayPrice(_displayPrice);
8309
+ setDisplayPriceBeforeDiscount(_displayPriceBeforeDiscount);
8310
+ }
8311
+ };
7237
8312
  return /*#__PURE__*/React__default.createElement("div", {
7238
8313
  className: className
7239
- }, product !== null && product !== void 0 && product.priceBeforeDiscount ? /*#__PURE__*/React__default.createElement("span", {
7240
- className: "text-gray3 line-through"
7241
- }, formatCurrency(product === null || product === void 0 ? void 0 : product.priceBeforeDiscount)) : null, /*#__PURE__*/React__default.createElement("span", {
8314
+ }, displayPriceBeforeDiscount !== displayPrice ? /*#__PURE__*/React__default.createElement("span", {
8315
+ className: "text-gray3 line-through mr-2"
8316
+ }, displayPriceBeforeDiscount) : null, /*#__PURE__*/React__default.createElement("span", {
7242
8317
  className: "text-primary font-semibold",
7243
8318
  style: style
7244
- }, formatCurrency(product === null || product === void 0 ? void 0 : product.price)));
8319
+ }, displayPrice));
7245
8320
  };
7246
8321
 
7247
- const ProductItem1 = props => {
7248
- const {
7249
- product
7250
- } = props;
8322
+ var ProductItem1 = function ProductItem1(props) {
8323
+ var product = props.product;
7251
8324
  return /*#__PURE__*/React__default.createElement("div", {
7252
8325
  className: "flex"
7253
8326
  }, /*#__PURE__*/React__default.createElement(ProductImage, {
@@ -7261,44 +8334,62 @@ const ProductItem1 = props => {
7261
8334
  className: "flex mt-2"
7262
8335
  }, /*#__PURE__*/React__default.createElement("div", {
7263
8336
  className: "flex-1 text-gray3"
7264
- }, getDurationValue(product === null || product === void 0 ? void 0 : product.attributes), " ph\xFAt"), /*#__PURE__*/React__default.createElement(ProductPrice, {
8337
+ }, getDurationValue(product === null || product === void 0 ? void 0 : product.attributes)), /*#__PURE__*/React__default.createElement(ProductPrice, {
7265
8338
  product: product
7266
8339
  }))));
7267
8340
  };
7268
8341
 
7269
- const Treatments1$1 = props => {
7270
- const {
7271
- shopConfigStyle = {},
7272
- shopConfig = {},
7273
- data = {},
7274
- SectionTitle = null
7275
- } = props;
7276
- const {
7277
- primary = "#000",
7278
- secondary = "#000",
7279
- textBody = "#000",
7280
- textButton = "#fff",
7281
- background = "#fff"
7282
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
7283
- const [params, setParams] = useState({});
7284
- const {
7285
- categories
7286
- } = CategoryController({
7287
- ...props
7288
- });
7289
- const {
7290
- products = []
7291
- } = ProductController({
7292
- ...props,
7293
- params
7294
- });
7295
- const [selectedCategory, setSelectedCategory] = useState(0);
7296
- console.log("Treatments2 products");
7297
- return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
7298
- className: "relative w-full py-12 px-4 xl:px-20",
8342
+ var Loading = function Loading(props) {
8343
+ var _props$size = props.size,
8344
+ size = _props$size === void 0 ? 24 : _props$size;
8345
+ return /*#__PURE__*/React__default.createElement("div", {
8346
+ className: "border-4 boder-[rgba(255, 255, 255, 0.2)] rounded-full border-t-4 border-t-primary animate-spin",
7299
8347
  style: {
7300
- backgroundColor: background
8348
+ width: size,
8349
+ height: size
7301
8350
  }
8351
+ });
8352
+ };
8353
+
8354
+ var Treatments1$1 = function Treatments1(props) {
8355
+ var _props$shopConfigStyl = props.shopConfigStyle,
8356
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
8357
+ _props$data = props.data,
8358
+ data = _props$data === void 0 ? {} : _props$data,
8359
+ _props$SectionTitle = props.SectionTitle,
8360
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
8361
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
8362
+ _shopConfigStyle$colo2 = _shopConfigStyle$colo.secondary,
8363
+ secondary = _shopConfigStyle$colo2 === void 0 ? "#000" : _shopConfigStyle$colo2;
8364
+ var _useState = useState({
8365
+ types: "1"
8366
+ }),
8367
+ params = _useState[0],
8368
+ setParams = _useState[1];
8369
+ var _CategoryController = CategoryController(_extends({}, props, {
8370
+ types: "1"
8371
+ })),
8372
+ categories = _CategoryController.categories;
8373
+ var _ProductController = ProductController(_extends({}, props, {
8374
+ params: params
8375
+ })),
8376
+ _ProductController$pr = _ProductController.products,
8377
+ products = _ProductController$pr === void 0 ? [] : _ProductController$pr,
8378
+ loading = _ProductController.loading;
8379
+ var _useState2 = useState(0),
8380
+ selectedCategory = _useState2[0],
8381
+ setSelectedCategory = _useState2[1];
8382
+ useEffect(function () {
8383
+ var newParams = _extends({}, params, {
8384
+ categoryId: selectedCategory
8385
+ });
8386
+ if (!selectedCategory) {
8387
+ delete newParams.categoryId;
8388
+ }
8389
+ setParams(newParams);
8390
+ }, [selectedCategory]);
8391
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
8392
+ className: SECTION_DEFAULT_CLASS + " relative"
7302
8393
  }, /*#__PURE__*/React__default.createElement(SectionTitle, {
7303
8394
  data: data,
7304
8395
  shopConfigStyle: shopConfigStyle
@@ -7306,37 +8397,112 @@ const Treatments1$1 = props => {
7306
8397
  datas: [{
7307
8398
  categoryId: 0,
7308
8399
  cateName: "Tất cả"
7309
- }, ...categories],
7310
- style: {
7311
- backgroundColor: secondary
7312
- },
7313
- className: "mt-6 rounded-lg overflow-hidden",
7314
- primaryColor: primary,
7315
- renderItem: (item, index) => /*#__PURE__*/React__default.createElement("div", {
7316
- key: index,
7317
- className: `p-3 flex gap-3 shrink-0 cursor-pointer text-base`,
7318
- onClick: () => setSelectedCategory(item.categoryId),
7319
- style: {
7320
- backgroundColor: selectedCategory === item.categoryId ? primary : "inherit",
7321
- color: selectedCategory === item.categoryId ? textButton : textBody
7322
- }
7323
- }, item === null || item === void 0 ? void 0 : item.cateName)
7324
- }), /*#__PURE__*/React__default.createElement("div", {
8400
+ }].concat(categories),
8401
+ className: "mt-6 rounded-lg overflow-hidden bg-bgSecondary",
8402
+ renderItem: function renderItem(item, index) {
8403
+ return /*#__PURE__*/React__default.createElement("div", {
8404
+ key: index,
8405
+ className: "p-3 flex gap-3 shrink-0 cursor-pointer text-base " + (selectedCategory === item.categoryId ? "bg-primary text-textButton" : ""),
8406
+ onClick: function onClick() {
8407
+ return setSelectedCategory(item.categoryId);
8408
+ }
8409
+ }, item === null || item === void 0 ? void 0 : item.cateName);
8410
+ }
8411
+ }), loading ? /*#__PURE__*/React__default.createElement("div", {
8412
+ className: "flex w-full justify-center p-12"
8413
+ }, /*#__PURE__*/React__default.createElement(Loading, null)) : products !== null && products !== void 0 && products.length ? /*#__PURE__*/React__default.createElement("div", {
7325
8414
  className: "grid grid-cols-1 md:grid-cols-2 gap-10 mt-6"
7326
- }, products === null || products === void 0 ? void 0 : products.map((product, index) => /*#__PURE__*/React__default.createElement(ProductItem1, {
7327
- key: index,
7328
- product: product === null || product === void 0 ? void 0 : product.productInfo
7329
- })))), /*#__PURE__*/React__default.createElement(Dash, {
8415
+ }, products === null || products === void 0 ? void 0 : products.map(function (product, index) {
8416
+ return /*#__PURE__*/React__default.createElement(ProductItem1, {
8417
+ key: index,
8418
+ product: product === null || product === void 0 ? void 0 : product.productInfo
8419
+ });
8420
+ })) : /*#__PURE__*/React__default.createElement("div", {
8421
+ className: "text-gray3 text-center p-12"
8422
+ }, "Kh\xF4ng c\xF3 d\u1ECBch v\u1EE5")), /*#__PURE__*/React__default.createElement(Dash, {
7330
8423
  color: secondary
7331
8424
  }));
7332
8425
  };
7333
8426
 
7334
- const ProductItem2 = props => {
7335
- const {
7336
- product
7337
- } = props;
8427
+ var ProductDetailController = function ProductDetailController(props) {
8428
+ var shopConfig = props.shopConfig,
8429
+ _props$productId = props.productId,
8430
+ productId = _props$productId === void 0 ? 0 : _props$productId;
8431
+ var _useState = useState(),
8432
+ product = _useState[0],
8433
+ setProduct = _useState[1];
8434
+ useEffect(function () {
8435
+ if (productId) {
8436
+ getProductDetail();
8437
+ }
8438
+ }, [productId]);
8439
+ var getProductDetail = function getProductDetail() {
8440
+ try {
8441
+ var _temp = _catch(function () {
8442
+ return Promise.resolve(getDetailProductApi(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId, productId)).then(function (res) {
8443
+ var _res$data, _res$data$status;
8444
+ if ((res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$status = _res$data.status) === null || _res$data$status === void 0 ? void 0 : _res$data$status.code) == 200) {
8445
+ var _res$data2;
8446
+ setProduct(res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data);
8447
+ }
8448
+ });
8449
+ }, function (e) {
8450
+ console.log(e);
8451
+ });
8452
+ return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
8453
+ } catch (e) {
8454
+ return Promise.reject(e);
8455
+ }
8456
+ };
8457
+ return {
8458
+ product: product
8459
+ };
8460
+ };
8461
+
8462
+ var ServiceDetail1 = function ServiceDetail1(props) {
8463
+ var shopConfigStyle = props.shopConfigStyle;
8464
+ var _ProductDetailControl = ProductDetailController(props),
8465
+ product = _ProductDetailControl.product;
8466
+ console.log('product', product);
7338
8467
  return /*#__PURE__*/React__default.createElement("div", {
7339
- className: "text-center"
8468
+ className: SECTION_DEFAULT_CLASS + " !py-0"
8469
+ }, /*#__PURE__*/React__default.createElement("div", {
8470
+ className: "p-6 rounded-2xl grid grid-cols-1 md:grid-cols-3 gap-6 bg-bgSecondary"
8471
+ }, /*#__PURE__*/React__default.createElement(ProductImage, {
8472
+ product: product,
8473
+ className: "w-full aspect-square rounded-2xl"
8474
+ }), /*#__PURE__*/React__default.createElement("div", {
8475
+ className: "col-span-2"
8476
+ }, /*#__PURE__*/React__default.createElement("p", {
8477
+ className: "font-semibold text-2xl"
8478
+ }, product === null || product === void 0 ? void 0 : product.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
8479
+ product: product,
8480
+ className: "mt-6"
8481
+ }), /*#__PURE__*/React__default.createElement("div", {
8482
+ className: "flex gap-4 mt-6"
8483
+ }, /*#__PURE__*/React__default.createElement("div", null, "Th\u1EDDi l\u01B0\u1EE3ng: "), /*#__PURE__*/React__default.createElement("div", null, getDurationValue(product === null || product === void 0 ? void 0 : product.attributes))), /*#__PURE__*/React__default.createElement("div", {
8484
+ className: "flex gap-4 mt-6"
8485
+ }, /*#__PURE__*/React__default.createElement(Button, {
8486
+ label: "ĐẶT LỊCH",
8487
+ shopConfigStyle: shopConfigStyle
8488
+ })), /*#__PURE__*/React__default.createElement("p", {
8489
+ className: "text-lg mt-12 pt-6 border-t border-stroke"
8490
+ }, "M\xF4 t\u1EA3"), product !== null && product !== void 0 && product.description ? /*#__PURE__*/React__default.createElement("div", {
8491
+ className: "mt-6",
8492
+ dangerouslySetInnerHTML: {
8493
+ __html: product === null || product === void 0 ? void 0 : product.description
8494
+ }
8495
+ }) : /*#__PURE__*/React__default.createElement("div", {
8496
+ className: "text-gray3 mt-2"
8497
+ }, "Kh\xF4ng c\xF3 th\xF4ng tin"))));
8498
+ };
8499
+
8500
+ var ProductItem2 = function ProductItem2(props) {
8501
+ var product = props.product;
8502
+ return /*#__PURE__*/React__default.createElement("a", {
8503
+ href: getLinkProductDetail(product)
8504
+ }, /*#__PURE__*/React__default.createElement("div", {
8505
+ className: "text-center relative group"
7340
8506
  }, /*#__PURE__*/React__default.createElement(ProductImage, {
7341
8507
  product: product,
7342
8508
  className: "max-w-[240px] rounded-full mx-auto"
@@ -7345,47 +8511,42 @@ const ProductItem2 = props => {
7345
8511
  className: "text-lg mt-4"
7346
8512
  }), /*#__PURE__*/React__default.createElement("div", {
7347
8513
  className: "text-lg mt-2"
7348
- }, product === null || product === void 0 ? void 0 : product.productName));
7349
- };
7350
-
7351
- const Products1 = props => {
7352
- const {
7353
- shopConfigStyle = {},
7354
- shopConfig = {},
7355
- data = {},
7356
- SectionTitle = null
7357
- } = props;
7358
- const {
7359
- primary = "#000",
7360
- secondary = "#000",
7361
- textBody = "#000",
7362
- textButton = "#fff",
7363
- background = "#fff"
7364
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
7365
- const [params, setParams] = useState({
7366
- size: 4
7367
- });
7368
- const {
7369
- products = []
7370
- } = ProductController({
7371
- ...props,
7372
- params
7373
- });
8514
+ }, product === null || product === void 0 ? void 0 : product.productName)));
8515
+ };
8516
+
8517
+ var Products1 = function Products1(props) {
8518
+ var _props$shopConfigStyl = props.shopConfigStyle,
8519
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
8520
+ _props$data = props.data,
8521
+ data = _props$data === void 0 ? {} : _props$data,
8522
+ _props$SectionTitle = props.SectionTitle,
8523
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
8524
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
8525
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
8526
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
8527
+ var _useState = useState({
8528
+ size: 4
8529
+ }),
8530
+ params = _useState[0];
8531
+ var _ProductController = ProductController(_extends({}, props, {
8532
+ params: params
8533
+ })),
8534
+ _ProductController$pr = _ProductController.products,
8535
+ products = _ProductController$pr === void 0 ? [] : _ProductController$pr;
7374
8536
  console.log("Products1 products");
7375
8537
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
7376
- className: "w-full py-12 px-4 xl:px-20 text-center",
7377
- style: {
7378
- backgroundColor: background
7379
- }
8538
+ className: SECTION_DEFAULT_CLASS + " text-center"
7380
8539
  }, /*#__PURE__*/React__default.createElement(SectionTitle, {
7381
8540
  data: data,
7382
8541
  shopConfigStyle: shopConfigStyle
7383
8542
  }), /*#__PURE__*/React__default.createElement("div", {
7384
8543
  className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-10 mt-12"
7385
- }, products === null || products === void 0 ? void 0 : products.map((product, index) => /*#__PURE__*/React__default.createElement(ProductItem2, {
7386
- key: index,
7387
- product: product === null || product === void 0 ? void 0 : product.productInfo
7388
- }))), /*#__PURE__*/React__default.createElement(Button, {
8544
+ }, products === null || products === void 0 ? void 0 : products.map(function (product, index) {
8545
+ return /*#__PURE__*/React__default.createElement(ProductItem2, {
8546
+ key: index,
8547
+ product: product === null || product === void 0 ? void 0 : product.productInfo
8548
+ });
8549
+ })), /*#__PURE__*/React__default.createElement(Button, {
7389
8550
  label: "Xem tất cả",
7390
8551
  shopConfigStyle: shopConfigStyle,
7391
8552
  className: "mt-12"
@@ -7394,29 +8555,21 @@ const Products1 = props => {
7394
8555
  }));
7395
8556
  };
7396
8557
 
7397
- const ItemProduct = props => {
7398
- var _shopConfigStyle$colo, _shopConfigStyle$colo2, _shopConfigStyle$colo3;
7399
- const {
7400
- product,
7401
- shopConfigStyle
7402
- } = props;
8558
+ var ItemProduct = function ItemProduct(props) {
8559
+ var product = props.product;
7403
8560
  return /*#__PURE__*/React__default.createElement("div", {
7404
- className: "pb-4 rounded-2xl w-full",
7405
- style: {
7406
- background: shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : (_shopConfigStyle$colo = shopConfigStyle.color) === null || _shopConfigStyle$colo === void 0 ? void 0 : _shopConfigStyle$colo.bgSecondary
7407
- }
8561
+ className: "pb-4 rounded-2xl w-full bg-bgSecondary"
7408
8562
  }, /*#__PURE__*/React__default.createElement("div", {
7409
8563
  className: "relative pt-2 flex justify-center h-32 sm:h-40 lg:h-52"
7410
8564
  }, /*#__PURE__*/React__default.createElement("a", {
7411
- href: `#`
8565
+ href: "#"
7412
8566
  }, /*#__PURE__*/React__default.createElement(ProductImage, {
7413
8567
  product: product,
7414
8568
  className: "aspect-w-1 aspect-h-1 max-h-32 sm:max-h-40 lg:max-h-52 object-cover"
7415
8569
  })), product && (product === null || product === void 0 ? void 0 : product.priceBeforeDiscount) && +(product === null || product === void 0 ? void 0 : product.priceBeforeDiscount) !== (product === null || product === void 0 ? void 0 : product.price) && /*#__PURE__*/React__default.createElement("label", {
7416
- className: "absolute bg-red-600 rounded-r-lg sm:px-2",
8570
+ className: "absolute bg-red-600 rounded-r-lg sm:px-2 text-textButton",
7417
8571
  style: {
7418
- top: "10%",
7419
- color: shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : (_shopConfigStyle$colo2 = shopConfigStyle.color) === null || _shopConfigStyle$colo2 === void 0 ? void 0 : _shopConfigStyle$colo2.textButton
8572
+ top: "10%"
7420
8573
  }
7421
8574
  }, ((product === null || product === void 0 ? void 0 : product.priceBeforeDiscount) - (product === null || product === void 0 ? void 0 : product.price)) / (product === null || product === void 0 ? void 0 : product.priceBeforeDiscount) * 100, "%")), /*#__PURE__*/React__default.createElement("div", {
7422
8575
  className: "px-4 h-[100px] mt-6"
@@ -7425,25 +8578,29 @@ const ItemProduct = props => {
7425
8578
  }, product === null || product === void 0 ? void 0 : product.productName), /*#__PURE__*/React__default.createElement("div", {
7426
8579
  className: "mt-3 md:flex md:justify-between flex-col"
7427
8580
  }, /*#__PURE__*/React__default.createElement(ProductPrice, {
7428
- product: product,
7429
- style: {
7430
- color: shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : (_shopConfigStyle$colo3 = shopConfigStyle.color) === null || _shopConfigStyle$colo3 === void 0 ? void 0 : _shopConfigStyle$colo3.primary
7431
- }
8581
+ product: product
7432
8582
  }))));
7433
8583
  };
7434
8584
 
7435
- const Carousel = props => {
7436
- const carouselRef = useRef(null);
7437
- const [isScrolledToLeft, setIsScrolledToLeft] = useState(false);
7438
- const [isScrolledToRight, setIsScrolledToRight] = useState(true);
7439
- const {
7440
- datas = [],
7441
- className = "",
7442
- style = {},
7443
- primaryColor = "",
7444
- renderItem = () => {}
7445
- } = props;
7446
- const handleClickPrevImg = () => {
8585
+ var Carousel = function Carousel(props) {
8586
+ var carouselRef = useRef(null);
8587
+ var _useState = useState(false),
8588
+ isScrolledToLeft = _useState[0],
8589
+ setIsScrolledToLeft = _useState[1];
8590
+ var _useState2 = useState(true),
8591
+ isScrolledToRight = _useState2[0],
8592
+ setIsScrolledToRight = _useState2[1];
8593
+ var _props$datas = props.datas,
8594
+ datas = _props$datas === void 0 ? [] : _props$datas,
8595
+ _props$className = props.className,
8596
+ className = _props$className === void 0 ? "" : _props$className,
8597
+ _props$style = props.style,
8598
+ style = _props$style === void 0 ? {} : _props$style,
8599
+ _props$primaryColor = props.primaryColor,
8600
+ primaryColor = _props$primaryColor === void 0 ? "" : _props$primaryColor,
8601
+ _props$renderItem = props.renderItem,
8602
+ renderItem = _props$renderItem === void 0 ? function () {} : _props$renderItem;
8603
+ var handleClickPrevImg = function handleClickPrevImg() {
7447
8604
  if (carouselRef.current) {
7448
8605
  setIsScrolledToLeft(true);
7449
8606
  setIsScrolledToRight(false);
@@ -7453,7 +8610,7 @@ const Carousel = props => {
7453
8610
  });
7454
8611
  }
7455
8612
  };
7456
- const handleClickNextImg = () => {
8613
+ var handleClickNextImg = function handleClickNextImg() {
7457
8614
  setIsScrolledToRight(true);
7458
8615
  setIsScrolledToLeft(false);
7459
8616
  if (carouselRef.current) {
@@ -7464,12 +8621,14 @@ const Carousel = props => {
7464
8621
  }
7465
8622
  };
7466
8623
  return /*#__PURE__*/React__default.createElement("div", {
7467
- className: `relative ${className} `,
8624
+ className: "relative " + className + " ",
7468
8625
  style: style
7469
8626
  }, /*#__PURE__*/React__default.createElement("div", {
7470
8627
  className: " w-full pe-2 h-full flex overflow-x-auto hide-scrollbar",
7471
8628
  ref: carouselRef
7472
- }, datas && datas.length > 0 && datas.map((item, index) => renderItem(item, index))), datas && datas.length > 0 && /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("button", {
8629
+ }, datas && datas.length > 0 && datas.map(function (item, index) {
8630
+ return renderItem(item, index);
8631
+ })), datas && datas.length > 0 && /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("button", {
7473
8632
  className: " hidden md:block bg-gray3 p-3 rounded-full absolute top-[45%] left-[-8px] lg:left-[-1%]",
7474
8633
  style: {
7475
8634
  backgroundColor: isScrolledToLeft ? primaryColor : "#BDBDBD"
@@ -7488,21 +8647,23 @@ const Carousel = props => {
7488
8647
  }))));
7489
8648
  };
7490
8649
 
7491
- const Products2 = props => {
7492
- const {
7493
- shopConfigStyle,
7494
- data
7495
- } = props;
7496
- const {
7497
- primary = "#000",
7498
- secondary = "#000",
7499
- textBody = "#000",
7500
- background = "#fff",
7501
- textButton = "#fff"
7502
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
7503
- const {
7504
- products = []
7505
- } = ProductController(props);
8650
+ var Products2 = function Products2(props) {
8651
+ var shopConfigStyle = props.shopConfigStyle,
8652
+ data = props.data;
8653
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
8654
+ _shopConfigStyle$colo2 = _shopConfigStyle$colo.primary,
8655
+ primary = _shopConfigStyle$colo2 === void 0 ? "#000" : _shopConfigStyle$colo2,
8656
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
8657
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3,
8658
+ _shopConfigStyle$colo4 = _shopConfigStyle$colo.textBody,
8659
+ textBody = _shopConfigStyle$colo4 === void 0 ? "#000" : _shopConfigStyle$colo4,
8660
+ _shopConfigStyle$colo5 = _shopConfigStyle$colo.background,
8661
+ background = _shopConfigStyle$colo5 === void 0 ? "#fff" : _shopConfigStyle$colo5,
8662
+ _shopConfigStyle$colo6 = _shopConfigStyle$colo.textButton,
8663
+ textButton = _shopConfigStyle$colo6 === void 0 ? "#fff" : _shopConfigStyle$colo6;
8664
+ var _ProductController = ProductController(props),
8665
+ _ProductController$pr = _ProductController.products,
8666
+ products = _ProductController$pr === void 0 ? [] : _ProductController$pr;
7506
8667
  console.log("Products2 products");
7507
8668
  return /*#__PURE__*/React__default.createElement("div", {
7508
8669
  className: "pt-10 px-4 xl:px-20",
@@ -7523,29 +8684,178 @@ const Products2 = props => {
7523
8684
  }, data === null || data === void 0 ? void 0 : data.sectionTitle), /*#__PURE__*/React__default.createElement(Carousel, {
7524
8685
  datas: products,
7525
8686
  primaryColor: primary,
7526
- renderItem: (item, index) => /*#__PURE__*/React__default.createElement("div", {
7527
- key: `carousel-${index}`,
7528
- className: " min-w-[40vw] object-cover sm:min-w-[25vw] lg:min-w-[22vw] xl:min-w-[20vw] pe-4 xl:pe-6"
7529
- }, /*#__PURE__*/React__default.createElement(ItemProduct, {
7530
- product: item.productInfo,
7531
- shopConfigStyle: shopConfigStyle
7532
- }))
8687
+ renderItem: function renderItem(item, index) {
8688
+ return /*#__PURE__*/React__default.createElement("div", {
8689
+ key: "carousel-" + index,
8690
+ className: " min-w-[40vw] object-cover sm:min-w-[25vw] lg:min-w-[22vw] xl:min-w-[20vw] pe-4 xl:pe-6"
8691
+ }, /*#__PURE__*/React__default.createElement(ItemProduct, {
8692
+ product: item.productInfo,
8693
+ shopConfigStyle: shopConfigStyle
8694
+ }));
8695
+ }
7533
8696
  })));
7534
8697
  };
7535
8698
 
7536
- const CarouselItem = props => {
7537
- const listRef = useRef(null);
7538
- const [isScrolledToLeft, setIsScrolledToLeft] = useState(false);
7539
- const [isScrolledToRight, setIsScrolledToRight] = useState(true);
7540
- const {
7541
- datas = [],
7542
- className = "",
7543
- style = {},
7544
- primaryColor = "",
7545
- textButtonColor = "",
7546
- renderItem = () => {}
7547
- } = props;
7548
- const handleClickPrevImg = () => {
8699
+ var Pagination = function Pagination(props) {
8700
+ var _props$size = props.size,
8701
+ size = _props$size === void 0 ? 24 : _props$size,
8702
+ _props$className = props.className,
8703
+ className = _props$className === void 0 ? "" : _props$className,
8704
+ _props$total_pages = props.total_pages,
8705
+ total_pages = _props$total_pages === void 0 ? 0 : _props$total_pages,
8706
+ _props$has_next = props.has_next,
8707
+ has_next = _props$has_next === void 0 ? true : _props$has_next,
8708
+ _props$has_previous = props.has_previous,
8709
+ has_previous = _props$has_previous === void 0 ? false : _props$has_previous,
8710
+ _props$current_page = props.current_page,
8711
+ current_page = _props$current_page === void 0 ? 0 : _props$current_page,
8712
+ _props$onPageChange = props.onPageChange,
8713
+ onPageChange = _props$onPageChange === void 0 ? function () {} : _props$onPageChange;
8714
+ var handlePageChange = function handlePageChange(page) {
8715
+ onPageChange(page);
8716
+ };
8717
+ return /*#__PURE__*/React__default.createElement("div", {
8718
+ className: "flex gap-4 items-center justify-self-center " + className
8719
+ }, /*#__PURE__*/React__default.createElement(IoChevronBackOutline, {
8720
+ className: has_previous ? "text-primary" : "text-gray3",
8721
+ size: size
8722
+ }), /*#__PURE__*/React__default.createElement("div", {
8723
+ className: "flex items-center space-x-1"
8724
+ }, Array(total_pages).fill().map(function (_, index) {
8725
+ return /*#__PURE__*/React__default.createElement("button", {
8726
+ key: index,
8727
+ onClick: function onClick() {
8728
+ return handlePageChange(index);
8729
+ },
8730
+ className: "px-4 py-1 rounded-md " + (index === current_page ? 'bg-primary text-textButton' : 'bg-transparent text-primary') + " hover:opacity-80"
8731
+ }, index + 1);
8732
+ })), /*#__PURE__*/React__default.createElement(IoChevronForwardOutline, {
8733
+ className: has_next ? "text-primary" : "text-gray3",
8734
+ size: size
8735
+ }));
8736
+ };
8737
+
8738
+ var Products3 = function Products3(props) {
8739
+ var _props$shopConfigStyl = props.shopConfigStyle,
8740
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
8741
+ _props$data = props.data,
8742
+ data = _props$data === void 0 ? {} : _props$data,
8743
+ _props$SectionTitle = props.SectionTitle,
8744
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
8745
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
8746
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
8747
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
8748
+ var _useState = useState({
8749
+ size: 6
8750
+ }),
8751
+ productParams = _useState[0],
8752
+ setProductParams = _useState[1];
8753
+ var _useState2 = useState(false),
8754
+ isAutoGetList = _useState2[0],
8755
+ setIsAutoGetList = _useState2[1];
8756
+ var _useState3 = useState(),
8757
+ categorySelected = _useState3[0],
8758
+ setCategorySelected = _useState3[1];
8759
+ var _ProductController = ProductController(_extends({}, props, {
8760
+ params: productParams,
8761
+ isAutoGetList: isAutoGetList
8762
+ })),
8763
+ _ProductController$pr = _ProductController.products,
8764
+ products = _ProductController$pr === void 0 ? [] : _ProductController$pr,
8765
+ loading = _ProductController.loading,
8766
+ page = _ProductController.page;
8767
+ var _CategoryController = CategoryController(_extends({}, props, {
8768
+ params: {
8769
+ type: "0"
8770
+ }
8771
+ })),
8772
+ categories = _CategoryController.categories;
8773
+ useEffect(function () {
8774
+ setCategorySelected(categories === null || categories === void 0 ? void 0 : categories[0]);
8775
+ }, [categories]);
8776
+ useEffect(function () {
8777
+ if (categorySelected) {
8778
+ setProductParams(_extends({}, productParams, {
8779
+ page: 0,
8780
+ categoryId: categorySelected === null || categorySelected === void 0 ? void 0 : categorySelected.categoryId
8781
+ }));
8782
+ setIsAutoGetList(true);
8783
+ }
8784
+ }, [categorySelected]);
8785
+ var onSelectCategory = function onSelectCategory(category) {
8786
+ setCategorySelected(category);
8787
+ };
8788
+ var onPageChange = function onPageChange(pageNum) {
8789
+ setProductParams(_extends({}, productParams, {
8790
+ page: pageNum
8791
+ }));
8792
+ };
8793
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
8794
+ className: "" + SECTION_DEFAULT_CLASS
8795
+ }, /*#__PURE__*/React__default.createElement(SectionTitle, {
8796
+ data: data,
8797
+ shopConfigStyle: shopConfigStyle
8798
+ }), /*#__PURE__*/React__default.createElement("div", {
8799
+ className: "grid grid-cols-1 md:grid-cols-4 gap-12"
8800
+ }, /*#__PURE__*/React__default.createElement("div", {
8801
+ className: "hidden md:block"
8802
+ }, /*#__PURE__*/React__default.createElement("div", {
8803
+ className: "text-xl"
8804
+ }, "Danh m\u1EE5c s\u1EA3n ph\u1EA9m"), categories === null || categories === void 0 ? void 0 : categories.map(function (category, index) {
8805
+ return /*#__PURE__*/React__default.createElement("div", {
8806
+ className: "flex gap-2 py-4 border-b border-stroke cursor-pointer hover:text-primary " + ((categorySelected === null || categorySelected === void 0 ? void 0 : categorySelected.categoryId) === (category === null || category === void 0 ? void 0 : category.categoryId) ? "text-primary" : "text-textSecondary"),
8807
+ key: index,
8808
+ onClick: function onClick() {
8809
+ return onSelectCategory(category);
8810
+ }
8811
+ }, /*#__PURE__*/React__default.createElement(IoIosHeartEmpty, {
8812
+ size: 24
8813
+ }), /*#__PURE__*/React__default.createElement("div", null, category === null || category === void 0 ? void 0 : category.cateName));
8814
+ })), /*#__PURE__*/React__default.createElement("div", {
8815
+ className: "md:hidden"
8816
+ }), /*#__PURE__*/React__default.createElement("div", {
8817
+ className: "col-span-3 text-center"
8818
+ }, loading ? /*#__PURE__*/React__default.createElement("div", {
8819
+ className: "flex w-full justify-center p-12"
8820
+ }, /*#__PURE__*/React__default.createElement(Loading, {
8821
+ size: 32
8822
+ })) : /*#__PURE__*/React__default.createElement("div", {
8823
+ className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-12 mt-12"
8824
+ }, products === null || products === void 0 ? void 0 : products.map(function (product, index) {
8825
+ return /*#__PURE__*/React__default.createElement(ProductItem2, {
8826
+ key: index,
8827
+ product: product === null || product === void 0 ? void 0 : product.productInfo
8828
+ });
8829
+ })), /*#__PURE__*/React__default.createElement(Pagination, _extends({
8830
+ className: "mt-12"
8831
+ }, page, {
8832
+ onPageChange: onPageChange
8833
+ }))))), /*#__PURE__*/React__default.createElement(Dash, {
8834
+ color: secondary
8835
+ }));
8836
+ };
8837
+
8838
+ var CarouselItem = function CarouselItem(props) {
8839
+ var listRef = useRef(null);
8840
+ var _useState = useState(false),
8841
+ isScrolledToLeft = _useState[0],
8842
+ setIsScrolledToLeft = _useState[1];
8843
+ var _useState2 = useState(true),
8844
+ isScrolledToRight = _useState2[0],
8845
+ setIsScrolledToRight = _useState2[1];
8846
+ var _props$datas = props.datas,
8847
+ datas = _props$datas === void 0 ? [] : _props$datas,
8848
+ _props$className = props.className,
8849
+ className = _props$className === void 0 ? "" : _props$className,
8850
+ _props$style = props.style,
8851
+ style = _props$style === void 0 ? {} : _props$style,
8852
+ _props$primaryColor = props.primaryColor,
8853
+ primaryColor = _props$primaryColor === void 0 ? "" : _props$primaryColor,
8854
+ _props$textButtonColo = props.textButtonColor,
8855
+ textButtonColor = _props$textButtonColo === void 0 ? "" : _props$textButtonColo,
8856
+ _props$renderItem = props.renderItem,
8857
+ renderItem = _props$renderItem === void 0 ? function () {} : _props$renderItem;
8858
+ var handleClickPrevImg = function handleClickPrevImg() {
7549
8859
  if (listRef.current) {
7550
8860
  setIsScrolledToLeft(true);
7551
8861
  setIsScrolledToRight(false);
@@ -7555,7 +8865,7 @@ const CarouselItem = props => {
7555
8865
  });
7556
8866
  }
7557
8867
  };
7558
- const handleClickNextImg = () => {
8868
+ var handleClickNextImg = function handleClickNextImg() {
7559
8869
  setIsScrolledToRight(true);
7560
8870
  setIsScrolledToLeft(false);
7561
8871
  if (listRef.current) {
@@ -7567,14 +8877,16 @@ const CarouselItem = props => {
7567
8877
  };
7568
8878
  console.log("check propsss::::::::", datas);
7569
8879
  return /*#__PURE__*/React__default.createElement("div", {
7570
- className: `grid grid-cols-12 h-12 ${className}`,
8880
+ className: "grid grid-cols-12 h-12 " + className,
7571
8881
  style: style
7572
8882
  }, /*#__PURE__*/React__default.createElement("div", {
7573
8883
  className: "col-span-12 lg:col-span-10 md:col-span-9 overflow-hidden "
7574
8884
  }, /*#__PURE__*/React__default.createElement("div", {
7575
8885
  className: "flex overflow-x-auto gap-2 hide-scrollbar items-center",
7576
8886
  ref: listRef
7577
- }, datas && datas.length > 0 && datas.map((item, index) => renderItem(item, index)))), datas && datas.length > 0 && /*#__PURE__*/React__default.createElement("div", {
8887
+ }, datas && datas.length > 0 && datas.map(function (item, index) {
8888
+ return renderItem(item, index);
8889
+ }))), datas && datas.length > 0 && /*#__PURE__*/React__default.createElement("div", {
7578
8890
  className: "hidden my-auto col-span-5 md:col-span-3 lg:col-span-2 gap-4 md:flex justify-end "
7579
8891
  }, /*#__PURE__*/React__default.createElement("button", {
7580
8892
  className: " px-4 py-3 rounded-full",
@@ -7601,38 +8913,46 @@ const CarouselItem = props => {
7601
8913
  }))));
7602
8914
  };
7603
8915
 
7604
- const ListProduct = props => {
7605
- const {
7606
- datas = [],
7607
- style = {},
7608
- className = {},
7609
- renderItem = () => {}
7610
- } = props;
8916
+ var ListProduct = function ListProduct(props) {
8917
+ var _props$datas = props.datas,
8918
+ datas = _props$datas === void 0 ? [] : _props$datas,
8919
+ _props$style = props.style,
8920
+ style = _props$style === void 0 ? {} : _props$style,
8921
+ _props$className = props.className,
8922
+ className = _props$className === void 0 ? {} : _props$className,
8923
+ _props$renderItem = props.renderItem,
8924
+ renderItem = _props$renderItem === void 0 ? function () {} : _props$renderItem;
7611
8925
  return /*#__PURE__*/React__default.createElement("div", {
7612
- className: `grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4 2xl:grid-cols-5 mt-6 ${className}`,
8926
+ className: "grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4 2xl:grid-cols-5 mt-6 " + className,
7613
8927
  style: style
7614
- }, datas && datas.length > 0 && datas.map((item, index) => renderItem(item, index)));
7615
- };
7616
-
7617
- const Products10 = props => {
7618
- const [selectCategory, setSelectCategory] = useState("");
7619
- const {
7620
- shopConfigStyle,
7621
- data
7622
- } = props;
7623
- const {
7624
- primary = "#000",
7625
- textBody = "#000",
7626
- textButton = "#fff",
7627
- background = "#fff",
7628
- bgSecondary = "#fff"
7629
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
7630
- const {
7631
- categories = []
7632
- } = CategoryController(props);
7633
- const {
7634
- products = []
7635
- } = ProductController(props);
8928
+ }, datas && datas.length > 0 && datas.map(function (item, index) {
8929
+ return renderItem(item, index);
8930
+ }));
8931
+ };
8932
+
8933
+ var Products10 = function Products10(props) {
8934
+ var _useState = useState(""),
8935
+ selectCategory = _useState[0],
8936
+ setSelectCategory = _useState[1];
8937
+ var shopConfigStyle = props.shopConfigStyle,
8938
+ data = props.data;
8939
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
8940
+ _shopConfigStyle$colo2 = _shopConfigStyle$colo.primary,
8941
+ primary = _shopConfigStyle$colo2 === void 0 ? "#000" : _shopConfigStyle$colo2,
8942
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.textBody,
8943
+ textBody = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3,
8944
+ _shopConfigStyle$colo4 = _shopConfigStyle$colo.textButton,
8945
+ textButton = _shopConfigStyle$colo4 === void 0 ? "#fff" : _shopConfigStyle$colo4,
8946
+ _shopConfigStyle$colo5 = _shopConfigStyle$colo.background,
8947
+ background = _shopConfigStyle$colo5 === void 0 ? "#fff" : _shopConfigStyle$colo5,
8948
+ _shopConfigStyle$colo6 = _shopConfigStyle$colo.bgSecondary,
8949
+ bgSecondary = _shopConfigStyle$colo6 === void 0 ? "#fff" : _shopConfigStyle$colo6;
8950
+ var _CategoryController = CategoryController(props),
8951
+ _CategoryController$c = _CategoryController.categories,
8952
+ categories = _CategoryController$c === void 0 ? [] : _CategoryController$c;
8953
+ var _ProductController = ProductController(props),
8954
+ _ProductController$pr = _ProductController.products,
8955
+ products = _ProductController$pr === void 0 ? [] : _ProductController$pr;
7636
8956
  console.log("Products10 products");
7637
8957
  return /*#__PURE__*/React__default.createElement("div", {
7638
8958
  className: "w-full pt-10 px-4 xl:px-20",
@@ -7646,40 +8966,116 @@ const Products10 = props => {
7646
8966
  datas: categories,
7647
8967
  primaryColor: primary,
7648
8968
  textButtonColor: textButton,
7649
- renderItem: (item, index) => /*#__PURE__*/React__default.createElement("div", {
7650
- key: `${item.categoryId}-${index}`,
7651
- className: `border-2 items whitespace-nowrap p-2 rounded-lg cursor-pointer `,
7652
- style: {
7653
- borderColor: primary,
7654
- color: selectCategory === item.categoryId ? textButton : primary,
7655
- background: selectCategory === item.categoryId ? primary : bgSecondary
7656
- },
7657
- onClick: () => {
7658
- setSelectCategory(item.categoryId);
7659
- }
7660
- }, item.cateName)
8969
+ renderItem: function renderItem(item, index) {
8970
+ return /*#__PURE__*/React__default.createElement("div", {
8971
+ key: item.categoryId + "-" + index,
8972
+ className: "border-2 items whitespace-nowrap p-2 rounded-lg cursor-pointer ",
8973
+ style: {
8974
+ borderColor: primary,
8975
+ color: selectCategory === item.categoryId ? textButton : primary,
8976
+ background: selectCategory === item.categoryId ? primary : bgSecondary
8977
+ },
8978
+ onClick: function onClick() {
8979
+ setSelectCategory(item.categoryId);
8980
+ }
8981
+ }, item.cateName);
8982
+ }
7661
8983
  }), /*#__PURE__*/React__default.createElement(ListProduct, {
7662
8984
  datas: products,
7663
- renderItem: (item, index) => /*#__PURE__*/React__default.createElement("div", {
7664
- key: `productfsd-${index}`
7665
- }, /*#__PURE__*/React__default.createElement(ItemProduct, {
7666
- product: item.productInfo,
7667
- shopConfigStyle: shopConfigStyle
7668
- }))
8985
+ renderItem: function renderItem(item, index) {
8986
+ return /*#__PURE__*/React__default.createElement("div", {
8987
+ key: "productfsd-" + index
8988
+ }, /*#__PURE__*/React__default.createElement(ItemProduct, {
8989
+ product: item.productInfo,
8990
+ shopConfigStyle: shopConfigStyle
8991
+ }));
8992
+ }
7669
8993
  }));
7670
8994
  };
7671
8995
 
7672
- const ProductsTop1 = props => {
7673
- const {
7674
- data,
7675
- shopConfigStyle
7676
- } = props;
7677
- const {
7678
- background = "#fff"
7679
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
7680
- const {
7681
- products = []
7682
- } = ProductController(props);
8996
+ var ProductSale2 = function ProductSale2(props) {
8997
+ var _props$shopConfigStyl = props.shopConfigStyle,
8998
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
8999
+ _props$data = props.data,
9000
+ data = _props$data === void 0 ? {} : _props$data,
9001
+ _props$SectionTitle = props.SectionTitle,
9002
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
9003
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9004
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
9005
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
9006
+ var _useState = useState({
9007
+ size: 4
9008
+ });
9009
+ var products = [];
9010
+ console.log("Products1 products");
9011
+ return products !== null && products !== void 0 && products.length ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
9012
+ className: SECTION_DEFAULT_CLASS + " text-center"
9013
+ }, /*#__PURE__*/React__default.createElement(SectionTitle, {
9014
+ data: data,
9015
+ shopConfigStyle: shopConfigStyle
9016
+ }), /*#__PURE__*/React__default.createElement("div", {
9017
+ className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-10 mt-12"
9018
+ }, products === null || products === void 0 ? void 0 : products.map(function (product, index) {
9019
+ return /*#__PURE__*/React__default.createElement(ProductItem2, {
9020
+ key: index,
9021
+ product: product === null || product === void 0 ? void 0 : product.productInfo
9022
+ });
9023
+ })), /*#__PURE__*/React__default.createElement(Button, {
9024
+ label: "Xem tất cả",
9025
+ shopConfigStyle: shopConfigStyle,
9026
+ className: "mt-12"
9027
+ })), /*#__PURE__*/React__default.createElement(Dash, {
9028
+ color: secondary
9029
+ })) : null;
9030
+ };
9031
+
9032
+ var ProductHot3 = function ProductHot3(props) {
9033
+ var _props$shopConfigStyl = props.shopConfigStyle,
9034
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
9035
+ _props$data = props.data,
9036
+ data = _props$data === void 0 ? {} : _props$data,
9037
+ _props$SectionTitle = props.SectionTitle,
9038
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
9039
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9040
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
9041
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
9042
+ var _useState = useState({
9043
+ size: 4,
9044
+ isHighlight: true
9045
+ }),
9046
+ params = _useState[0];
9047
+ var _ProductController = ProductController(_extends({}, props, {
9048
+ params: params
9049
+ })),
9050
+ _ProductController$pr = _ProductController.products,
9051
+ products = _ProductController$pr === void 0 ? [] : _ProductController$pr;
9052
+ console.log("Products1 products");
9053
+ return products !== null && products !== void 0 && products.length ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
9054
+ className: SECTION_DEFAULT_CLASS + " text-center"
9055
+ }, /*#__PURE__*/React__default.createElement(SectionTitle, {
9056
+ data: data,
9057
+ shopConfigStyle: shopConfigStyle
9058
+ }), /*#__PURE__*/React__default.createElement("div", {
9059
+ className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-10 mt-12"
9060
+ }, products === null || products === void 0 ? void 0 : products.map(function (product, index) {
9061
+ return /*#__PURE__*/React__default.createElement(ProductItem2, {
9062
+ key: index,
9063
+ product: product === null || product === void 0 ? void 0 : product.productInfo
9064
+ });
9065
+ }))), /*#__PURE__*/React__default.createElement(Dash, {
9066
+ color: secondary
9067
+ })) : null;
9068
+ };
9069
+
9070
+ var ProductsTop1 = function ProductsTop1(props) {
9071
+ var data = props.data,
9072
+ shopConfigStyle = props.shopConfigStyle;
9073
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9074
+ _shopConfigStyle$colo2 = _shopConfigStyle$colo.background,
9075
+ background = _shopConfigStyle$colo2 === void 0 ? "#fff" : _shopConfigStyle$colo2;
9076
+ var _ProductController = ProductController(props),
9077
+ _ProductController$pr = _ProductController.products,
9078
+ products = _ProductController$pr === void 0 ? [] : _ProductController$pr;
7683
9079
  console.log("ProductsTop1 products");
7684
9080
  return /*#__PURE__*/React__default.createElement("div", {
7685
9081
  className: "w-full pt-10 px-4 xl:px-20",
@@ -7690,343 +9086,199 @@ const ProductsTop1 = props => {
7690
9086
  className: "text-2xl md:text-3xl lg:text-4xl font-semibold mb-6"
7691
9087
  }, data === null || data === void 0 ? void 0 : data.sectionTitle), /*#__PURE__*/React__default.createElement(ListProduct, {
7692
9088
  datas: products,
7693
- renderItem: (item, index) => /*#__PURE__*/React__default.createElement("div", {
7694
- key: `productfsd-${index}`
7695
- }, /*#__PURE__*/React__default.createElement(ItemProduct, {
7696
- product: item.productInfo,
7697
- shopConfigStyle: shopConfigStyle
7698
- }))
7699
- }));
7700
- };
7701
-
7702
- const getEmployeeListApi = shopId => {
7703
- return api({
7704
- method: "post",
7705
- url: `/chain-employment-profile/filter-employ-by-customer`,
7706
- headers: {
7707
- shopId
7708
- }
7709
- });
7710
- };
7711
-
7712
- const EmployeeController = props => {
7713
- const {
7714
- isAutoGetList = true,
7715
- shopConfig
7716
- } = props;
7717
- const [listEmployment, setListEmployment] = useState([]);
7718
- useEffect(() => {
7719
- if (isAutoGetList) {
7720
- getListEmployee();
7721
- }
7722
- }, [isAutoGetList]);
7723
- const getListEmployee = async () => {
7724
- try {
7725
- var _res$data, _res$data$status;
7726
- const res = await getEmployeeListApi(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId);
7727
- if ((res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$status = _res$data.status) === null || _res$data$status === void 0 ? void 0 : _res$data$status.code) == 200) {
7728
- var _res$data2;
7729
- setListEmployment((res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data) || []);
7730
- }
7731
- return res;
7732
- } catch (e) {
7733
- console.log(e);
7734
- }
7735
- };
7736
- return {
7737
- listEmployment,
7738
- getListEmployee
7739
- };
7740
- };
7741
-
7742
- const Input = forwardRef((props, ref) => {
7743
- const {
7744
- label = "",
7745
- placeholder = "",
7746
- className = "",
7747
- name = "",
7748
- style = {},
7749
- onChange = () => {},
7750
- defaultValue = "",
7751
- type = "text",
7752
- rules = []
7753
- } = props;
7754
- const [value, setValue] = useState(defaultValue);
7755
- const [error, setError] = useState("");
7756
- useImperativeHandle(ref, () => ({
7757
- validateData() {
7758
- return validateData();
7759
- },
7760
- setValue(text) {
7761
- return setValue(text);
7762
- },
7763
- getValue() {
7764
- return value();
7765
- },
7766
- setError(err) {
7767
- return setError(err);
7768
- }
7769
- }));
7770
- const validateData = () => {
7771
- let count = 0;
7772
- rules.forEach(e => {
7773
- var _e$pattern;
7774
- if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && value === '') {
7775
- setError(e === null || e === void 0 ? void 0 : e.message);
7776
- count++;
7777
- return false;
7778
- } else if ((e === null || e === void 0 ? void 0 : e.type) === 'pattern' && !(e !== null && e !== void 0 && (_e$pattern = e.pattern) !== null && _e$pattern !== void 0 && _e$pattern.test(value))) {
7779
- setError(e === null || e === void 0 ? void 0 : e.message);
7780
- count++;
7781
- return false;
7782
- }
7783
- });
7784
- if (count) {
7785
- return false;
7786
- } else {
7787
- setError('');
7788
- return true;
7789
- }
7790
- };
7791
- const handleOnChange = event => {
7792
- const {
7793
- value
7794
- } = event.target;
7795
- setValue(value);
7796
- onChange === null || onChange === void 0 ? void 0 : onChange(value);
7797
- };
7798
- const _className = `h-10 py-1 px-2 border border-stroke rounded ${className}`;
7799
- const required = !!(rules !== null && rules !== void 0 && rules.find(e => (e === null || e === void 0 ? void 0 : e.type) === "required"));
7800
- const labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
7801
- className: "text-danger"
7802
- }, " *") : null;
7803
- return /*#__PURE__*/React__default.createElement("div", null, label ? /*#__PURE__*/React__default.createElement("div", {
7804
- className: "mb-1"
7805
- }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("input", {
7806
- type: type,
7807
- name: name,
7808
- value: value,
7809
- placeholder: placeholder,
7810
- onChange: handleOnChange,
7811
- required: required,
7812
- className: _className
7813
- }), error ? /*#__PURE__*/React__default.createElement("div", null, error) : null);
7814
- });
7815
-
7816
- const Select = forwardRef((props, ref) => {
7817
- const {
7818
- label = "",
7819
- placeholder = "",
7820
- className = "",
7821
- name = "",
7822
- style = {},
7823
- onChange = () => {},
7824
- defaultValue = null,
7825
- type = "text",
7826
- rules = [],
7827
- options = [],
7828
- required = false
7829
- } = props;
7830
- const [value, setValue] = useState(defaultValue);
7831
- const [error, setError] = useState("");
7832
- useImperativeHandle(ref, () => ({
7833
- validateData() {
7834
- return validateData();
7835
- },
7836
- setValue(text) {
7837
- return setValue(text);
7838
- },
7839
- getValue() {
7840
- return value();
7841
- },
7842
- setError(err) {
7843
- return setError(err);
9089
+ renderItem: function renderItem(item, index) {
9090
+ return /*#__PURE__*/React__default.createElement("div", {
9091
+ key: "productfsd-" + index
9092
+ }, /*#__PURE__*/React__default.createElement(ItemProduct, {
9093
+ product: item.productInfo,
9094
+ shopConfigStyle: shopConfigStyle
9095
+ }));
7844
9096
  }
7845
9097
  }));
7846
- const validateData = () => {
7847
- let count = 0;
7848
- rules.forEach(e => {
7849
- var _e$pattern;
7850
- if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && value === '') {
7851
- setError(e === null || e === void 0 ? void 0 : e.message);
7852
- count++;
7853
- return false;
7854
- } else if ((e === null || e === void 0 ? void 0 : e.type) === 'pattern' && !(e !== null && e !== void 0 && (_e$pattern = e.pattern) !== null && _e$pattern !== void 0 && _e$pattern.test(value))) {
7855
- setError(e === null || e === void 0 ? void 0 : e.message);
7856
- count++;
7857
- return false;
9098
+ };
9099
+
9100
+ var CartController = function CartController(props) {
9101
+ var addToCart = props.addToCart,
9102
+ dispatch = props.dispatch;
9103
+ useEffect(function () {}, []);
9104
+ var addProductToCart = function addProductToCart(product, variant, quantity) {
9105
+ try {
9106
+ try {
9107
+ dispatch(addToCart({
9108
+ product: product,
9109
+ variant: variant,
9110
+ quantity: quantity
9111
+ }));
9112
+ } catch (e) {
9113
+ console.log(e);
7858
9114
  }
7859
- });
7860
- if (count) {
7861
- return false;
7862
- } else {
7863
- setError('');
7864
- return true;
9115
+ return Promise.resolve();
9116
+ } catch (e) {
9117
+ return Promise.reject(e);
7865
9118
  }
7866
9119
  };
7867
- const handleOnChange = event => {
7868
- const {
7869
- value
7870
- } = event.target;
7871
- setValue(value);
7872
- onChange === null || onChange === void 0 ? void 0 : onChange(value);
9120
+ return {
9121
+ addProductToCart: addProductToCart
7873
9122
  };
7874
- const _className = `h-10 py-1 px-2 border border-stroke rounded ${className}`;
7875
- const labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
7876
- className: "text-danger"
7877
- }, " *") : null;
7878
- return /*#__PURE__*/React__default.createElement("div", null, label ? /*#__PURE__*/React__default.createElement("div", {
7879
- className: "mb-1"
7880
- }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("select", {
7881
- name: name,
7882
- value: value,
7883
- onChange: handleOnChange,
7884
- required: required,
7885
- className: _className
7886
- }, /*#__PURE__*/React__default.createElement("option", {
7887
- value: "",
7888
- disabled: true,
7889
- selected: true,
7890
- hidden: true
7891
- }, placeholder), options === null || options === void 0 ? void 0 : options.map((option, index) => /*#__PURE__*/React__default.createElement("option", {
7892
- value: option.value,
7893
- key: index
7894
- }, option === null || option === void 0 ? void 0 : option.label))), error ? /*#__PURE__*/React__default.createElement("div", null, error) : null);
7895
- });
7896
-
7897
- const DateTimePicker = props => {
7898
- const {
7899
- label = "",
7900
- placeholder = "",
7901
- className = "",
7902
- name = "",
7903
- style = {},
7904
- onChange = () => {},
7905
- defaultValue = new Date(),
7906
- required = false
7907
- } = props;
7908
- const [value, setValue] = useState(defaultValue);
7909
- const [error, setError] = useState("");
7910
- const _className = `h-10 flex items-center py-1 px-2 border border-stroke rounded bg-white cursor-pointer ${className}`;
7911
- const labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
7912
- className: "text-danger"
7913
- }, " *") : null;
7914
- const CustomInput = forwardRef(({
7915
- value,
7916
- onClick,
7917
- className
7918
- }, ref) => /*#__PURE__*/React__default.createElement("div", {
7919
- className: className,
7920
- onClick: onClick,
7921
- ref: ref
7922
- }, value));
7923
- return /*#__PURE__*/React__default.createElement("div", {
7924
- className: "w-full"
7925
- }, label ? /*#__PURE__*/React__default.createElement("div", {
7926
- className: "mb-1"
7927
- }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement(DatePicker, {
7928
- selected: value,
7929
- onChange: date => setValue(date),
7930
- customInput: /*#__PURE__*/React__default.createElement(CustomInput, {
7931
- className: _className
7932
- }),
7933
- wrapperClassName: "w-full"
7934
- }), error ? /*#__PURE__*/React__default.createElement("div", null, error) : null);
7935
9123
  };
7936
9124
 
7937
- const BookingForm = props => {
7938
- const {
7939
- shopConfig = {},
7940
- shopConfigStyle = {}
7941
- } = props;
7942
- const {
7943
- primary = "#000",
7944
- secondary = "#000",
7945
- textBody = "#000",
7946
- background = "#fff"
7947
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
7948
- const [isAutoGetListProduct, setIsAutoGetListProduct] = useState(false);
7949
- const [productsParams, setProductsParams] = useState({
7950
- types: "1,10"
7951
- });
7952
- const [isAutoGetListEmployee, setIsAutoGetListEmployee] = useState(false);
7953
- const [startDate, setStartDate] = useState(new Date());
7954
- const {
7955
- listEmployment = []
7956
- } = EmployeeController({
7957
- ...props,
7958
- isAutoGetList: isAutoGetListEmployee
7959
- });
7960
- const {
7961
- products
7962
- } = ProductController({
7963
- ...props,
7964
- isAutoGetList: isAutoGetListProduct,
7965
- params: productsParams
7966
- });
7967
- console.log("BookingForm products");
7968
- return /*#__PURE__*/React__default.createElement("div", {
7969
- className: "grid gap-4 rounded-lg p-6",
7970
- style: {
7971
- backgroundColor: secondary
9125
+ var ProductDetail10 = function ProductDetail10(props) {
9126
+ var shopConfigStyle = props.shopConfigStyle;
9127
+ var _ProductDetailControl = ProductDetailController(props),
9128
+ product = _ProductDetailControl.product;
9129
+ var _useState = useState(),
9130
+ variant = _useState[0],
9131
+ setVariant = _useState[1];
9132
+ var _useState2 = useState([]),
9133
+ options = _useState2[0],
9134
+ setOptions = _useState2[1];
9135
+ var _CartController = CartController(props),
9136
+ addProductToCart = _CartController.addProductToCart;
9137
+ var refInputQuantity = useRef();
9138
+ useEffect(function () {
9139
+ if (product) {
9140
+ initVariant();
9141
+ }
9142
+ }, [product]);
9143
+ var initVariant = function initVariant() {
9144
+ var _product$variants;
9145
+ var variant = product === null || product === void 0 ? void 0 : (_product$variants = product.variants) === null || _product$variants === void 0 ? void 0 : _product$variants[0];
9146
+ var indexOptions = variant.index.split(",");
9147
+ setVariant(variant);
9148
+ var options = (product === null || product === void 0 ? void 0 : product.optionValues) || [];
9149
+ indexOptions.map(function (value, index) {
9150
+ return options[index].valueIndex = value;
9151
+ });
9152
+ setOptions(options);
9153
+ };
9154
+ var selectOption = function selectOption(optionIndex, valueIndex) {
9155
+ console.log("selectOption optionIndex valueIndex", optionIndex, valueIndex);
9156
+ var newOptions = [].concat(options);
9157
+ newOptions[optionIndex].valueIndex = valueIndex;
9158
+ setOptions(newOptions);
9159
+ console.log("newOptions", newOptions);
9160
+ var variant = getVariantFromOption(newOptions);
9161
+ console.log("getVariantFromOption variant", variant);
9162
+ setVariant(variant);
9163
+ };
9164
+ var getVariantFromOption = function getVariantFromOption(_options) {
9165
+ console.log("getVariantFromOption options", _options);
9166
+ var listOptionIndexSelected = _options.map(function (e) {
9167
+ return e.valueIndex;
9168
+ }).filter(function (e) {
9169
+ return e !== undefined;
9170
+ });
9171
+ var variantIndex = listOptionIndexSelected.join(",");
9172
+ return ((product === null || product === void 0 ? void 0 : product.variants) || []).find(function (e) {
9173
+ return e.index === variantIndex;
9174
+ });
9175
+ };
9176
+ var validateData = function validateData() {
9177
+ var _refInputQuantity$cur;
9178
+ return (refInputQuantity === null || refInputQuantity === void 0 ? void 0 : (_refInputQuantity$cur = refInputQuantity.current) === null || _refInputQuantity$cur === void 0 ? void 0 : _refInputQuantity$cur.validateData()) && variant;
9179
+ };
9180
+ var addToCart = function addToCart() {
9181
+ try {
9182
+ var _temp = function () {
9183
+ if (validateData()) {
9184
+ var _refInputQuantity$cur2;
9185
+ var quantity = refInputQuantity === null || refInputQuantity === void 0 ? void 0 : (_refInputQuantity$cur2 = refInputQuantity.current) === null || _refInputQuantity$cur2 === void 0 ? void 0 : _refInputQuantity$cur2.getValue();
9186
+ return Promise.resolve(addProductToCart(product, variant, quantity)).then(function () {});
9187
+ }
9188
+ }();
9189
+ return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
9190
+ } catch (e) {
9191
+ return Promise.reject(e);
7972
9192
  }
9193
+ };
9194
+ var buyNow = function buyNow() {};
9195
+ return /*#__PURE__*/React__default.createElement("div", {
9196
+ className: SECTION_DEFAULT_CLASS + " mb-0"
7973
9197
  }, /*#__PURE__*/React__default.createElement("div", {
7974
- className: "grid grid-cols-1 md:grid-cols-2 gap-4"
7975
- }, /*#__PURE__*/React__default.createElement(Input, {
7976
- label: "Họ tên",
7977
- placeholder: "Nhập họ tên",
7978
- rules: [{
7979
- type: "required",
7980
- message: "Bắt buộc nhập họ tên"
7981
- }],
7982
- className: "w-full rounded-lg"
9198
+ className: "p-6 rounded-2xl grid grid-cols-1 md:grid-cols-3 gap-6 bg-bgSecondary"
9199
+ }, /*#__PURE__*/React__default.createElement(ProductImage, {
9200
+ product: product,
9201
+ className: "w-full aspect-square rounded-2xl"
9202
+ }), /*#__PURE__*/React__default.createElement("div", {
9203
+ className: "col-span-2"
9204
+ }, /*#__PURE__*/React__default.createElement("p", {
9205
+ className: "font-semibold text-2xl"
9206
+ }, product === null || product === void 0 ? void 0 : product.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
9207
+ product: product,
9208
+ variant: variant,
9209
+ className: "mt-6"
9210
+ }), options.map(function (option, index) {
9211
+ return /*#__PURE__*/React__default.createElement("div", {
9212
+ className: "flex gap-2 mt-6",
9213
+ key: index
9214
+ }, /*#__PURE__*/React__default.createElement("div", {
9215
+ className: "min-w-24"
9216
+ }, option === null || option === void 0 ? void 0 : option.name, ":"), /*#__PURE__*/React__default.createElement("div", {
9217
+ className: "flex gap-2"
9218
+ }, ((option === null || option === void 0 ? void 0 : option.value) || []).map(function (v, i) {
9219
+ return /*#__PURE__*/React__default.createElement("button", {
9220
+ key: i,
9221
+ onClick: function onClick() {
9222
+ return selectOption(index, i);
9223
+ },
9224
+ className: "rounded py-1 px-2 " + (i == option.valueIndex ? "bg-primary text-textButton" : "border bg-gray6")
9225
+ }, v);
9226
+ })));
7983
9227
  }), /*#__PURE__*/React__default.createElement(Input, {
7984
- label: "Họ tên",
7985
- placeholder: "Nhập họ tên",
9228
+ label: "Số lượng",
9229
+ wrapClassName: "flex items-center gap-6 mt-6",
7986
9230
  rules: [{
7987
9231
  type: "required",
7988
- message: "Bắt buộc nhập họ tên"
7989
- }],
7990
- className: "w-full rounded-lg"
7991
- })), /*#__PURE__*/React__default.createElement("div", {
7992
- className: "grid grid-cols-1 md:grid-cols-2 gap-4"
7993
- }, /*#__PURE__*/React__default.createElement(Select, {
7994
- label: "Dịch vụ",
7995
- options: [{
7996
- label: "123",
7997
- value: "456"
9232
+ message: "Bắt buộc nhập số lượng"
7998
9233
  }, {
7999
- label: "1235",
8000
- value: "4567"
9234
+ type: "pattern",
9235
+ pattern: numberPattern,
9236
+ message: "Số lượng không đúng"
8001
9237
  }],
8002
- className: "w-full rounded-lg",
8003
- placeholder: "Chọn dịch vụ"
8004
- }), /*#__PURE__*/React__default.createElement(DateTimePicker, {
8005
- label: "Thời gian",
8006
- className: "w-full rounded-lg",
8007
- placeholder: "Chọn thời gian"
8008
- })), /*#__PURE__*/React__default.createElement("div", {
8009
- className: "text-center"
9238
+ defaultValue: 1,
9239
+ isQuantity: true,
9240
+ min: 1,
9241
+ ref: refInputQuantity
9242
+ }), /*#__PURE__*/React__default.createElement("div", {
9243
+ className: "flex gap-4 mt-6"
8010
9244
  }, /*#__PURE__*/React__default.createElement(Button, {
8011
- label: "Đặt lịch ngay",
8012
- shopConfigStyle: shopConfigStyle
8013
- })));
9245
+ label: "THÊM VÀO GIỎ",
9246
+ shopConfigStyle: shopConfigStyle,
9247
+ type: "outline",
9248
+ onClick: function onClick() {
9249
+ return addToCart();
9250
+ }
9251
+ }), /*#__PURE__*/React__default.createElement(Button, {
9252
+ label: "MUA NGAY",
9253
+ shopConfigStyle: shopConfigStyle,
9254
+ onClick: function onClick() {
9255
+ return buyNow();
9256
+ }
9257
+ })), /*#__PURE__*/React__default.createElement("p", {
9258
+ className: "text-lg mt-12 pt-6 border-t border-stroke"
9259
+ }, "M\xF4 t\u1EA3 s\u1EA3n ph\u1EA9m"), product !== null && product !== void 0 && product.description ? /*#__PURE__*/React__default.createElement("div", {
9260
+ className: "mt-6",
9261
+ dangerouslySetInnerHTML: {
9262
+ __html: product === null || product === void 0 ? void 0 : product.description
9263
+ }
9264
+ }) : /*#__PURE__*/React__default.createElement("div", {
9265
+ className: "text-gray3 mt-2"
9266
+ }, "Kh\xF4ng c\xF3 th\xF4ng tin"))));
8014
9267
  };
8015
9268
 
8016
- const Booking1 = props => {
9269
+ var Booking1 = function Booking1(props) {
8017
9270
  var _data$data, _data$data$, _data$data2, _data$data2$;
8018
- const {
8019
- shopConfigStyle = {},
8020
- shopConfig = {},
8021
- data = {},
8022
- SectionTitle = null
8023
- } = props;
8024
- const {
8025
- primary = "#000",
8026
- secondary = "#000",
8027
- textBody = "#000",
8028
- background = "#fff"
8029
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
9271
+ var _props$shopConfigStyl = props.shopConfigStyle,
9272
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
9273
+ _props$shopConfig = props.shopConfig,
9274
+ shopConfig = _props$shopConfig === void 0 ? {} : _props$shopConfig,
9275
+ _props$data = props.data,
9276
+ data = _props$data === void 0 ? {} : _props$data,
9277
+ _props$SectionTitle = props.SectionTitle,
9278
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
9279
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9280
+ _shopConfigStyle$colo5 = _shopConfigStyle$colo.background,
9281
+ background = _shopConfigStyle$colo5 === void 0 ? "#fff" : _shopConfigStyle$colo5;
8030
9282
  console.log("booking data", data);
8031
9283
  return /*#__PURE__*/React__default.createElement("div", {
8032
9284
  className: "relative w-full px-4 xl:px-20 py-12",
@@ -8048,40 +9300,34 @@ const Booking1 = props => {
8048
9300
  }, data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : (_data$data2$ = _data$data2[0]) === null || _data$data2$ === void 0 ? void 0 : _data$data2$.description))));
8049
9301
  };
8050
9302
 
8051
- const Banner1 = props => {
8052
- const {
8053
- data
8054
- } = props;
8055
- const sectionData = data === null || data === void 0 ? void 0 : data.data;
9303
+ var Banner1 = function Banner1(props) {
9304
+ var data = props.data;
9305
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
8056
9306
  return /*#__PURE__*/React__default.createElement("div", {
8057
9307
  className: "w-full pt-10 px-4 xl:px-20 bg-background"
8058
9308
  }, /*#__PURE__*/React__default.createElement("h3", {
8059
9309
  className: "text-2xl lg:text-3xl xl:text-4xl font-semibold"
8060
9310
  }, data === null || data === void 0 ? void 0 : data.sectionTitle), /*#__PURE__*/React__default.createElement("div", {
8061
9311
  className: "grid grid-cols-1 sm:grid-cols-3 gap-6 mt-6"
8062
- }, sectionData && sectionData.length > 0 && sectionData.map((item, index) => {
9312
+ }, sectionData && sectionData.length > 0 && sectionData.map(function (item, index) {
8063
9313
  return /*#__PURE__*/React__default.createElement("img", {
8064
9314
  src: item === null || item === void 0 ? void 0 : item.srcImage,
8065
9315
  alt: "",
8066
9316
  className: "rounded-2xl",
8067
- key: `hnfhn-${index}`
9317
+ key: "hnfhn-" + index
8068
9318
  });
8069
9319
  })));
8070
9320
  };
8071
9321
 
8072
- const Partner1 = props => {
8073
- const {
8074
- shopConfigStyle,
8075
- data
8076
- } = props;
8077
- const {
8078
- primary = "#000",
8079
- textBody = "#000",
8080
- textButton = "#fff",
8081
- background = "#fff",
8082
- bgSecondary = "#fff"
8083
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
8084
- const sectionData = data === null || data === void 0 ? void 0 : data.data;
9322
+ var Partner1 = function Partner1(props) {
9323
+ var shopConfigStyle = props.shopConfigStyle,
9324
+ data = props.data;
9325
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9326
+ _shopConfigStyle$colo5 = _shopConfigStyle$colo.background,
9327
+ background = _shopConfigStyle$colo5 === void 0 ? "#fff" : _shopConfigStyle$colo5,
9328
+ _shopConfigStyle$colo6 = _shopConfigStyle$colo.bgSecondary,
9329
+ bgSecondary = _shopConfigStyle$colo6 === void 0 ? "#fff" : _shopConfigStyle$colo6;
9330
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
8085
9331
  return /*#__PURE__*/React__default.createElement("div", {
8086
9332
  className: "w-full pt-10 px-4 xl:px-20",
8087
9333
  style: {
@@ -8094,9 +9340,9 @@ const Partner1 = props => {
8094
9340
  style: {
8095
9341
  background: bgSecondary
8096
9342
  }
8097
- }, sectionData && sectionData.length > 0 && sectionData.map((item, index) => {
9343
+ }, sectionData && sectionData.length > 0 && sectionData.map(function (item, index) {
8098
9344
  return /*#__PURE__*/React__default.createElement("div", {
8099
- key: `xfriidj-${index}`
9345
+ key: "xfriidj-" + index
8100
9346
  }, /*#__PURE__*/React__default.createElement("img", {
8101
9347
  src: item.srcImage,
8102
9348
  alt: ""
@@ -8104,19 +9350,17 @@ const Partner1 = props => {
8104
9350
  })));
8105
9351
  };
8106
9352
 
8107
- const Address1 = props => {
8108
- const {
8109
- shopConfigStyle,
8110
- data
8111
- } = props;
8112
- const {
8113
- primary = "#000",
8114
- textBody = "#000",
8115
- textButton = "#fff",
8116
- background = "#fff",
8117
- bgSecondary = "#fff"
8118
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
8119
- const sectionData = data === null || data === void 0 ? void 0 : data.data;
9353
+ var Address1 = function Address1(props) {
9354
+ var shopConfigStyle = props.shopConfigStyle,
9355
+ data = props.data;
9356
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9357
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.textBody,
9358
+ textBody = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3,
9359
+ _shopConfigStyle$colo5 = _shopConfigStyle$colo.background,
9360
+ background = _shopConfigStyle$colo5 === void 0 ? "#fff" : _shopConfigStyle$colo5,
9361
+ _shopConfigStyle$colo6 = _shopConfigStyle$colo.bgSecondary,
9362
+ bgSecondary = _shopConfigStyle$colo6 === void 0 ? "#fff" : _shopConfigStyle$colo6;
9363
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
8120
9364
  return /*#__PURE__*/React__default.createElement("div", {
8121
9365
  className: "w-full pt-10 px-4 xl:px-20 ",
8122
9366
  style: {
@@ -8127,10 +9371,10 @@ const Address1 = props => {
8127
9371
  className: "text-2xl lg:text-3xl xl:text-4xl font-semibold"
8128
9372
  }, data === null || data === void 0 ? void 0 : data.sectionTitle), /*#__PURE__*/React__default.createElement("div", {
8129
9373
  className: "grid grid-cols-2 sm:grid-cols-3 gap-4 mt-6 "
8130
- }, sectionData && sectionData.length > 0 && sectionData.map((item, index) => {
9374
+ }, sectionData && sectionData.length > 0 && sectionData.map(function (item, index) {
8131
9375
  return /*#__PURE__*/React__default.createElement("div", {
8132
9376
  className: "lg:leading-6 p-4 rounded-xl",
8133
- key: `fyfoy-${index}`,
9377
+ key: "fyfoy-" + index,
8134
9378
  style: {
8135
9379
  background: bgSecondary
8136
9380
  }
@@ -8148,16 +9392,14 @@ const Address1 = props => {
8148
9392
  })));
8149
9393
  };
8150
9394
 
8151
- const Links1 = props => {
8152
- const {
8153
- data
8154
- } = props;
8155
- const sectionData = data === null || data === void 0 ? void 0 : data.data;
9395
+ var Links1 = function Links1(props) {
9396
+ var data = props.data;
9397
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
8156
9398
  return /*#__PURE__*/React__default.createElement("div", {
8157
9399
  className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 w-full pt-10 px-4 xl:px-20 bg-background"
8158
- }, sectionData && sectionData.length > 0 && sectionData.map((item, index) => {
9400
+ }, sectionData && sectionData.length > 0 && sectionData.map(function (item, index) {
8159
9401
  return /*#__PURE__*/React__default.createElement("div", {
8160
- key: `qwikf-${index}`
9402
+ key: "qwikf-" + index
8161
9403
  }, /*#__PURE__*/React__default.createElement("h4", {
8162
9404
  className: "text-lg md:text-xl lg:text-2xl font-semibold mb-4"
8163
9405
  }, "\u0110a d\u1EA1ng thanh to\xE1n"), /*#__PURE__*/React__default.createElement("div", {
@@ -8174,17 +9416,17 @@ const Links1 = props => {
8174
9416
  }));
8175
9417
  };
8176
9418
 
8177
- const Footer1 = props => {
8178
- const {
8179
- shopConfigStyle,
8180
- data
8181
- } = props;
8182
- const {
8183
- primary = "#000",
8184
- textBody = "#000",
8185
- textButton = "#fff",
8186
- bgSecondary = "#fff"
8187
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
9419
+ var Footer1 = function Footer1(props) {
9420
+ var shopConfigStyle = props.shopConfigStyle;
9421
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9422
+ _shopConfigStyle$colo2 = _shopConfigStyle$colo.primary,
9423
+ primary = _shopConfigStyle$colo2 === void 0 ? "#000" : _shopConfigStyle$colo2,
9424
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.textBody,
9425
+ textBody = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3,
9426
+ _shopConfigStyle$colo4 = _shopConfigStyle$colo.textButton,
9427
+ textButton = _shopConfigStyle$colo4 === void 0 ? "#fff" : _shopConfigStyle$colo4,
9428
+ _shopConfigStyle$colo5 = _shopConfigStyle$colo.bgSecondary,
9429
+ bgSecondary = _shopConfigStyle$colo5 === void 0 ? "#fff" : _shopConfigStyle$colo5;
8188
9430
  return /*#__PURE__*/React__default.createElement("div", {
8189
9431
  className: "footer px-4 py-10 xl:px-20 ",
8190
9432
  style: {
@@ -8271,153 +9513,488 @@ const Footer1 = props => {
8271
9513
  }, "Xem \u0111i\u1EC1u kho\u1EA3n v\xE0 ch\xEDnh s\xE1ch"))));
8272
9514
  };
8273
9515
 
8274
- const RatingStar = props => {
8275
- const {
8276
- star = 5,
8277
- style = {},
8278
- className = ""
8279
- } = props;
8280
- const res = [];
8281
- for (let i = 1; i < star; i++) {
9516
+ var Footer7 = function Footer7(props) {
9517
+ var _routes$filter;
9518
+ var shopConfig = props.shopConfig,
9519
+ shopConfigStyle = props.shopConfigStyle,
9520
+ _props$routes = props.routes,
9521
+ routes = _props$routes === void 0 ? [] : _props$routes;
9522
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9523
+ _shopConfigStyle$colo2 = _shopConfigStyle$colo.primary,
9524
+ primary = _shopConfigStyle$colo2 === void 0 ? "#000" : _shopConfigStyle$colo2,
9525
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.textBody,
9526
+ textBody = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3,
9527
+ _shopConfigStyle$colo4 = _shopConfigStyle$colo.textButton,
9528
+ textButton = _shopConfigStyle$colo4 === void 0 ? "#fff" : _shopConfigStyle$colo4,
9529
+ _shopConfigStyle$colo5 = _shopConfigStyle$colo.bgSecondary,
9530
+ bgSecondary = _shopConfigStyle$colo5 === void 0 ? "#fff" : _shopConfigStyle$colo5;
9531
+ console.log("Footer7 shopConfig", shopConfig);
9532
+ var _useState = useState([]),
9533
+ shopAddressList = _useState[0],
9534
+ setShopAddressList = _useState[1];
9535
+ useEffect(function () {
9536
+ genShopAddress();
9537
+ }, [shopConfig]);
9538
+ var genShopAddress = function genShopAddress() {
9539
+ try {
9540
+ var addressJson = JSON.parse(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopAddress);
9541
+ if (addressJson) {
9542
+ setShopAddressList(addressJson);
9543
+ } else {
9544
+ setShopAddressList([{
9545
+ address: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopAddress,
9546
+ phone: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopPhone
9547
+ }]);
9548
+ }
9549
+ } catch (e) {
9550
+ setShopAddressList([{
9551
+ address: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopAddress,
9552
+ phone: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopPhone
9553
+ }]);
9554
+ }
9555
+ };
9556
+ return /*#__PURE__*/React__default.createElement("div", {
9557
+ className: "footer px-4 pt-10 xl:px-20",
9558
+ style: {
9559
+ background: bgSecondary,
9560
+ color: textBody
9561
+ }
9562
+ }, /*#__PURE__*/React__default.createElement("div", {
9563
+ className: "flex items-center gap-2"
9564
+ }, /*#__PURE__*/React__default.createElement("img", {
9565
+ className: "object-cover w-14",
9566
+ src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
9567
+ alt: ""
9568
+ }), /*#__PURE__*/React__default.createElement("h3", {
9569
+ className: " text-2xl md:text-3xl font-semibold ms-2",
9570
+ style: {
9571
+ color: primary
9572
+ }
9573
+ }, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName)), /*#__PURE__*/React__default.createElement("div", {
9574
+ className: "mt-6 grid grid-cols-1 sm:grid-cols-4 gap-6"
9575
+ }, /*#__PURE__*/React__default.createElement("div", {
9576
+ className: " col-span-2 flex flex-col leading-8 mb-10 sm:mb-0 "
9577
+ }, /*#__PURE__*/React__default.createElement("div", {
9578
+ className: "mb-3 font-semibold text-md md:text-lg"
9579
+ }, "Th\xF4ng tin li\xEAn h\u1EC7"), shopAddressList === null || shopAddressList === void 0 ? void 0 : shopAddressList.map(function (item, index) {
9580
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", null, "C\u01A1 s\u1EDF ", index + 1), /*#__PURE__*/React__default.createElement("div", {
9581
+ className: "flex gap-1"
9582
+ }, /*#__PURE__*/React__default.createElement(IoLocationOutline, {
9583
+ size: 24,
9584
+ className: "inline-block mt-1",
9585
+ style: {
9586
+ color: primary
9587
+ }
9588
+ }), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.address)), /*#__PURE__*/React__default.createElement("div", {
9589
+ className: "flex gap-1"
9590
+ }, /*#__PURE__*/React__default.createElement(IoCallOutline, {
9591
+ size: 24,
9592
+ className: "inline-block mt-1",
9593
+ style: {
9594
+ color: primary
9595
+ }
9596
+ }), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.phone)));
9597
+ })), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
9598
+ className: "mb-4 font-semibold text-lg"
9599
+ }, "Li\xEAn k\u1EBFt"), /*#__PURE__*/React__default.createElement("div", {
9600
+ className: "leading-10 flex flex-col "
9601
+ }, routes === null || routes === void 0 ? void 0 : (_routes$filter = routes.filter(function (e) {
9602
+ return e === null || e === void 0 ? void 0 : e.isShow;
9603
+ })) === null || _routes$filter === void 0 ? void 0 : _routes$filter.map(function (route, index) {
9604
+ return /*#__PURE__*/React__default.createElement("a", {
9605
+ href: route === null || route === void 0 ? void 0 : route.route
9606
+ }, /*#__PURE__*/React__default.createElement("div", null, route === null || route === void 0 ? void 0 : route.label));
9607
+ }))), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
9608
+ className: "font-semibold mb-4 text-lg"
9609
+ }, "H\u1ED7 tr\u1EE3"), /*#__PURE__*/React__default.createElement("div", {
9610
+ className: "flex justify-start items-center gap-4"
9611
+ }, /*#__PURE__*/React__default.createElement("a", {
9612
+ href: (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopFacebookPage) || "#"
9613
+ }, /*#__PURE__*/React__default.createElement(FaFacebookF, {
9614
+ size: 40,
9615
+ color: textButton,
9616
+ className: "p-2 rounded-lg",
9617
+ style: {
9618
+ background: primary
9619
+ }
9620
+ })), /*#__PURE__*/React__default.createElement("a", {
9621
+ href: (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopMessenger) || "#"
9622
+ }, /*#__PURE__*/React__default.createElement(FaFacebookMessenger, {
9623
+ size: 40,
9624
+ color: textButton,
9625
+ className: "p-2 rounded-lg",
9626
+ style: {
9627
+ background: primary
9628
+ }
9629
+ })), /*#__PURE__*/React__default.createElement("a", {
9630
+ href: (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopZalo) || "#"
9631
+ }, /*#__PURE__*/React__default.createElement(SiZalo, {
9632
+ size: 40,
9633
+ color: textButton,
9634
+ className: "p-2 rounded-lg",
9635
+ style: {
9636
+ background: primary
9637
+ }
9638
+ }))))), /*#__PURE__*/React__default.createElement("hr", null), /*#__PURE__*/React__default.createElement("div", {
9639
+ className: "py-4"
9640
+ }, /*#__PURE__*/React__default.createElement("small", {
9641
+ className: "me-5"
9642
+ }, "B\u1EA3n quy\u1EC1n thu\u1ED9c c\xF4ng ty c\u1ED5 ph\u1EA7n c\xF4ng ngh\u1EC7 th\xF4ng minh SFIN."), /*#__PURE__*/React__default.createElement("a", {
9643
+ href: "#"
9644
+ }, /*#__PURE__*/React__default.createElement("small", {
9645
+ className: "underline decoration-solid",
9646
+ style: {
9647
+ color: primary
9648
+ }
9649
+ }, "Xem \u0111i\u1EC1u kho\u1EA3n v\xE0 ch\xEDnh s\xE1ch"))));
9650
+ };
9651
+
9652
+ var RatingStar = function RatingStar(props) {
9653
+ var _props$star = props.star,
9654
+ star = _props$star === void 0 ? 5 : _props$star,
9655
+ _props$style = props.style,
9656
+ style = _props$style === void 0 ? {} : _props$style,
9657
+ _props$className = props.className,
9658
+ className = _props$className === void 0 ? "" : _props$className;
9659
+ var res = [];
9660
+ for (var i = 1; i < star; i++) {
8282
9661
  res.push(/*#__PURE__*/React__default.createElement(FaStar, {
8283
9662
  color: "#E2B93B"
8284
9663
  }));
8285
9664
  }
8286
- const decimalPart = star % 1;
9665
+ var decimalPart = star % 1;
8287
9666
  if (decimalPart && decimalPart >= 0.5) {
8288
9667
  res.push(/*#__PURE__*/React__default.createElement(FaRegStarHalfStroke, {
8289
9668
  color: "#E2B93B"
8290
9669
  }));
8291
9670
  }
8292
- for (let i = res === null || res === void 0 ? void 0 : res.length; i < 5; i++) {
9671
+ for (var _i = res === null || res === void 0 ? void 0 : res.length; _i < 5; _i++) {
8293
9672
  res.push(/*#__PURE__*/React__default.createElement(FaRegStar, {
8294
9673
  color: "#E2B93B"
8295
9674
  }));
8296
9675
  }
8297
9676
  return /*#__PURE__*/React__default.createElement("div", {
8298
- className: `flex gap-1 ${className}`,
9677
+ className: "flex gap-1 " + className,
8299
9678
  style: style
8300
9679
  }, res);
8301
9680
  };
8302
9681
 
8303
- const CustomerRating10 = props => {
9682
+ var CustomerRating10 = function CustomerRating10(props) {
8304
9683
  var _data$data;
8305
- const {
8306
- shopConfigStyle = {},
8307
- shopConfig = {},
8308
- data = {},
8309
- SectionTitle = null
8310
- } = props;
8311
- const {
8312
- primary = "#000",
8313
- secondary = "#000",
8314
- textBody = "#000",
8315
- background = "#fff"
8316
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
9684
+ var _props$shopConfigStyl = props.shopConfigStyle,
9685
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
9686
+ _props$data = props.data,
9687
+ data = _props$data === void 0 ? {} : _props$data,
9688
+ _props$SectionTitle = props.SectionTitle,
9689
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
9690
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9691
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
9692
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
8317
9693
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
8318
- className: "relative w-full py-12 px-4 xl:px-20",
8319
- style: {
8320
- backgroundColor: background
8321
- }
9694
+ className: SECTION_DEFAULT_CLASS
8322
9695
  }, /*#__PURE__*/React__default.createElement(SectionTitle, {
8323
9696
  data: data,
8324
9697
  shopConfigStyle: shopConfigStyle
8325
9698
  }), /*#__PURE__*/React__default.createElement("div", {
8326
9699
  className: "mt-12 grid grid-cols-1 md:grid-cols-2 gap-12"
8327
- }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map((item, index) => /*#__PURE__*/React__default.createElement("div", {
8328
- key: index,
8329
- className: "flex"
8330
- }, /*#__PURE__*/React__default.createElement("img", {
8331
- src: item === null || item === void 0 ? void 0 : item.avatar,
8332
- className: "w-[136px] h-[136px] rounded-2xl"
8333
- }), /*#__PURE__*/React__default.createElement("div", {
8334
- className: "ml-4"
8335
- }, /*#__PURE__*/React__default.createElement(RatingStar, {
8336
- star: (item === null || item === void 0 ? void 0 : item.rate) || 5
8337
- }), /*#__PURE__*/React__default.createElement("div", {
8338
- className: "text-xl md:text-2xl mt-2"
8339
- }, item === null || item === void 0 ? void 0 : item.name), /*#__PURE__*/React__default.createElement("div", {
8340
- className: "mt-2"
8341
- }, item === null || item === void 0 ? void 0 : item.content)))))), /*#__PURE__*/React__default.createElement(Dash, {
9700
+ }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map(function (item, index) {
9701
+ return /*#__PURE__*/React__default.createElement("div", {
9702
+ key: index,
9703
+ className: "flex"
9704
+ }, /*#__PURE__*/React__default.createElement("img", {
9705
+ src: item === null || item === void 0 ? void 0 : item.avatar,
9706
+ className: "w-[136px] h-[136px] rounded-2xl"
9707
+ }), /*#__PURE__*/React__default.createElement("div", {
9708
+ className: "ml-4"
9709
+ }, /*#__PURE__*/React__default.createElement(RatingStar, {
9710
+ star: (item === null || item === void 0 ? void 0 : item.rate) || 5
9711
+ }), /*#__PURE__*/React__default.createElement("div", {
9712
+ className: "text-xl md:text-2xl mt-2"
9713
+ }, item === null || item === void 0 ? void 0 : item.name), /*#__PURE__*/React__default.createElement("div", {
9714
+ className: "mt-2"
9715
+ }, item === null || item === void 0 ? void 0 : item.content)));
9716
+ }))), /*#__PURE__*/React__default.createElement(Dash, {
8342
9717
  color: secondary
8343
9718
  }));
8344
9719
  };
8345
9720
 
8346
- const Employees1 = props => {
9721
+ var Employees1 = function Employees1(props) {
8347
9722
  var _data$data;
8348
- const {
8349
- shopConfigStyle = {},
8350
- shopConfig = {},
8351
- data = {},
8352
- SectionTitle = null
8353
- } = props;
8354
- const {
8355
- primary = "#000",
8356
- secondary = "#000",
8357
- textBody = "#000",
8358
- background = "#fff"
8359
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
9723
+ var _props$shopConfigStyl = props.shopConfigStyle,
9724
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
9725
+ _props$data = props.data,
9726
+ data = _props$data === void 0 ? {} : _props$data,
9727
+ _props$SectionTitle = props.SectionTitle,
9728
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
9729
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9730
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
9731
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
8360
9732
  console.log("Employee data", data);
8361
9733
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
8362
- className: "relative w-full py-12 px-4 xl:px-20",
8363
- style: {
8364
- backgroundColor: background
8365
- }
9734
+ className: SECTION_DEFAULT_CLASS + " relative"
8366
9735
  }, /*#__PURE__*/React__default.createElement(SectionTitle, {
8367
- data: data,
8368
- shopConfigStyle: shopConfigStyle
9736
+ data: data
8369
9737
  }), /*#__PURE__*/React__default.createElement("div", {
8370
9738
  className: "mt-12 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4 lg:gap-12"
8371
- }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map((item, index) => /*#__PURE__*/React__default.createElement("div", {
8372
- key: index,
8373
- className: "w-full aspect-[3/4] relative overflow-hidden rounded-2xl"
8374
- }, /*#__PURE__*/React__default.createElement("div", {
8375
- className: "absolute bottom-0 h-1/2 w-full flex flex-col justify-end p-4 bg-gradient-to-t from-black to-transparent bg-opacity-70 text-center"
8376
- }, /*#__PURE__*/React__default.createElement("div", {
8377
- className: "text-2xl text-white"
8378
- }, item === null || item === void 0 ? void 0 : item.name), /*#__PURE__*/React__default.createElement("div", {
8379
- className: "text-white mt-1"
8380
- }, item === null || item === void 0 ? void 0 : item.role)), /*#__PURE__*/React__default.createElement("img", {
8381
- src: item === null || item === void 0 ? void 0 : item.avatar,
8382
- className: "w-full h-full"
8383
- }))))), /*#__PURE__*/React__default.createElement(Dash, {
9739
+ }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map(function (item, index) {
9740
+ return /*#__PURE__*/React__default.createElement("div", {
9741
+ key: index,
9742
+ className: "w-full aspect-[3/4] relative overflow-hidden rounded-2xl"
9743
+ }, /*#__PURE__*/React__default.createElement("div", {
9744
+ className: "absolute bottom-0 h-1/2 w-full flex flex-col justify-end p-4 bg-gradient-to-t from-black to-transparent bg-opacity-70 text-center"
9745
+ }, /*#__PURE__*/React__default.createElement("div", {
9746
+ className: "text-2xl text-white"
9747
+ }, item === null || item === void 0 ? void 0 : item.name), /*#__PURE__*/React__default.createElement("div", {
9748
+ className: "text-white mt-1"
9749
+ }, item === null || item === void 0 ? void 0 : item.role)), /*#__PURE__*/React__default.createElement("img", {
9750
+ src: item === null || item === void 0 ? void 0 : item.avatar,
9751
+ className: "w-full h-full"
9752
+ }));
9753
+ }))), /*#__PURE__*/React__default.createElement(Dash, {
8384
9754
  color: secondary
8385
9755
  }));
8386
9756
  };
8387
9757
 
8388
- const Gallery1 = props => {
9758
+ var Gallery1 = function Gallery1(props) {
8389
9759
  var _data$data;
8390
- const {
8391
- shopConfigStyle = {},
8392
- shopConfig = {},
8393
- data = {},
8394
- SectionTitle = null
8395
- } = props;
8396
- const {
8397
- primary = "#000",
8398
- secondary = "#000",
8399
- textBody = "#000",
8400
- background = "#fff"
8401
- } = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color;
9760
+ var _props$shopConfigStyl = props.shopConfigStyle,
9761
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
9762
+ _props$data = props.data,
9763
+ data = _props$data === void 0 ? {} : _props$data,
9764
+ _props$SectionTitle = props.SectionTitle,
9765
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
9766
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9767
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
9768
+ secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
8402
9769
  console.log("Gallery1 data", data);
8403
9770
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
8404
- className: "relative w-full py-12 px-4 xl:px-20",
8405
- style: {
8406
- backgroundColor: background
8407
- }
9771
+ className: "" + SECTION_DEFAULT_CLASS
8408
9772
  }, /*#__PURE__*/React__default.createElement(SectionTitle, {
8409
9773
  data: data,
8410
9774
  shopConfigStyle: shopConfigStyle
8411
9775
  }), /*#__PURE__*/React__default.createElement("div", {
8412
9776
  className: "mt-6 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-1 md:gap-2"
8413
- }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map((it, index) => /*#__PURE__*/React__default.createElement("div", {
8414
- key: index
8415
- }, /*#__PURE__*/React__default.createElement("img", {
8416
- src: it === null || it === void 0 ? void 0 : it.srcImage
8417
- }))))), /*#__PURE__*/React__default.createElement(Dash, {
9777
+ }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map(function (it, index) {
9778
+ return /*#__PURE__*/React__default.createElement("div", {
9779
+ key: index
9780
+ }, /*#__PURE__*/React__default.createElement("img", {
9781
+ src: it === null || it === void 0 ? void 0 : it.srcImage
9782
+ }));
9783
+ }))), /*#__PURE__*/React__default.createElement(Dash, {
8418
9784
  color: secondary
8419
9785
  }));
8420
9786
  };
8421
9787
 
8422
- export { Address1, Banner1, Booking1, CustomerRating10, Employees1, Features1, Features2, Features3, Footer1, Gallery1, Hero10, Hero11, Hero11$1 as Hero12, Hero13, Links1, NavBar7, Partner1, Products1, Products10, Products2, ProductsTop1, SectionTitle1, Treatments1, Treatments1$1 as Treatments2 };
9788
+ var PageTitle1 = function PageTitle1(props) {
9789
+ var _sectionData$;
9790
+ var data = props.data,
9791
+ route = props.route;
9792
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
9793
+ return /*#__PURE__*/React__default.createElement("div", {
9794
+ className: "relative w-full bg-cover bg-center bg-no-repeat ",
9795
+ style: {
9796
+ backgroundImage: "url(" + (sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$ = sectionData[0]) === null || _sectionData$ === void 0 ? void 0 : _sectionData$.srcImage) + ")"
9797
+ }
9798
+ }, /*#__PURE__*/React__default.createElement("div", {
9799
+ className: "absolute top-0 w-full h-full bg-black opacity-40 z-0"
9800
+ }), /*#__PURE__*/React__default.createElement("div", {
9801
+ className: "relative w-full p-20 z-10 flex flex-col gap-6 items-center justify-center"
9802
+ }, /*#__PURE__*/React__default.createElement("div", {
9803
+ className: "text-3xl md:text-5xl text-white leading-[1.6] md:leading-[1.6] text-center font-headingFont"
9804
+ }, route === null || route === void 0 ? void 0 : route.label)));
9805
+ };
9806
+
9807
+ var About5 = function About5(props) {
9808
+ var _sectionData$, _sectionData$2;
9809
+ var shopConfig = props.shopConfig,
9810
+ data = props.data;
9811
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
9812
+ console.log("About5 sectionData", sectionData);
9813
+ return /*#__PURE__*/React__default.createElement("div", {
9814
+ className: SECTION_DEFAULT_CLASS + " grid grid-cols-1 lg:grid-cols-2 gap-12"
9815
+ }, /*#__PURE__*/React__default.createElement("img", {
9816
+ src: sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$ = sectionData[0]) === null || _sectionData$ === void 0 ? void 0 : _sectionData$.srcImage,
9817
+ className: "w-full hidden lg:block rounded-xl"
9818
+ }), /*#__PURE__*/React__default.createElement("div", {
9819
+ className: "ck-content",
9820
+ dangerouslySetInnerHTML: {
9821
+ __html: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopAbout
9822
+ }
9823
+ }), /*#__PURE__*/React__default.createElement("img", {
9824
+ src: sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$2 = sectionData[0]) === null || _sectionData$2 === void 0 ? void 0 : _sectionData$2.srcImage,
9825
+ className: "w-full block lg:hidden rounded-xl"
9826
+ }));
9827
+ };
9828
+
9829
+ var Contact1 = function Contact1(props) {
9830
+ var _sectionData$;
9831
+ var shopConfigStyle = props.shopConfigStyle,
9832
+ shopConfig = props.shopConfig,
9833
+ data = props.data,
9834
+ _props$SectionTitle = props.SectionTitle,
9835
+ SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
9836
+ var sectionData = data === null || data === void 0 ? void 0 : data.data;
9837
+ return /*#__PURE__*/React__default.createElement("div", {
9838
+ className: "" + SECTION_DEFAULT_CLASS
9839
+ }, /*#__PURE__*/React__default.createElement(SectionTitle, {
9840
+ data: data,
9841
+ shopConfigStyle: shopConfigStyle
9842
+ }), /*#__PURE__*/React__default.createElement("div", {
9843
+ className: "grid grid-cols-1 lg:grid-cols-2 gap-12 mt-6"
9844
+ }, /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("p", null, "Trong qu\xE1 tr\xECnh gh\xE9 th\u0103m website, n\u1EBFu qu\xFD kh\xE1ch c\xF3 b\u1EA5t k\u1EF3 th\u1EAFc m\u1EAFc hay c\u1EA7n s\u1EF1 h\u1ED7 tr\u1EE3 n\xE0o, h\xE3y li\xEAn h\u1EC7 v\u1EDBi ch\xFAng t\xF4i theo c\xE1c k\xEAnh sau: "), shopConfig !== null && shopConfig !== void 0 && shopConfig.shopPhone ? /*#__PURE__*/React__default.createElement("div", {
9845
+ className: "flex items-center gap-2 rounded-lg overflow-hidden bg-white mt-6"
9846
+ }, /*#__PURE__*/React__default.createElement(FaFacebookF, {
9847
+ size: 40,
9848
+ className: "p-2 text-textButton bg-primary"
9849
+ }), /*#__PURE__*/React__default.createElement("div", null, "S\u1ED1 \u0111i\u1EC7n tho\u1EA1i: ", shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopPhone)) : null, shopConfig !== null && shopConfig !== void 0 && shopConfig.shopZalo ? /*#__PURE__*/React__default.createElement("div", {
9850
+ className: "flex items-center gap-2 rounded-lg overflow-hidden bg-white mt-6"
9851
+ }, /*#__PURE__*/React__default.createElement(SiZalo, {
9852
+ size: 40,
9853
+ className: "p-2 text-textButton bg-primary"
9854
+ }), /*#__PURE__*/React__default.createElement("div", null, "Zalo: ", shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopZalo)) : null, shopConfig !== null && shopConfig !== void 0 && shopConfig.shopFacebookPage ? /*#__PURE__*/React__default.createElement("div", {
9855
+ className: "flex items-center gap-2 rounded-lg overflow-hidden bg-white mt-6"
9856
+ }, /*#__PURE__*/React__default.createElement(FaFacebookF, {
9857
+ size: 40,
9858
+ className: "p-2 text-textButton bg-primary"
9859
+ }), /*#__PURE__*/React__default.createElement("div", null, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopFacebookPage)) : null, shopConfig !== null && shopConfig !== void 0 && shopConfig.shopMessenger ? /*#__PURE__*/React__default.createElement("div", {
9860
+ className: "flex items-center gap-2 rounded-lg overflow-hidden bg-white mt-6"
9861
+ }, /*#__PURE__*/React__default.createElement(FaFacebookMessenger, {
9862
+ size: 40,
9863
+ className: "p-2 text-textButton bg-primary"
9864
+ }), /*#__PURE__*/React__default.createElement("div", null, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopMessenger)) : null), /*#__PURE__*/React__default.createElement("img", {
9865
+ src: sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$ = sectionData[0]) === null || _sectionData$ === void 0 ? void 0 : _sectionData$.srcImage,
9866
+ className: "w-full rounded-xl border-white border-8 shadow-lg"
9867
+ })));
9868
+ };
9869
+
9870
+ var Breadcrumb1 = function Breadcrumb1(props) {
9871
+ var shopConfigStyle = props.shopConfigStyle,
9872
+ route = props.route,
9873
+ _props$routes = props.routes,
9874
+ routes = _props$routes === void 0 ? [] : _props$routes;
9875
+ var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
9876
+ _shopConfigStyle$colo3 = _shopConfigStyle$colo.textHeading,
9877
+ textHeading = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
9878
+ var _useState = useState([]),
9879
+ items = _useState[0],
9880
+ setItems = _useState[1];
9881
+ useEffect(function () {
9882
+ getItems();
9883
+ }, [route]);
9884
+ var getItems = function getItems() {
9885
+ var _route$route, _route$route$split, _route$route$split$fi;
9886
+ var items = route === null || route === void 0 ? void 0 : (_route$route = route.route) === null || _route$route === void 0 ? void 0 : (_route$route$split = _route$route.split("/")) === null || _route$route$split === void 0 ? void 0 : (_route$route$split$fi = _route$route$split.filter(function (e) {
9887
+ return e === null || e === void 0 ? void 0 : e.length;
9888
+ })) === null || _route$route$split$fi === void 0 ? void 0 : _route$route$split$fi.slice(0, 2);
9889
+ items = items.map(function (e) {
9890
+ return (routes === null || routes === void 0 ? void 0 : routes.find(function (r) {
9891
+ return (r === null || r === void 0 ? void 0 : r.name) === e;
9892
+ })) || {
9893
+ label: e
9894
+ };
9895
+ });
9896
+ items.unshift({
9897
+ name: "home",
9898
+ label: "Trang chủ",
9899
+ route: "/"
9900
+ });
9901
+ setItems(items);
9902
+ };
9903
+ return /*#__PURE__*/React__default.createElement("div", {
9904
+ className: SECTION_DEFAULT_CLASS + " !my-6 flex gap-2"
9905
+ }, items === null || items === void 0 ? void 0 : items.map(function (item, index) {
9906
+ return /*#__PURE__*/React__default.createElement("div", {
9907
+ key: index,
9908
+ className: "flex gap-2"
9909
+ }, index ? /*#__PURE__*/React__default.createElement("div", {
9910
+ className: "text-gray4"
9911
+ }, "/") : null, item !== null && item !== void 0 && item.route ? /*#__PURE__*/React__default.createElement("a", {
9912
+ href: item === null || item === void 0 ? void 0 : item.route,
9913
+ style: {
9914
+ color: textHeading
9915
+ }
9916
+ }, item === null || item === void 0 ? void 0 : item.label) : /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.label));
9917
+ }));
9918
+ };
9919
+
9920
+ var Carts1 = function Carts1(props) {
9921
+ var _props$cartItems = props.cartItems,
9922
+ cartItems = _props$cartItems === void 0 ? [] : _props$cartItems;
9923
+ var _useState = useState(false),
9924
+ checkAll = _useState[0],
9925
+ setCheckAll = _useState[1];
9926
+ var handleCheckAll = function handleCheckAll(event) {
9927
+ var _event$target = event.target,
9928
+ checked = _event$target.checked;
9929
+ setCheckAll(checked);
9930
+ };
9931
+ return /*#__PURE__*/React__default.createElement("div", {
9932
+ className: SECTION_DEFAULT_CLASS + " mt-0 rounded-2xl bg-bgSecondary p-4"
9933
+ }, /*#__PURE__*/React__default.createElement("div", {
9934
+ className: "flex gap-4 pb-4"
9935
+ }, /*#__PURE__*/React__default.createElement("input", {
9936
+ type: "checkbox",
9937
+ checked: checkAll,
9938
+ onChange: handleCheckAll
9939
+ }), /*#__PURE__*/React__default.createElement("div", {
9940
+ className: "flex-1"
9941
+ }, "S\u1EA3n ph\u1EA9m"), /*#__PURE__*/React__default.createElement("div", {
9942
+ className: "w-32 text-right"
9943
+ }, "\u0110\u01A1n gi\xE1"), /*#__PURE__*/React__default.createElement("div", {
9944
+ className: "w-32 text-center"
9945
+ }, "S\u1ED1 l\u01B0\u1EE3ng"), /*#__PURE__*/React__default.createElement("div", {
9946
+ className: "w-32 text-right"
9947
+ }, "Th\xE0nh ti\u1EC1n"), /*#__PURE__*/React__default.createElement("div", {
9948
+ className: "w-32 text-center"
9949
+ }, "H\xE0nh \u0111\u1ED9ng")), cartItems.map(function (item, index) {
9950
+ return /*#__PURE__*/React__default.createElement(CartItem, {
9951
+ item: item,
9952
+ key: index
9953
+ });
9954
+ }));
9955
+ };
9956
+ var CartItem = function CartItem(props) {
9957
+ var item = props.item;
9958
+ var _useState2 = useState(item.quantity),
9959
+ quantity = _useState2[0],
9960
+ setQuantity = _useState2[1];
9961
+ var refInputQuantity = useRef();
9962
+ var handleCheckItem = function handleCheckItem(event) {};
9963
+ return /*#__PURE__*/React__default.createElement("div", {
9964
+ className: "flex items-center gap-4 border-t py-4"
9965
+ }, /*#__PURE__*/React__default.createElement("input", {
9966
+ type: "checkbox",
9967
+ checked: false,
9968
+ onChange: handleCheckItem
9969
+ }), /*#__PURE__*/React__default.createElement("div", {
9970
+ className: "flex-1"
9971
+ }, "S\u1EA3n ph\u1EA9m"), /*#__PURE__*/React__default.createElement("div", {
9972
+ className: "w-32 text-right"
9973
+ }, formatCurrency(item.price)), /*#__PURE__*/React__default.createElement("div", {
9974
+ className: "w-32 text-right"
9975
+ }, /*#__PURE__*/React__default.createElement(Input, {
9976
+ rules: [{
9977
+ type: "required",
9978
+ message: "Bắt buộc nhập số lượng"
9979
+ }, {
9980
+ type: "pattern",
9981
+ pattern: numberPattern,
9982
+ message: "Số lượng không đúng"
9983
+ }],
9984
+ defaultValue: quantity,
9985
+ isQuantity: true,
9986
+ min: 1,
9987
+ onChange: function onChange(text) {
9988
+ return setQuantity(parseInt(text));
9989
+ },
9990
+ ref: refInputQuantity,
9991
+ wrapClassName: "w-fit mx-auto"
9992
+ })), /*#__PURE__*/React__default.createElement("div", {
9993
+ className: "w-32 text-right"
9994
+ }, formatCurrency(item.price * quantity)), /*#__PURE__*/React__default.createElement("div", {
9995
+ className: "w-32 text-center"
9996
+ }, "H\xE0nh \u0111\u1ED9ng"));
9997
+ };
9998
+
9999
+ export { About5, Address1, Banner1, Booking1, Breadcrumb1, Carts1, Contact1, CustomerRating10, Employees1, Features1, Features2, Features3, Footer1, Footer7, Gallery1, Hero10, Hero11, Hero11$1 as Hero12, Hero13, Links1, NavBar7, PageTitle1, Partner1, ProductDetail10, ProductHot3, ProductSale2, Products1, Products10, Products2, Products3, ProductsTop1, SectionTitle1, ServiceDetail1, Treatments1, Treatments1$1 as Treatments2 };
8423
10000
  //# sourceMappingURL=index.modern.js.map