s-platform-landing-section 0.1.10-alpha.6 → 0.1.10-alpha.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -11,11 +11,35 @@ 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');
20
+
21
+ var Button = function Button(props) {
22
+ var _props$label = props.label,
23
+ label = _props$label === void 0 ? "" : _props$label,
24
+ _props$className = props.className,
25
+ className = _props$className === void 0 ? "" : _props$className,
26
+ _props$style = props.style,
27
+ style = _props$style === void 0 ? {} : _props$style,
28
+ _props$shopConfigStyl = props.shopConfigStyle,
29
+ shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
30
+ _props$onClick = props.onClick,
31
+ onClick = _props$onClick === void 0 ? function () {} : _props$onClick,
32
+ _props$type = props.type,
33
+ type = _props$type === void 0 ? "primary" : _props$type;
34
+ var _className = type === "primary" ? "text-textButton bg-primary" : "text-primary bg-transparent border border-primary";
35
+ _className = "font-medium rounded-lg text-sm px-4 py-2.5 hover:text-textButton hover:bg-primary hover:opacity-80 " + _className + " " + ((shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.buttonClass) || "") + " " + className;
36
+ return /*#__PURE__*/React__default.createElement("button", {
37
+ type: "button",
38
+ className: _className,
39
+ style: style,
40
+ onClick: onClick
41
+ }, label);
42
+ };
19
43
 
20
44
  function _arrayLikeToArray(r, a) {
21
45
  (null == a || a > r.length) && (a = r.length);
@@ -68,38 +92,113 @@ function _unsupportedIterableToArray(r, a) {
68
92
  }
69
93
  }
70
94
 
71
- var Button = function Button(props) {
72
- var _props$label = props.label,
73
- label = _props$label === void 0 ? "" : _props$label,
74
- _props$className = props.className,
75
- className = _props$className === void 0 ? "" : _props$className,
76
- _props$style = props.style,
77
- style = _props$style === void 0 ? {} : _props$style,
78
- _props$shopConfigStyl = props.shopConfigStyle,
79
- shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
80
- _props$onClick = props.onClick,
81
- onClick = _props$onClick === void 0 ? function () {} : _props$onClick,
82
- _props$type = props.type,
83
- type = _props$type === void 0 ? "primary" : _props$type;
84
- var _className = type === "primary" ? "text-textButton bg-primary" : "text-primary bg-transparent border border-primary";
85
- _className = "font-medium rounded-lg text-sm px-4 py-2.5 hover:text-textButton hover:bg-primary hover:opacity-80 " + _className + " " + ((shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.buttonClass) || "") + " " + className;
86
- return /*#__PURE__*/React__default.createElement("button", {
87
- type: "button",
88
- className: _className,
89
- style: style,
90
- onClick: onClick
91
- }, label);
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
+ };
95
128
  var LinkToPage = function LinkToPage(props) {
96
129
  var _props$Link = props.Link,
97
130
  Link = _props$Link === void 0 ? null : _props$Link,
98
131
  otherProps = _objectWithoutPropertiesLoose(props, _excluded);
99
132
  return Link ? /*#__PURE__*/React__default.createElement(Link, otherProps, props.children) : /*#__PURE__*/React__default.createElement("a", otherProps, props.children);
100
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
+
101
200
  var NavBar7 = function NavBar7(props) {
102
- var _routes$filter;
201
+ var _routes$find, _routes$filter, _routes$filter2;
103
202
  var _useState = React.useState(false),
104
203
  isOpen = _useState[0],
105
204
  setIsOpen = _useState[1];
@@ -108,20 +207,41 @@ var NavBar7 = function NavBar7(props) {
108
207
  shopConfigStyle = props.shopConfigStyle,
109
208
  _props$routes = props.routes,
110
209
  routes = _props$routes === void 0 ? [] : _props$routes,
111
- _props$currentRoute = props.currentRoute,
112
- currentRoute = _props$currentRoute === void 0 ? null : _props$currentRoute,
113
- _props$userInfo = props.userInfo,
114
- userInfo = _props$userInfo === void 0 ? null : _props$userInfo,
115
- _props$Link2 = props.Link,
116
- Link = _props$Link2 === void 0 ? null : _props$Link2,
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,
117
214
  _props$useSelector = props.useSelector,
118
- 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;
119
218
  var cartItems = useSelector === null || useSelector === void 0 ? void 0 : useSelector(function (state) {
120
219
  return state.cart.items;
121
220
  });
221
+ var userInfo = useSelector === null || useSelector === void 0 ? void 0 : useSelector(function (state) {
222
+ return state.user.info;
223
+ });
122
224
  var _useState2 = React.useState(""),
123
225
  totalItem = _useState2[0],
124
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
+ }];
125
245
  React.useEffect(function () {
126
246
  console.log("NavBar7 cartItems", cartItems);
127
247
  var totalItem = cartItems.reduce(function (total, item) {
@@ -163,15 +283,16 @@ var NavBar7 = function NavBar7(props) {
163
283
  className: "hidden lg:flex flex-1 items-center gap-4"
164
284
  }, routes === null || routes === void 0 ? void 0 : (_routes$filter = routes.filter(function (e) {
165
285
  return e === null || e === void 0 ? void 0 : e.isShow;
166
- })) === null || _routes$filter === void 0 ? void 0 : _routes$filter.map(function (route, index) {
286
+ })) === null || _routes$filter === void 0 ? void 0 : _routes$filter.map(function (item, index) {
167
287
  return /*#__PURE__*/React__default.createElement(LinkToPage, {
168
288
  Link: Link,
169
- href: route === null || route === void 0 ? void 0 : route.route
170
- }, (currentRoute === null || currentRoute === void 0 ? void 0 : currentRoute.name) === (route === null || route === void 0 ? void 0 : route.name) ? /*#__PURE__*/React__default.createElement("div", {
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", {
171
292
  className: "py-1 border-b text-textHeading border-textHeading"
172
- }, 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", {
173
294
  className: "py-1"
174
- }, route === null || route === void 0 ? void 0 : route.label));
295
+ }, item === null || item === void 0 ? void 0 : item.label));
175
296
  })), cart(), userInfo ?
176
297
  /*#__PURE__*/
177
298
  React__default.createElement("div", {
@@ -180,19 +301,29 @@ var NavBar7 = function NavBar7(props) {
180
301
  className: "text-bgSecondary",
181
302
  size: 48
182
303
  }), /*#__PURE__*/React__default.createElement("div", {
183
- className: "flex flex-col ml-2"
184
- }, /*#__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", {
185
311
  className: "font-semibold"
186
- }, 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
+ })))) :
187
316
  /*#__PURE__*/
188
317
  React__default.createElement("div", {
189
318
  className: "flex gap-2"
190
- }, /*#__PURE__*/React__default.createElement("a", {
319
+ }, /*#__PURE__*/React__default.createElement(LinkToPage, {
320
+ Link: Link,
191
321
  href: "/account"
192
322
  }, /*#__PURE__*/React__default.createElement(Button, {
193
323
  label: "Đăng nhập",
194
324
  shopConfigStyle: shopConfigStyle
195
- })), /*#__PURE__*/React__default.createElement("a", {
325
+ })), /*#__PURE__*/React__default.createElement(LinkToPage, {
326
+ Link: Link,
196
327
  href: "/account"
197
328
  }, /*#__PURE__*/React__default.createElement(Button, {
198
329
  label: "Đăng ký",
@@ -235,13 +366,16 @@ var NavBar7 = function NavBar7(props) {
235
366
  }
236
367
  }, /*#__PURE__*/React__default.createElement(rx.RxCross2, {
237
368
  size: 24
238
- })), /*#__PURE__*/React__default.createElement("div", null, routes === null || routes === void 0 ? void 0 : routes.map(function (route, index) {
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) {
239
372
  return /*#__PURE__*/React__default.createElement(LinkToPage, {
240
373
  Link: Link,
241
- href: route === null || route === void 0 ? void 0 : route.route
374
+ href: item === null || item === void 0 ? void 0 : item.route,
375
+ key: index
242
376
  }, /*#__PURE__*/React__default.createElement("div", {
243
- className: "py-2 " + ((currentRoute === null || currentRoute === void 0 ? void 0 : currentRoute.name) === (route === null || route === void 0 ? void 0 : route.name) ? "text-textHeading" : "")
244
- }, 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));
245
379
  })))) : null));
246
380
  };
247
381
 
@@ -1718,12 +1852,12 @@ const hasStandardBrowserWebWorkerEnv = (() => {
1718
1852
  const origin = hasBrowserEnv && window.location.href || 'http://localhost';
1719
1853
 
1720
1854
  var utils$1 = {
1721
- __proto__: null,
1722
- hasBrowserEnv: hasBrowserEnv,
1723
- hasStandardBrowserWebWorkerEnv: hasStandardBrowserWebWorkerEnv,
1724
- hasStandardBrowserEnv: hasStandardBrowserEnv,
1725
- navigator: _navigator,
1726
- origin: origin
1855
+ __proto__: null,
1856
+ hasBrowserEnv: hasBrowserEnv,
1857
+ hasStandardBrowserWebWorkerEnv: hasStandardBrowserWebWorkerEnv,
1858
+ hasStandardBrowserEnv: hasStandardBrowserEnv,
1859
+ navigator: _navigator,
1860
+ origin: origin
1727
1861
  };
1728
1862
 
1729
1863
  var platform$1 = {
@@ -4862,8 +4996,8 @@ var callBound = function callBoundIntrinsic(name, allowMissing) {
4862
4996
  var _nodeResolve_empty = {};
4863
4997
 
4864
4998
  var _nodeResolve_empty$1 = {
4865
- __proto__: null,
4866
- 'default': _nodeResolve_empty
4999
+ __proto__: null,
5000
+ 'default': _nodeResolve_empty
4867
5001
  };
4868
5002
 
4869
5003
  var utilInspect = getCjsExportFromNamespace(_nodeResolve_empty$1);
@@ -7055,12 +7189,13 @@ var ProductImage = function ProductImage(props) {
7055
7189
  var ModalNotification = function ModalNotification(props) {
7056
7190
  var modalRef = React.useRef(null);
7057
7191
  var onClose = props.onClose,
7058
- onCloseFormBooking = props.onCloseFormBooking;
7192
+ onCloseFormBooking = props.onCloseFormBooking,
7193
+ _props$isButtonClose = props.isButtonClose,
7194
+ isButtonClose = _props$isButtonClose === void 0 ? true : _props$isButtonClose;
7059
7195
  var handleClickOutside = function handleClickOutside(event) {
7060
7196
  if (modalRef.current && !modalRef.current.contains(event.target)) {
7061
- onClose();
7197
+ if (onClose) onClose();
7062
7198
  if (onCloseFormBooking && typeof onCloseFormBooking === 'function') {
7063
- console.log("đóng nhá");
7064
7199
  onCloseFormBooking();
7065
7200
  }
7066
7201
  }
@@ -7076,7 +7211,7 @@ var ModalNotification = function ModalNotification(props) {
7076
7211
  }, /*#__PURE__*/React__default.createElement("div", {
7077
7212
  className: " flex items-center justify-center relative bg-red",
7078
7213
  ref: modalRef
7079
- }, 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", {
7080
7215
  className: "absolute top-4 right-4",
7081
7216
  onClick: onClose
7082
7217
  }, /*#__PURE__*/React__default.createElement(rx.RxCross2, null))));
@@ -7141,6 +7276,19 @@ var createSpaScheduleApi = function createSpaScheduleApi(shopId, data) {
7141
7276
  }
7142
7277
  });
7143
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
+ };
7144
7292
 
7145
7293
  var _excluded$1 = ["productName"];
7146
7294
  var BookingController = function BookingController(props) {
@@ -7263,8 +7411,8 @@ var Input = React.forwardRef(function (props, ref) {
7263
7411
  onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
7264
7412
  }
7265
7413
  };
7266
- var _className = "h-10 py-1 px-2 border border-stroke rounded focus:outline-none focus:ring-0 " + className;
7267
- 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";
7268
7416
  var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
7269
7417
  return (e === null || e === void 0 ? void 0 : e.type) === "required";
7270
7418
  }));
@@ -7300,44 +7448,78 @@ var Input = React.forwardRef(function (props, ref) {
7300
7448
  });
7301
7449
 
7302
7450
  var Select = React.forwardRef(function (props, ref) {
7303
- var _Object$keys;
7304
- var _useState = React.useState(false),
7305
- isOpen = _useState[0],
7306
- setIsOpen = _useState[1];
7307
- var _useState2 = React.useState([]),
7308
- listOptions = _useState2[0],
7309
- setListOptions = _useState2[1];
7310
- var selectRef = React.useRef(null);
7311
- var _useState3 = React.useState(""),
7312
- error = _useState3[0],
7313
- _setError = _useState3[1];
7314
7451
  var _props$label = props.label,
7315
7452
  label = _props$label === void 0 ? "" : _props$label,
7453
+ _props$labelClassName = props.labelClassName,
7454
+ labelClassName = _props$labelClassName === void 0 ? "" : _props$labelClassName,
7316
7455
  _props$placeholder = props.placeholder,
7317
7456
  placeholder = _props$placeholder === void 0 ? "" : _props$placeholder,
7318
7457
  _props$className = props.className,
7319
7458
  className = _props$className === void 0 ? "" : _props$className,
7320
7459
  _props$rules = props.rules,
7321
7460
  rules = _props$rules === void 0 ? [] : _props$rules,
7322
- _props$options = props.options,
7323
- options = _props$options === void 0 ? [] : _props$options,
7324
- _props$value = props.value,
7325
- value = _props$value === void 0 ? [] : _props$value,
7326
- _props$renderItem = props.renderItem,
7327
- renderItem = _props$renderItem === void 0 ? function () {} : _props$renderItem,
7328
- displayItem = props.displayItem,
7329
- searchOption = props.searchOption,
7330
- 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];
7331
7493
  var dropdownRef = React.useRef(null);
7332
- var _useState4 = React.useState('bottom'),
7333
- dropdownPosition = _useState4[0],
7334
- 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]);
7335
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();
7336
7517
  var updateDropdownPosition = function updateDropdownPosition() {
7337
7518
  if (selectRef.current && dropdownRef.current) {
7338
- var selectRect = selectRef.current.getBoundingClientRect();
7339
- var spaceBelow = window.innerHeight - selectRect.bottom;
7340
- 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;
7341
7523
  if (spaceBelow < spaceAbove) {
7342
7524
  setDropdownPosition('top');
7343
7525
  } else {
@@ -7354,17 +7536,19 @@ var Select = React.forwardRef(function (props, ref) {
7354
7536
  };
7355
7537
  }, [isOpen]);
7356
7538
  var handleClickOutside = function handleClickOutside(event) {
7357
- 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))) {
7358
7541
  setIsOpen(false);
7542
+ setInputSearch("");
7543
+ setListOptions(options);
7359
7544
  }
7360
7545
  };
7361
7546
  React.useEffect(function () {
7362
- setListOptions(options);
7363
7547
  document.addEventListener('click', handleClickOutside);
7364
7548
  return function () {
7365
7549
  document.removeEventListener('click', handleClickOutside);
7366
7550
  };
7367
- }, [options]);
7551
+ }, []);
7368
7552
  React.useImperativeHandle(ref, function () {
7369
7553
  return {
7370
7554
  validateData: function validateData() {
@@ -7375,13 +7559,18 @@ var Select = React.forwardRef(function (props, ref) {
7375
7559
  }
7376
7560
  };
7377
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
+ };
7378
7568
  var _validateData = function _validateData() {
7379
7569
  var count = 0;
7380
7570
  for (var _iterator = _createForOfIteratorHelperLoose(rules), _step; !(_step = _iterator()).done;) {
7381
7571
  var _e$pattern;
7382
7572
  var e = _step.value;
7383
- if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && (value === null || value === void 0 ? void 0 : value.length) <= 0) {
7384
- console.log("chưa chọn gì");
7573
+ if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && isEmpty(value)) {
7385
7574
  _setError(e === null || e === void 0 ? void 0 : e.message);
7386
7575
  count++;
7387
7576
  break;
@@ -7399,8 +7588,40 @@ var Select = React.forwardRef(function (props, ref) {
7399
7588
  }
7400
7589
  };
7401
7590
  var handleSearch = function handleSearch(e) {
7402
- var listOptions = handleSearchOption(e);
7403
- 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);
7404
7625
  };
7405
7626
  var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
7406
7627
  return (e === null || e === void 0 ? void 0 : e.type) === "required";
@@ -7410,21 +7631,25 @@ var Select = React.forwardRef(function (props, ref) {
7410
7631
  }, " *") : null;
7411
7632
  return /*#__PURE__*/React__default.createElement("div", {
7412
7633
  ref: selectRef,
7413
- className: className + " relative "
7634
+ className: wrapClassName + " relative "
7414
7635
  }, label ? /*#__PURE__*/React__default.createElement("div", {
7415
- className: "mb-1"
7416
- }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
7417
- 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"
7418
7639
  }, /*#__PURE__*/React__default.createElement("button", {
7419
- className: "w-full h-10 bg-transparent flex justify-between items-center px-3 py-2",
7420
- onClick: function onClick() {
7421
- setIsOpen(!isOpen);
7422
- }
7423
- }, 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", {
7424
- 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
7425
7642
  }, /*#__PURE__*/React__default.createElement("div", {
7643
+ className: "flex justify-between items-center w-full"
7644
+ }, isEmpty(value) || isMulti ? /*#__PURE__*/React__default.createElement("div", {
7426
7645
  className: "text-gray3 line-clamp-1"
7427
- }, 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", {
7428
7653
  className: "ms-1"
7429
7654
  }, /*#__PURE__*/React__default.createElement(fa.FaAngleUp, {
7430
7655
  className: "text-xs"
@@ -7435,21 +7660,32 @@ var Select = React.forwardRef(function (props, ref) {
7435
7660
  style: {
7436
7661
  background: "#FFFFFF"
7437
7662
  },
7438
- className: className + " absolute p-1 my-2 rounded-2xl w-full z-50 border " + (dropdownPosition === 'top' ? 'bottom-full mb-2' : 'top-full mt-2')
7439
- }, /*#__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", {
7440
7665
  className: "px-3 flex items-center border-b-[1px]"
7441
7666
  }, /*#__PURE__*/React__default.createElement(lu.LuSearch, {
7442
7667
  className: "inline text-gray3 me-2"
7443
7668
  }), /*#__PURE__*/React__default.createElement("input", {
7444
7669
  type: "text",
7670
+ ref: inputRef,
7445
7671
  className: "py-2 w-full border-0 focus:outline-none focus:ring-0",
7446
7672
  placeholder: "T\xECm ki\u1EBFm",
7447
- value: searchOption,
7673
+ value: inputSearch,
7448
7674
  onChange: function onChange(e) {
7449
7675
  handleSearch(e);
7450
7676
  }
7451
- })), /*#__PURE__*/React__default.createElement("div", null, listOptions && listOptions.length > 0 ? listOptions.map(function (item, index) {
7452
- 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));
7453
7689
  }) : /*#__PURE__*/React__default.createElement("div", {
7454
7690
  className: "py-6 text-center"
7455
7691
  }, "Kh\xF4ng c\xF3 k\u1EBFt qu\u1EA3")))) : null), error ? /*#__PURE__*/React__default.createElement("div", {
@@ -7559,13 +7795,19 @@ var InputPhoneNumber = React.forwardRef(function (props, ref) {
7559
7795
  _props$type = props.type,
7560
7796
  type = _props$type === void 0 ? "text" : _props$type,
7561
7797
  _props$rules = props.rules,
7562
- 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;
7563
7802
  var _useState = React.useState(defaultValue),
7564
7803
  value = _useState[0],
7565
7804
  _setValue = _useState[1];
7566
- var _useState2 = React.useState(""),
7567
- error = _useState2[0],
7568
- _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];
7569
7811
  var handleOnChange = function handleOnChange(event) {
7570
7812
  var value = event.target.value;
7571
7813
  _setValue(value);
@@ -7615,27 +7857,25 @@ var InputPhoneNumber = React.forwardRef(function (props, ref) {
7615
7857
  var labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
7616
7858
  className: "text-danger"
7617
7859
  }, " *") : null;
7618
- var _className = "h-10 px-2 focus:outline-none focus:ring-0 " + className;
7619
- var data = [{
7620
- country: "Việt Nam",
7621
- code: "+84"
7622
- }];
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
+ }], []);
7623
7865
  return /*#__PURE__*/React__default.createElement("div", {
7624
- className: "flex flex-col px-2 py-1"
7625
- }, label ? /*#__PURE__*/React__default.createElement("label", null, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
7626
- 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
7627
7871
  }, /*#__PURE__*/React__default.createElement("button", {
7628
7872
  className: "flex items-center border-r-2"
7629
7873
  }, /*#__PURE__*/React__default.createElement(Select$1, {
7630
7874
  className: 'w-max',
7875
+ defaultValue: countryCode,
7631
7876
  options: data,
7632
7877
  placeholder: "+84",
7633
- renderItem: function renderItem(item, index) {
7634
- return /*#__PURE__*/React__default.createElement("div", {
7635
- key: "dd\u01B0vhu-" + index,
7636
- className: "px-2 flex items-center hover:bg-gray-200 rounded-lg whitespace-nowrap v-max"
7637
- }, item === null || item === void 0 ? void 0 : item.code, "-", item === null || item === void 0 ? void 0 : item.country);
7638
- }
7878
+ onClick: setCountryCode
7639
7879
  })), /*#__PURE__*/React__default.createElement("input", {
7640
7880
  type: type,
7641
7881
  name: name,
@@ -7643,7 +7883,7 @@ var InputPhoneNumber = React.forwardRef(function (props, ref) {
7643
7883
  placeholder: placeholder,
7644
7884
  onChange: handleOnChange,
7645
7885
  required: required,
7646
- className: _className
7886
+ className: _inputClassName
7647
7887
  })), error ? /*#__PURE__*/React__default.createElement("div", {
7648
7888
  className: "text-danger"
7649
7889
  }, error) : null);
@@ -7684,15 +7924,18 @@ var BookingForm = function BookingForm(props) {
7684
7924
  var _useState2 = React.useState({
7685
7925
  types: "1,10"
7686
7926
  }),
7687
- productsParams = _useState2[0];
7927
+ productsParams = _useState2[0],
7928
+ setProductsParams = _useState2[1];
7688
7929
  var _useState3 = React.useState(false);
7689
- var _useState4 = React.useState(new Date());
7690
- var _useState5 = React.useState(defaultValue),
7691
- listProductSelected = _useState5[0],
7692
- setListProductSelected = _useState5[1];
7693
- var _useState6 = React.useState(""),
7694
- searchOption = _useState6[0],
7695
- 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];
7696
7939
  var inputNameRef = React.useRef(null);
7697
7940
  var inputDateRef = React.useRef(null);
7698
7941
  var inputPhoneNumberRef = React.useRef(null);
@@ -7714,38 +7957,57 @@ var BookingForm = function BookingForm(props) {
7714
7957
  var _BookingController = BookingController(props),
7715
7958
  _BookingController$cr = _BookingController.createSchedule,
7716
7959
  createSchedule = _BookingController$cr === void 0 ? function () {} : _BookingController$cr;
7717
- var handleSelectedProduct = function handleSelectedProduct(event, productSelected) {
7718
- event.stopPropagation();
7719
- console.log("check:", listProductSelected);
7720
- var isExist = listProductSelected.some(function (item) {
7721
- var _item$product;
7722
- 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);
7723
7983
  });
7724
7984
  if (isExist) {
7725
7985
  setListProductSelected(function (prev) {
7726
- return prev.filter(function (item) {
7727
- var _item$product2;
7728
- 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);
7729
7989
  });
7730
7990
  });
7731
7991
  } else {
7732
7992
  setListProductSelected(function (prev) {
7733
- return [].concat(prev, [{
7734
- product: productSelected,
7993
+ return [].concat(prev, [_extends({}, element, {
7735
7994
  quantity: 1,
7736
7995
  technical: {},
7737
7996
  oldService: false
7738
- }]);
7997
+ })]);
7739
7998
  });
7740
7999
  }
7741
8000
  };
7742
- var checkProductSelected = function checkProductSelected(productId) {
7743
- if (listProductSelected && listProductSelected.length > 0) return listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.some(function (item) {
7744
- var _item$product3;
7745
- 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
+ });
7746
8008
  });
7747
8009
  };
7748
- var handleChooseTechnical = function handleChooseTechnical(technicalSelected, index) {
8010
+ var handleChooseTechnical = function handleChooseTechnical(index, technicalSelected) {
7749
8011
  setListProductSelected(function (prev) {
7750
8012
  var updateListSelected = [].concat(prev);
7751
8013
  updateListSelected[index] = _extends({}, updateListSelected[index], {
@@ -7765,37 +8027,18 @@ var BookingForm = function BookingForm(props) {
7765
8027
  });
7766
8028
  }
7767
8029
  };
7768
- var checkTechnicalSelected = function checkTechnicalSelected(technicalStaffIds, index) {
7769
- var _listProductSelected$, _listProductSelected$2;
7770
- 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;
7771
- };
7772
- var removeTechnicalSelected = function removeTechnicalSelected(event, index) {
7773
- event.stopPropagation();
8030
+ var removeTechnicalSelected = function removeTechnicalSelected(productId, technical) {
7774
8031
  setListProductSelected(function (prev) {
7775
- var updateListSelected = [].concat(prev);
7776
- updateListSelected[index] = _extends({}, updateListSelected[index], {
7777
- 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;
7778
8040
  });
7779
- return updateListSelected;
7780
- });
7781
- };
7782
- var handleSearchService = function handleSearchService(e) {
7783
- var searchValue = e.target.value;
7784
- setSearchOption(searchValue);
7785
- var listCopy = products.filter(function (item) {
7786
- var _item$productInfo, _item$productInfo$pro;
7787
- 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());
7788
- });
7789
- return listCopy;
7790
- };
7791
- var handleSearchTechnical = function handleSearchTechnical(e) {
7792
- var searchValue = e.target.value;
7793
- setSearchOption(searchValue);
7794
- var listCopy = listEmployment.filter(function (item) {
7795
- var _item$name;
7796
- 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());
7797
8041
  });
7798
- return listCopy;
7799
8042
  };
7800
8043
  var handleSubmit = function handleSubmit() {
7801
8044
  try {
@@ -7811,9 +8054,9 @@ var BookingForm = function BookingForm(props) {
7811
8054
  var customerName = inputNameRef === null || inputNameRef === void 0 ? void 0 : (_inputNameRef$current2 = inputNameRef.current) === null || _inputNameRef$current2 === void 0 ? void 0 : _inputNameRef$current2.getValue();
7812
8055
  var scheduleDate = inputDateRef === null || inputDateRef === void 0 ? void 0 : (_inputDateRef$current2 = inputDateRef.current) === null || _inputDateRef$current2 === void 0 ? void 0 : _inputDateRef$current2.getValue();
7813
8056
  var services = listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.map(function (item) {
7814
- var _item$product4, _item$technical;
8057
+ var _item$productInfo6, _item$technical;
7815
8058
  return {
7816
- 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,
7817
8060
  technicalStaffIds: [item === null || item === void 0 ? void 0 : (_item$technical = item.technical) === null || _item$technical === void 0 ? void 0 : _item$technical.sysUserId],
7818
8061
  quantity: item === null || item === void 0 ? void 0 : item.quantity,
7819
8062
  oldService: item === null || item === void 0 ? void 0 : item.oldService
@@ -7843,6 +8086,13 @@ var BookingForm = function BookingForm(props) {
7843
8086
  setIsOpenPopup(false);
7844
8087
  setDataBooking({});
7845
8088
  };
8089
+ var handleSearchProducts = function handleSearchProducts(value) {
8090
+ setProductsParams(function (prev) {
8091
+ return _extends({}, prev, {
8092
+ productName: value
8093
+ });
8094
+ });
8095
+ };
7846
8096
  return /*#__PURE__*/React__default.createElement("div", {
7847
8097
  className: "grid gap-4 rounded-lg p-6 " + className,
7848
8098
  style: {
@@ -7872,37 +8122,26 @@ var BookingForm = function BookingForm(props) {
7872
8122
  pattern: pattern === null || pattern === void 0 ? void 0 : pattern.phoneNumberPattern,
7873
8123
  message: "Số điện thoại không hợp lệ!"
7874
8124
  }],
7875
- className: "w-full rounded-lg"
8125
+ className: "w-full rounded-lg rounded-lg bg-bgSecondary",
8126
+ inputClassName: "w-full"
7876
8127
  })), /*#__PURE__*/React__default.createElement("div", {
7877
8128
  className: "grid grid-cols-1 gap-4"
7878
8129
  }, /*#__PURE__*/React__default.createElement("div", {
7879
8130
  className: "relative"
7880
8131
  }, /*#__PURE__*/React__default.createElement(Select$1, {
7881
8132
  ref: inputSelectedRef,
7882
- searchOption: searchOption,
7883
- handleSearchOption: handleSearchService,
7884
- value: listProductSelected,
8133
+ isMulti: true,
8134
+ defaultValue: listProductSelected,
8135
+ onClick: handleSelectedProduct,
8136
+ handleSearchOption: handleSearchProducts,
8137
+ className: "bg-bgSecondary rounded-lg",
7885
8138
  rules: [{
7886
8139
  type: "required",
7887
8140
  message: "Bắt buộc chọn dịch vụ"
7888
8141
  }],
7889
8142
  label: "Dịch vụ",
7890
8143
  placeholder: "Chọn dịch vụ",
7891
- options: products,
7892
- renderItem: function renderItem(item, index) {
7893
- var _item$productInfo2, _item$productInfo3;
7894
- return /*#__PURE__*/React__default.createElement("div", {
7895
- key: "dfjsvsjvhu-" + index,
7896
- className: "px-2 py-1.5 flex items-center hover:bg-gray-100 rounded-lg",
7897
- onClick: function onClick(event) {
7898
- handleSelectedProduct(event, item === null || item === void 0 ? void 0 : item.productInfo);
7899
- }
7900
- }, /*#__PURE__*/React__default.createElement(io.IoMdCheckmark, {
7901
- 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"
7902
- }), /*#__PURE__*/React__default.createElement("div", {
7903
- className: " whitespace-nowrap line-clamp-1"
7904
- }, item === null || item === void 0 ? void 0 : (_item$productInfo3 = item.productInfo) === null || _item$productInfo3 === void 0 ? void 0 : _item$productInfo3.productName));
7905
- }
8144
+ options: productsMapping
7906
8145
  })), /*#__PURE__*/React__default.createElement(DateTimePicker, {
7907
8146
  ref: inputDateRef,
7908
8147
  label: "Thời gian",
@@ -7915,7 +8154,7 @@ var BookingForm = function BookingForm(props) {
7915
8154
  })), (listProductSelected === null || listProductSelected === void 0 ? void 0 : listProductSelected.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
7916
8155
  className: "grid grid-cols-1"
7917
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) {
7918
- var _item$product5;
8157
+ var _item$productInfo7;
7919
8158
  return /*#__PURE__*/React__default.createElement("div", {
7920
8159
  className: "w-full bg-transparent border-b-2 py-3 grid grid-col-12 gap-2",
7921
8160
  key: "ohoihtr-" + optionIndex
@@ -7927,12 +8166,12 @@ var BookingForm = function BookingForm(props) {
7927
8166
  className: "col-span-10"
7928
8167
  }, /*#__PURE__*/React__default.createElement("div", {
7929
8168
  className: "col-span-10 font-semibold "
7930
- }, 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", {
7931
8170
  className: "col-span-1 flex justify-center px-2"
7932
8171
  }, /*#__PURE__*/React__default.createElement("div", {
7933
8172
  className: "flex items-center justify-center cursor-pointer",
7934
8173
  onClick: function onClick(event) {
7935
- handleSelectedProduct(event, item === null || item === void 0 ? void 0 : item.product);
8174
+ handleRemoveProductSelected(event, item);
7936
8175
  }
7937
8176
  }, /*#__PURE__*/React__default.createElement(rx.RxCross2, {
7938
8177
  className: "text-base ",
@@ -7961,40 +8200,20 @@ var BookingForm = function BookingForm(props) {
7961
8200
  }
7962
8201
  })), /*#__PURE__*/React__default.createElement("div", {
7963
8202
  className: "col-end-13 col-span-8 flex flex-col gap-2 "
7964
- }, /*#__PURE__*/React__default.createElement("div", {
7965
- className: "font-semibold text-sm mb-1"
7966
- }, "K\u1EF9 thu\u1EADt vi\xEAn"), /*#__PURE__*/React__default.createElement(Select$1, {
8203
+ }, /*#__PURE__*/React__default.createElement(Select$1, {
7967
8204
  placeholder: "Ch\u1ECDn k\u1EF9 thu\u1EADt vi\xEAn",
7968
- searchOption: searchOption,
7969
- handleSearchOption: handleSearchTechnical,
7970
- value: item === null || item === void 0 ? void 0 : item.technical,
7971
- className: "w-full border rounded-lg",
7972
- displayItem: function displayItem(technicalSelected) {
7973
- return /*#__PURE__*/React__default.createElement("div", {
7974
- className: "flex justify-between items-center w-full"
7975
- }, /*#__PURE__*/React__default.createElement("div", {
7976
- className: "line-clamp-1 text-start "
7977
- }, technicalSelected === null || technicalSelected === void 0 ? void 0 : technicalSelected.name, "(", technicalSelected === null || technicalSelected === void 0 ? void 0 : technicalSelected.roleName, ")"), /*#__PURE__*/React__default.createElement("div", {
7978
- onClick: function onClick(event) {
7979
- removeTechnicalSelected(event, optionIndex);
7980
- }
7981
- }, /*#__PURE__*/React__default.createElement(rx.RxCross2, {
7982
- className: "text-xs"
7983
- })));
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);
7984
8211
  },
7985
- options: listEmployment,
7986
- renderItem: function renderItem(employee, index) {
7987
- return /*#__PURE__*/React__default.createElement("div", {
7988
- key: "dds32vsjvhu-" + index,
7989
- 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",
7990
- onClick: function onClick() {
7991
- handleChooseTechnical(employee, optionIndex);
7992
- }
7993
- }, /*#__PURE__*/React__default.createElement(io.IoMdCheckmark, {
7994
- 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"
7995
- }), /*#__PURE__*/React__default.createElement("div", {
7996
- className: "hover:bg-gray-100 rounded-lg text-wrap md:text-base text-xs"
7997
- }, 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);
7998
8217
  }
7999
8218
  }))));
8000
8219
  })) : null, /*#__PURE__*/React__default.createElement("div", {
@@ -8061,13 +8280,15 @@ var Treatments1 = function Treatments1(props) {
8061
8280
  console.log("treatment1:", products);
8062
8281
  var handleOpenModalBooking = function handleOpenModalBooking(event, data) {
8063
8282
  try {
8283
+ var _data$productInfo, _data$productInfo2;
8064
8284
  event.stopPropagation();
8065
- setDataBooking([{
8066
- product: data,
8285
+ setDataBooking([_extends({}, data, {
8067
8286
  quantity: 1,
8068
8287
  technical: {},
8069
- oldService: false
8070
- }]);
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
+ })]);
8071
8292
  setIsOpenModal(true);
8072
8293
  } catch (error) {
8073
8294
  console.log("::::::::::errrorrrrr::::::", error);
@@ -8075,7 +8296,6 @@ var Treatments1 = function Treatments1(props) {
8075
8296
  };
8076
8297
  var handleCloseModal = function handleCloseModal() {
8077
8298
  setIsOpenModal(false);
8078
- console.log("đóng::::");
8079
8299
  setDataBooking([]);
8080
8300
  };
8081
8301
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
@@ -8107,7 +8327,7 @@ var Treatments1 = function Treatments1(props) {
8107
8327
  shopConfigStyle: shopConfigStyle,
8108
8328
  className: "mt-4",
8109
8329
  onClick: function onClick(event) {
8110
- handleOpenModalBooking(event, product === null || product === void 0 ? void 0 : product.productInfo);
8330
+ handleOpenModalBooking(event, product);
8111
8331
  }
8112
8332
  })), /*#__PURE__*/React__default.createElement("div", {
8113
8333
  className: "hidden " + (index % 2 ? "md:block" : "")
@@ -8120,7 +8340,7 @@ var Treatments1 = function Treatments1(props) {
8120
8340
  }), isOpenModal ? /*#__PURE__*/React__default.createElement(ModalNotification, {
8121
8341
  onClose: handleCloseModal
8122
8342
  }, /*#__PURE__*/React__default.createElement(BookingForm, {
8123
- className: "overflow-y-scroll hide-scrollbar max-h-[80vh]",
8343
+ className: "overflow-y-auto hide-scrollbar max-h-[80vh]",
8124
8344
  onCloseFormBooking: handleCloseModal,
8125
8345
  defaultValue: dataBooking,
8126
8346
  shopConfig: shopConfig,
@@ -8245,39 +8465,6 @@ var ScrollHorizontal = function ScrollHorizontal(props) {
8245
8465
  }))));
8246
8466
  };
8247
8467
 
8248
- var getDurationValue = function getDurationValue(attributes) {
8249
- var _durationAtt$value, _durationAtt$unit;
8250
- if (!attributes) {
8251
- return "";
8252
- }
8253
- if (typeof attributes === "string") {
8254
- attributes = JSON.parse(attributes || "[]");
8255
- }
8256
- var durationAtt = attributes.find(function (attr) {
8257
- return attr.name === "Thời lượng (phút) / buổi";
8258
- });
8259
- 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]) || "") : "";
8260
- };
8261
- var genProductSlug = function genProductSlug(productName, id) {
8262
- var slug = productName.toLowerCase();
8263
- slug = slug.replace(/(à|á|ạ|ả|ã|â|ầ|ấ|ậ|ẩ|ẫ|ă|ằ|ắ|ặ|ẳ|ẵ)/g, "a");
8264
- slug = slug.replace(/(è|é|ẹ|ẻ|ẽ|ê|ề|ế|ệ|ể|ễ)/g, "e");
8265
- slug = slug.replace(/(ì|í|ị|ỉ|ĩ)/g, "i");
8266
- slug = slug.replace(/(ò|ó|ọ|ỏ|õ|ô|ồ|ố|ộ|ổ|ỗ|ơ|ờ|ớ|ợ|ở|ỡ)/g, "o");
8267
- slug = slug.replace(/(ù|ú|ụ|ủ|ũ|ư|ừ|ứ|ự|ử|ữ)/g, "u");
8268
- slug = slug.replace(/(ỳ|ý|ỵ|ỷ|ỹ)/g, "y");
8269
- slug = slug.replace(/(đ)/g, "d");
8270
- slug = slug.replace(/([^0-9a-z-\s])/g, "");
8271
- slug = slug.replace(/(\s+)/g, "-");
8272
- slug = slug.replace(/^-+/g, "");
8273
- slug = slug.replace(/-+$/g, "");
8274
- return slug + "-" + id;
8275
- };
8276
- var getLinkProductDetail = function getLinkProductDetail(product) {
8277
- var slug = genProductSlug(product === null || product === void 0 ? void 0 : product.productName, product === null || product === void 0 ? void 0 : product.productId);
8278
- return "/product/" + slug + "/" + (product === null || product === void 0 ? void 0 : product.shopId);
8279
- };
8280
-
8281
8468
  function getMinMax(array, field) {
8282
8469
  if (!(array !== null && array !== void 0 && array.length) || !array[0].hasOwnProperty(field)) {
8283
8470
  return null;
@@ -9948,61 +10135,775 @@ var Breadcrumb1 = function Breadcrumb1(props) {
9948
10135
  }));
9949
10136
  };
9950
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
+
9951
10586
  var Carts1 = function Carts1(props) {
9952
- var _props$cartItems = props.cartItems,
9953
- 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;
9954
10594
  var _useState = React.useState(false),
9955
- checkAll = _useState[0],
9956
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;
9957
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) {
9958
10645
  var _event$target = event.target,
10646
+ value = _event$target.value,
9959
10647
  checked = _event$target.checked;
9960
- 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
+ }
9961
10664
  };
9962
- return /*#__PURE__*/React__default.createElement("div", {
9963
- 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"
9964
10716
  }, /*#__PURE__*/React__default.createElement("div", {
9965
- className: "flex gap-4 pb-4"
10717
+ className: "flex gap-6 pb-4 whitespace-nowrap w-max md:w-full"
9966
10718
  }, /*#__PURE__*/React__default.createElement("input", {
9967
10719
  type: "checkbox",
9968
- checked: checkAll,
10720
+ checked: (chosenProducts === null || chosenProducts === void 0 ? void 0 : chosenProducts.length) === (cartItems === null || cartItems === void 0 ? void 0 : cartItems.length),
9969
10721
  onChange: handleCheckAll
9970
10722
  }), /*#__PURE__*/React__default.createElement("div", {
9971
- className: "flex-1"
10723
+ className: "min-w-80 lg:flex-1 "
9972
10724
  }, "S\u1EA3n ph\u1EA9m"), /*#__PURE__*/React__default.createElement("div", {
9973
- className: "w-32 text-right"
10725
+ className: "min-w-32 text-right"
9974
10726
  }, "\u0110\u01A1n gi\xE1"), /*#__PURE__*/React__default.createElement("div", {
9975
- className: "w-32 text-center"
10727
+ className: "min-w-32 text-center"
9976
10728
  }, "S\u1ED1 l\u01B0\u1EE3ng"), /*#__PURE__*/React__default.createElement("div", {
9977
- className: "w-32 text-right"
10729
+ className: "min-w-32 text-right"
9978
10730
  }, "Th\xE0nh ti\u1EC1n"), /*#__PURE__*/React__default.createElement("div", {
9979
- className: "w-32 text-center"
9980
- }, "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;
9981
10734
  return /*#__PURE__*/React__default.createElement(CartItem, {
9982
10735
  item: item,
9983
- 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
9984
10744
  });
9985
- }));
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
+ }))));
9986
10852
  };
9987
10853
  var CartItem = function CartItem(props) {
9988
- var item = props.item;
9989
- var _useState2 = React.useState(item.quantity),
9990
- quantity = _useState2[0],
9991
- 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];
9992
10865
  var refInputQuantity = React.useRef();
9993
- 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
+ };
9994
10879
  return /*#__PURE__*/React__default.createElement("div", {
9995
- 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"
9996
10881
  }, /*#__PURE__*/React__default.createElement("input", {
9997
10882
  type: "checkbox",
9998
- checked: false,
9999
- 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
10000
10889
  }), /*#__PURE__*/React__default.createElement("div", {
10001
- className: "flex-1"
10002
- }, "S\u1EA3n ph\u1EA9m"), /*#__PURE__*/React__default.createElement("div", {
10003
- className: "w-32 text-right"
10004
- }, formatCurrency(item.price)), /*#__PURE__*/React__default.createElement("div", {
10005
- 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"
10006
10907
  }, /*#__PURE__*/React__default.createElement(Input, {
10007
10908
  rules: [{
10008
10909
  type: "required",
@@ -10014,17 +10915,24 @@ var CartItem = function CartItem(props) {
10014
10915
  }],
10015
10916
  defaultValue: quantity,
10016
10917
  isQuantity: true,
10017
- min: 1,
10918
+ min: 0,
10018
10919
  onChange: function onChange(text) {
10019
- return setQuantity(parseInt(text));
10920
+ return handleChangeQuantity(item, parseInt(text));
10020
10921
  },
10021
10922
  ref: refInputQuantity,
10022
10923
  wrapClassName: "w-fit mx-auto"
10023
10924
  })), /*#__PURE__*/React__default.createElement("div", {
10024
- className: "w-32 text-right"
10025
- }, formatCurrency(item.price * quantity)), /*#__PURE__*/React__default.createElement("div", {
10026
- className: "w-32 text-center"
10027
- }, "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"))));
10028
10936
  };
10029
10937
 
10030
10938
  exports.About5 = About5;