s-platform-landing-section 0.1.10-alpha.5 → 0.1.10-alpha.7

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 (6) hide show
  1. package/dist/index.css +84 -84
  2. package/dist/index.js +1270 -349
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.modern.js +2466 -1910
  5. package/dist/index.modern.js.map +1 -1
  6. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -11,11 +11,12 @@ var ci = require('react-icons/ci');
11
11
  var bs = require('react-icons/bs');
12
12
  var fa6 = require('react-icons/fa6');
13
13
  var lu = require('react-icons/lu');
14
+ var io = require('react-icons/io');
14
15
  var DatePicker = _interopDefault(require('react-datepicker'));
15
16
  require('react-datepicker/dist/react-datepicker.css');
16
- var io = require('react-icons/io');
17
17
  var si = require('react-icons/si');
18
18
  var go = require('react-icons/go');
19
+ var ri = require('react-icons/ri');
19
20
 
20
21
  var Button = function Button(props) {
21
22
  var _props$label = props.label,
@@ -40,8 +41,164 @@ var Button = function Button(props) {
40
41
  }, label);
41
42
  };
42
43
 
44
+ function _arrayLikeToArray(r, a) {
45
+ (null == a || a > r.length) && (a = r.length);
46
+ for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
47
+ return n;
48
+ }
49
+ function _createForOfIteratorHelperLoose(r, e) {
50
+ var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
51
+ if (t) return (t = t.call(r)).next.bind(t);
52
+ if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) {
53
+ t && (r = t);
54
+ var o = 0;
55
+ return function () {
56
+ return o >= r.length ? {
57
+ done: !0
58
+ } : {
59
+ done: !1,
60
+ value: r[o++]
61
+ };
62
+ };
63
+ }
64
+ throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
65
+ }
66
+ function _extends() {
67
+ return _extends = Object.assign ? Object.assign.bind() : function (n) {
68
+ for (var e = 1; e < arguments.length; e++) {
69
+ var t = arguments[e];
70
+ for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
71
+ }
72
+ return n;
73
+ }, _extends.apply(null, arguments);
74
+ }
75
+ function _objectDestructuringEmpty(t) {
76
+ if (null == t) throw new TypeError("Cannot destructure " + t);
77
+ }
78
+ function _objectWithoutPropertiesLoose(r, e) {
79
+ if (null == r) return {};
80
+ var t = {};
81
+ for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
82
+ if (e.includes(n)) continue;
83
+ t[n] = r[n];
84
+ }
85
+ return t;
86
+ }
87
+ function _unsupportedIterableToArray(r, a) {
88
+ if (r) {
89
+ if ("string" == typeof r) return _arrayLikeToArray(r, a);
90
+ var t = {}.toString.call(r).slice(8, -1);
91
+ 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;
92
+ }
93
+ }
94
+
95
+ var _excluded = ["Link"];
96
+ var getDurationValue = function getDurationValue(attributes) {
97
+ var _durationAtt$value, _durationAtt$unit;
98
+ if (!attributes) {
99
+ return "";
100
+ }
101
+ if (typeof attributes === "string") {
102
+ attributes = JSON.parse(attributes || "[]");
103
+ }
104
+ var durationAtt = attributes.find(function (attr) {
105
+ return attr.name === "Thời lượng (phút) / buổi";
106
+ });
107
+ 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]) || "") : "";
108
+ };
109
+ var genProductSlug = function genProductSlug(productName, id) {
110
+ var slug = productName.toLowerCase();
111
+ slug = slug.replace(/(à|á|ạ|ả|ã|â|ầ|ấ|ậ|ẩ|ẫ|ă|ằ|ắ|ặ|ẳ|ẵ)/g, "a");
112
+ slug = slug.replace(/(è|é|ẹ|ẻ|ẽ|ê|ề|ế|ệ|ể|ễ)/g, "e");
113
+ slug = slug.replace(/(ì|í|ị|ỉ|ĩ)/g, "i");
114
+ slug = slug.replace(/(ò|ó|ọ|ỏ|õ|ô|ồ|ố|ộ|ổ|ỗ|ơ|ờ|ớ|ợ|ở|ỡ)/g, "o");
115
+ slug = slug.replace(/(ù|ú|ụ|ủ|ũ|ư|ừ|ứ|ự|ử|ữ)/g, "u");
116
+ slug = slug.replace(/(ỳ|ý|ỵ|ỷ|ỹ)/g, "y");
117
+ slug = slug.replace(/(đ)/g, "d");
118
+ slug = slug.replace(/([^0-9a-z-\s])/g, "");
119
+ slug = slug.replace(/(\s+)/g, "-");
120
+ slug = slug.replace(/^-+/g, "");
121
+ slug = slug.replace(/-+$/g, "");
122
+ return slug + "-" + id;
123
+ };
124
+ var getLinkProductDetail = function getLinkProductDetail(product) {
125
+ var slug = genProductSlug(product === null || product === void 0 ? void 0 : product.productName, product === null || product === void 0 ? void 0 : product.productId);
126
+ return "/product/" + slug + "/" + (product === null || product === void 0 ? void 0 : product.shopId);
127
+ };
128
+ var LinkToPage = function LinkToPage(props) {
129
+ var _props$Link = props.Link,
130
+ Link = _props$Link === void 0 ? null : _props$Link,
131
+ otherProps = _objectWithoutPropertiesLoose(props, _excluded);
132
+ return Link ? /*#__PURE__*/React__default.createElement(Link, otherProps, props.children) : /*#__PURE__*/React__default.createElement("a", otherProps, props.children);
133
+ };
134
+
135
+ var Options = function Options(props) {
136
+ var _props$className = props.className,
137
+ className = _props$className === void 0 ? "" : _props$className,
138
+ _props$dropdownClassN = props.dropdownClassName,
139
+ dropdownClassName = _props$dropdownClassN === void 0 ? "" : _props$dropdownClassN,
140
+ _props$options = props.options,
141
+ options = _props$options === void 0 ? [] : _props$options,
142
+ _props$Link = props.Link,
143
+ Link = _props$Link === void 0 ? null : _props$Link;
144
+ var _useState = React.useState(false),
145
+ isOpen = _useState[0],
146
+ setIsOpen = _useState[1];
147
+ var dropdownRef = React.useRef(null);
148
+ var toggleDropdown = function toggleDropdown() {
149
+ setIsOpen(!isOpen);
150
+ };
151
+ React.useEffect(function () {
152
+ var handleClickOutside = function handleClickOutside(event) {
153
+ if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
154
+ setIsOpen(false);
155
+ }
156
+ };
157
+ document.addEventListener('mousedown', handleClickOutside);
158
+ return function () {
159
+ document.removeEventListener('mousedown', handleClickOutside);
160
+ };
161
+ }, []);
162
+ var _onClick = function onClick(option) {
163
+ var _option$onClick;
164
+ setIsOpen(false);
165
+ option === null || option === void 0 ? void 0 : (_option$onClick = option.onClick) === null || _option$onClick === void 0 ? void 0 : _option$onClick.call(option);
166
+ };
167
+ var itemClassName = "flex gap-2 px-4 py-2 text-gray-700 hover:bg-gray-100 rounded cursor-pointer";
168
+ return /*#__PURE__*/React__default.createElement("div", {
169
+ className: "relative",
170
+ ref: dropdownRef
171
+ }, /*#__PURE__*/React__default.createElement("div", {
172
+ onClick: toggleDropdown,
173
+ className: "cursor-pointer " + className
174
+ }, props === null || props === void 0 ? void 0 : props.children), isOpen ? /*#__PURE__*/React__default.createElement("div", {
175
+ className: "absolute w-max rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 z-10 " + dropdownClassName
176
+ }, /*#__PURE__*/React__default.createElement("div", {
177
+ className: "p-2",
178
+ role: "menu",
179
+ "aria-orientation": "vertical",
180
+ "aria-labelledby": "options-menu"
181
+ }, options === null || options === void 0 ? void 0 : options.map(function (option, index) {
182
+ return option !== null && option !== void 0 && option.href ? /*#__PURE__*/React__default.createElement(LinkToPage, {
183
+ onClick: function onClick() {
184
+ return setIsOpen(false);
185
+ },
186
+ Link: Link,
187
+ href: option === null || option === void 0 ? void 0 : option.href,
188
+ className: itemClassName,
189
+ role: "menuitem"
190
+ }, option === null || option === void 0 ? void 0 : option.icon, /*#__PURE__*/React__default.createElement("p", null, option === null || option === void 0 ? void 0 : option.label)) : /*#__PURE__*/React__default.createElement("div", {
191
+ onClick: function onClick() {
192
+ return _onClick(option);
193
+ },
194
+ className: itemClassName,
195
+ role: "menuitem"
196
+ }, option === null || option === void 0 ? void 0 : option.icon, /*#__PURE__*/React__default.createElement("p", null, option === null || option === void 0 ? void 0 : option.label));
197
+ }))) : null);
198
+ };
199
+
43
200
  var NavBar7 = function NavBar7(props) {
44
- var _routes$filter;
201
+ var _routes$find, _routes$filter, _routes$filter2;
45
202
  var _useState = React.useState(false),
46
203
  isOpen = _useState[0],
47
204
  setIsOpen = _useState[1];
@@ -50,17 +207,41 @@ var NavBar7 = function NavBar7(props) {
50
207
  shopConfigStyle = props.shopConfigStyle,
51
208
  _props$routes = props.routes,
52
209
  routes = _props$routes === void 0 ? [] : _props$routes,
53
- _props$section = props.section,
54
- section = _props$section === void 0 ? {} : _props$section,
55
- _props$userInfo = props.userInfo,
56
- userInfo = _props$userInfo === void 0 ? null : _props$userInfo,
57
- _props$cartItems = props.cartItems,
58
- cartItems = _props$cartItems === void 0 ? [] : _props$cartItems,
210
+ _props$route = props.route,
211
+ route = _props$route === void 0 ? null : _props$route,
212
+ _props$Link = props.Link,
213
+ Link = _props$Link === void 0 ? null : _props$Link,
59
214
  _props$useSelector = props.useSelector,
60
- useSelector = _props$useSelector === void 0 ? null : _props$useSelector;
215
+ useSelector = _props$useSelector === void 0 ? null : _props$useSelector,
216
+ _props$logout = props.logout,
217
+ logout = _props$logout === void 0 ? function () {} : _props$logout;
218
+ var cartItems = useSelector === null || useSelector === void 0 ? void 0 : useSelector(function (state) {
219
+ return state.cart.items;
220
+ });
221
+ var userInfo = useSelector === null || useSelector === void 0 ? void 0 : useSelector(function (state) {
222
+ return state.user.info;
223
+ });
61
224
  var _useState2 = React.useState(""),
62
225
  totalItem = _useState2[0],
63
226
  setTotalItem = _useState2[1];
227
+ var profileRoute = (_routes$find = routes.find(function (e) {
228
+ return (e === null || e === void 0 ? void 0 : e.name) === "profile";
229
+ })) === null || _routes$find === void 0 ? void 0 : _routes$find.route;
230
+ var profileOptions = [{
231
+ label: "Thông tin cá nhân",
232
+ href: profileRoute,
233
+ icon: /*#__PURE__*/React__default.createElement(io5.IoInformationCircleOutline, {
234
+ size: 24,
235
+ className: "text-gray3"
236
+ })
237
+ }, {
238
+ label: "Đăng xuất",
239
+ onClick: logout,
240
+ icon: /*#__PURE__*/React__default.createElement(io5.IoLogOutOutline, {
241
+ size: 24,
242
+ className: "text-gray3"
243
+ })
244
+ }];
64
245
  React.useEffect(function () {
65
246
  console.log("NavBar7 cartItems", cartItems);
66
247
  var totalItem = cartItems.reduce(function (total, item) {
@@ -71,15 +252,9 @@ var NavBar7 = function NavBar7(props) {
71
252
  }
72
253
  setTotalItem(totalItem);
73
254
  }, [cartItems]);
74
- var cartItems2 = useSelector === null || useSelector === void 0 ? void 0 : useSelector(function (state) {
75
- return state.cart.items;
76
- });
77
- console.log("NavBar7 cartItems2", cartItems2);
78
- React.useEffect(function () {
79
- console.log("NavBar7 cartItems2", cartItems2);
80
- }, [cartItems2]);
81
255
  var cart = function cart() {
82
- return /*#__PURE__*/React__default.createElement("a", {
256
+ return /*#__PURE__*/React__default.createElement(LinkToPage, {
257
+ Link: Link,
83
258
  href: "/carts"
84
259
  }, /*#__PURE__*/React__default.createElement("div", {
85
260
  className: "relative cursor-pointer"
@@ -94,7 +269,8 @@ var NavBar7 = function NavBar7(props) {
94
269
  className: "w-full sticky top-0 shadow z-50 bg-background"
95
270
  }, /*#__PURE__*/React__default.createElement("div", {
96
271
  className: "hidden lg:flex gap-6 justify-between items-center py-2 px-4 xl:px-20"
97
- }, /*#__PURE__*/React__default.createElement("a", {
272
+ }, /*#__PURE__*/React__default.createElement(LinkToPage, {
273
+ Link: Link,
98
274
  href: "/",
99
275
  className: "flex items-center gap-2"
100
276
  }, /*#__PURE__*/React__default.createElement("img", {
@@ -107,14 +283,16 @@ var NavBar7 = function NavBar7(props) {
107
283
  className: "hidden lg:flex flex-1 items-center gap-4"
108
284
  }, routes === null || routes === void 0 ? void 0 : (_routes$filter = routes.filter(function (e) {
109
285
  return e === null || e === void 0 ? void 0 : e.isShow;
110
- })) === null || _routes$filter === void 0 ? void 0 : _routes$filter.map(function (route, index) {
111
- return /*#__PURE__*/React__default.createElement("a", {
112
- href: route === null || route === void 0 ? void 0 : route.route
113
- }, (section === null || section === void 0 ? void 0 : section.pageRoute) === (route === null || route === void 0 ? void 0 : route.name) ? /*#__PURE__*/React__default.createElement("div", {
286
+ })) === null || _routes$filter === void 0 ? void 0 : _routes$filter.map(function (item, index) {
287
+ return /*#__PURE__*/React__default.createElement(LinkToPage, {
288
+ Link: Link,
289
+ href: item === null || item === void 0 ? void 0 : item.route,
290
+ key: index
291
+ }, (item === null || item === void 0 ? void 0 : item.name) === (route === null || route === void 0 ? void 0 : route.name) ? /*#__PURE__*/React__default.createElement("div", {
114
292
  className: "py-1 border-b text-textHeading border-textHeading"
115
- }, route === null || route === void 0 ? void 0 : route.label) : /*#__PURE__*/React__default.createElement("div", {
293
+ }, item === null || item === void 0 ? void 0 : item.label) : /*#__PURE__*/React__default.createElement("div", {
116
294
  className: "py-1"
117
- }, route === null || route === void 0 ? void 0 : route.label));
295
+ }, item === null || item === void 0 ? void 0 : item.label));
118
296
  })), cart(), userInfo ?
119
297
  /*#__PURE__*/
120
298
  React__default.createElement("div", {
@@ -123,19 +301,29 @@ var NavBar7 = function NavBar7(props) {
123
301
  className: "text-bgSecondary",
124
302
  size: 48
125
303
  }), /*#__PURE__*/React__default.createElement("div", {
126
- className: "flex flex-col ml-2"
127
- }, /*#__PURE__*/React__default.createElement("label", null, "Xin ch\xE0o!"), /*#__PURE__*/React__default.createElement("label", {
304
+ className: "ml-2"
305
+ }, /*#__PURE__*/React__default.createElement("label", null, "Xin ch\xE0o!"), /*#__PURE__*/React__default.createElement(Options, {
306
+ Link: Link,
307
+ options: profileOptions,
308
+ dropdownClassName: "right-0 top-8",
309
+ className: "flex gap-4 items-center"
310
+ }, /*#__PURE__*/React__default.createElement("div", {
128
311
  className: "font-semibold"
129
- }, userInfo === null || userInfo === void 0 ? void 0 : userInfo.name))) :
312
+ }, userInfo === null || userInfo === void 0 ? void 0 : userInfo.name), /*#__PURE__*/React__default.createElement(io5.IoChevronDownOutline, {
313
+ className: "text-gray3",
314
+ size: 24
315
+ })))) :
130
316
  /*#__PURE__*/
131
317
  React__default.createElement("div", {
132
318
  className: "flex gap-2"
133
- }, /*#__PURE__*/React__default.createElement("a", {
319
+ }, /*#__PURE__*/React__default.createElement(LinkToPage, {
320
+ Link: Link,
134
321
  href: "/account"
135
322
  }, /*#__PURE__*/React__default.createElement(Button, {
136
323
  label: "Đăng nhập",
137
324
  shopConfigStyle: shopConfigStyle
138
- })), /*#__PURE__*/React__default.createElement("a", {
325
+ })), /*#__PURE__*/React__default.createElement(LinkToPage, {
326
+ Link: Link,
139
327
  href: "/account"
140
328
  }, /*#__PURE__*/React__default.createElement(Button, {
141
329
  label: "Đăng ký",
@@ -143,7 +331,8 @@ var NavBar7 = function NavBar7(props) {
143
331
  type: 'outline'
144
332
  })))), /*#__PURE__*/React__default.createElement("div", {
145
333
  className: "relative lg:hidden flex gap-4 items-center px-4 py-2"
146
- }, /*#__PURE__*/React__default.createElement("a", {
334
+ }, /*#__PURE__*/React__default.createElement(LinkToPage, {
335
+ Link: Link,
147
336
  href: "/",
148
337
  className: "flex flex-1 gap-2 items-center"
149
338
  }, /*#__PURE__*/React__default.createElement("img", {
@@ -177,12 +366,16 @@ var NavBar7 = function NavBar7(props) {
177
366
  }
178
367
  }, /*#__PURE__*/React__default.createElement(rx.RxCross2, {
179
368
  size: 24
180
- })), /*#__PURE__*/React__default.createElement("div", null, routes === null || routes === void 0 ? void 0 : routes.map(function (route, index) {
181
- return /*#__PURE__*/React__default.createElement("a", {
182
- href: route === null || route === void 0 ? void 0 : route.route
369
+ })), /*#__PURE__*/React__default.createElement("div", null, routes === null || routes === void 0 ? void 0 : (_routes$filter2 = routes.filter(function (e) {
370
+ return e === null || e === void 0 ? void 0 : e.isShow;
371
+ })) === null || _routes$filter2 === void 0 ? void 0 : _routes$filter2.map(function (item, index) {
372
+ return /*#__PURE__*/React__default.createElement(LinkToPage, {
373
+ Link: Link,
374
+ href: item === null || item === void 0 ? void 0 : item.route,
375
+ key: index
183
376
  }, /*#__PURE__*/React__default.createElement("div", {
184
- className: "py-2 " + ((section === null || section === void 0 ? void 0 : section.pageRoute) === (route === null || route === void 0 ? void 0 : route.name) ? "text-textHeading" : "")
185
- }, route === null || route === void 0 ? void 0 : route.label));
377
+ className: "py-2 " + ((item === null || item === void 0 ? void 0 : item.name) === (route === null || route === void 0 ? void 0 : route.name) ? "text-textHeading" : "")
378
+ }, item === null || item === void 0 ? void 0 : item.label));
186
379
  })))) : null));
187
380
  };
188
381
 
@@ -339,57 +532,6 @@ function _catch(body, recover) {
339
532
  return result;
340
533
  }
341
534
 
342
- function _arrayLikeToArray(r, a) {
343
- (null == a || a > r.length) && (a = r.length);
344
- for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
345
- return n;
346
- }
347
- function _createForOfIteratorHelperLoose(r, e) {
348
- var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
349
- if (t) return (t = t.call(r)).next.bind(t);
350
- if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) {
351
- t && (r = t);
352
- var o = 0;
353
- return function () {
354
- return o >= r.length ? {
355
- done: !0
356
- } : {
357
- done: !1,
358
- value: r[o++]
359
- };
360
- };
361
- }
362
- throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
363
- }
364
- function _extends() {
365
- return _extends = Object.assign ? Object.assign.bind() : function (n) {
366
- for (var e = 1; e < arguments.length; e++) {
367
- var t = arguments[e];
368
- for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
369
- }
370
- return n;
371
- }, _extends.apply(null, arguments);
372
- }
373
- function _objectDestructuringEmpty(t) {
374
- if (null == t) throw new TypeError("Cannot destructure " + t);
375
- }
376
- function _objectWithoutPropertiesLoose(r, e) {
377
- if (null == r) return {};
378
- var t = {};
379
- for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
380
- if (e.includes(n)) continue;
381
- t[n] = r[n];
382
- }
383
- return t;
384
- }
385
- function _unsupportedIterableToArray(r, a) {
386
- if (r) {
387
- if ("string" == typeof r) return _arrayLikeToArray(r, a);
388
- var t = {}.toString.call(r).slice(8, -1);
389
- 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;
390
- }
391
- }
392
-
393
535
  function bind(fn, thisArg) {
394
536
  return function wrap() {
395
537
  return fn.apply(thisArg, arguments);
@@ -7047,12 +7189,13 @@ var ProductImage = function ProductImage(props) {
7047
7189
  var ModalNotification = function ModalNotification(props) {
7048
7190
  var modalRef = React.useRef(null);
7049
7191
  var onClose = props.onClose,
7050
- onCloseFormBooking = props.onCloseFormBooking;
7192
+ onCloseFormBooking = props.onCloseFormBooking,
7193
+ _props$isButtonClose = props.isButtonClose,
7194
+ isButtonClose = _props$isButtonClose === void 0 ? true : _props$isButtonClose;
7051
7195
  var handleClickOutside = function handleClickOutside(event) {
7052
7196
  if (modalRef.current && !modalRef.current.contains(event.target)) {
7053
- onClose();
7197
+ if (onClose) onClose();
7054
7198
  if (onCloseFormBooking && typeof onCloseFormBooking === 'function') {
7055
- console.log("đóng nhá");
7056
7199
  onCloseFormBooking();
7057
7200
  }
7058
7201
  }
@@ -7068,7 +7211,7 @@ var ModalNotification = function ModalNotification(props) {
7068
7211
  }, /*#__PURE__*/React__default.createElement("div", {
7069
7212
  className: " flex items-center justify-center relative bg-red",
7070
7213
  ref: modalRef
7071
- }, props === null || props === void 0 ? void 0 : props.children, /*#__PURE__*/React__default.createElement("button", {
7214
+ }, props === null || props === void 0 ? void 0 : props.children, isButtonClose && /*#__PURE__*/React__default.createElement("button", {
7072
7215
  className: "absolute top-4 right-4",
7073
7216
  onClick: onClose
7074
7217
  }, /*#__PURE__*/React__default.createElement(rx.RxCross2, null))));
@@ -7133,8 +7276,21 @@ var createSpaScheduleApi = function createSpaScheduleApi(shopId, data) {
7133
7276
  }
7134
7277
  });
7135
7278
  };
7279
+ var draftOrderWithoutLoginApi = function draftOrderWithoutLoginApi(shopId, data) {
7280
+ return api({
7281
+ method: "post",
7282
+ url: "/spa/orders/draft-online-without-login",
7283
+ params: {
7284
+ shopId: shopId
7285
+ },
7286
+ data: data,
7287
+ headers: {
7288
+ shopId: shopId
7289
+ }
7290
+ });
7291
+ };
7136
7292
 
7137
- var _excluded = ["productName"];
7293
+ var _excluded$1 = ["productName"];
7138
7294
  var BookingController = function BookingController(props) {
7139
7295
  _objectDestructuringEmpty(props);
7140
7296
  var createSchedule = function createSchedule(customerName, customerPhone, scheduleDate, services, shopId) {
@@ -7148,7 +7304,7 @@ var BookingController = function BookingController(props) {
7148
7304
  scheduleDate: new Date(scheduleDate).getTime(),
7149
7305
  services: services === null || services === void 0 ? void 0 : services.map(function (_ref) {
7150
7306
  var productName = _ref.productName,
7151
- rest = _objectWithoutPropertiesLoose(_ref, _excluded);
7307
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
7152
7308
  return rest;
7153
7309
  }),
7154
7310
  shopId: shopId
@@ -7255,8 +7411,8 @@ var Input = React.forwardRef(function (props, ref) {
7255
7411
  onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
7256
7412
  }
7257
7413
  };
7258
- var _className = "h-10 py-1 px-2 border border-stroke rounded focus:outline-none focus:ring-0 " + className;
7259
- var _inputClassName = (isQuantity ? "text-center w-12" : "") + " " + inputClassName;
7414
+ var _className = "h-10 py-1 px-2 border border-stroke rounded " + className;
7415
+ var _inputClassName = (isQuantity ? "text-center w-12" : "") + " " + inputClassName + " focus:outline-none focus:ring-0";
7260
7416
  var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
7261
7417
  return (e === null || e === void 0 ? void 0 : e.type) === "required";
7262
7418
  }));
@@ -7292,44 +7448,78 @@ var Input = React.forwardRef(function (props, ref) {
7292
7448
  });
7293
7449
 
7294
7450
  var Select = React.forwardRef(function (props, ref) {
7295
- var _Object$keys;
7296
- var _useState = React.useState(false),
7297
- isOpen = _useState[0],
7298
- setIsOpen = _useState[1];
7299
- var _useState2 = React.useState([]),
7300
- listOptions = _useState2[0],
7301
- setListOptions = _useState2[1];
7302
- var selectRef = React.useRef(null);
7303
- var _useState3 = React.useState(""),
7304
- error = _useState3[0],
7305
- _setError = _useState3[1];
7306
7451
  var _props$label = props.label,
7307
7452
  label = _props$label === void 0 ? "" : _props$label,
7453
+ _props$labelClassName = props.labelClassName,
7454
+ labelClassName = _props$labelClassName === void 0 ? "" : _props$labelClassName,
7308
7455
  _props$placeholder = props.placeholder,
7309
7456
  placeholder = _props$placeholder === void 0 ? "" : _props$placeholder,
7310
7457
  _props$className = props.className,
7311
7458
  className = _props$className === void 0 ? "" : _props$className,
7312
7459
  _props$rules = props.rules,
7313
7460
  rules = _props$rules === void 0 ? [] : _props$rules,
7314
- _props$options = props.options,
7315
- options = _props$options === void 0 ? [] : _props$options,
7316
- _props$value = props.value,
7317
- value = _props$value === void 0 ? [] : _props$value,
7318
- _props$renderItem = props.renderItem,
7319
- renderItem = _props$renderItem === void 0 ? function () {} : _props$renderItem,
7320
- displayItem = props.displayItem,
7321
- searchOption = props.searchOption,
7322
- handleSearchOption = props.handleSearchOption;
7461
+ options = props.options,
7462
+ _props$defaultValue = props.defaultValue,
7463
+ defaultValue = _props$defaultValue === void 0 ? {} : _props$defaultValue,
7464
+ handleSearchOption = props.handleSearchOption,
7465
+ _props$wrapClassName = props.wrapClassName,
7466
+ wrapClassName = _props$wrapClassName === void 0 ? "" : _props$wrapClassName,
7467
+ _props$isMulti = props.isMulti,
7468
+ isMulti = _props$isMulti === void 0 ? false : _props$isMulti,
7469
+ _props$onClick = props.onClick,
7470
+ onClick = _props$onClick === void 0 ? function () {} : _props$onClick,
7471
+ _props$isButtonDelete = props.isButtonDelete,
7472
+ isButtonDelete = _props$isButtonDelete === void 0 ? false : _props$isButtonDelete,
7473
+ _props$funcDelete = props.funcDelete,
7474
+ funcDelete = _props$funcDelete === void 0 ? function () {} : _props$funcDelete,
7475
+ _props$isSearch = props.isSearch,
7476
+ isSearch = _props$isSearch === void 0 ? true : _props$isSearch;
7477
+ var _useState = React.useState(false),
7478
+ isOpen = _useState[0],
7479
+ setIsOpen = _useState[1];
7480
+ var selectRef = React.useRef(null);
7481
+ var _useState2 = React.useState(""),
7482
+ error = _useState2[0],
7483
+ _setError = _useState2[1];
7484
+ var _useState3 = React.useState(""),
7485
+ inputSearch = _useState3[0],
7486
+ setInputSearch = _useState3[1];
7487
+ var _useState4 = React.useState(defaultValue),
7488
+ value = _useState4[0],
7489
+ setValue = _useState4[1];
7490
+ var _useState5 = React.useState(options),
7491
+ listOptions = _useState5[0],
7492
+ setListOptions = _useState5[1];
7323
7493
  var dropdownRef = React.useRef(null);
7324
- var _useState4 = React.useState('bottom'),
7325
- dropdownPosition = _useState4[0],
7326
- setDropdownPosition = _useState4[1];
7494
+ var _useState6 = React.useState('bottom'),
7495
+ dropdownPosition = _useState6[0],
7496
+ setDropdownPosition = _useState6[1];
7497
+ var inputRef = React.useRef(null);
7498
+ React.useEffect(function () {
7499
+ if (isMulti) return;else {
7500
+ setIsOpen(false);
7501
+ setInputSearch("");
7502
+ setListOptions(options);
7503
+ }
7504
+ }, [value]);
7505
+ React.useEffect(function () {
7506
+ if (isMulti) setValue(defaultValue);
7507
+ }, [defaultValue]);
7508
+ React.useEffect(function () {
7509
+ setListOptions(options);
7510
+ if (!isMulti) {
7511
+ setValue({});
7512
+ }
7513
+ }, [options]);
7327
7514
  React.useEffect(function () {
7515
+ var _inputRef$current;
7516
+ inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
7328
7517
  var updateDropdownPosition = function updateDropdownPosition() {
7329
7518
  if (selectRef.current && dropdownRef.current) {
7330
- var selectRect = selectRef.current.getBoundingClientRect();
7331
- var spaceBelow = window.innerHeight - selectRect.bottom;
7332
- var spaceAbove = selectRect.top;
7519
+ var _selectRef$current, _window;
7520
+ var selectRect = selectRef === null || selectRef === void 0 ? void 0 : (_selectRef$current = selectRef.current) === null || _selectRef$current === void 0 ? void 0 : _selectRef$current.getBoundingClientRect();
7521
+ var spaceBelow = ((_window = window) === null || _window === void 0 ? void 0 : _window.innerHeight) - (selectRect === null || selectRect === void 0 ? void 0 : selectRect.bottom);
7522
+ var spaceAbove = selectRect === null || selectRect === void 0 ? void 0 : selectRect.top;
7333
7523
  if (spaceBelow < spaceAbove) {
7334
7524
  setDropdownPosition('top');
7335
7525
  } else {
@@ -7346,17 +7536,19 @@ var Select = React.forwardRef(function (props, ref) {
7346
7536
  };
7347
7537
  }, [isOpen]);
7348
7538
  var handleClickOutside = function handleClickOutside(event) {
7349
- if (selectRef.current && !selectRef.current.contains(event.target)) {
7539
+ var _selectRef$current2;
7540
+ if (selectRef !== null && selectRef !== void 0 && selectRef.current && !(selectRef !== null && selectRef !== void 0 && (_selectRef$current2 = selectRef.current) !== null && _selectRef$current2 !== void 0 && _selectRef$current2.contains(event.target))) {
7350
7541
  setIsOpen(false);
7542
+ setInputSearch("");
7543
+ setListOptions(options);
7351
7544
  }
7352
7545
  };
7353
7546
  React.useEffect(function () {
7354
- setListOptions(options);
7355
7547
  document.addEventListener('click', handleClickOutside);
7356
7548
  return function () {
7357
7549
  document.removeEventListener('click', handleClickOutside);
7358
7550
  };
7359
- }, [options]);
7551
+ }, []);
7360
7552
  React.useImperativeHandle(ref, function () {
7361
7553
  return {
7362
7554
  validateData: function validateData() {
@@ -7367,13 +7559,18 @@ var Select = React.forwardRef(function (props, ref) {
7367
7559
  }
7368
7560
  };
7369
7561
  });
7562
+ var isEmpty = function isEmpty(value) {
7563
+ var _Object$keys;
7564
+ if (Array !== null && Array !== void 0 && Array.isArray(value)) return (value === null || value === void 0 ? void 0 : value.length) <= 0;
7565
+ if (typeof value === 'object') return (Object === null || Object === void 0 ? void 0 : (_Object$keys = Object.keys(value)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.length) <= 0;
7566
+ return false;
7567
+ };
7370
7568
  var _validateData = function _validateData() {
7371
7569
  var count = 0;
7372
7570
  for (var _iterator = _createForOfIteratorHelperLoose(rules), _step; !(_step = _iterator()).done;) {
7373
7571
  var _e$pattern;
7374
7572
  var e = _step.value;
7375
- if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && (value === null || value === void 0 ? void 0 : value.length) <= 0) {
7376
- console.log("chưa chọn gì");
7573
+ if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && isEmpty(value)) {
7377
7574
  _setError(e === null || e === void 0 ? void 0 : e.message);
7378
7575
  count++;
7379
7576
  break;
@@ -7391,8 +7588,40 @@ var Select = React.forwardRef(function (props, ref) {
7391
7588
  }
7392
7589
  };
7393
7590
  var handleSearch = function handleSearch(e) {
7394
- var listOptions = handleSearchOption(e);
7395
- setListOptions(listOptions);
7591
+ var searchValue = e.target.value;
7592
+ setInputSearch(searchValue);
7593
+ if (handleSearchOption && typeof handleSearchOption === 'function') {
7594
+ handleSearchOption(searchValue);
7595
+ } else {
7596
+ var listFilterOptions = options.filter(function (item) {
7597
+ var _item$label;
7598
+ return item === null || item === void 0 ? void 0 : (_item$label = item.label) === null || _item$label === void 0 ? void 0 : _item$label.toLowerCase().includes(searchValue === null || searchValue === void 0 ? void 0 : searchValue.toLowerCase());
7599
+ });
7600
+ setListOptions(listFilterOptions);
7601
+ }
7602
+ };
7603
+ var handleToggleSelect = function handleToggleSelect() {
7604
+ if (!isOpen && handleSearchOption && typeof handleSearchOption === 'function') {
7605
+ handleSearchOption("");
7606
+ }
7607
+ setIsOpen(!isOpen);
7608
+ setInputSearch("");
7609
+ setListOptions(options);
7610
+ };
7611
+ var checkSelection = function checkSelection(valueId) {
7612
+ if (isMulti) return value === null || value === void 0 ? void 0 : value.some(function (item) {
7613
+ return (item === null || item === void 0 ? void 0 : item.value) === valueId;
7614
+ });
7615
+ return (value === null || value === void 0 ? void 0 : value.value) == valueId;
7616
+ };
7617
+ var handleSelection = function handleSelection(item) {
7618
+ if (isMulti === false) setValue(item);
7619
+ onClick === null || onClick === void 0 ? void 0 : onClick(item);
7620
+ };
7621
+ var handleDeleteSelection = function handleDeleteSelection(e, item) {
7622
+ e.stopPropagation();
7623
+ if (isMulti === false) setValue({});
7624
+ funcDelete === null || funcDelete === void 0 ? void 0 : funcDelete(item);
7396
7625
  };
7397
7626
  var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
7398
7627
  return (e === null || e === void 0 ? void 0 : e.type) === "required";
@@ -7402,21 +7631,25 @@ var Select = React.forwardRef(function (props, ref) {
7402
7631
  }, " *") : null;
7403
7632
  return /*#__PURE__*/React__default.createElement("div", {
7404
7633
  ref: selectRef,
7405
- className: className + " relative "
7634
+ className: wrapClassName + " relative "
7406
7635
  }, label ? /*#__PURE__*/React__default.createElement("div", {
7407
- className: "mb-1"
7408
- }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
7409
- className: className + " bg-white rounded-lg"
7636
+ className: labelClassName + " mb-1"
7637
+ }, label, " ", labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
7638
+ className: className + " flex flex-col gap-2 rounded-lg"
7410
7639
  }, /*#__PURE__*/React__default.createElement("button", {
7411
- className: "w-full h-10 bg-transparent flex justify-between items-center px-3 py-2",
7412
- onClick: function onClick() {
7413
- setIsOpen(!isOpen);
7414
- }
7415
- }, 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", {
7416
- className: "flex justify-between items-center w-full"
7640
+ className: "w-full h-10 bg-transparent flex justify-between items-center px-3 py-2",
7641
+ onClick: handleToggleSelect
7417
7642
  }, /*#__PURE__*/React__default.createElement("div", {
7643
+ className: "flex justify-between items-center w-full"
7644
+ }, isEmpty(value) || isMulti ? /*#__PURE__*/React__default.createElement("div", {
7418
7645
  className: "text-gray3 line-clamp-1"
7419
- }, placeholder), /*#__PURE__*/React__default.createElement("div", {
7646
+ }, placeholder) : /*#__PURE__*/React__default.createElement("div", {
7647
+ className: "line-clamp-1"
7648
+ }, value === null || value === void 0 ? void 0 : value.label), isButtonDelete && !isEmpty(value) ? /*#__PURE__*/React__default.createElement("div", {
7649
+ onClick: function onClick(e) {
7650
+ handleDeleteSelection(e, value);
7651
+ }
7652
+ }, /*#__PURE__*/React__default.createElement(rx.RxCross2, null)) : /*#__PURE__*/React__default.createElement("div", {
7420
7653
  className: "ms-1"
7421
7654
  }, /*#__PURE__*/React__default.createElement(fa.FaAngleUp, {
7422
7655
  className: "text-xs"
@@ -7427,21 +7660,32 @@ var Select = React.forwardRef(function (props, ref) {
7427
7660
  style: {
7428
7661
  background: "#FFFFFF"
7429
7662
  },
7430
- className: className + " absolute p-1 my-2 rounded-2xl w-full z-50 border " + (dropdownPosition === 'top' ? 'bottom-full mb-2' : 'top-full mt-2')
7431
- }, /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
7663
+ className: className + " overflow-y-auto max-h-72 absolute p-1 my-2 rounded-2xl w-full z-50 border " + (dropdownPosition === 'top' ? 'bottom-full mb-2' : 'top-full mt-2')
7664
+ }, /*#__PURE__*/React__default.createElement("div", null, isSearch ? /*#__PURE__*/React__default.createElement("div", {
7432
7665
  className: "px-3 flex items-center border-b-[1px]"
7433
7666
  }, /*#__PURE__*/React__default.createElement(lu.LuSearch, {
7434
7667
  className: "inline text-gray3 me-2"
7435
7668
  }), /*#__PURE__*/React__default.createElement("input", {
7436
7669
  type: "text",
7670
+ ref: inputRef,
7437
7671
  className: "py-2 w-full border-0 focus:outline-none focus:ring-0",
7438
7672
  placeholder: "T\xECm ki\u1EBFm",
7439
- value: searchOption,
7673
+ value: inputSearch,
7440
7674
  onChange: function onChange(e) {
7441
7675
  handleSearch(e);
7442
7676
  }
7443
- })), /*#__PURE__*/React__default.createElement("div", null, listOptions && listOptions.length > 0 ? listOptions.map(function (item, index) {
7444
- return renderItem(item, index);
7677
+ })) : null, /*#__PURE__*/React__default.createElement("div", null, (listOptions === null || listOptions === void 0 ? void 0 : listOptions.length) > 0 ? listOptions === null || listOptions === void 0 ? void 0 : listOptions.map(function (item, index) {
7678
+ return /*#__PURE__*/React__default.createElement("div", {
7679
+ key: "gjfd-" + index,
7680
+ className: "px-2 cursor-default py-1.5 flex items-center hover:bg-gray-100 rounded-lg",
7681
+ onClick: function onClick() {
7682
+ handleSelection(item);
7683
+ }
7684
+ }, /*#__PURE__*/React__default.createElement(io.IoMdCheckmark, {
7685
+ className: (checkSelection(item === null || item === void 0 ? void 0 : item.value) ? "" : 'invisible') + " inline me-2 w-4"
7686
+ }), /*#__PURE__*/React__default.createElement("div", {
7687
+ className: " whitespace-nowrap line-clamp-1"
7688
+ }, item === null || item === void 0 ? void 0 : item.label));
7445
7689
  }) : /*#__PURE__*/React__default.createElement("div", {
7446
7690
  className: "py-6 text-center"
7447
7691
  }, "Kh\xF4ng c\xF3 k\u1EBFt qu\u1EA3")))) : null), error ? /*#__PURE__*/React__default.createElement("div", {
@@ -7551,13 +7795,19 @@ var InputPhoneNumber = React.forwardRef(function (props, ref) {
7551
7795
  _props$type = props.type,
7552
7796
  type = _props$type === void 0 ? "text" : _props$type,
7553
7797
  _props$rules = props.rules,
7554
- rules = _props$rules === void 0 ? [] : _props$rules;
7798
+ rules = _props$rules === void 0 ? [] : _props$rules,
7799
+ _props$wrapClassName = props.wrapClassName,
7800
+ wrapClassName = _props$wrapClassName === void 0 ? "" : _props$wrapClassName,
7801
+ inputClassName = props.inputClassName;
7555
7802
  var _useState = React.useState(defaultValue),
7556
7803
  value = _useState[0],
7557
7804
  _setValue = _useState[1];
7558
- var _useState2 = React.useState(""),
7559
- error = _useState2[0],
7560
- _setError = _useState2[1];
7805
+ var _useState2 = React.useState({}),
7806
+ countryCode = _useState2[0],
7807
+ setCountryCode = _useState2[1];
7808
+ var _useState3 = React.useState(""),
7809
+ error = _useState3[0],
7810
+ _setError = _useState3[1];
7561
7811
  var handleOnChange = function handleOnChange(event) {
7562
7812
  var value = event.target.value;
7563
7813
  _setValue(value);
@@ -7607,27 +7857,25 @@ var InputPhoneNumber = React.forwardRef(function (props, ref) {
7607
7857
  var labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
7608
7858
  className: "text-danger"
7609
7859
  }, " *") : null;
7610
- var _className = "h-10 px-2 focus:outline-none focus:ring-0 " + className;
7611
- var data = [{
7612
- country: "Việt Nam",
7613
- code: "+84"
7614
- }];
7860
+ var _inputClassName = "h-10 px-2 focus:outline-none focus:ring-0 " + inputClassName;
7861
+ var data = React.useCallback([{
7862
+ label: "+84",
7863
+ value: "+84"
7864
+ }], []);
7615
7865
  return /*#__PURE__*/React__default.createElement("div", {
7616
- className: "flex flex-col px-2 py-1"
7617
- }, label ? /*#__PURE__*/React__default.createElement("label", null, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
7618
- className: "flex items-center h-10 bg-white rounded-lg"
7866
+ className: wrapClassName + " flex flex-col"
7867
+ }, label ? /*#__PURE__*/React__default.createElement("label", {
7868
+ className: "mb-1"
7869
+ }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
7870
+ className: "flex items-center h-10 rounded-lg px-2 py-1 " + className
7619
7871
  }, /*#__PURE__*/React__default.createElement("button", {
7620
7872
  className: "flex items-center border-r-2"
7621
7873
  }, /*#__PURE__*/React__default.createElement(Select$1, {
7622
7874
  className: 'w-max',
7875
+ defaultValue: countryCode,
7623
7876
  options: data,
7624
7877
  placeholder: "+84",
7625
- renderItem: function renderItem(item, index) {
7626
- return /*#__PURE__*/React__default.createElement("div", {
7627
- key: "dd\u01B0vhu-" + index,
7628
- className: "px-2 flex items-center hover:bg-gray-200 rounded-lg whitespace-nowrap v-max"
7629
- }, item === null || item === void 0 ? void 0 : item.code, "-", item === null || item === void 0 ? void 0 : item.country);
7630
- }
7878
+ onClick: setCountryCode
7631
7879
  })), /*#__PURE__*/React__default.createElement("input", {
7632
7880
  type: type,
7633
7881
  name: name,
@@ -7635,7 +7883,7 @@ var InputPhoneNumber = React.forwardRef(function (props, ref) {
7635
7883
  placeholder: placeholder,
7636
7884
  onChange: handleOnChange,
7637
7885
  required: required,
7638
- className: _className
7886
+ className: _inputClassName
7639
7887
  })), error ? /*#__PURE__*/React__default.createElement("div", {
7640
7888
  className: "text-danger"
7641
7889
  }, error) : null);
@@ -7676,15 +7924,18 @@ var BookingForm = function BookingForm(props) {
7676
7924
  var _useState2 = React.useState({
7677
7925
  types: "1,10"
7678
7926
  }),
7679
- productsParams = _useState2[0];
7927
+ productsParams = _useState2[0],
7928
+ setProductsParams = _useState2[1];
7680
7929
  var _useState3 = React.useState(false);
7681
- var _useState4 = React.useState(new Date());
7682
- var _useState5 = React.useState(defaultValue),
7683
- listProductSelected = _useState5[0],
7684
- setListProductSelected = _useState5[1];
7685
- var _useState6 = React.useState(""),
7686
- searchOption = _useState6[0],
7687
- setSearchOption = _useState6[1];
7930
+ var _useState4 = React.useState(defaultValue),
7931
+ listProductSelected = _useState4[0],
7932
+ setListProductSelected = _useState4[1];
7933
+ var _useState5 = React.useState([]),
7934
+ listEmploymentMapping = _useState5[0],
7935
+ setListEmploymentMapping = _useState5[1];
7936
+ var _useState6 = React.useState([]),
7937
+ productsMapping = _useState6[0],
7938
+ setProductsMapping = _useState6[1];
7688
7939
  var inputNameRef = React.useRef(null);
7689
7940
  var inputDateRef = React.useRef(null);
7690
7941
  var inputPhoneNumberRef = React.useRef(null);
@@ -7706,38 +7957,57 @@ var BookingForm = function BookingForm(props) {
7706
7957
  var _BookingController = BookingController(props),
7707
7958
  _BookingController$cr = _BookingController.createSchedule,
7708
7959
  createSchedule = _BookingController$cr === void 0 ? function () {} : _BookingController$cr;
7709
- var handleSelectedProduct = function handleSelectedProduct(event, productSelected) {
7710
- event.stopPropagation();
7711
- console.log("check:", listProductSelected);
7712
- var isExist = listProductSelected.some(function (item) {
7713
- var _item$product;
7714
- 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);
7960
+ React.useEffect(function () {
7961
+ var mappingProducts = products === null || products === void 0 ? void 0 : products.map(function (item) {
7962
+ var _item$productInfo, _item$productInfo2;
7963
+ return _extends({}, item, {
7964
+ label: item === null || item === void 0 ? void 0 : (_item$productInfo = item.productInfo) === null || _item$productInfo === void 0 ? void 0 : _item$productInfo.productName,
7965
+ value: item === null || item === void 0 ? void 0 : (_item$productInfo2 = item.productInfo) === null || _item$productInfo2 === void 0 ? void 0 : _item$productInfo2.productId
7966
+ });
7967
+ });
7968
+ setProductsMapping(mappingProducts);
7969
+ }, [products]);
7970
+ React.useEffect(function () {
7971
+ var mappingListEmployment = listEmployment === null || listEmployment === void 0 ? void 0 : listEmployment.map(function (item) {
7972
+ return _extends({}, item, {
7973
+ label: (item === null || item === void 0 ? void 0 : item.name) + " (" + (item === null || item === void 0 ? void 0 : item.roleName) + ")",
7974
+ value: item === null || item === void 0 ? void 0 : item.sysUserId
7975
+ });
7976
+ });
7977
+ setListEmploymentMapping(mappingListEmployment);
7978
+ }, [listEmployment]);
7979
+ var handleSelectedProduct = function handleSelectedProduct(element) {
7980
+ var isExist = listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.some(function (item) {
7981
+ var _item$productInfo3, _element$productInfo;
7982
+ return (item === null || item === void 0 ? void 0 : (_item$productInfo3 = item.productInfo) === null || _item$productInfo3 === void 0 ? void 0 : _item$productInfo3.productId) === (element === null || element === void 0 ? void 0 : (_element$productInfo = element.productInfo) === null || _element$productInfo === void 0 ? void 0 : _element$productInfo.productId);
7715
7983
  });
7716
7984
  if (isExist) {
7717
7985
  setListProductSelected(function (prev) {
7718
- return prev.filter(function (item) {
7719
- var _item$product2;
7720
- 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);
7986
+ return prev === null || prev === void 0 ? void 0 : prev.filter(function (item) {
7987
+ var _item$productInfo4, _element$productInfo2;
7988
+ return (item === null || item === void 0 ? void 0 : (_item$productInfo4 = item.productInfo) === null || _item$productInfo4 === void 0 ? void 0 : _item$productInfo4.productId) !== (element === null || element === void 0 ? void 0 : (_element$productInfo2 = element.productInfo) === null || _element$productInfo2 === void 0 ? void 0 : _element$productInfo2.productId);
7721
7989
  });
7722
7990
  });
7723
7991
  } else {
7724
7992
  setListProductSelected(function (prev) {
7725
- return [].concat(prev, [{
7726
- product: productSelected,
7993
+ return [].concat(prev, [_extends({}, element, {
7727
7994
  quantity: 1,
7728
7995
  technical: {},
7729
7996
  oldService: false
7730
- }]);
7997
+ })]);
7731
7998
  });
7732
7999
  }
7733
8000
  };
7734
- var checkProductSelected = function checkProductSelected(productId) {
7735
- if (listProductSelected && listProductSelected.length > 0) return listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.some(function (item) {
7736
- var _item$product3;
7737
- return (item === null || item === void 0 ? void 0 : (_item$product3 = item.product) === null || _item$product3 === void 0 ? void 0 : _item$product3.productId) === productId;
8001
+ var handleRemoveProductSelected = function handleRemoveProductSelected(e, element) {
8002
+ e.stopPropagation();
8003
+ setListProductSelected(function (prev) {
8004
+ return prev === null || prev === void 0 ? void 0 : prev.filter(function (item) {
8005
+ var _item$productInfo5, _element$productInfo3;
8006
+ return (item === null || item === void 0 ? void 0 : (_item$productInfo5 = item.productInfo) === null || _item$productInfo5 === void 0 ? void 0 : _item$productInfo5.productId) !== (element === null || element === void 0 ? void 0 : (_element$productInfo3 = element.productInfo) === null || _element$productInfo3 === void 0 ? void 0 : _element$productInfo3.productId);
8007
+ });
7738
8008
  });
7739
8009
  };
7740
- var handleChooseTechnical = function handleChooseTechnical(technicalSelected, index) {
8010
+ var handleChooseTechnical = function handleChooseTechnical(index, technicalSelected) {
7741
8011
  setListProductSelected(function (prev) {
7742
8012
  var updateListSelected = [].concat(prev);
7743
8013
  updateListSelected[index] = _extends({}, updateListSelected[index], {
@@ -7757,37 +8027,18 @@ var BookingForm = function BookingForm(props) {
7757
8027
  });
7758
8028
  }
7759
8029
  };
7760
- var checkTechnicalSelected = function checkTechnicalSelected(technicalStaffIds, index) {
7761
- var _listProductSelected$, _listProductSelected$2;
7762
- 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;
7763
- };
7764
- var removeTechnicalSelected = function removeTechnicalSelected(event, index) {
7765
- event.stopPropagation();
8030
+ var removeTechnicalSelected = function removeTechnicalSelected(productId, technical) {
7766
8031
  setListProductSelected(function (prev) {
7767
- var updateListSelected = [].concat(prev);
7768
- updateListSelected[index] = _extends({}, updateListSelected[index], {
7769
- technical: {}
8032
+ return prev.map(function (product) {
8033
+ var _product$productInfo;
8034
+ if ((product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.productId) === productId) {
8035
+ return _extends({}, product, {
8036
+ technical: {}
8037
+ });
8038
+ }
8039
+ return product;
7770
8040
  });
7771
- return updateListSelected;
7772
- });
7773
- };
7774
- var handleSearchService = function handleSearchService(e) {
7775
- var searchValue = e.target.value;
7776
- setSearchOption(searchValue);
7777
- var listCopy = products.filter(function (item) {
7778
- var _item$productInfo, _item$productInfo$pro;
7779
- 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());
7780
- });
7781
- return listCopy;
7782
- };
7783
- var handleSearchTechnical = function handleSearchTechnical(e) {
7784
- var searchValue = e.target.value;
7785
- setSearchOption(searchValue);
7786
- var listCopy = listEmployment.filter(function (item) {
7787
- var _item$name;
7788
- 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());
7789
8041
  });
7790
- return listCopy;
7791
8042
  };
7792
8043
  var handleSubmit = function handleSubmit() {
7793
8044
  try {
@@ -7803,9 +8054,9 @@ var BookingForm = function BookingForm(props) {
7803
8054
  var customerName = inputNameRef === null || inputNameRef === void 0 ? void 0 : (_inputNameRef$current2 = inputNameRef.current) === null || _inputNameRef$current2 === void 0 ? void 0 : _inputNameRef$current2.getValue();
7804
8055
  var scheduleDate = inputDateRef === null || inputDateRef === void 0 ? void 0 : (_inputDateRef$current2 = inputDateRef.current) === null || _inputDateRef$current2 === void 0 ? void 0 : _inputDateRef$current2.getValue();
7805
8056
  var services = listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.map(function (item) {
7806
- var _item$product4, _item$technical;
8057
+ var _item$productInfo6, _item$technical;
7807
8058
  return {
7808
- productId: item === null || item === void 0 ? void 0 : (_item$product4 = item.product) === null || _item$product4 === void 0 ? void 0 : _item$product4.productId,
8059
+ productId: item === null || item === void 0 ? void 0 : (_item$productInfo6 = item.productInfo) === null || _item$productInfo6 === void 0 ? void 0 : _item$productInfo6.productId,
7809
8060
  technicalStaffIds: [item === null || item === void 0 ? void 0 : (_item$technical = item.technical) === null || _item$technical === void 0 ? void 0 : _item$technical.sysUserId],
7810
8061
  quantity: item === null || item === void 0 ? void 0 : item.quantity,
7811
8062
  oldService: item === null || item === void 0 ? void 0 : item.oldService
@@ -7835,6 +8086,13 @@ var BookingForm = function BookingForm(props) {
7835
8086
  setIsOpenPopup(false);
7836
8087
  setDataBooking({});
7837
8088
  };
8089
+ var handleSearchProducts = function handleSearchProducts(value) {
8090
+ setProductsParams(function (prev) {
8091
+ return _extends({}, prev, {
8092
+ productName: value
8093
+ });
8094
+ });
8095
+ };
7838
8096
  return /*#__PURE__*/React__default.createElement("div", {
7839
8097
  className: "grid gap-4 rounded-lg p-6 " + className,
7840
8098
  style: {
@@ -7864,37 +8122,26 @@ var BookingForm = function BookingForm(props) {
7864
8122
  pattern: pattern === null || pattern === void 0 ? void 0 : pattern.phoneNumberPattern,
7865
8123
  message: "Số điện thoại không hợp lệ!"
7866
8124
  }],
7867
- className: "w-full rounded-lg"
8125
+ className: "w-full rounded-lg rounded-lg bg-bgSecondary",
8126
+ inputClassName: "w-full"
7868
8127
  })), /*#__PURE__*/React__default.createElement("div", {
7869
8128
  className: "grid grid-cols-1 gap-4"
7870
8129
  }, /*#__PURE__*/React__default.createElement("div", {
7871
8130
  className: "relative"
7872
8131
  }, /*#__PURE__*/React__default.createElement(Select$1, {
7873
8132
  ref: inputSelectedRef,
7874
- searchOption: searchOption,
7875
- handleSearchOption: handleSearchService,
7876
- value: listProductSelected,
8133
+ isMulti: true,
8134
+ defaultValue: listProductSelected,
8135
+ onClick: handleSelectedProduct,
8136
+ handleSearchOption: handleSearchProducts,
8137
+ className: "bg-bgSecondary rounded-lg",
7877
8138
  rules: [{
7878
8139
  type: "required",
7879
8140
  message: "Bắt buộc chọn dịch vụ"
7880
8141
  }],
7881
8142
  label: "Dịch vụ",
7882
8143
  placeholder: "Chọn dịch vụ",
7883
- options: products,
7884
- renderItem: function renderItem(item, index) {
7885
- var _item$productInfo2, _item$productInfo3;
7886
- return /*#__PURE__*/React__default.createElement("div", {
7887
- key: "dfjsvsjvhu-" + index,
7888
- className: "px-2 py-1.5 flex items-center hover:bg-gray-100 rounded-lg",
7889
- onClick: function onClick(event) {
7890
- handleSelectedProduct(event, item === null || item === void 0 ? void 0 : item.productInfo);
7891
- }
7892
- }, /*#__PURE__*/React__default.createElement(io.IoMdCheckmark, {
7893
- 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"
7894
- }), /*#__PURE__*/React__default.createElement("div", {
7895
- className: " whitespace-nowrap line-clamp-1"
7896
- }, item === null || item === void 0 ? void 0 : (_item$productInfo3 = item.productInfo) === null || _item$productInfo3 === void 0 ? void 0 : _item$productInfo3.productName));
7897
- }
8144
+ options: productsMapping
7898
8145
  })), /*#__PURE__*/React__default.createElement(DateTimePicker, {
7899
8146
  ref: inputDateRef,
7900
8147
  label: "Thời gian",
@@ -7907,7 +8154,7 @@ var BookingForm = function BookingForm(props) {
7907
8154
  })), (listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
7908
8155
  className: "grid grid-cols-1"
7909
8156
  }, /*#__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) {
7910
- var _item$product5;
8157
+ var _item$productInfo7;
7911
8158
  return /*#__PURE__*/React__default.createElement("div", {
7912
8159
  className: "w-full bg-transparent border-b-2 py-3 grid grid-col-12 gap-2",
7913
8160
  key: "ohoihtr-" + optionIndex
@@ -7919,12 +8166,12 @@ var BookingForm = function BookingForm(props) {
7919
8166
  className: "col-span-10"
7920
8167
  }, /*#__PURE__*/React__default.createElement("div", {
7921
8168
  className: "col-span-10 font-semibold "
7922
- }, 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", {
8169
+ }, item === null || item === void 0 ? void 0 : (_item$productInfo7 = item.productInfo) === null || _item$productInfo7 === void 0 ? void 0 : _item$productInfo7.productName)), /*#__PURE__*/React__default.createElement("div", {
7923
8170
  className: "col-span-1 flex justify-center px-2"
7924
8171
  }, /*#__PURE__*/React__default.createElement("div", {
7925
8172
  className: "flex items-center justify-center cursor-pointer",
7926
8173
  onClick: function onClick(event) {
7927
- handleSelectedProduct(event, item === null || item === void 0 ? void 0 : item.product);
8174
+ handleRemoveProductSelected(event, item);
7928
8175
  }
7929
8176
  }, /*#__PURE__*/React__default.createElement(rx.RxCross2, {
7930
8177
  className: "text-base ",
@@ -7953,40 +8200,20 @@ var BookingForm = function BookingForm(props) {
7953
8200
  }
7954
8201
  })), /*#__PURE__*/React__default.createElement("div", {
7955
8202
  className: "col-end-13 col-span-8 flex flex-col gap-2 "
7956
- }, /*#__PURE__*/React__default.createElement("div", {
7957
- className: "font-semibold text-sm mb-1"
7958
- }, "K\u1EF9 thu\u1EADt vi\xEAn"), /*#__PURE__*/React__default.createElement(Select$1, {
8203
+ }, /*#__PURE__*/React__default.createElement(Select$1, {
7959
8204
  placeholder: "Ch\u1ECDn k\u1EF9 thu\u1EADt vi\xEAn",
7960
- searchOption: searchOption,
7961
- handleSearchOption: handleSearchTechnical,
7962
- value: item === null || item === void 0 ? void 0 : item.technical,
7963
- className: "w-full border rounded-lg",
7964
- displayItem: function displayItem(technicalSelected) {
7965
- return /*#__PURE__*/React__default.createElement("div", {
7966
- className: "flex justify-between items-center w-full"
7967
- }, /*#__PURE__*/React__default.createElement("div", {
7968
- className: "line-clamp-1 text-start "
7969
- }, technicalSelected === null || technicalSelected === void 0 ? void 0 : technicalSelected.name, "(", technicalSelected === null || technicalSelected === void 0 ? void 0 : technicalSelected.roleName, ")"), /*#__PURE__*/React__default.createElement("div", {
7970
- onClick: function onClick(event) {
7971
- removeTechnicalSelected(event, optionIndex);
7972
- }
7973
- }, /*#__PURE__*/React__default.createElement(rx.RxCross2, {
7974
- className: "text-xs"
7975
- })));
8205
+ label: "K\u1EF9 thu\u1EADt vi\xEAn",
8206
+ wrapClassName: "flex flex-col gap-2",
8207
+ labelClassName: "font-semibold text-sm",
8208
+ className: "w-full bg-bgSecondary border rounded-lg",
8209
+ onClick: function onClick(technical) {
8210
+ handleChooseTechnical(optionIndex, technical);
7976
8211
  },
7977
- options: listEmployment,
7978
- renderItem: function renderItem(employee, index) {
7979
- return /*#__PURE__*/React__default.createElement("div", {
7980
- key: "dds32vsjvhu-" + index,
7981
- 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",
7982
- onClick: function onClick() {
7983
- handleChooseTechnical(employee, optionIndex);
7984
- }
7985
- }, /*#__PURE__*/React__default.createElement(io.IoMdCheckmark, {
7986
- 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"
7987
- }), /*#__PURE__*/React__default.createElement("div", {
7988
- className: "hover:bg-gray-100 rounded-lg text-wrap md:text-base text-xs"
7989
- }, employee === null || employee === void 0 ? void 0 : employee.name, "(", employee === null || employee === void 0 ? void 0 : employee.roleName, ")"));
8212
+ options: listEmploymentMapping,
8213
+ isButtonDelete: true,
8214
+ funcDelete: function funcDelete(technical) {
8215
+ var _item$productInfo8;
8216
+ removeTechnicalSelected(item === null || item === void 0 ? void 0 : (_item$productInfo8 = item.productInfo) === null || _item$productInfo8 === void 0 ? void 0 : _item$productInfo8.productId);
7990
8217
  }
7991
8218
  }))));
7992
8219
  })) : null, /*#__PURE__*/React__default.createElement("div", {
@@ -8053,13 +8280,15 @@ var Treatments1 = function Treatments1(props) {
8053
8280
  console.log("treatment1:", products);
8054
8281
  var handleOpenModalBooking = function handleOpenModalBooking(event, data) {
8055
8282
  try {
8283
+ var _data$productInfo, _data$productInfo2;
8056
8284
  event.stopPropagation();
8057
- setDataBooking([{
8058
- product: data,
8285
+ setDataBooking([_extends({}, data, {
8059
8286
  quantity: 1,
8060
8287
  technical: {},
8061
- oldService: false
8062
- }]);
8288
+ oldService: false,
8289
+ label: data === null || data === void 0 ? void 0 : (_data$productInfo = data.productInfo) === null || _data$productInfo === void 0 ? void 0 : _data$productInfo.productName,
8290
+ value: data === null || data === void 0 ? void 0 : (_data$productInfo2 = data.productInfo) === null || _data$productInfo2 === void 0 ? void 0 : _data$productInfo2.productId
8291
+ })]);
8063
8292
  setIsOpenModal(true);
8064
8293
  } catch (error) {
8065
8294
  console.log("::::::::::errrorrrrr::::::", error);
@@ -8067,7 +8296,6 @@ var Treatments1 = function Treatments1(props) {
8067
8296
  };
8068
8297
  var handleCloseModal = function handleCloseModal() {
8069
8298
  setIsOpenModal(false);
8070
- console.log("đóng::::");
8071
8299
  setDataBooking([]);
8072
8300
  };
8073
8301
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
@@ -8099,7 +8327,7 @@ var Treatments1 = function Treatments1(props) {
8099
8327
  shopConfigStyle: shopConfigStyle,
8100
8328
  className: "mt-4",
8101
8329
  onClick: function onClick(event) {
8102
- handleOpenModalBooking(event, product === null || product === void 0 ? void 0 : product.productInfo);
8330
+ handleOpenModalBooking(event, product);
8103
8331
  }
8104
8332
  })), /*#__PURE__*/React__default.createElement("div", {
8105
8333
  className: "hidden " + (index % 2 ? "md:block" : "")
@@ -8112,7 +8340,7 @@ var Treatments1 = function Treatments1(props) {
8112
8340
  }), isOpenModal ? /*#__PURE__*/React__default.createElement(ModalNotification, {
8113
8341
  onClose: handleCloseModal
8114
8342
  }, /*#__PURE__*/React__default.createElement(BookingForm, {
8115
- className: "overflow-y-scroll hide-scrollbar max-h-[80vh]",
8343
+ className: "overflow-y-auto hide-scrollbar max-h-[80vh]",
8116
8344
  onCloseFormBooking: handleCloseModal,
8117
8345
  defaultValue: dataBooking,
8118
8346
  shopConfig: shopConfig,
@@ -8237,39 +8465,6 @@ var ScrollHorizontal = function ScrollHorizontal(props) {
8237
8465
  }))));
8238
8466
  };
8239
8467
 
8240
- var getDurationValue = function getDurationValue(attributes) {
8241
- var _durationAtt$value, _durationAtt$unit;
8242
- if (!attributes) {
8243
- return "";
8244
- }
8245
- if (typeof attributes === "string") {
8246
- attributes = JSON.parse(attributes || "[]");
8247
- }
8248
- var durationAtt = attributes.find(function (attr) {
8249
- return attr.name === "Thời lượng (phút) / buổi";
8250
- });
8251
- 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]) || "") : "";
8252
- };
8253
- var genProductSlug = function genProductSlug(productName, id) {
8254
- var slug = productName.toLowerCase();
8255
- slug = slug.replace(/(à|á|ạ|ả|ã|â|ầ|ấ|ậ|ẩ|ẫ|ă|ằ|ắ|ặ|ẳ|ẵ)/g, "a");
8256
- slug = slug.replace(/(è|é|ẹ|ẻ|ẽ|ê|ề|ế|ệ|ể|ễ)/g, "e");
8257
- slug = slug.replace(/(ì|í|ị|ỉ|ĩ)/g, "i");
8258
- slug = slug.replace(/(ò|ó|ọ|ỏ|õ|ô|ồ|ố|ộ|ổ|ỗ|ơ|ờ|ớ|ợ|ở|ỡ)/g, "o");
8259
- slug = slug.replace(/(ù|ú|ụ|ủ|ũ|ư|ừ|ứ|ự|ử|ữ)/g, "u");
8260
- slug = slug.replace(/(ỳ|ý|ỵ|ỷ|ỹ)/g, "y");
8261
- slug = slug.replace(/(đ)/g, "d");
8262
- slug = slug.replace(/([^0-9a-z-\s])/g, "");
8263
- slug = slug.replace(/(\s+)/g, "-");
8264
- slug = slug.replace(/^-+/g, "");
8265
- slug = slug.replace(/-+$/g, "");
8266
- return slug + "-" + id;
8267
- };
8268
- var getLinkProductDetail = function getLinkProductDetail(product) {
8269
- var slug = genProductSlug(product === null || product === void 0 ? void 0 : product.productName, product === null || product === void 0 ? void 0 : product.productId);
8270
- return "/product/" + slug + "/" + (product === null || product === void 0 ? void 0 : product.shopId);
8271
- };
8272
-
8273
8468
  function getMinMax(array, field) {
8274
8469
  if (!(array !== null && array !== void 0 && array.length) || !array[0].hasOwnProperty(field)) {
8275
8470
  return null;
@@ -9164,15 +9359,20 @@ var ProductDetail10 = function ProductDetail10(props) {
9164
9359
  var indexOptions = variant.index.split(",");
9165
9360
  setVariant(variant);
9166
9361
  var options = (product === null || product === void 0 ? void 0 : product.optionValues) || [];
9167
- indexOptions.map(function (value, index) {
9168
- return options[index].valueIndex = value;
9362
+ options = options.map(function (e, i) {
9363
+ return _extends({}, e, {
9364
+ valueIndex: (indexOptions === null || indexOptions === void 0 ? void 0 : indexOptions[i]) || 0
9365
+ });
9169
9366
  });
9170
9367
  setOptions(options);
9171
9368
  };
9172
9369
  var selectOption = function selectOption(optionIndex, valueIndex) {
9173
9370
  console.log("selectOption optionIndex valueIndex", optionIndex, valueIndex);
9371
+ var newOption = _extends({}, options[optionIndex], {
9372
+ valueIndex: valueIndex
9373
+ });
9374
+ options.splice(optionIndex, 1, newOption);
9174
9375
  var newOptions = [].concat(options);
9175
- newOptions[optionIndex].valueIndex = valueIndex;
9176
9376
  setOptions(newOptions);
9177
9377
  console.log("newOptions", newOptions);
9178
9378
  var variant = getVariantFromOption(newOptions);
@@ -9935,61 +10135,775 @@ var Breadcrumb1 = function Breadcrumb1(props) {
9935
10135
  }));
9936
10136
  };
9937
10137
 
10138
+ var getRegionApi = function getRegionApi(parentId) {
10139
+ return api({
10140
+ method: "get",
10141
+ url: "/region",
10142
+ params: {
10143
+ parent_id: parentId
10144
+ }
10145
+ });
10146
+ };
10147
+
10148
+ var RegionController = function RegionController(props) {
10149
+ var _props$defaultRegion = props.defaultRegion,
10150
+ defaultRegion = _props$defaultRegion === void 0 ? {} : _props$defaultRegion;
10151
+ var _useState = React.useState([]),
10152
+ cityList = _useState[0],
10153
+ setCityList = _useState[1];
10154
+ var _useState2 = React.useState([]),
10155
+ districtList = _useState2[0],
10156
+ setDistrictList = _useState2[1];
10157
+ var _useState3 = React.useState([]),
10158
+ wardList = _useState3[0],
10159
+ setWardList = _useState3[1];
10160
+ var _useState4 = React.useState((defaultRegion === null || defaultRegion === void 0 ? void 0 : defaultRegion.city) || {}),
10161
+ city = _useState4[0],
10162
+ setCity = _useState4[1];
10163
+ var _useState5 = React.useState((defaultRegion === null || defaultRegion === void 0 ? void 0 : defaultRegion.district) || {}),
10164
+ district = _useState5[0],
10165
+ setDistrict = _useState5[1];
10166
+ var _useState6 = React.useState((defaultRegion === null || defaultRegion === void 0 ? void 0 : defaultRegion.ward) || {}),
10167
+ ward = _useState6[0],
10168
+ setWard = _useState6[1];
10169
+ React.useEffect(function () {
10170
+ getListCity();
10171
+ }, []);
10172
+ React.useEffect(function () {
10173
+ getListDistrict();
10174
+ }, [city]);
10175
+ React.useEffect(function () {
10176
+ getListWard();
10177
+ }, [district]);
10178
+ var getListCity = function getListCity() {
10179
+ try {
10180
+ var _temp = _catch(function () {
10181
+ return Promise.resolve(getRegionApi("0")).then(function (res) {
10182
+ var _res$data, _res$data$status;
10183
+ 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) {
10184
+ var _res$data2;
10185
+ setCityList(res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data);
10186
+ setDistrictList([]);
10187
+ setWardList([]);
10188
+ }
10189
+ });
10190
+ }, function (error) {
10191
+ console.log(error);
10192
+ });
10193
+ return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
10194
+ } catch (e) {
10195
+ return Promise.reject(e);
10196
+ }
10197
+ };
10198
+ var getListDistrict = function getListDistrict() {
10199
+ try {
10200
+ var _temp2 = _catch(function () {
10201
+ var parentId = (city === null || city === void 0 ? void 0 : city.dictItemId) || (city === null || city === void 0 ? void 0 : city.id);
10202
+ return Promise.resolve(getRegionApi(parentId)).then(function (res) {
10203
+ var _res$data3, _res$data3$status;
10204
+ setDistrict({});
10205
+ console.log("check response district::::", res);
10206
+ setWard({});
10207
+ if ((res === null || res === void 0 ? void 0 : (_res$data3 = res.data) === null || _res$data3 === void 0 ? void 0 : (_res$data3$status = _res$data3.status) === null || _res$data3$status === void 0 ? void 0 : _res$data3$status.code) == "200") {
10208
+ var _res$data4;
10209
+ setDistrictList(res === null || res === void 0 ? void 0 : (_res$data4 = res.data) === null || _res$data4 === void 0 ? void 0 : _res$data4.data);
10210
+ setWardList([]);
10211
+ }
10212
+ });
10213
+ }, function (error) {
10214
+ console.log(error);
10215
+ });
10216
+ return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
10217
+ } catch (e) {
10218
+ return Promise.reject(e);
10219
+ }
10220
+ };
10221
+ var getListWard = function getListWard() {
10222
+ try {
10223
+ var _temp3 = _catch(function () {
10224
+ var parentId = (district === null || district === void 0 ? void 0 : district.dictItemId) || (district === null || district === void 0 ? void 0 : district.id);
10225
+ return Promise.resolve(getRegionApi(parentId)).then(function (res) {
10226
+ var _res$data5, _res$data5$status;
10227
+ console.log("check response ward::::", res);
10228
+ setWard({});
10229
+ if ((res === null || res === void 0 ? void 0 : (_res$data5 = res.data) === null || _res$data5 === void 0 ? void 0 : (_res$data5$status = _res$data5.status) === null || _res$data5$status === void 0 ? void 0 : _res$data5$status.code) == 200) {
10230
+ var _res$data6;
10231
+ setWardList(res === null || res === void 0 ? void 0 : (_res$data6 = res.data) === null || _res$data6 === void 0 ? void 0 : _res$data6.data);
10232
+ }
10233
+ });
10234
+ }, function (error) {
10235
+ console.log(error);
10236
+ });
10237
+ return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(function () {}) : void 0);
10238
+ } catch (e) {
10239
+ return Promise.reject(e);
10240
+ }
10241
+ };
10242
+ return {
10243
+ city: city,
10244
+ setCity: setCity,
10245
+ district: district,
10246
+ setDistrict: setDistrict,
10247
+ ward: ward,
10248
+ setWard: setWard,
10249
+ cityList: cityList,
10250
+ districtList: districtList,
10251
+ wardList: wardList
10252
+ };
10253
+ };
10254
+
10255
+ var TextArea = React.forwardRef(function (props, ref) {
10256
+ var _props$label = props.label,
10257
+ label = _props$label === void 0 ? "" : _props$label,
10258
+ _props$placeholder = props.placeholder,
10259
+ placeholder = _props$placeholder === void 0 ? "" : _props$placeholder,
10260
+ _props$rules = props.rules,
10261
+ rules = _props$rules === void 0 ? [] : _props$rules,
10262
+ _props$textareaClassN = props.textareaClassName,
10263
+ textareaClassName = _props$textareaClassN === void 0 ? "" : _props$textareaClassN,
10264
+ _props$className = props.className,
10265
+ className = _props$className === void 0 ? "" : _props$className,
10266
+ _props$defaultValue = props.defaultValue,
10267
+ defaultValue = _props$defaultValue === void 0 ? "" : _props$defaultValue,
10268
+ _props$onChange = props.onChange,
10269
+ onChange = _props$onChange === void 0 ? function () {} : _props$onChange;
10270
+ var _useState = React.useState(defaultValue),
10271
+ value = _useState[0],
10272
+ _setValue = _useState[1];
10273
+ var _useState2 = React.useState(""),
10274
+ error = _useState2[0],
10275
+ _setError = _useState2[1];
10276
+ React.useImperativeHandle(ref, function () {
10277
+ return {
10278
+ validateData: function validateData() {
10279
+ return _validateData();
10280
+ },
10281
+ setValue: function setValue(text) {
10282
+ return _setValue(text);
10283
+ },
10284
+ getValue: function getValue() {
10285
+ return value;
10286
+ },
10287
+ setError: function setError(err) {
10288
+ return _setError(err);
10289
+ }
10290
+ };
10291
+ });
10292
+ var _validateData = function _validateData() {
10293
+ var count = 0;
10294
+ for (var _iterator = _createForOfIteratorHelperLoose(rules), _step; !(_step = _iterator()).done;) {
10295
+ var _e$pattern;
10296
+ var e = _step.value;
10297
+ if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && value === '') {
10298
+ _setError(e === null || e === void 0 ? void 0 : e.message);
10299
+ count++;
10300
+ break;
10301
+ } 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))) {
10302
+ _setError(e === null || e === void 0 ? void 0 : e.message);
10303
+ count++;
10304
+ break;
10305
+ }
10306
+ }
10307
+ if (count) {
10308
+ return false;
10309
+ } else {
10310
+ _setError('');
10311
+ return true;
10312
+ }
10313
+ };
10314
+ var handleOnChangeValue = function handleOnChangeValue(e) {
10315
+ var value = e.target.value;
10316
+ _setValue(value);
10317
+ onChange === null || onChange === void 0 ? void 0 : onChange(value);
10318
+ };
10319
+ var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
10320
+ return (e === null || e === void 0 ? void 0 : e.type) === "required";
10321
+ }));
10322
+ var labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
10323
+ className: "text-danger"
10324
+ }, " *") : null;
10325
+ return /*#__PURE__*/React__default.createElement("div", {
10326
+ className: "" + className
10327
+ }, label ? /*#__PURE__*/React__default.createElement("div", {
10328
+ className: "mb-1"
10329
+ }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("textarea", {
10330
+ name: "",
10331
+ id: "",
10332
+ className: textareaClassName + " focus:outline-none focus:ring-0",
10333
+ placeholder: placeholder,
10334
+ value: value,
10335
+ onChange: function onChange(e) {
10336
+ handleOnChangeValue(e);
10337
+ }
10338
+ }), error ? /*#__PURE__*/React__default.createElement("div", {
10339
+ className: "text-danger"
10340
+ }, error) : null);
10341
+ });
10342
+
10343
+ var FormCheckout = React.forwardRef(function (props, ref) {
10344
+ var _props$label = props.label,
10345
+ label = _props$label === void 0 ? "" : _props$label,
10346
+ _props$className = props.className,
10347
+ className = _props$className === void 0 ? "" : _props$className,
10348
+ _props$shopConfig = props.shopConfig,
10349
+ shopConfig = _props$shopConfig === void 0 ? {} : _props$shopConfig,
10350
+ _props$labelClassName = props.labelClassName,
10351
+ labelClassName = _props$labelClassName === void 0 ? "" : _props$labelClassName,
10352
+ _props$defaultRegion = props.defaultRegion,
10353
+ defaultRegion = _props$defaultRegion === void 0 ? {} : _props$defaultRegion;
10354
+ var nameRef = React.useRef(null);
10355
+ var phoneNumberRef = React.useRef(null);
10356
+ var addressRef = React.useRef(null);
10357
+ var cityRef = React.useRef(null);
10358
+ var districtRef = React.useRef(null);
10359
+ var wardRef = React.useRef(null);
10360
+ var noteRef = React.useRef(null);
10361
+ var _useState = React.useState([]),
10362
+ cityListMapping = _useState[0],
10363
+ setCityListMapping = _useState[1];
10364
+ var _useState2 = React.useState([]),
10365
+ districtListMapping = _useState2[0],
10366
+ setDistrictListMapping = _useState2[1];
10367
+ var _useState3 = React.useState([]),
10368
+ wardListMapping = _useState3[0],
10369
+ setWardListMapping = _useState3[1];
10370
+ var _RegionController = RegionController({
10371
+ shopId: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId,
10372
+ defaultRegion: defaultRegion
10373
+ }),
10374
+ _RegionController$cit = _RegionController.cityList,
10375
+ cityList = _RegionController$cit === void 0 ? [] : _RegionController$cit,
10376
+ _RegionController$dis = _RegionController.districtList,
10377
+ districtList = _RegionController$dis === void 0 ? [] : _RegionController$dis,
10378
+ _RegionController$war = _RegionController.wardList,
10379
+ wardList = _RegionController$war === void 0 ? [] : _RegionController$war,
10380
+ city = _RegionController.city,
10381
+ _RegionController$set = _RegionController.setCity,
10382
+ setCity = _RegionController$set === void 0 ? function () {} : _RegionController$set,
10383
+ district = _RegionController.district,
10384
+ setDistrict = _RegionController.setDistrict,
10385
+ ward = _RegionController.ward,
10386
+ setWard = _RegionController.setWard;
10387
+ React.useEffect(function () {
10388
+ var mappingCityList = cityList === null || cityList === void 0 ? void 0 : cityList.map(function (item) {
10389
+ return _extends({}, item, {
10390
+ label: item === null || item === void 0 ? void 0 : item.itemName,
10391
+ value: item === null || item === void 0 ? void 0 : item.dictItemId
10392
+ });
10393
+ });
10394
+ setCityListMapping(mappingCityList);
10395
+ }, [cityList]);
10396
+ React.useEffect(function () {
10397
+ var mappingDistrictList = districtList === null || districtList === void 0 ? void 0 : districtList.map(function (item) {
10398
+ return _extends({}, item, {
10399
+ label: item === null || item === void 0 ? void 0 : item.itemName,
10400
+ value: item === null || item === void 0 ? void 0 : item.dictItemId
10401
+ });
10402
+ });
10403
+ setDistrictListMapping(mappingDistrictList);
10404
+ }, [districtList]);
10405
+ React.useEffect(function () {
10406
+ var mappingWardList = wardList === null || wardList === void 0 ? void 0 : wardList.map(function (item) {
10407
+ return _extends({}, item, {
10408
+ label: item === null || item === void 0 ? void 0 : item.itemName,
10409
+ value: item === null || item === void 0 ? void 0 : item.dictItemId
10410
+ });
10411
+ });
10412
+ setWardListMapping(mappingWardList);
10413
+ }, [wardList]);
10414
+ React.useImperativeHandle(ref, function () {
10415
+ return {
10416
+ validateForm: function validateForm() {
10417
+ return _validateForm();
10418
+ },
10419
+ setValue: function setValue() {
10420
+ return _setValue();
10421
+ },
10422
+ getValue: function getValue() {
10423
+ return _getValue();
10424
+ }
10425
+ };
10426
+ });
10427
+ var _validateForm = function _validateForm() {
10428
+ var _nameRef$current, _phoneNumberRef$curre, _addressRef$current, _cityRef$current, _districtRef$current, _wardRef$current;
10429
+ var nameValidation = nameRef === null || nameRef === void 0 ? void 0 : (_nameRef$current = nameRef.current) === null || _nameRef$current === void 0 ? void 0 : _nameRef$current.validateData();
10430
+ var phoneNumberValidation = phoneNumberRef === null || phoneNumberRef === void 0 ? void 0 : (_phoneNumberRef$curre = phoneNumberRef.current) === null || _phoneNumberRef$curre === void 0 ? void 0 : _phoneNumberRef$curre.validateData();
10431
+ var addressValidation = addressRef === null || addressRef === void 0 ? void 0 : (_addressRef$current = addressRef.current) === null || _addressRef$current === void 0 ? void 0 : _addressRef$current.validateData();
10432
+ var cityValidation = cityRef === null || cityRef === void 0 ? void 0 : (_cityRef$current = cityRef.current) === null || _cityRef$current === void 0 ? void 0 : _cityRef$current.validateData();
10433
+ var districtValidation = districtRef === null || districtRef === void 0 ? void 0 : (_districtRef$current = districtRef.current) === null || _districtRef$current === void 0 ? void 0 : _districtRef$current.validateData();
10434
+ var wardValidation = wardRef === null || wardRef === void 0 ? void 0 : (_wardRef$current = wardRef.current) === null || _wardRef$current === void 0 ? void 0 : _wardRef$current.validateData();
10435
+ return nameValidation && phoneNumberValidation && addressValidation && cityValidation && districtValidation && wardValidation;
10436
+ };
10437
+ var _getValue = function _getValue() {
10438
+ var _noteRef$current, _nameRef$current2, _phoneNumberRef$curre2, _addressRef$current2;
10439
+ var orderInfo = {
10440
+ note: noteRef === null || noteRef === void 0 ? void 0 : (_noteRef$current = noteRef.current) === null || _noteRef$current === void 0 ? void 0 : _noteRef$current.getValue(),
10441
+ deliveryInfo: {
10442
+ receiverName: nameRef === null || nameRef === void 0 ? void 0 : (_nameRef$current2 = nameRef.current) === null || _nameRef$current2 === void 0 ? void 0 : _nameRef$current2.getValue(),
10443
+ receiverPhone: phoneNumberRef === null || phoneNumberRef === void 0 ? void 0 : (_phoneNumberRef$curre2 = phoneNumberRef.current) === null || _phoneNumberRef$curre2 === void 0 ? void 0 : _phoneNumberRef$curre2.getValue(),
10444
+ receiverStreet: addressRef === null || addressRef === void 0 ? void 0 : (_addressRef$current2 = addressRef.current) === null || _addressRef$current2 === void 0 ? void 0 : _addressRef$current2.getValue(),
10445
+ cityToName: city === null || city === void 0 ? void 0 : city.itemName,
10446
+ districtToName: district === null || district === void 0 ? void 0 : district.itemName,
10447
+ wardToName: ward === null || ward === void 0 ? void 0 : ward.itemName,
10448
+ cityTo: city === null || city === void 0 ? void 0 : city.dictItemId,
10449
+ districtTo: district === null || district === void 0 ? void 0 : district.dictItemId,
10450
+ wardTo: ward === null || ward === void 0 ? void 0 : ward.dictItemId
10451
+ }
10452
+ };
10453
+ return orderInfo;
10454
+ };
10455
+ var _setValue = function _setValue() {
10456
+ var _nameRef$current3, _phoneNumberRef$curre3, _addressRef$current3, _noteRef$current2;
10457
+ nameRef === null || nameRef === void 0 ? void 0 : (_nameRef$current3 = nameRef.current) === null || _nameRef$current3 === void 0 ? void 0 : _nameRef$current3.setValue("");
10458
+ phoneNumberRef === null || phoneNumberRef === void 0 ? void 0 : (_phoneNumberRef$curre3 = phoneNumberRef.current) === null || _phoneNumberRef$curre3 === void 0 ? void 0 : _phoneNumberRef$curre3.setValue("");
10459
+ addressRef === null || addressRef === void 0 ? void 0 : (_addressRef$current3 = addressRef.current) === null || _addressRef$current3 === void 0 ? void 0 : _addressRef$current3.setValue("");
10460
+ setCity({});
10461
+ setDistrict({});
10462
+ setWard({});
10463
+ noteRef === null || noteRef === void 0 ? void 0 : (_noteRef$current2 = noteRef.current) === null || _noteRef$current2 === void 0 ? void 0 : _noteRef$current2.setValue("");
10464
+ };
10465
+ return /*#__PURE__*/React__default.createElement("div", {
10466
+ className: className + " p-6 grid gap-6 "
10467
+ }, /*#__PURE__*/React__default.createElement("div", {
10468
+ className: "" + labelClassName
10469
+ }, label), /*#__PURE__*/React__default.createElement("div", {
10470
+ className: "grid grid-cols-1 lg:grid-cols-2 gap-6"
10471
+ }, /*#__PURE__*/React__default.createElement(Input, {
10472
+ ref: nameRef,
10473
+ placeholder: "Nhập họ và tên",
10474
+ inputClassName: "w-full",
10475
+ label: "Họ và tên",
10476
+ rules: [{
10477
+ type: "required",
10478
+ message: "Bắt buộc nhập họ và tên"
10479
+ }],
10480
+ className: "w-full rounded-lg"
10481
+ }), /*#__PURE__*/React__default.createElement(InputPhoneNumber, {
10482
+ ref: phoneNumberRef,
10483
+ label: "S\u1ED1 \u0111i\u1EC7n tho\u1EA1i",
10484
+ placeholder: "Nhập số điện thoại",
10485
+ inputClassName: "w-full h-full",
10486
+ rules: [{
10487
+ type: "required",
10488
+ message: "Bắt buộc nhập số điện thoại"
10489
+ }, {
10490
+ type: "pattern",
10491
+ pattern: pattern === null || pattern === void 0 ? void 0 : pattern.phoneNumberPattern,
10492
+ message: "Số điện thoại không hợp lệ!"
10493
+ }],
10494
+ className: "w-full rounded-lg border"
10495
+ })), /*#__PURE__*/React__default.createElement("div", {
10496
+ className: "grid grid-cols-1 lg:grid-cols-2 gap-6"
10497
+ }, /*#__PURE__*/React__default.createElement(Select$1, {
10498
+ ref: cityRef,
10499
+ options: cityListMapping,
10500
+ label: "T\u1EC9nh/TP",
10501
+ placeholder: "Ch\u1ECDn",
10502
+ rules: [{
10503
+ type: "required",
10504
+ message: "Bắt buộc nhập Tỉnh/TP"
10505
+ }],
10506
+ className: "w-full rounded-lg border",
10507
+ defaultvalue: city,
10508
+ onClick: setCity
10509
+ }), /*#__PURE__*/React__default.createElement(Select$1, {
10510
+ ref: districtRef,
10511
+ options: districtListMapping,
10512
+ label: "Qu\u1EADn/Huy\u1EC7n",
10513
+ placeholder: "Ch\u1ECDn",
10514
+ rules: [{
10515
+ type: "required",
10516
+ message: "Bắt buộc nhập Quận/Huyện"
10517
+ }],
10518
+ className: "w-full rounded-lg border",
10519
+ defaultvalue: district,
10520
+ onClick: setDistrict
10521
+ })), /*#__PURE__*/React__default.createElement("div", {
10522
+ className: "grid grid-cols-1 lg:grid-cols-2 gap-6"
10523
+ }, /*#__PURE__*/React__default.createElement(Select$1, {
10524
+ ref: wardRef,
10525
+ options: wardListMapping,
10526
+ label: "Ph\u01B0\u1EDDng/X\xE3",
10527
+ placeholder: "Ch\u1ECDn",
10528
+ value: ward,
10529
+ rules: [{
10530
+ type: "required",
10531
+ message: "Bắt buộc nhập Phường/Xã"
10532
+ }],
10533
+ className: "w-full rounded-lg border",
10534
+ onClick: setWard
10535
+ }), /*#__PURE__*/React__default.createElement(Input, {
10536
+ ref: addressRef,
10537
+ label: "\u0110\u1ECBa ch\u1EC9",
10538
+ inputClassName: "w-full",
10539
+ placeholder: "VD: Số 89 ngõ 200 Lĩnh Nam, Hoàng Mai,Hà Nội",
10540
+ rules: [{
10541
+ type: "required",
10542
+ message: "Bắt buộc nhập địa chỉ"
10543
+ }],
10544
+ className: "w-full rounded-lg px-2 py-1"
10545
+ })), /*#__PURE__*/React__default.createElement("div", {
10546
+ className: "grid grid-cols-1 gap-6"
10547
+ }, /*#__PURE__*/React__default.createElement(TextArea, {
10548
+ ref: noteRef,
10549
+ label: "Ghi ch\xFA",
10550
+ placeholder: "Ghi ch\xFA th\u1EDDi gian giao h\xE0ng, ho\u1EB7c ch\u1EC9 d\u1EABn giao h\xE0ng, ...",
10551
+ className: " w-full ",
10552
+ textareaClassName: "px-4 py-3 w-full border rounded-xl min-h-24"
10553
+ })));
10554
+ });
10555
+
10556
+ var OrderControllerWithoutLogin = function OrderControllerWithoutLogin(props) {
10557
+ _objectDestructuringEmpty(props);
10558
+ var draftOrderWithoutLogin = function draftOrderWithoutLogin(shopId, dataOrder) {
10559
+ try {
10560
+ return Promise.resolve(_catch(function () {
10561
+ dataOrder.deliveryInfo.customerShippingPrice = 0;
10562
+ dataOrder.deliveryInfo.shippingFeePayer = "SHOP_CUSTOMER";
10563
+ dataOrder.deliveryInfo.shippingPrice = 0;
10564
+ dataOrder.deliveryInfo.shippingType = "SHIPPER";
10565
+ dataOrder.deliveryInfo.shopShippingPrice = 0;
10566
+ var data = _extends({}, dataOrder, {
10567
+ payStatus: false,
10568
+ paymentMethod: "COD",
10569
+ promotionCode: "",
10570
+ campaignId: null,
10571
+ customerAddress: null
10572
+ });
10573
+ return Promise.resolve(draftOrderWithoutLoginApi(shopId, data));
10574
+ }, function (e) {
10575
+ console.log(e);
10576
+ }));
10577
+ } catch (e) {
10578
+ return Promise.reject(e);
10579
+ }
10580
+ };
10581
+ return {
10582
+ draftOrderWithoutLogin: draftOrderWithoutLogin
10583
+ };
10584
+ };
10585
+
9938
10586
  var Carts1 = function Carts1(props) {
9939
- var _props$cartItems = props.cartItems,
9940
- cartItems = _props$cartItems === void 0 ? [] : _props$cartItems;
10587
+ var _dayjs;
10588
+ var shopConfig = props.shopConfig,
10589
+ shopConfigStyle = props.shopConfigStyle,
10590
+ dispatch = props.dispatch,
10591
+ useSelector = props.useSelector,
10592
+ removeFromCart = props.removeFromCart,
10593
+ updateQuantity = props.updateQuantity;
9941
10594
  var _useState = React.useState(false),
9942
- checkAll = _useState[0],
9943
10595
  setCheckAll = _useState[1];
10596
+ var _useState2 = React.useState([]),
10597
+ chosenProducts = _useState2[0],
10598
+ setChosenProducts = _useState2[1];
10599
+ var _useState3 = React.useState(true),
10600
+ isCheckout = _useState3[0],
10601
+ setIsCheckout = _useState3[1];
10602
+ var _useState4 = React.useState(0),
10603
+ discount = _useState4[0];
10604
+ var _useState5 = React.useState({}),
10605
+ orderSuccessInfo = _useState5[0],
10606
+ setOrderSuccessInfo = _useState5[1];
10607
+ var _useState6 = React.useState(false),
10608
+ isOpenModal = _useState6[0],
10609
+ setIsOpenModal = _useState6[1];
10610
+ var formCheckoutRef = React.useRef(null);
10611
+ var cartItems = useSelector(function (state) {
10612
+ var _state$cart;
10613
+ return state === null || state === void 0 ? void 0 : (_state$cart = state.cart) === null || _state$cart === void 0 ? void 0 : _state$cart.items;
10614
+ });
10615
+ var _OrderControllerWitho = OrderControllerWithoutLogin(props),
10616
+ _OrderControllerWitho2 = _OrderControllerWitho.draftOrderWithoutLogin,
10617
+ draftOrderWithoutLogin = _OrderControllerWitho2 === void 0 ? function () {} : _OrderControllerWitho2;
9944
10618
  var handleCheckAll = function handleCheckAll(event) {
10619
+ var checked = event.target.checked;
10620
+ if (checked) {
10621
+ setChosenProducts(cartItems);
10622
+ setCheckAll(checked);
10623
+ } else {
10624
+ setChosenProducts([]);
10625
+ setCheckAll(checked);
10626
+ }
10627
+ };
10628
+ React.useEffect(function () {
10629
+ var selectedProducts = cartItems === null || cartItems === void 0 ? void 0 : cartItems.filter(function (item) {
10630
+ return chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.some(function (product) {
10631
+ var _product$variant, _item$variant;
10632
+ return (product === null || product === void 0 ? void 0 : (_product$variant = product.variant) === null || _product$variant === void 0 ? void 0 : _product$variant.variantId) === (item === null || item === void 0 ? void 0 : (_item$variant = item.variant) === null || _item$variant === void 0 ? void 0 : _item$variant.variantId);
10633
+ });
10634
+ });
10635
+ setChosenProducts(selectedProducts);
10636
+ }, [cartItems]);
10637
+ var handleTotalPrice = function handleTotalPrice() {
10638
+ var totalPrice = chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.reduce(function (sum, element) {
10639
+ var _element$variant;
10640
+ return sum + (element === null || element === void 0 ? void 0 : (_element$variant = element.variant) === null || _element$variant === void 0 ? void 0 : _element$variant.price) * (element === null || element === void 0 ? void 0 : element.quantity);
10641
+ }, 0);
10642
+ return totalPrice;
10643
+ };
10644
+ var handleCheckProducts = function handleCheckProducts(event) {
9945
10645
  var _event$target = event.target,
10646
+ value = _event$target.value,
9946
10647
  checked = _event$target.checked;
9947
- setCheckAll(checked);
10648
+ var products = cartItems === null || cartItems === void 0 ? void 0 : cartItems.find(function (item) {
10649
+ var _item$variant2;
10650
+ return (item === null || item === void 0 ? void 0 : (_item$variant2 = item.variant) === null || _item$variant2 === void 0 ? void 0 : _item$variant2.variantId) == value;
10651
+ });
10652
+ if (checked) {
10653
+ setChosenProducts(function (prev) {
10654
+ return [].concat(prev, [products]);
10655
+ });
10656
+ } else {
10657
+ setChosenProducts(function (prev) {
10658
+ return prev.filter(function (item) {
10659
+ var _item$variant3;
10660
+ return (item === null || item === void 0 ? void 0 : (_item$variant3 = item.variant) === null || _item$variant3 === void 0 ? void 0 : _item$variant3.variantId) != value;
10661
+ });
10662
+ });
10663
+ }
9948
10664
  };
9949
- return /*#__PURE__*/React__default.createElement("div", {
9950
- className: SECTION_DEFAULT_CLASS + " mt-0 rounded-2xl bg-bgSecondary p-4"
10665
+ var handleSubmit = function handleSubmit() {
10666
+ try {
10667
+ var _formCheckoutRef$curr;
10668
+ var formCheckoutValidation = formCheckoutRef === null || formCheckoutRef === void 0 ? void 0 : (_formCheckoutRef$curr = formCheckoutRef.current) === null || _formCheckoutRef$curr === void 0 ? void 0 : _formCheckoutRef$curr.validateForm();
10669
+ var _temp = function () {
10670
+ if (formCheckoutValidation && (chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.length) > 0) {
10671
+ var _formCheckoutRef$curr2;
10672
+ var orderInfo = formCheckoutRef === null || formCheckoutRef === void 0 ? void 0 : (_formCheckoutRef$curr2 = formCheckoutRef.current) === null || _formCheckoutRef$curr2 === void 0 ? void 0 : _formCheckoutRef$curr2.getValue();
10673
+ var items = chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.map(function (item) {
10674
+ var _item$variant4;
10675
+ return {
10676
+ productId: item === null || item === void 0 ? void 0 : item.productId,
10677
+ type: item === null || item === void 0 ? void 0 : item.type,
10678
+ quantity: item === null || item === void 0 ? void 0 : item.quantity,
10679
+ selected: true,
10680
+ variantId: item === null || item === void 0 ? void 0 : (_item$variant4 = item.variant) === null || _item$variant4 === void 0 ? void 0 : _item$variant4.variantId,
10681
+ serials: []
10682
+ };
10683
+ });
10684
+ var order = _extends({}, orderInfo, {
10685
+ orders: [{
10686
+ items: items,
10687
+ saleManList: [],
10688
+ shopId: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId,
10689
+ shopName: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName,
10690
+ shopPromotionCode: ""
10691
+ }]
10692
+ });
10693
+ return Promise.resolve(draftOrderWithoutLogin(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId, order)).then(function (res) {
10694
+ var _res$data, _res$data$status;
10695
+ 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") {
10696
+ var _res$data2, _formCheckoutRef$curr3;
10697
+ setOrderSuccessInfo(res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data);
10698
+ formCheckoutRef === null || formCheckoutRef === void 0 ? void 0 : (_formCheckoutRef$curr3 = formCheckoutRef.current) === null || _formCheckoutRef$curr3 === void 0 ? void 0 : _formCheckoutRef$curr3.setValue();
10699
+ setIsOpenModal(true);
10700
+ setChosenProducts([]);
10701
+ }
10702
+ });
10703
+ }
10704
+ }();
10705
+ return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
10706
+ } catch (e) {
10707
+ return Promise.reject(e);
10708
+ }
10709
+ };
10710
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, isCheckout ?
10711
+ /*#__PURE__*/
10712
+ React__default.createElement("div", {
10713
+ className: "relative"
10714
+ }, /*#__PURE__*/React__default.createElement("div", {
10715
+ className: SECTION_DEFAULT_CLASS + " mt-0 rounded-2xl bg-bgSecondary p-4 overflow-x-auto min-w-72 lg:hide-scrollbar"
9951
10716
  }, /*#__PURE__*/React__default.createElement("div", {
9952
- className: "flex gap-4 pb-4"
10717
+ className: "flex gap-6 pb-4 whitespace-nowrap w-max md:w-full"
9953
10718
  }, /*#__PURE__*/React__default.createElement("input", {
9954
10719
  type: "checkbox",
9955
- checked: checkAll,
10720
+ checked: (chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.length) === (cartItems === null || cartItems === void 0 ? void 0 : cartItems.length),
9956
10721
  onChange: handleCheckAll
9957
10722
  }), /*#__PURE__*/React__default.createElement("div", {
9958
- className: "flex-1"
10723
+ className: "min-w-80 lg:flex-1 "
9959
10724
  }, "S\u1EA3n ph\u1EA9m"), /*#__PURE__*/React__default.createElement("div", {
9960
- className: "w-32 text-right"
10725
+ className: "min-w-32 text-right"
9961
10726
  }, "\u0110\u01A1n gi\xE1"), /*#__PURE__*/React__default.createElement("div", {
9962
- className: "w-32 text-center"
10727
+ className: "min-w-32 text-center"
9963
10728
  }, "S\u1ED1 l\u01B0\u1EE3ng"), /*#__PURE__*/React__default.createElement("div", {
9964
- className: "w-32 text-right"
10729
+ className: "min-w-32 text-right"
9965
10730
  }, "Th\xE0nh ti\u1EC1n"), /*#__PURE__*/React__default.createElement("div", {
9966
- className: "w-32 text-center"
9967
- }, "H\xE0nh \u0111\u1ED9ng")), cartItems.map(function (item, index) {
10731
+ className: "min-w-32 text-center"
10732
+ }, "H\xE0nh \u0111\u1ED9ng")), cartItems === null || cartItems === void 0 ? void 0 : cartItems.map(function (item, index) {
10733
+ var _item$variant5;
9968
10734
  return /*#__PURE__*/React__default.createElement(CartItem, {
9969
10735
  item: item,
9970
- key: index
10736
+ key: item === null || item === void 0 ? void 0 : (_item$variant5 = item.variant) === null || _item$variant5 === void 0 ? void 0 : _item$variant5.variantId,
10737
+ chosenProducts: chosenProducts,
10738
+ onChange: function onChange(event) {
10739
+ handleCheckProducts(event);
10740
+ },
10741
+ dispatch: dispatch,
10742
+ updateQuantity: updateQuantity,
10743
+ removeFromCart: removeFromCart
9971
10744
  });
9972
- }));
10745
+ })), /*#__PURE__*/React__default.createElement("div", {
10746
+ className: "grid grid-cols-5 md:flex items-center md:gap-6 bg-bgSecondary mb-6 md:h-20 py-4 px-4 xl:px-20 sticky bottom-0"
10747
+ }, /*#__PURE__*/React__default.createElement("div", {
10748
+ className: "col-span-2 md:flex-1 flex gap-2 min-w-32"
10749
+ }, /*#__PURE__*/React__default.createElement("input", {
10750
+ type: "checkbox",
10751
+ checked: (chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.length) === (cartItems === null || cartItems === void 0 ? void 0 : cartItems.length),
10752
+ onChange: handleCheckAll
10753
+ }), /*#__PURE__*/React__default.createElement("div", {
10754
+ className: "inline-block ms-2"
10755
+ }, "Ch\u1ECDn t\u1EA5t c\u1EA3")), /*#__PURE__*/React__default.createElement("div", {
10756
+ className: "col-span-3"
10757
+ }, /*#__PURE__*/React__default.createElement("div", {
10758
+ className: "min-w-56"
10759
+ }, "T\u1ED5ng thanh to\xE1n(5 s\u1EA3n ph\u1EA9m)"), /*#__PURE__*/React__default.createElement("div", {
10760
+ className: "min-w-32 text-primary text-lg font-medium\t"
10761
+ }, formatCurrency(handleTotalPrice()))), (chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.length) > 0 ? /*#__PURE__*/React__default.createElement(Button, {
10762
+ className: "col-span-5 mt-2 md:mt-0 ",
10763
+ label: /*#__PURE__*/React__default.createElement("a", {
10764
+ href: "#",
10765
+ className: "flex items-center justify-center bg-primary text-Button gap-2"
10766
+ }, "\u0110\u1EB7t h\xE0ng ", /*#__PURE__*/React__default.createElement(fa.FaArrowRight, null)),
10767
+ onClick: function onClick() {
10768
+ setIsCheckout(false);
10769
+ }
10770
+ }) : null)) :
10771
+ /*#__PURE__*/
10772
+ React__default.createElement("div", {
10773
+ className: SECTION_DEFAULT_CLASS + " grid grid-cols-1 mt-0 md:grid-cols-5 gap-6"
10774
+ }, /*#__PURE__*/React__default.createElement("div", {
10775
+ className: "md:col-span-3 bg-bgSecondary h-full rounded-xl"
10776
+ }, /*#__PURE__*/React__default.createElement(FormCheckout, {
10777
+ ref: formCheckoutRef,
10778
+ label: "Thông tin giao hàng",
10779
+ className: " h-max",
10780
+ labelClassName: "text-lg font-semibold"
10781
+ })), /*#__PURE__*/React__default.createElement("div", {
10782
+ className: "md:col-span-2 flex flex-col gap-6"
10783
+ }, /*#__PURE__*/React__default.createElement("div", {
10784
+ className: "flex flex-col gap-4 p-6 bg-bgSecondary rounded-xl"
10785
+ }, /*#__PURE__*/React__default.createElement("div", null, "Th\xF4ng tin thanh to\xE1n"), /*#__PURE__*/React__default.createElement("div", {
10786
+ className: "flex justify-between items-center"
10787
+ }, /*#__PURE__*/React__default.createElement("small", null, "T\u1ED5ng ti\u1EC1n h\xE0ng"), /*#__PURE__*/React__default.createElement("div", {
10788
+ className: "text-primary text-lg font-medium"
10789
+ }, formatCurrency(handleTotalPrice()))), /*#__PURE__*/React__default.createElement("div", {
10790
+ className: "flex justify-between items-center"
10791
+ }, /*#__PURE__*/React__default.createElement("small", null, "Gi\u1EA3m gi\xE1"), /*#__PURE__*/React__default.createElement("div", {
10792
+ className: "text-primary text-lg font-medium"
10793
+ }, formatCurrency(discount))), /*#__PURE__*/React__default.createElement("div", {
10794
+ className: "border-t border-dashed"
10795
+ }, /*#__PURE__*/React__default.createElement("div", {
10796
+ className: "flex justify-between items-center pt-4"
10797
+ }, /*#__PURE__*/React__default.createElement("small", null, "T\u1ED5ng thanh to\xE1n"), /*#__PURE__*/React__default.createElement("div", {
10798
+ className: "text-primary text-lg font-medium"
10799
+ }, formatCurrency(handleTotalPrice() - discount)))), /*#__PURE__*/React__default.createElement(Button, {
10800
+ label: "\u0110\u1EB6T H\xC0NG",
10801
+ onClick: handleSubmit
10802
+ })), /*#__PURE__*/React__default.createElement("div", {
10803
+ className: "flex flex-col bg-bgSecondary p-6 rounded-xl"
10804
+ }, /*#__PURE__*/React__default.createElement("div", {
10805
+ className: "font-medium text-lg mb-6"
10806
+ }, "S\u1EA3n ph\u1EA9m trong \u0111\u01A1n (", chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.length, ")"), chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.map(function (item) {
10807
+ var _item$variant6, _item$variant7, _item$variant8;
10808
+ return /*#__PURE__*/React__default.createElement("div", {
10809
+ className: "flex gap-6 border-t py-4",
10810
+ key: item === null || item === void 0 ? void 0 : (_item$variant6 = item.variant) === null || _item$variant6 === void 0 ? void 0 : _item$variant6.variantId
10811
+ }, /*#__PURE__*/React__default.createElement("img", {
10812
+ src: "https://img.freepik.com/free-photo/organic-cosmetic-product-with-dreamy-aesthetic-fresh-background_23-2151382816.jpg?semt=ais_hybrid",
10813
+ alt: "",
10814
+ className: "rounded-full w-12 h-12"
10815
+ }), /*#__PURE__*/React__default.createElement("div", {
10816
+ className: "flex flex-col gap-2"
10817
+ }, /*#__PURE__*/React__default.createElement("div", {
10818
+ className: "font-medium"
10819
+ }, item === null || item === void 0 ? void 0 : item.productName), /*#__PURE__*/React__default.createElement("div", {
10820
+ className: "px-4 py-1 border border-stroke bg-gray6 rounded-md w-max"
10821
+ }, item === null || item === void 0 ? void 0 : (_item$variant7 = item.variant) === null || _item$variant7 === void 0 ? void 0 : _item$variant7.name), /*#__PURE__*/React__default.createElement("div", {
10822
+ className: "flex gap-4 items-center"
10823
+ }, /*#__PURE__*/React__default.createElement("div", {
10824
+ className: "text-primary text-lg font-medium"
10825
+ }, formatCurrency(item === null || item === void 0 ? void 0 : (_item$variant8 = item.variant) === null || _item$variant8 === void 0 ? void 0 : _item$variant8.price)), /*#__PURE__*/React__default.createElement("div", null, "x", item === null || item === void 0 ? void 0 : item.quantity))));
10826
+ })))), isOpenModal && /*#__PURE__*/React__default.createElement(ModalNotification, {
10827
+ isButtonClose: false
10828
+ }, /*#__PURE__*/React__default.createElement("div", {
10829
+ className: "bg-white rounded-lg flex flex-col gap-2 shadow-lg p-6 max-w-sm text-center "
10830
+ }, /*#__PURE__*/React__default.createElement("div", {
10831
+ className: "h-20 mb-4 flex items-center justify-center"
10832
+ }, /*#__PURE__*/React__default.createElement(fa.FaCheckCircle, {
10833
+ className: "h-full text-green-500",
10834
+ style: {
10835
+ fontSize: "150px"
10836
+ }
10837
+ })), /*#__PURE__*/React__default.createElement("h3", {
10838
+ className: "text-2xl"
10839
+ }, "\u0110\u1EB7t h\xE0ng th\xE0nh c\xF4ng"), /*#__PURE__*/React__default.createElement("div", null, "Th\u1EDDi gian: ", (_dayjs = dayjs_min(orderSuccessInfo === null || orderSuccessInfo === void 0 ? void 0 : orderSuccessInfo.createdDate)) === null || _dayjs === void 0 ? void 0 : _dayjs.format("DD/MM/YYYY")), /*#__PURE__*/React__default.createElement("div", null, "M\xE3 \u0111\u01A1n h\xE0ng: ", orderSuccessInfo === null || orderSuccessInfo === void 0 ? void 0 : orderSuccessInfo.orderNumber), /*#__PURE__*/React__default.createElement("p", {
10840
+ className: "mb-6 text-sm text-gray3"
10841
+ }, "Ch\xFAng t\xF4i s\u1EBD li\xEAn h\u1EC7 ngay v\u1EDBi b\u1EA1n, vui l\xF2ng \u0111\u1EC3 \xFD \u0111i\u1EC7n tho\u1EA1i \u0111\u1EC3 x\xE1c nh\u1EADn \u0111\u01A1n h\xE0ng."), /*#__PURE__*/React__default.createElement(Button, {
10842
+ label: /*#__PURE__*/React__default.createElement("a", {
10843
+ className: "flex justify-center items-center gap-2",
10844
+ href: "/",
10845
+ onClick: function onClick() {
10846
+ setIsOpenModal(false);
10847
+ setOrderSuccessInfo({});
10848
+ }
10849
+ }, "Ti\u1EBFp t\u1EE5c mua s\u1EAFm ", /*#__PURE__*/React__default.createElement(fa.FaArrowRight, null)),
10850
+ shopConfigStyle: shopConfigStyle
10851
+ }))));
9973
10852
  };
9974
10853
  var CartItem = function CartItem(props) {
9975
- var item = props.item;
9976
- var _useState2 = React.useState(item.quantity),
9977
- quantity = _useState2[0],
9978
- setQuantity = _useState2[1];
10854
+ var _item$variant10, _item$variant11, _item$variant12, _item$variant13;
10855
+ var item = props.item,
10856
+ _props$onChange = props.onChange,
10857
+ onChange = _props$onChange === void 0 ? function () {} : _props$onChange,
10858
+ chosenProducts = props.chosenProducts,
10859
+ dispatch = props.dispatch,
10860
+ removeFromCart = props.removeFromCart,
10861
+ updateQuantity = props.updateQuantity;
10862
+ var _useState7 = React.useState(item === null || item === void 0 ? void 0 : item.quantity),
10863
+ quantity = _useState7[0],
10864
+ setQuantity = _useState7[1];
9979
10865
  var refInputQuantity = React.useRef();
9980
- var handleCheckItem = function handleCheckItem(event) {};
10866
+ var handleChangeQuantity = function handleChangeQuantity(item, text) {
10867
+ setQuantity(parseInt(text));
10868
+ dispatch(updateQuantity({
10869
+ quantity: parseInt(text),
10870
+ variant: item === null || item === void 0 ? void 0 : item.variant
10871
+ }));
10872
+ };
10873
+ var handleRemoveProduct = function handleRemoveProduct(variantId) {
10874
+ if (variantId) {
10875
+ dispatch(removeFromCart([variantId]));
10876
+ }
10877
+ return;
10878
+ };
9981
10879
  return /*#__PURE__*/React__default.createElement("div", {
9982
- className: "flex items-center gap-4 border-t py-4"
10880
+ className: "flex items-center gap-6 border-t py-4 w-max md:w-full"
9983
10881
  }, /*#__PURE__*/React__default.createElement("input", {
9984
10882
  type: "checkbox",
9985
- checked: false,
9986
- onChange: handleCheckItem
10883
+ checked: chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.some(function (element) {
10884
+ var _element$variant2, _item$variant9;
10885
+ return (element === null || element === void 0 ? void 0 : (_element$variant2 = element.variant) === null || _element$variant2 === void 0 ? void 0 : _element$variant2.variantId) === (item === null || item === void 0 ? void 0 : (_item$variant9 = item.variant) === null || _item$variant9 === void 0 ? void 0 : _item$variant9.variantId);
10886
+ }),
10887
+ value: item === null || item === void 0 ? void 0 : (_item$variant10 = item.variant) === null || _item$variant10 === void 0 ? void 0 : _item$variant10.variantId,
10888
+ onChange: onChange
9987
10889
  }), /*#__PURE__*/React__default.createElement("div", {
9988
- className: "flex-1"
9989
- }, "S\u1EA3n ph\u1EA9m"), /*#__PURE__*/React__default.createElement("div", {
9990
- className: "w-32 text-right"
9991
- }, formatCurrency(item.price)), /*#__PURE__*/React__default.createElement("div", {
9992
- className: "w-32 text-right"
10890
+ className: "min-w-80 lg:flex-1"
10891
+ }, /*#__PURE__*/React__default.createElement("div", {
10892
+ className: "flex gap-4 "
10893
+ }, /*#__PURE__*/React__default.createElement("img", {
10894
+ src: "https://img.freepik.com/free-photo/organic-cosmetic-product-with-dreamy-aesthetic-fresh-background_23-2151382816.jpg?semt=ais_hybrid",
10895
+ alt: "",
10896
+ className: "rounded-full w-20 h-20"
10897
+ }), /*#__PURE__*/React__default.createElement("div", {
10898
+ className: "flex flex-col gap-2 whitespace-nowrap"
10899
+ }, /*#__PURE__*/React__default.createElement("label", {
10900
+ className: "leading-6 w-56 lg:w-full text-wrap line-clamp-2"
10901
+ }, item === null || item === void 0 ? void 0 : item.productName), /*#__PURE__*/React__default.createElement("div", {
10902
+ className: "border border-stroke rounded-md bg-gray6 px-4 py-1 w-max"
10903
+ }, item === null || item === void 0 ? void 0 : (_item$variant11 = item.variant) === null || _item$variant11 === void 0 ? void 0 : _item$variant11.name)))), /*#__PURE__*/React__default.createElement("div", {
10904
+ className: "min-w-32 text-right"
10905
+ }, formatCurrency(item === null || item === void 0 ? void 0 : (_item$variant12 = item.variant) === null || _item$variant12 === void 0 ? void 0 : _item$variant12.price)), /*#__PURE__*/React__default.createElement("div", {
10906
+ className: "min-w-32 text-right"
9993
10907
  }, /*#__PURE__*/React__default.createElement(Input, {
9994
10908
  rules: [{
9995
10909
  type: "required",
@@ -10001,17 +10915,24 @@ var CartItem = function CartItem(props) {
10001
10915
  }],
10002
10916
  defaultValue: quantity,
10003
10917
  isQuantity: true,
10004
- min: 1,
10918
+ min: 0,
10005
10919
  onChange: function onChange(text) {
10006
- return setQuantity(parseInt(text));
10920
+ return handleChangeQuantity(item, parseInt(text));
10007
10921
  },
10008
10922
  ref: refInputQuantity,
10009
10923
  wrapClassName: "w-fit mx-auto"
10010
10924
  })), /*#__PURE__*/React__default.createElement("div", {
10011
- className: "w-32 text-right"
10012
- }, formatCurrency(item.price * quantity)), /*#__PURE__*/React__default.createElement("div", {
10013
- className: "w-32 text-center"
10014
- }, "H\xE0nh \u0111\u1ED9ng"));
10925
+ className: "min-w-32 text-right"
10926
+ }, formatCurrency((item === null || item === void 0 ? void 0 : (_item$variant13 = item.variant) === null || _item$variant13 === void 0 ? void 0 : _item$variant13.price) * quantity)), /*#__PURE__*/React__default.createElement("div", {
10927
+ className: "min-w-32 flex justify-center "
10928
+ }, /*#__PURE__*/React__default.createElement("button", {
10929
+ type: "button",
10930
+ className: "flex items-center gap-2 text-danger",
10931
+ onClick: function onClick() {
10932
+ var _item$variant14;
10933
+ handleRemoveProduct(item === null || item === void 0 ? void 0 : (_item$variant14 = item.variant) === null || _item$variant14 === void 0 ? void 0 : _item$variant14.variantId);
10934
+ }
10935
+ }, /*#__PURE__*/React__default.createElement(ri.RiDeleteBin7Line, null), /*#__PURE__*/React__default.createElement("span", null, "X\xF3a"))));
10015
10936
  };
10016
10937
 
10017
10938
  exports.About5 = About5;