import Image from "next/image"; import Link from "next/link"; /** * 列表页模板组件 * @param {Object[]} items - 列表数据,需包含 title, image, content, slug 字段 * @param {string} basePath - 详情页基础路径 * @param {number} columns - 每行显示的列数,默认4 */ export default function ListPageTemplate({ items, basePath = "", columns = 4 }) { // 静态映射,避免 Tailwind JIT 无法识别动态类名 const colClass = { 1: "lg:grid-cols-1", 2: "lg:grid-cols-2", 3: "lg:grid-cols-3", 4: "lg:grid-cols-4", 5: "lg:grid-cols-5", 6: "lg:grid-cols-6", }[columns] || "lg:grid-cols-4"; // 摘要函数,兼容中英文 function getSummary(text, maxLen = 58) { if (!text) return ""; if (/[-]/.test(text)) { // 英文 if (text.length <= maxLen) return text; let cut = text.slice(0, maxLen); if (!/\s/.test(text[maxLen])) { const lastSpace = cut.lastIndexOf(" "); if (lastSpace > 0) cut = cut.slice(0, lastSpace); } return cut + "..."; } else { // 中文 return text.length > maxLen ? text.slice(0, maxLen) + "..." : text; } } return (
{items.map((item, idx) => (
{/* 图片部分 */}
{item.image && ( {item.title )}
Read More
{item.additional_title}

{item.title}

{getSummary(item.subtitle)}

))}
); }