diff --git a/app/page.jsx b/app/page.jsx index 7eeb508..fcbde6c 100644 --- a/app/page.jsx +++ b/app/page.jsx @@ -1,4 +1,4 @@ -import Hero from "@/components/homes/home-15/Hero"; +import Hero15 from "@/components/homes/home-15/Hero15"; import SwiperItems from "@/components/homes/home-15/SwiperItems"; import React from "react"; import { getSiteSettings } from "@/utils/data"; @@ -33,7 +33,7 @@ export default function Page() {
<>
- +
diff --git a/components/homes/home-15/Hero15/UI.jsx b/components/homes/home-15/Hero15/UI.jsx new file mode 100644 index 0000000..e4e527e --- /dev/null +++ b/components/homes/home-15/Hero15/UI.jsx @@ -0,0 +1,124 @@ +"use client"; +import { useState } from "react"; +import ModalVideo from "@/components/common/ModalVideo"; +import Link from "next/link"; +import { Autoplay, Navigation, Pagination } from "swiper/modules"; +import { Swiper, SwiperSlide } from "swiper/react"; + +export default function HeroUI({ data, showNavButtons = false }) { + const [isOpen, setIsOpen] = useState(""); + + if (!data) return null; + + // 处理items + const items = data.items || []; + // 处理图片 + const bgImages = [data.image, data.image_1, data.image_2].filter(Boolean); + // 处理标题和副标题 + const titles = [data.title, ...(items.map(i => i.item_title))].filter(Boolean); + const subtitles = [data.subtitle, ...(items.map(i => i.item_subtitle))].filter(Boolean); + const descs = [data.description, ...(items.map(i => i.item_description))].filter(Boolean); + + return ( + <> +
+ + {items.map((item, idx) => { + let alignClass = ""; + switch ((item.content_align || "").toLowerCase()) { + case "center": + alignClass = "md:w-11/12 lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full !mx-auto text-center"; + break; + case "right": + alignClass = "md:w-10/12 lg:w-7/12 xl:w-6/12 w-full max-w-full text-center lg:text-right xl:text-right lg:!ml-[41.666667%] xl:!ml-[50%] xxl:!ml-[50%]"; + break; + case "left": + default: + alignClass = "md:w-10/12 md:!ml-[8.33333333%] lg:w-7/12 lg:!ml-0 xl:w-6/12 xxl:w-5/12 w-full max-w-full text-center lg:text-left xl:text-left"; + break; + } + return ( + +
+
+
+

+ {item.item_title || data.title} +

+

+ {item.item_subtitle || data.subtitle} +

+
+ {item.item_video_src ? ( + setIsOpen(item.item_video_src)} + className="btn btn-circle btn-white btn-play ripple !mx-auto !mb-5 !relative z-[2] xl:!text-[2.3rem] !w-[3.5rem] !h-[3.5rem] !text-[calc(1.355rem_+_1.26vw)] hover:translate-y-0 inline-flex items-center justify-center leading-none p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#ffffff] after:content-[''] after:block after:absolute after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:z-[-1] after:rounded-[50%] before:inset-0 after:bg-[#ffffff]" + style={{ cursor: "pointer" }} + > + + + ) : ( + item.item_button_text && item.item_button_link && ( + item.item_button_link.startsWith("http") ? ( + + {item.item_button_text} + + ) : ( + + {item.item_button_text} + + ) + ) + )} +
+
+
+
+ + ); + })} + +
+ {showNavButtons && ( +
+
+
+
+ )} +
+
+
+ + setIsOpen("")} + src={isOpen} + /> + + ); +} diff --git a/components/homes/home-15/Hero15/index.jsx b/components/homes/home-15/Hero15/index.jsx new file mode 100644 index 0000000..6752207 --- /dev/null +++ b/components/homes/home-15/Hero15/index.jsx @@ -0,0 +1,16 @@ +import { getComponentName } from "@/utils/getComponentName"; +import { fetchComponentData } from "@/utils/data"; +import UI from "./UI"; + +const componentName = getComponentName(import.meta.url); + +export default async function Component() { + const result = await fetchComponentData(componentName); + + if (result.error || !result.data) { + if (result.error) console.error(`Failed to fetch ${componentName} data:`, result.error); + return null; + } + + return ; +} diff --git a/public/files/4f1be9vdh1_c399d4a7.png b/public/files/4f1be9vdh1_c399d4a7.png new file mode 100644 index 0000000..223d981 Binary files /dev/null and b/public/files/4f1be9vdh1_c399d4a7.png differ diff --git a/public/files/4f4dth9h8o_2f658f40.png b/public/files/4f4dth9h8o_2f658f40.png new file mode 100644 index 0000000..1f21048 Binary files /dev/null and b/public/files/4f4dth9h8o_2f658f40.png differ diff --git a/public/files/4f6h671vh8_2e9b0231.png b/public/files/4f6h671vh8_2e9b0231.png new file mode 100644 index 0000000..60a2cac Binary files /dev/null and b/public/files/4f6h671vh8_2e9b0231.png differ diff --git a/public/files/4f9koe2v5n_c478425b.png b/public/files/4f9koe2v5n_c478425b.png new file mode 100644 index 0000000..1a87e8d Binary files /dev/null and b/public/files/4f9koe2v5n_c478425b.png differ diff --git a/public/files/4fc8nc4ldb_d6a1aa02.png b/public/files/4fc8nc4ldb_d6a1aa02.png new file mode 100644 index 0000000..0839166 Binary files /dev/null and b/public/files/4fc8nc4ldb_d6a1aa02.png differ diff --git a/public/files/4ffcdr62c8_5ce711c5.png b/public/files/4ffcdr62c8_5ce711c5.png new file mode 100644 index 0000000..88d0d73 Binary files /dev/null and b/public/files/4ffcdr62c8_5ce711c5.png differ diff --git a/public/files/4fimj0t7nu_b9f3fee8.png b/public/files/4fimj0t7nu_b9f3fee8.png new file mode 100644 index 0000000..c0ad205 Binary files /dev/null and b/public/files/4fimj0t7nu_b9f3fee8.png differ diff --git a/public/files/4fldpdggv0_05795d2c.png b/public/files/4fldpdggv0_05795d2c.png new file mode 100644 index 0000000..faeed4d Binary files /dev/null and b/public/files/4fldpdggv0_05795d2c.png differ diff --git a/public/files/4fo5hsu9j6_5a0c376b.png b/public/files/4fo5hsu9j6_5a0c376b.png new file mode 100644 index 0000000..a918da5 Binary files /dev/null and b/public/files/4fo5hsu9j6_5a0c376b.png differ diff --git a/public/files/4fqpfshkot_930c3d07.png b/public/files/4fqpfshkot_930c3d07.png new file mode 100644 index 0000000..7d7662e Binary files /dev/null and b/public/files/4fqpfshkot_930c3d07.png differ diff --git a/public/files/atrg7omggg_50271250.png b/public/files/atrg7omggg_50271250.png new file mode 100644 index 0000000..419179b Binary files /dev/null and b/public/files/atrg7omggg_50271250.png differ diff --git a/public/files/atv13e9hdg_9a160391.png b/public/files/atv13e9hdg_9a160391.png new file mode 100644 index 0000000..6c94014 Binary files /dev/null and b/public/files/atv13e9hdg_9a160391.png differ diff --git a/public/files/au2bm01ul0_28963fdc.png b/public/files/au2bm01ul0_28963fdc.png new file mode 100644 index 0000000..47391d6 Binary files /dev/null and b/public/files/au2bm01ul0_28963fdc.png differ diff --git a/public/files/au6d5h54r6_afea8ae4.png b/public/files/au6d5h54r6_afea8ae4.png new file mode 100644 index 0000000..3367d72 Binary files /dev/null and b/public/files/au6d5h54r6_afea8ae4.png differ diff --git a/public/files/auabk9ilft_99cda3c7.png b/public/files/auabk9ilft_99cda3c7.png new file mode 100644 index 0000000..a42c7db Binary files /dev/null and b/public/files/auabk9ilft_99cda3c7.png differ diff --git a/public/files/brou63ehu6_e4353faa.png b/public/files/brou63ehu6_e4353faa.png new file mode 100644 index 0000000..119bc18 Binary files /dev/null and b/public/files/brou63ehu6_e4353faa.png differ diff --git a/utils/getComponentName.js b/utils/getComponentName.js new file mode 100644 index 0000000..d8e3c26 --- /dev/null +++ b/utils/getComponentName.js @@ -0,0 +1,8 @@ +import path from "path"; +import { fileURLToPath } from "url"; + +export function getComponentName(metaUrl) { + const __filename = fileURLToPath(metaUrl); + const __dirname = path.dirname(__filename); + return path.basename(__dirname); +}