s-platform-landing-section 0.1.31 → 0.1.32

package/dist/index.modern.js

@@ -18,7 +18,7 @@ import 'slick-carousel/slick/slick.css';
 import 'slick-carousel/slick/slick-theme.css';
 import { AiOutlineShoppingCart, AiOutlinePhone } from 'react-icons/ai';
 import { GoCreditCard, GoClock } from 'react-icons/go';
-import { HiOutlineLocationMarker } from 'react-icons/hi';
+import { HiOutlineLocationMarker, HiOutlineArrowNarrowLeft, HiOutlineArrowNarrowRight } from 'react-icons/hi';
 import { RiDeleteBin7Line } from 'react-icons/ri';
 import { GiNewspaper } from 'react-icons/gi';
 
@@ -163,6 +163,103 @@ var urlMappings = {
 function convertURL(path) {
   return urlMappings[path] || path;
 }
+var ROUTE = {
+  HOME: {
+    name: "home",
+    label: "Trang chủ",
+    route: "/",
+    isShow: true
+  },
+  PRODUCTS: {
+    name: "products",
+    label: "Sản phẩm",
+    route: "/products",
+    isShow: true
+  },
+  PRODUCTS_BY_CATEGORY: {
+    name: "products_by_category",
+    label: "Sản phẩm theo danh mục",
+    route: "/products/:slug"
+  },
+  PRODUCT: {
+    name: "product",
+    label: "Chi tiết sản phẩm",
+    route: "/product/:slug"
+  },
+  SERVICES: {
+    name: "services",
+    label: "Dịch vụ",
+    route: "/services",
+    isShow: true
+  },
+  SERVICE: {
+    name: "service",
+    label: "Chi tiết dịch vụ",
+    route: "/service/:slug"
+  },
+  BOOKING: {
+    name: "booking",
+    label: "Đặt lịch",
+    route: "/dat-lich",
+    isShow: true
+  },
+  ABOUT: {
+    name: "about",
+    label: "Giới thiệu",
+    route: "/about",
+    isShow: true
+  },
+  SALES: {
+    name: "sales",
+    label: "Sản phẩm",
+    route: "/sales"
+  },
+  NEWS: {
+    name: "news",
+    label: "Tin tức",
+    route: "/news"
+  },
+  NEWS_BY_CATEGORY: {
+    name: "news_by_category",
+    label: "Tin tức theo danh mục",
+    route: "/news/:slug"
+  },
+  NEWS_DETAIL: {
+    name: "news_detail",
+    label: "Tin tức",
+    route: "/news/:slug/:languageCode"
+  },
+  CARTS: {
+    name: "carts",
+    label: "Giỏ hàng",
+    route: "/carts"
+  },
+  ORDERS: {
+    name: "orders",
+    label: "Đơn hàng",
+    route: "/orders"
+  },
+  ORDER: {
+    name: "order",
+    label: "Chi tiết đơn hàng",
+    route: "/order"
+  },
+  ACCOUNT: {
+    name: "account",
+    label: "Tài khoản",
+    route: "/account"
+  },
+  PROFILE: {
+    name: "profile",
+    label: "Tài khoản",
+    route: "/profile"
+  },
+  SEARCH: {
+    name: "search",
+    label: "Tìm kiếm",
+    route: "/search"
+  }
+};
 
 var Options = function Options(props) {
   var _props$className = props.className,
@@ -1107,7 +1204,7 @@ var Hero2 = function Hero2(props) {
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "font-medium line-clamp-1 ",
     style: {
-      fontSize: "clamp(1.25rem, 3vw, 3.5rem)",
+      fontSize: "clamp(1.25rem, 4vw, 3.5rem)",
       lineHeight: "1.5"
     }
   }, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : (_data$data3$ = _data$data3[0]) === null || _data$data3$ === void 0 ? void 0 : _data$data3$.title), /*#__PURE__*/React__default.createElement("div", {
@@ -9432,7 +9529,7 @@ var TreatmentsList7 = function TreatmentsList7(props) {
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "mt-12 w-full"
   }, (products === null || products === void 0 ? void 0 : products.length) > 0 ? /*#__PURE__*/React__default.createElement(Slider, {
-    infinite: true,
+    infinite: (products === null || products === void 0 ? void 0 : products.length) > 1 ? true : false,
     slidesToShow: 1,
     slidesToScroll: 1,
     speed: 500,
@@ -10026,6 +10123,7 @@ var TreatmentItem1 = function TreatmentItem1(props) {
 };
 
 var ProductList7 = function ProductList7(props) {
+  var _products$slice;
   var _props$shopConfigStyl = props.shopConfigStyle,
     shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
     _props$data = props.data,
@@ -10039,7 +10137,7 @@ var ProductList7 = function ProductList7(props) {
     _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
     secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
   var _useState = useState({
-      size: 4
+      size: 8
     }),
     params = _useState[0];
   var _ProductController = ProductController(_extends({}, props, {
@@ -10055,21 +10153,21 @@ var ProductList7 = function ProductList7(props) {
     shopConfigStyle: shopConfigStyle
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-10 mt-12"
-  }, products === null || products === void 0 ? void 0 : products.map(function (product, index) {
+  }, products === null || products === void 0 ? void 0 : (_products$slice = products.slice(0, 4)) === null || _products$slice === void 0 ? void 0 : _products$slice.map(function (product, index) {
     return /*#__PURE__*/React__default.createElement(ProductItem, {
       Link: Link,
       shopConfigStyle: shopConfigStyle,
       key: index,
       product: product === null || product === void 0 ? void 0 : product.productInfo
     });
-  })), (products === null || products === void 0 ? void 0 : products.length) > 0 ? /*#__PURE__*/React__default.createElement(LinkToPage, {
+  })), (products === null || products === void 0 ? void 0 : products.length) > 4 ? /*#__PURE__*/React__default.createElement(LinkToPage, {
     href: "/san-pham",
     Link: Link
   }, /*#__PURE__*/React__default.createElement(Button, {
     label: "Xem tất cả",
     shopConfigStyle: shopConfigStyle,
     className: "mt-12"
-  })) : null), /*#__PURE__*/React__default.createElement(Dash, {
+  })) : /*#__PURE__*/React__default.createElement(NotFoundProduct, null)), /*#__PURE__*/React__default.createElement(Dash, {
     color: secondary
   }));
 };
@@ -12617,31 +12715,99 @@ var Employees1 = function Employees1(props) {
 };
 
 var Gallery1 = function Gallery1(props) {
-  var _data$data;
+  var _data$data, _data$data2, _ROUTE$BOOKING;
   var _props$shopConfigStyl = props.shopConfigStyle,
     shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
     _props$data = props.data,
     data = _props$data === void 0 ? {} : _props$data,
     _props$SectionTitle = props.SectionTitle,
-    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
+    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle,
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
   var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
     _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
     secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
-  console.log("Gallery1 data", data);
+  var sliderRef = useRef(null);
+  var settings = {
+    infinite: true,
+    slidesToShow: 3,
+    slidesToScroll: 1,
+    speed: 500,
+    autoplay: false,
+    autoplaySpeed: 4000,
+    pauseOnHover: true,
+    dots: false,
+    swipe: true,
+    touchMove: true,
+    arrows: false,
+    responsive: [{
+      breakpoint: 1024,
+      settings: {
+        slidesToShow: 3,
+        slidesToScroll: 1
+      }
+    }, {
+      breakpoint: 1023,
+      settings: {
+        slidesToShow: 2,
+        slidesToScroll: 1
+      }
+    }, {
+      breakpoint: 635,
+      settings: {
+        slidesToShow: 1,
+        slidesToScroll: 1
+      }
+    }]
+  };
+  var goToNext = function goToNext() {
+    if (sliderRef.current) {
+      sliderRef.current.slickNext();
+    }
+  };
+  var goToPrev = function goToPrev() {
+    if (sliderRef.current) {
+      sliderRef.current.slickPrev();
+    }
+  };
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
     className: "" + SECTION_DEFAULT_CLASS
   }, /*#__PURE__*/React__default.createElement(SectionTitle, {
     data: data,
     shopConfigStyle: shopConfigStyle
-  }), /*#__PURE__*/React__default.createElement("div", {
-    className: "mt-6 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-1 md:gap-2"
-  }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map(function (it, index) {
+  }), (data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
+    className: "mt-10"
+  }, /*#__PURE__*/React__default.createElement(Slider, _extends({}, settings, {
+    ref: sliderRef
+  }), data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : _data$data2.map(function (it, index) {
     return /*#__PURE__*/React__default.createElement("div", {
-      key: index
+      key: index,
+      className: "px-0 sm:px-4 md:px-4 pointer-events-none lg:px-6"
     }, /*#__PURE__*/React__default.createElement("img", {
-      src: it === null || it === void 0 ? void 0 : it.srcImage
+      src: it === null || it === void 0 ? void 0 : it.srcImage,
+      className: "rounded-2xl object-cover"
     }));
-  }))), /*#__PURE__*/React__default.createElement(Dash, {
+  })), /*#__PURE__*/React__default.createElement("div", {
+    className: "flex flex-col gap-6 items-center"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "flex gap-6 mt-2 items-center"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "text-primary cursor-pointer hover:scale-110 duration-200 hover:opacity-80",
+    onClick: goToPrev
+  }, /*#__PURE__*/React__default.createElement(HiOutlineArrowNarrowLeft, {
+    size: 34
+  })), /*#__PURE__*/React__default.createElement("div", {
+    className: "text-primary cursor-pointer hover:scale-110 duration-200 hover:opacity-80",
+    onClick: goToNext
+  }, /*#__PURE__*/React__default.createElement(HiOutlineArrowNarrowRight, {
+    size: 34
+  }))), /*#__PURE__*/React__default.createElement(LinkToPage, {
+    href: ROUTE === null || ROUTE === void 0 ? void 0 : (_ROUTE$BOOKING = ROUTE.BOOKING) === null || _ROUTE$BOOKING === void 0 ? void 0 : _ROUTE$BOOKING.route,
+    Link: Link
+  }, /*#__PURE__*/React__default.createElement(Button, {
+    label: "\u0110\u1EB6T L\u1ECACH NGAY",
+    shopConfigStyle: shopConfigStyle
+  })))) : null), /*#__PURE__*/React__default.createElement(Dash, {
     color: secondary
   }));
 };
@@ -13934,7 +14100,7 @@ var SearchBar6 = function SearchBar6(props) {
     }
   };
   return /*#__PURE__*/React__default.createElement("div", {
-    className: "w-full flex flex-col justify-center px-3 md:px-6 gap-2 lg:gap-3 items-center h-32 lg:h-44 ",
+    className: "w-full flex flex-col justify-center px-3 md:px-6 gap-2 md:gap-4 lg:gap-6 items-center h-40 lg:h-52 ",
     style: {
       background: "url(" + (data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.srcImage) + ")",
       backgroundPosition: "center",
@@ -13945,7 +14111,7 @@ var SearchBar6 = function SearchBar6(props) {
   }, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : _data$data3.title) : null, data !== null && data !== void 0 && (_data$data4 = data.data) !== null && _data$data4 !== void 0 && _data$data4.description ? /*#__PURE__*/React__default.createElement("div", {
     className: "text-center text-textBody"
   }, data === null || data === void 0 ? void 0 : (_data$data5 = data.data) === null || _data$data5 === void 0 ? void 0 : _data$data5.description) : null, /*#__PURE__*/React__default.createElement("div", {
-    className: "flex gap-2 md:gap-4 lg:gap-6 mb-2 md:mb-0 w-full md:w-[70%] h-10 lg:h-12 lg:w-1/2"
+    className: "flex gap-2 md:gap-4 lg:gap-6 mb-2 md:mb-0 w-[90%] sm:w-[70%] h-10 lg:h-12 lg:w-1/2"
   }, /*#__PURE__*/React__default.createElement(Input, {
     icons: /*#__PURE__*/React__default.createElement(IoSearchOutline, {
       className: "text-gray3"
@@ -13976,7 +14142,7 @@ var ShopHighlights2 = function ShopHighlights2(props) {
     Link = _props$Link === void 0 ? null : _props$Link;
   var sectionData = data === null || data === void 0 ? void 0 : data.data;
   return /*#__PURE__*/React__default.createElement("div", {
-    className: SECTION_CLASS + " my-0 md:my-0 !bg-bgSecondary py-6 grid grid-cols-2 lg:grid-cols-4 gap-4 lg:gap-6"
+    className: SECTION_CLASS + " !mt-0 !md:mt-0 !bg-bgSecondary py-6 grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 md:gap-6"
   }, sectionData === null || sectionData === void 0 ? void 0 : sectionData.map(function (item, index) {
     var _item$title;
     return /*#__PURE__*/React__default.createElement(LinkToPage, {
@@ -14140,7 +14306,7 @@ var VideoFull1 = function VideoFull1(props) {
     data: data,
     shopConfigStyle: shopConfigStyle
   }), youtubeVideoId ? /*#__PURE__*/React__default.createElement("div", {
-    className: "w-full aspect-video"
+    className: "w-full aspect-video mt-6"
   }, /*#__PURE__*/React__default.createElement("iframe", {
     className: "w-full h-full",
     src: "https://www.youtube.com/embed/" + youtubeVideoId,