|
@@ -1,140 +1,22 @@
|
|
|
|
|
|
|
|
import { Swiper, SwiperSlide } from "swiper/react";
|
|
import { Swiper, SwiperSlide } from "swiper/react";
|
|
|
-// import { Pagination } from "swiper/modules";
|
|
|
|
|
import { OpenAddToCartModalButton } from "@/components/common/AddToCartModal/OpenAddToCartModalButton";
|
|
import { OpenAddToCartModalButton } from "@/components/common/AddToCartModal/OpenAddToCartModalButton";
|
|
|
import type {HomeProduct,HomeSectionImage} from "@/types/home/type"
|
|
import type {HomeProduct,HomeSectionImage} from "@/types/home/type"
|
|
|
import Link from "next/link";
|
|
import Link from "next/link";
|
|
|
import Image from "next/image";
|
|
import Image from "next/image";
|
|
|
|
|
+import { useStore } from "@utils/hooks/useConfig";
|
|
|
|
|
+import { Price } from "@components/theme/ui/Price";
|
|
|
interface zeroWearProps {
|
|
interface zeroWearProps {
|
|
|
zeroWear: HomeProduct[];
|
|
zeroWear: HomeProduct[];
|
|
|
zeroWearImage:HomeSectionImage[]
|
|
zeroWearImage:HomeSectionImage[]
|
|
|
}
|
|
}
|
|
|
-// const productList = [
|
|
|
|
|
-// {
|
|
|
|
|
-// id: 1,
|
|
|
|
|
-// img: "https://picsum.photos/400/500?random=1",
|
|
|
|
|
-// title: "14-36 In Water Wave Hum...",
|
|
|
|
|
-// price: 143.35,
|
|
|
|
|
-// },
|
|
|
|
|
-// {
|
|
|
|
|
-// id: 2,
|
|
|
|
|
-// img: "https://picsum.photos/400/500?random=2",
|
|
|
|
|
-// title: "14-36 In Water Wave Hum.",
|
|
|
|
|
-// price: 143.35,
|
|
|
|
|
-// },
|
|
|
|
|
-// {
|
|
|
|
|
-// id: 3,
|
|
|
|
|
-// img: "https://picsum.photos/400/500?random=3",
|
|
|
|
|
-// title: "14-36 In Water Wave Hum...",
|
|
|
|
|
-// price: 143.35,
|
|
|
|
|
-// },
|
|
|
|
|
-// {
|
|
|
|
|
-// id: 4,
|
|
|
|
|
-// img: "https://picsum.photos/400/500?random=4",
|
|
|
|
|
-// title: "14-36 In Water Wave Hum.",
|
|
|
|
|
-// price: 143.35,
|
|
|
|
|
-// },
|
|
|
|
|
-// ];
|
|
|
|
|
|
|
+
|
|
|
|
|
|
|
|
const MiddleImageSwiper = ({ zeroWear,zeroWearImage }: zeroWearProps) => {
|
|
const MiddleImageSwiper = ({ zeroWear,zeroWearImage }: zeroWearProps) => {
|
|
|
- // zeroWear=[
|
|
|
|
|
- // {
|
|
|
|
|
- // "id": 55766,
|
|
|
|
|
- // "sku": "STW--4*7BobWig--RTG-10, #4--STW--5*5BobWig--12",
|
|
|
|
|
- // "name": "[Pack Deal] 10in Natural Black 7*4 Bob Wig and 12in Chocolate Brown 5*5 Bob Wig",
|
|
|
|
|
- // "slug": null,
|
|
|
|
|
- // "type": "flexible_variant",
|
|
|
|
|
- // "price": '368',
|
|
|
|
|
- // "min_price":'368' ,
|
|
|
|
|
- // "special_price": null,
|
|
|
|
|
- // "image_url": "https://img.asteriahair.com/media/catalog/product/2/_/2_wigs_package_deal_natural_black_bob_wig_and_natural_black_bob_wig_1.jpg",
|
|
|
|
|
- // "is_new": false,
|
|
|
|
|
- // "is_featured": false,
|
|
|
|
|
- // "short_description": "Asteria Hair [Pack Deal] 10in Natural Black Ready To Go 7*4 Lace Bob Wig and 12in Chocolate Brown 5*5 Lace Closure Bob Wig.",
|
|
|
|
|
- // "rating": 5,
|
|
|
|
|
- // "review_count": 2
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // "id": 55811,
|
|
|
|
|
- // "sku": "LD--13*4Wig--24,LB--5*7Wig--RTG--20",
|
|
|
|
|
- // "name": "[Pack Deal] 2 Long Length Wig 24Inch Loose Deep 13*4 Lace Wig and 20Inch Body Wave Ready To Go Closure Wig",
|
|
|
|
|
- // "slug": null,
|
|
|
|
|
- // "type": "flexible_variant",
|
|
|
|
|
- // "price": "830",
|
|
|
|
|
- // "min_price": "830",
|
|
|
|
|
- // "special_price": null,
|
|
|
|
|
- // "image_url": "https://img.asteriahair.com/media/catalog/product/l/d/ld_body.png",
|
|
|
|
|
- // "is_new": false,
|
|
|
|
|
- // "is_featured": false,
|
|
|
|
|
- // "short_description": "Asteria Hair [Pack Deal] 2 Long Length Wig 24Inch Loose Deep 13*4 Lace Wig and 20Inch Body Wave Ready To Go 5*7 Closure Wig.",
|
|
|
|
|
- // "rating": 5,
|
|
|
|
|
- // "review_count": 13
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // "id": 55651,
|
|
|
|
|
- // "sku": "STW--4*7Wig--RTG--16,A025--STW--13*4Bob--RTG--12",
|
|
|
|
|
- // "name": "[Pack Deal] 2 Ready To Go Wig 100% Glueless Straight Texture",
|
|
|
|
|
- // "slug": null,
|
|
|
|
|
- // "type": "flexible_variant",
|
|
|
|
|
- // "price": "400",
|
|
|
|
|
- // "min_price": "400",
|
|
|
|
|
- // "special_price": null,
|
|
|
|
|
- // "image_url": "https://img.asteriahair.com/media/catalog/product/b/o/bob_.png",
|
|
|
|
|
- // "is_new": false,
|
|
|
|
|
- // "is_featured": false,
|
|
|
|
|
- // "short_description": "Asteria Hair [Pack Deal] 2 Ready To Go Wig 100% Glueless Straight Texture, straight 7*5 ready to go lace wig 16inch and zigzag style 13*4 ready to go lace bob wig 12inch.",
|
|
|
|
|
- // "rating": 5,
|
|
|
|
|
- // "review_count": 11
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // "id": 55681,
|
|
|
|
|
- // "sku": "Curly--HDLaceFrontWig--20--250%,LB--4*7BobWig--RTG-10",
|
|
|
|
|
- // "name": "[Pack Deal] 20in 250% Density Curly 13*4 HD Lace Wig and 10Inch 7*4 Ready To Go Body Wave Bob Human Hair Wig",
|
|
|
|
|
- // "slug": null,
|
|
|
|
|
- // "type": "flexible_variant",
|
|
|
|
|
- // "price": "650",
|
|
|
|
|
- // "min_price": "650",
|
|
|
|
|
- // "special_price": null,
|
|
|
|
|
- // "image_url": "https://img.asteriahair.com/media/catalog/product/j/c/jc_rtg_lb_.png",
|
|
|
|
|
- // "is_new": false,
|
|
|
|
|
- // "is_featured": false,
|
|
|
|
|
- // "short_description": "Asteria Hair [Pack Deal] 20in 250% Density Curly 13*4 HD Lace Wig and 10in 7*4 Ready To Go Body Wave Bob Human Hair Lace Wig.",
|
|
|
|
|
- // "rating": 5,
|
|
|
|
|
- // "review_count": 4
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // "id": 55982,
|
|
|
|
|
- // "sku": "JC-5*7Wig-24-180%-RTG,NHC-RTG-LB-4*7BOB-12",
|
|
|
|
|
- // "name": "[Pack Deal]2 Ready To Go Wigs Curly 5*7 Lace Wig 24 Inch And BOB Body Wave Wig 4*7 Lace Wigs 12 Inch",
|
|
|
|
|
- // "slug": null,
|
|
|
|
|
- // "type": "flexible_variant",
|
|
|
|
|
- // "price": '738',
|
|
|
|
|
- // "min_price": '738',
|
|
|
|
|
- // "special_price": null,
|
|
|
|
|
- // "image_url": "https://img.asteriahair.com/media/catalog/product/1/_/1_6_16.png",
|
|
|
|
|
- // "is_new": false,
|
|
|
|
|
- // "is_featured": false,
|
|
|
|
|
- // "short_description": "This value pack includes two ready-to-wear wigs: a 24-inch curly style with 5*7 lace front and a 12-inch body wave bob with 4*7 lace, both made from human hair for instant perfection and versatile styling.",
|
|
|
|
|
- // "rating": 0,
|
|
|
|
|
- // "review_count": 0
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // "id": 55984,
|
|
|
|
|
- // "sku": "NHC-RTG-LB-4*7BOB-12,NHC-RTG-STW-4*7BOB-10",
|
|
|
|
|
- // "name": "[Pack Deal]Ready To Go Wigs Bob Straight Wig 4*7 Lace Wigs 10 Inch And BOB Body Wave Wig 4*7 Lace Wigs 12 Inch",
|
|
|
|
|
- // "slug": null,
|
|
|
|
|
- // "type": "flexible_variant",
|
|
|
|
|
- // "price": '398',
|
|
|
|
|
- // "min_price": '398',
|
|
|
|
|
- // "special_price": null,
|
|
|
|
|
- // "image_url": "https://img.asteriahair.com/media/catalog/product/1/_/1_7.png",
|
|
|
|
|
- // "is_new": false,
|
|
|
|
|
- // "is_featured": false,
|
|
|
|
|
- // "short_description": "This value pack includes two ready-to-wear bob wigs: a 10-inch straight style and a 12-inch body wave style, both featuring a 4*7 lace construction and made from human hair, allowing you to effortlessly switch between two fashionable looks.",
|
|
|
|
|
- // "rating": 0,
|
|
|
|
|
- // "review_count": 0
|
|
|
|
|
- // }
|
|
|
|
|
- // ]
|
|
|
|
|
|
|
+
|
|
|
|
|
+ const {store} = useStore();
|
|
|
|
|
+ const currencyCode = store.currentCurrency;
|
|
|
|
|
+
|
|
|
if (!zeroWear || zeroWear.length === 0) return null;
|
|
if (!zeroWear || zeroWear.length === 0) return null;
|
|
|
const productList = zeroWear
|
|
const productList = zeroWear
|
|
|
const WearImage = zeroWearImage;
|
|
const WearImage = zeroWearImage;
|
|
@@ -197,10 +79,18 @@ const MiddleImageSwiper = ({ zeroWear,zeroWearImage }: zeroWearProps) => {
|
|
|
{/* 价格 + 购物车图标 */}
|
|
{/* 价格 + 购物车图标 */}
|
|
|
<div className="flex items-center justify-between">
|
|
<div className="flex items-center justify-between">
|
|
|
<div className="flex items-center gap-1">
|
|
<div className="flex items-center gap-1">
|
|
|
- <span className="font-semibold">${item.min_price}</span>
|
|
|
|
|
- <span className="text-xs text-gray-500 line-through">
|
|
|
|
|
- ${item.price}
|
|
|
|
|
- </span>
|
|
|
|
|
|
|
+
|
|
|
|
|
+ <Price
|
|
|
|
|
+ className="text-ly-18 font-bold"
|
|
|
|
|
+ amount={item.min_price}
|
|
|
|
|
+ currencyCode={currencyCode}
|
|
|
|
|
+ />
|
|
|
|
|
+
|
|
|
|
|
+ <Price
|
|
|
|
|
+ className="text-ly-18 text-ly-gray line-through"
|
|
|
|
|
+ amount={item.price}
|
|
|
|
|
+ currencyCode={currencyCode}
|
|
|
|
|
+ />
|
|
|
</div>
|
|
</div>
|
|
|
{/* 购物车图标 */}
|
|
{/* 购物车图标 */}
|
|
|
<OpenAddToCartModalButton
|
|
<OpenAddToCartModalButton
|