From 9345e8fc3c9743e92d7cc5e5119f7776bd334ae2 Mon Sep 17 00:00:00 2001 From: jingrow Date: Sat, 23 Aug 2025 16:01:24 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0getComponentName.js,fetchComp?= =?UTF-8?q?onentData=E9=BB=98=E8=AE=A4=E5=BC=80=E5=90=AF=E8=87=AA=E5=8A=A8?= =?UTF-8?q?=E4=B8=8B=E8=BD=BD=E6=96=87=E4=BB=B6=E5=88=B0=E6=9C=AC=E5=9C=B0?= =?UTF-8?q?=E5=8A=9F=E8=83=BD=EF=BC=8C=E9=87=8D=E6=9E=84Features=E7=BB=84?= =?UTF-8?q?=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/homes/home-15/Features.jsx | 94 --------------------- components/homes/home-15/Features/UI.jsx | 94 +++++++++++++++++++++ components/homes/home-15/Features/index.jsx | 16 ++++ utils/data.js | 11 ++- utils/getComponentName.js | 8 ++ 5 files changed, 127 insertions(+), 96 deletions(-) delete mode 100644 components/homes/home-15/Features.jsx create mode 100644 components/homes/home-15/Features/UI.jsx create mode 100644 components/homes/home-15/Features/index.jsx create mode 100644 utils/getComponentName.js diff --git a/components/homes/home-15/Features.jsx b/components/homes/home-15/Features.jsx deleted file mode 100644 index b17d969..0000000 --- a/components/homes/home-15/Features.jsx +++ /dev/null @@ -1,94 +0,0 @@ -"use client"; -import React, { useEffect, useState } from "react"; -import Image from "next/image"; -import axios from "axios"; - -export default function Features() { - const [data, setData] = useState(null); - const [loading, setLoading] = useState(true); - const [error, setError] = useState(null); - - useEffect(() => { - async function fetchData() { - try { - setLoading(true); - const res = await axios.get("/api/get-component-data", { - params: { component_name: "Features" }, - }); - setData(res.data.data); - } catch (err) { - setError("获取Features数据失败"); - } finally { - setLoading(false); - } - } - fetchData(); - }, []); - - if (loading) return
Loading...
; - if (error) return null; - if (!data) return null; - - // 主图 - const mainImage = data.image || "/assets/img/photos/about2.jpg"; - // 标题/副标题/描述 - const title = data.title || ""; - const subtitle = data.subtitle || ""; - const description = data.description || ""; - const icon = data.icon || "/files/icon.svg"; - const htmlCode = data.html_code || ""; - const buttonText = data.button_text || "MORE"; - const buttonLink = data.button_link || "#"; - // items 子表 - // const items = data.items || []; - - return ( -
- {/* 左侧内容区 */} -
- {htmlCode ? ( -
- ) : ( - icon - )} -

- {title} -

-
- - {/* 右侧图片区 */} -
-
- image -
-
-
- ); -} diff --git a/components/homes/home-15/Features/UI.jsx b/components/homes/home-15/Features/UI.jsx new file mode 100644 index 0000000..9193783 --- /dev/null +++ b/components/homes/home-15/Features/UI.jsx @@ -0,0 +1,94 @@ +"use client"; +import React from "react"; +import Image from "next/image"; + +export default function UI({ data }) { + if (!data) return null; + + // 主图 + const mainImage = data.image || "/assets/img/photos/about2.jpg"; + const secondImage = data.image_1 || "/assets/img/photos/about3.jpg"; + // 标题/副标题/描述 + const title = data.title || ""; + const subtitle = data.subtitle || ""; + const description = data.description || ""; + const icon = data.icon || "/files/icon.svg"; + const htmlCode = data.html_code || ""; + const buttonText = data.button_text || "MORE"; + const buttonLink = data.button_link || "#"; + + return ( +
+ {/* 右侧图片区 - 错开叠放 */} +
+ {/* 装饰性背景点 */} +
+ {/* 错开叠放的图片容器 */} +
+ {/* 第一张图片 - 较大，位置偏右 */} +
+
+ image +
+
+ {/* 第二张图片 - 较小，位置偏左，覆盖第一张图片 */} +
+
+ image +
+
+
+
+ {/* 左侧内容区 */} +
+ {htmlCode ? ( +
+ ) : ( + icon + )} +

+ {title} +

+ + ); +} diff --git a/components/homes/home-15/Features/index.jsx b/components/homes/home-15/Features/index.jsx new file mode 100644 index 0000000..6752207 --- /dev/null +++ b/components/homes/home-15/Features/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/utils/data.js b/utils/data.js index 390deb9..55d80cf 100644 --- a/utils/data.js +++ b/utils/data.js @@ -185,7 +185,7 @@ export async function getAllSlugs() { } } -export async function fetchComponentData(componentName) { +export async function fetchComponentData(componentName, downloadFiles = true) { try { const res = await axios.get( `${BACKEND_SERVER_URL}/api/action/jsite.api.v1.get_component_data`, @@ -193,7 +193,14 @@ export async function fetchComponentData(componentName) { params: { component_name: componentName, site_name: BACKEND_SITE_NAME }, } ); - return { data: res.data.message?.data || null }; + + let data = res.data.message?.data || null; + + if (data && downloadFiles) { + data = await processDataItem(data, downloadFiles); + } + + return { data }; } catch (error) { if ( error.response && 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); +}