wishpal_ironfan
/
fake_shop
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

完善功能

This commit is contained in:
yezian 2025-02-14 19:24:31 +08:00
parent ae02089dbd
commit 3965330120
8 changed files with 481 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
app/about/page.jsx Normal file
View File

@ -0,0 +1,38 @@
import Link from "next/link";
export default function About() {
return (
<div className="min-h-screen bg-gray-50 p-4">
<h1 className="text-2xl font-bold mb-4">关于我们</h1>
<div className="bg-white p-4 rounded-lg shadow">
<h2 className="text-lg font-semibold">公司名称</h2>
<p className="mt-2">北京万辉启明科技有限公司</p>
<h2 className="text-lg font-semibold mt-4">公司信息</h2>
<p className="mt-2">
我们是一家专注于提供优质宠物用品的公司，致力于为您的宠物提供最好的产品和服务。
</p>
<h2 className="text-lg font-semibold mt-4">用户协议</h2>
<p className="mt-2">
请在使用我们的服务之前，仔细阅读并理解我们的
<Link href="/user-agreement" className="text-blue-500 underline">
用户协议
</Link>
。
</p>
<h2 className="text-lg font-semibold mt-4">隐私协议</h2>
<p className="mt-2">
我们重视您的隐私，详细信息请参阅我们的
<Link href="/privacy-policy" className="text-blue-500 underline">
隐私协议
</Link>
。
</p>
<h2 className="text-lg font-semibold mt-4">网站版本</h2>
<p className="mt-2">当前网站版本：1.0.0</p>
</div>
</div>
);
}

28
app/contact/page.jsx Normal file
View File

@ -0,0 +1,28 @@
"use client";
export default function CustomerService() {
return (
<div className="min-h-screen bg-gray-50 p-4">
<h1 className="text-2xl font-bold mb-4">客服中心</h1>
<div className="bg-white p-4 rounded-lg shadow">
<h2 className="text-lg font-semibold">售后服务</h2>
<p className="mt-2">
我们提供7天无理由退货服务，确保您对购买的商品满意。如需退货，请在收到商品后的7天内联系我们。
</p>
<h2 className="text-lg font-semibold mt-4">客诉解决</h2>
<p className="mt-2">
如果您在购物过程中遇到任何问题，请随时与我们联系，我们将竭诚为您服务。
</p>
<h2 className="text-lg font-semibold mt-4">联系方式</h2>
<p className="mt-2">
如需帮助，请发送邮件至:{" "}
<a href="mailto:beijingwanhui@outlook.com" className="text-blue-500">
beijingwanhui@outlook.com
</a>
</p>
</div>
</div>
);
}

62
app/good/[id]/page.jsx
View File

@ -6,6 +6,9 @@ import Image from "next/image";
import { useRouter } from "next/navigation";
import toast from "react-hot-toast";
import AddToCartModal from "@/components/AddToCartModal";
import Link from "next/link";
import { AiOutlineHome, AiOutlineShoppingCart } from "react-icons/ai";
import { FiUser } from "react-icons/fi";
export default function ProductDetail() {
const params = useParams();
@ -15,6 +18,7 @@ export default function ProductDetail() {
const [quantity, setQuantity] = useState(1);
const router = useRouter();
const [showModal, setShowModal] = useState(false);
const [recommendedProducts, setRecommendedProducts] = useState([]);
useEffect(() => {
const fetchProduct = async () => {
@ -25,6 +29,7 @@ export default function ProductDetail() {
}
const data = await res.json();
setProduct(data);
fetchRecommendedProducts(); // 直接获取推荐商品
} catch (err) {
setError(err.message);
} finally {
@ -32,6 +37,19 @@ export default function ProductDetail() {
}
};
const fetchRecommendedProducts = async () => {
try {
const res = await fetch(`/api/products`); // 获取所有商品
if (!res.ok) {
throw new Error("获取推荐商品失败");
}
const data = await res.json();
setRecommendedProducts(data.slice(0, 4)); // 取前四个商品
} catch (err) {
console.error(err.message);
}
};
fetchProduct();
}, [params.id]);
@ -168,8 +186,48 @@ export default function ProductDetail() {
</div>
</div>
{/* 推荐商品模块 */}
<div className="p-4 bg-white mt-4">
<h2 className="text-lg font-bold mb-2">猜你喜欢</h2>
<div className="grid grid-cols-2 gap-4">
{recommendedProducts.map((item) => (
<Link key={item._id} href={`/good/${item._id}`}>
<div className="bg-gray-100 rounded-lg p-2 overflow-hidden">
<Image
src={item.imageUrl}
alt={item.title}
width={200}
height={200}
className="object-cover rounded h-32 w-full"
/>
<h3 className="text-sm font-medium mt-2">{item.title}</h3>
<p className="text-red-500">¥{item.price}</p>
</div>
</Link>
))}
</div>
</div>
{/* 底部购买栏 */}
<div className="fixed bottom-0 left-0 right-0 flex items-center p-4 bg-white border-t">
<div className="fixed gap-4 bottom-0 left-0 right-0 flex items-center p-4 bg-white border-t">
<Link href="/tab">
<button className="flex-1 text-gray-500 flex flex-col items-center">
<AiOutlineHome className="mb-1 w-6 h-6" />
<span className="text-xs">首页</span>
</button>
</Link>
<Link href="/contact">
<button className="flex-1 text-gray-500 flex flex-col items-center">
<FiUser className="mb-1 w-6 h-6" />
<span className="text-xs">客服</span>
</button>
</Link>
<Link href="/tab/cart">
<button className="flex-1 text-gray-500 flex flex-col items-center">
<AiOutlineShoppingCart className="mb-1 w-6 h-6" />
<span className="text-xs">购物车</span>
</button>
</Link>
<button
className="flex-1 bg-yellow-400 text-white py-2 rounded-full"
onClick={handleAddToCartClick}
@ -177,7 +235,7 @@ export default function ProductDetail() {
加入购物车
</button>
<button
className="flex-1 ml-2 bg-red-500 text-white py-2 rounded-full"
className="flex-1 bg-red-500 text-white py-2 rounded-full"
onClick={handleBuyNow}
>
立即购买

87
app/privacy-policy/page.jsx Normal file
View File

@ -0,0 +1,87 @@
export default function PrivacyPolicy() {
return (
<div className="min-h-screen bg-gray-50 p-4">
<h1 className="text-2xl font-bold mb-4">隐私协议</h1>
<p>
本应用尊重并保护所有使用服务用户的个人隐私权。为了给您提供更准确、更有个性化的服务，本应用会按照本隐私权政策的规定使用和披露您的个人信息。但本应用将以高度的勤勉、审慎义务对待这些信息。除本隐私权政策另有规定外，在未征得您事先许可的情况下，本应用不会将这些信息对外披露或向第三方提供。本应用会不时更新本隐私权政策。
您在同意本应用服务使用协议之时，即视为您已经同意本隐私权政策全部内容。本隐私权政策属于本应用服务使用协议不可分割的一部分。
</p>
<h2>1. 适用范围</h2>
<p>
(a)
在您使用本应用网络服务，或访问本应用平台网页时，本应用自动接收并记录的您的浏览器和计算机上的信息，包括但不限于您的IP地址、浏览器的类型、使用的语言、访问日期和时间、软硬件特征信息及您需求的网页记录等数据；
</p>
<p>您了解并同意，以下信息不适用本隐私权政策：</p>
<p>
(a)
本应用收集到的您在本应用发布的有关信息数据，包括但不限于参与活动、成交信息及评价详情；
</p>
<p>(b) 违反法律规定或违反本应用规则行为及本应用已对您采取的措施。</p>
<h2>2. 信息使用</h2>
<p>
(a)本应用不会向任何无关第三方提供、出售、出租、分享或交易您的个人信息，除非事先得到您的许可，或该第三方和本应用（含本应用关联公司）单独或共同为您提供服务，且在该服务结束后，其将被禁止访问包括其以前能够访问的所有这些资料。
</p>
<p>
(b)
本应用亦不允许任何第三方以任何手段收集、编辑、出售或者无偿传播您的个人信息。任何本应用平台用户如从事上述活动，一经发现，本应用有权立即终止与该用户的服务协议。
</p>
<h2>3. 信息披露</h2>
<p>
在如下情况下，本应用将依据您的个人意愿或法律的规定全部或部分的披露您的个人信息：
</p>
<p>(a) 经您事先同意，向第三方披露；</p>
<p>(b)为提供您所要求的产品和服务，而必须和第三方分享您的个人信息；</p>
<p>
(c)
根据法律的有关规定，或者行政或司法机构的要求，向第三方或者行政、司法机构披露；
</p>
<p>
(d)
如您出现违反中国有关法律、法规或者本应用服务协议或相关规则的情况，需要向第三方披露；
</p>
<p>
(e)
如您是适格的知识产权投诉人并已提起投诉，应被投诉人要求，向被投诉人披露，以便双方处理可能的权利纠纷；
</p>
<p>
(f)
在本应用平台上创建的某一交易中，如交易任何一方履行或部分履行了交易义务并提出信息披露请求的，本应用有权决定向该用户提供其交易对方的联络方式等必要信息，以促成交易的完成或纠纷的解决。
</p>
<p>(g) 其它本应用根据法律、法规或者网站政策认为合适的披露。</p>
<h2>4. 信息存储和交换</h2>
<p>
本应用收集的有关您的信息和资料将保存在本应用及（或）其关联公司的服务器上，这些信息和资料可能传送至您所在国家、地区或本应用收集信息和资料所在地的境外并在境外被访问、存储和展示。
</p>
<h2>5. Cookie的使用</h2>
<p>
(a)
在您未拒绝接受cookies的情况下，本应用会在您的计算机上设定或取用cookies
，以便您能登录或使用依赖于cookies的本应用平台服务或功能。本应用使用cookies可为您提供更加周到的个性化服务，包括推广服务。
</p>
<p>
(b)
您有权选择接受或拒绝接受cookies。您可以通过修改浏览器设置的方式拒绝接受cookies。但如果您选择拒绝接受cookies，则您可能无法登录或使用依赖于cookies的本应用网络服务或功能。
</p>
<p>(c) 通过本应用所设cookies所取得的有关信息，将适用本政策。</p>
<h2>6. 信息安全</h2>
<p>
(a)
本应用帐号均有安全保护功能，请妥善保管您的用户名及密码信息。本应用将通过对用户密码进行加密等安全措施确保您的信息不丢失，不被滥用和变造。尽管有前述安全措施，但同时也请您注意在信息网络上不存在"完善的安全措施"。
</p>
<p>
(b)
在使用本应用网络服务进行网上交易时，您不可避免的要向交易对方或潜在的交易对方提供您的个人信息。
</p>
<h2>7. 本隐私政策的更改</h2>
<p>
(a)如果决定更改隐私政策，我们会在本政策中、本公司网站中以及我们认为适当的位置发布这些更改，以便您了解我们如何收集、使用您的个人信息，哪些人可以访问这些信息，以及在什么情况下我们会透露这些信息。
</p>
<p>
(b)本公司保留随时修改本政策的权利，因此请经常查看。如对本政策作出重大更改，本公司会通过网站通知的形式告知。
</p>
<p>
请您妥善保护自己的个人信息，仅在必要的情形下向他人提供。如您发现自己的个人信息泄密，尤其是本应用用户名及密码发生泄露，请您立即联络本应用客服，以便本应用采取相应措施。
</p>
</div>
);
}

37
app/register/page.jsx
View File

@ -11,10 +11,14 @@ export default function Register() {
password: "",
});
const [error, setError] = useState("");
const [agreed, setAgreed] = useState(false);
const handleSubmit = async (e) => {
e.preventDefault();
try {
if (!agreed) {
throw new Error("您必须同意用户协议和隐私协议才能注册");
}
const res = await fetch("/api/auth/register", {
method: "POST",
headers: { "Content-Type": "application/json" },
@ -70,10 +74,41 @@ export default function Register() {
</div>
</div>
<div className="flex items-center">
<input
type="checkbox"
required
checked={agreed}
onChange={(e) => setAgreed(e.target.checked)}
className="mr-2"
/>
<span className="text-sm">
我已阅读并同意
<Link
href="/user-agreement"
className="text-yellow-600 hover:underline"
>
用户协议
</Link>
和
<Link
href="/privacy-policy"
className="text-yellow-600 hover:underline"
>
隐私协议
</Link>
</span>
</div>
<div>
<button
type="submit"
className="group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-yellow-400 hover:bg-yellow-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-yellow-500"
disabled={!agreed}
className={`group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white ${
agreed
? "bg-yellow-400 hover:bg-yellow-500"
: "bg-gray-400 cursor-not-allowed"
}`}
>
注册
</button>

37
app/tab/profile/page.jsx
View File

@ -116,7 +116,7 @@ export default function Profile() {
{/* 常用工具区域 */}
<div className="p-4">
<h3 className="text-lg font-bold mb-4">常用工具</h3>
<div className="grid grid-cols-3 gap-4">
<div className="grid grid-cols-4 gap-4">
<Link href="/address" className="flex flex-col items-center">
<div className="w-12 h-12 bg-green-100 rounded-lg flex items-center justify-center mb-1">
<svg
@ -179,6 +179,41 @@ export default function Profile() {
</div>
<span className="text-sm">签到</span>
</Link>
<Link href="/contact" className="flex flex-col items-center">
<div className="w-12 h-12 bg-teal-100 rounded-lg flex items-center justify-center mb-1">
<svg
className="w-6 h-6"
viewBox="0 0 1024 1024"
fill="#0d9488"
stroke="currentColor"
>
<path d="M927.616 465.6C923.328 236.704 745.888 51.808 528 51.808h-32c-217.888 0-395.328 184.896-399.616 413.76C58.112 487.744 32 528.672 32 576v64c0 70.592 57.408 128 128 128s128-57.408 128-128v-64a128.064 128.064 0 0 0-126.784-127.872C173.728 262.688 318.912 115.808 496 115.808h32c177.12 0 322.272 146.88 334.784 332.32A128.064 128.064 0 0 0 736 576v64c0 57.792 38.72 106.176 91.392 122.016a337.504 337.504 0 0 1-191.936 124.48A79.712 79.712 0 0 0 560 832a80 80 0 1 0 0 160 79.68 79.68 0 0 0 67.872-38.112 402.432 402.432 0 0 0 278.24-193.6C955.968 742.816 992 695.776 992 640v-64c0-47.328-26.112-88.256-64.384-110.4zM224 576v64c0 35.296-28.704 64-64 64s-64-28.704-64-64v-64c0-35.296 28.704-64 64-64s64 28.704 64 64z m704 64c0 34.304-27.2 62.176-61.12 63.712l-2.496-1.184c-0.224 0.512-0.576 0.928-0.8 1.408A64 64 0 0 1 800 640v-64c0-35.296 28.704-64 64-64s64 28.704 64 64v64z"></path>
</svg>
</div>
<span className="text-sm">联系客服</span>
</Link>
<Link href="/about" className="flex flex-col items-center">
<div className="w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center mb-1">
<svg
className="w-6 h-6"
viewBox="0 0 1229 1024"
fill="#2563eb"
stroke="currentColor"
>
<path
d="M727.59 511.004C817.748 467.99 880.387 375.63 880.387 268.53 880.387 120.549 761.052 0.147 614.391 0.147S348.4 120.549 348.4 268.53c0 107.098 62.674 199.46 152.792 242.474-224.396 55.89-328.166 277.36-328.166 485.41 0 14.89 11.962 26.876 26.643 26.876 14.76 0 26.68-12.027 26.68-26.876 0-214.47 121.399-445.341 388.01-445.341 266.604 0 388.004 230.871 388.004 445.341 0 14.89 11.96 26.876 26.678 26.876 14.721 0 26.643-12.027 26.643-26.876 0.074-208.051-103.656-429.522-328.093-485.41M401.72 268.53c0-118.315 95.37-214.583 212.67-214.583 117.297 0 212.675 96.268 212.675 214.583 0 118.276-95.376 214.511-212.675 214.511-117.301 0-212.67-96.235-212.67-214.511"
p-id="5242"
></path>
<path
d="M289.591 493.675c12.114-1.162 21.894-10.48 23.806-22.626 1.877-12.147-4.674-24.098-15.868-28.931-5.364-2.321-130.794-58.097-120.828-189.135C188.124 103.764 349.2 85.703 356.177 84.966c14.607-1.428 25.34-14.541 23.924-29.32-1.38-14.812-14.225-25.601-29.058-24.25C277.56 38.475 135.42 93.01 123.5 248.847c-7.324 96.924 44.313 166.582 95.411 207.43-88.82 31.206-234.37 119.899-216.354 364.072 1.034 14.118 12.728 24.947 26.523 24.947 0.692 0 1.347 0 2.039-0.077 14.68-1.121 25.719-14.041 24.607-28.854-21.62-293.563 223.52-321.686 233.865-322.69M1105.17 248.848C1093.283 93.05 951.185 38.513 877.702 31.397c-14.76-1.318-27.679 9.477-29.06 24.213-1.415 14.773 9.355 27.928 24 29.356 6.86 0.655 167.9 17.87 179.358 167.978 10.01 131.04-115.456 186.853-120.708 189.098-11.23 4.797-17.787 16.667-15.952 28.812 1.803 12.146 11.615 21.581 23.73 22.781 10.43 1.009 255.568 29.125 233.95 322.655-1.111 14.813 9.926 27.726 24.608 28.848 0.69 0.083 1.345 0.083 2.033 0.083 13.8 0 25.494-10.792 26.527-24.947 18.052-244.097-127.497-332.79-216.354-363.997 51.1-40.923 102.77-110.505 95.336-207.43z"
p-id="5243"
></path>
</svg>
</div>
<span className="text-sm">关于我们</span>
</Link>
</div>
</div>

170
app/user-agreement/page.jsx Normal file
View File

@ -0,0 +1,170 @@
export default function UserAgreement() {
return (
<div className="min-h-screen bg-gray-50 p-4">
<h1 className="text-2xl font-bold mb-4">用户协议</h1>
<p>
请您本产品之前，请务必仔细阅读并理解《用户协议》（以下简称"本协议"）中规定的多有权利和限制。
</p>
<p>
我们一向尊重并会严格保护用户在使用本产品时的合法权益（包括用户隐私、用户数据等）不受到任何侵犯。
</p>
<p>
本协议（包括本文最后部分的隐私政策）是用户（包括通过各种合法途径获取到本产品的自然人、法人或其他组织机构，以下简称"用户"或"您"）与我们之间针对本产品相关事项最终的、完整的且排他的协议，并取代、合并之前的当事人之间关于上述事项的讨论和协议。
</p>
<p>
本协议将对用户使用本产品的行为产生法律约束力，您已承诺和保证有权利和能力订立本协议。用户开始使用本产品将视为已经接受本协议，请认真阅读并理解本协议中各种条款，包括免除和限制我们的免责条款和对用户的权利限制（未成年人审阅时应由法定监护人陪同），如果您不能接受本协议中的全部条款，请勿开始使用本产品。
</p>
<h2 className="text-xl font-bold mt-4">使用账户</h2>
<p>您必须承诺和保证：</p>
<p>您使用本产品的行为必须合法。</p>
<p>
本产品将会依据本协议"修改和终止"的规定保留或终止您的账户。您必须承诺对您的登录信息保密、不被其他人获取与使用，并且对您在本账户下的所有行为负责。您必须将任何有可能触犯法律的、未授权使用或怀疑为未授权使用的行为在第一时间通知本产品。本产品不对您因未能遵守上述要求而造成的损失承担法律责任。
</p>
<h2 className="text-xl font-bold mt-4">终端用户协议许可</h2>
<p>依据本协议规定，本产品将授予您以下不可转让的、非排他的许可：</p>
<ol>
<li>使用本产品的权利；</li>
<li>
在您所有的网络通信设备、计算机设备和移动通信设备上下载、安装、使用本产品的权利。
</li>
</ol>
<h2 className="text-xl font-bold mt-4">限制性条款</h2>
<p>本协议对您的授权将受到以下限制：</p>
<ol>
<li>
您不得对本产品进行任何形式的许可、出售、租赁、转让、发行或其他商业用途；
</li>
<li>
除非法律禁止此类限制，否则您不得对本产品的任何部分或衍生产品进行修改、翻译、改编、合并、利用、分解、改造或反向编译、反向工程等；
</li>
<li>您不得以创建相同或竞争服务为目的使用本产品；</li>
<li>
除非法律明文规定，否则您不得对本产品的任何部分以任何形式或方法进行生产、复制、发行、出售、下载或显示等；
</li>
<li>您不得删除或破坏包含在本产品中的任何版权声明或其他所有权标记。</li>
</ol>
<h2 className="text-xl font-bold mt-4">费用</h2>
<p>
您必须自行负担购买本产品的费用，个人上网或第三方（包括但不限于电信或移动通讯提供商）收取的通讯费、信息费等相关费用。如涉及电信增值服务，我们建议您与增值服务提供商确认相关费用问题。
</p>
<h2 className="text-xl font-bold mt-4">版本</h2>
<p>任何本产品的更新版本或未来版本、更新或者其他变更将受到本协议约束。</p>
<h2 className="text-xl font-bold mt-4">遵守法律</h2>
<p>
您同意遵守《中华人民共和国合同法》、《中华人民共和国著作权法》及其实施条例、《全国人民代表大会常务委员会关于维护互联网安全的决定》（"人大安全决定"）、《中华人民共和国保守国家秘密法》、《中华人民共和国电信条例》（"电信条例"）、《中华人民共和国计算机信息系统安全保护条例》、《中华人民共和国计算机信息网络国际联网管理暂行规定》及其实施办法、《计算机信息系统国际联网保密管理规定》、《互联网信息服务管理办法》、《计算机信息网络国际联网安全保护管理办法》、《互联网电子公告服务管理规定》（"电子公告规定"）等相关中国法律法规的任何及所有的规定，并对以任何方式使用您的密码和您的账号使用本服务的任何行为及其结果承担全部责任。如违反《人大安全决定》有可能构成犯罪，被追究刑事责任。《电子公告规定》则有明文规定，上网用户使用电子公告服务系统对所发布的信息负责。《电信条例》也强调，使用电信网络传输信息的内容及其后果由电信用户负责。在任何情况下，如果本网站有理由认为您的任何行为，包括但不限于您的任何言论和其它行为违反或可能违反上述法律和法规的任何规定，本网站可在任何时候不经任何事先通知终止向您提供服务。
</p>
<h2 className="text-xl font-bold mt-4">用户内容</h2>
<ol>
<li>
用户内容是指该用户下载、发布或以其他方式使用本产品时产生的所有内容（例如：您的信息、图片、音乐或其他内容）。
</li>
<li>
您是您的用户内容唯一的责任人，您将承担因您的用户内容披露而导致的您或任何第三方被识别的风险。
</li>
<li>您已同意您的用户内容受到权利限制（详见"权利限制"）。</li>
</ol>
<h2 className="text-xl font-bold mt-4">权利限制</h2>
<p>
您已同意通过分享或其他方式使用本产品中的相关服务，在使用过程中，您将承担因下述行为所造成的风险而产生的全部法律责任：
</p>
<ol>
<li>破坏宪法所确定的基本原则的；</li>
<li>危害国家安全、泄露国家秘密、颠覆国家政权、破坏国家统一的；</li>
<li>损害国家荣誉和利益的；</li>
<li>煽动民族仇恨、民族歧视，破坏民族团结的；</li>
<li>破坏国家宗教政策，宣扬邪教和封建迷信的；</li>
<li>散布淫秽、色情、赌博、暴力、凶杀、恐怖或者教唆犯罪的；</li>
<li>侮辱或者诽谤他人，侵害他人合法权益的；</li>
<li>含有法律、行政法规禁止的其他内容的。</li>
</ol>
<p>您已经同意不在本产品从事下列行为：</p>
<ol>
<li>
发布或分享电脑病毒、蠕虫、恶意代码、故意破坏或改变计算机系统或数据的软件；
</li>
<li>未授权的情况下，收集其他用户的信息或数据，例如电子邮箱地址等；</li>
<li>
用自动化的方式恶意使用本产品，给服务器造成过度的负担或以其他方式干扰或损害网站服务器和网络链接；
</li>
<li>在未授权的情况下，尝试访问本产品的服务器数据或通信数据；</li>
<li>干扰、破坏本产品其他用户的使用。</li>
</ol>
<h2 className="text-xl font-bold mt-4">修改和终止</h2>
<h3 className="font-bold">修改</h3>
<p>
本协议容许变更。如果本协议有任何实质性变更，我们将通过电子邮件来通知您。变更通知之后，继续使用本产品则为您已知晓此类变更并同意条款约束；
</p>
<p>我们保留在任何时候无需通知而修改、保留或关闭本产品任何服务之权利；</p>
<p>您已同意我们无需因修改、保留或关闭本产品任何服务之权利；</p>
<p>
您已同意我们无需因修改、保留或关闭本产品任何服务的行为对您或第三方承担责任。
</p>
<h3 className="font-bold">终止</h3>
<p>
本协议自您接受之日起生效，在您使用本产品的过程中持续有效，直至依据本协议终止；
</p>
<p>
尽管有上述规定，如果您使用本产品的时间早于您接受本协议的时间，您在此知晓并同意本协议于您接受本协议的时间，您在此知晓并同意本协议于您第一次使用本产品时生效，除非依据本协议提前终止；
</p>
<p>
我们可能会依据法律的规定，保留您使用本产品或者本账户的权利；无论是否通知，我们将在任何时间以任何原因终止本协议，包括出于善意的相信您违反了我们可接受使用政策或本协议的其他规定；
</p>
<p>
不受前款规定所限，如果用户侵犯第三人的版权且我们接到版权所有人或版权所有人的合法代理人的通知后，我们保留终止本协议的权利；
</p>
<p>
一旦本协议终止，您使用本产品的权利即告终止。您应当知晓您的产品终止意味着您的用户内容将从我们的活动数据库中删除。我们不因终止本协议对您承担任何责任，包括终止您的用户账户和删除您的用户内容。
</p>
<h2 className="text-xl font-bold mt-4">第三方</h2>
<p>您已知晓或同意我们的部分服务时基于第三方的技术支持获得；</p>
<p>
您已知晓本协议是您在与我们之前签订，而非您与上述第三方之间签订。我们是基于本产品所产生的内容、维护、支持服务、保证和由此产生的诉讼等事项的唯一责任人。您已同意遵守且授权给本产品限制您有条件地使用本产品的服务。
</p>
<h2 className="text-xl font-bold mt-4">第三方信息和服务</h2>
<ol>
<li>
本产品包含了第三方的部分信息和服务。我们不控制且不对第三方的信息和服务负责；
</li>
<li>
我们仅为您使用方便的目的或为承诺和保证第三方的需要而提供此类信息和服务；
</li>
<li>用户需对使用第三方信息和服务产生的风险承担法律责任；</li>
<li>当用户访问第三方信息和服务时，适用第三方的条款和政策。</li>
</ol>
<h2 className="text-xl font-bold mt-4">赔偿</h2>
<p>
您已同意无害地使用本产品，避免因下述行为或相关行为遭受来第三方的任何投诉、诉讼、损失、损害、责任、成本和费用（包括律师费）：
</p>
<ol>
<li>用户使用本产品的行为；</li>
<li>用户的用户内容；</li>
<li>用户违反本协议的行为。</li>
</ol>
<p>我们保留专属抗辩权和请求赔偿的权利。</p>
<p>
您已同意，除非获得我们书面同意，您不得在您与我们共同对第三方提起的诉讼中单方和解。
</p>
<p>我们将尽合理努力将此类诉讼、诉讼行为或进程通知您。</p>
<p>
在任何情况下，本产品都不对您或任何第三方因本协议产生的任何间接性、后果性、惩罚性的、偶然的、特殊或惩罚性的损害赔偿承担责任。访问、使用本产品所产生的损坏计算机系统或移动通讯设备数据的风险将由您个人承担。
</p>
<h2 className="text-xl font-bold mt-4">适用法律</h2>
<p>本协议适用中华人民共和国法律；</p>
<p>
如果双方发生纠纷，应本着友好的圆柱协商解决；如协商不成，应向所在地的法院提起诉讼。
</p>
<h2 className="text-xl font-bold mt-4">独立性</h2>
<p>
本协议中的某些条款因故无法适用，则本协议的其他条款继续适用且无法适用的条款将会被修改，以便其能够依法适用。
</p>
<h2 className="text-xl font-bold mt-4">完整性</h2>
<p>
本协议（包括隐私政策）是您和本产品之间关于本产品相关事项的最终的、完整的、排他的协议，且取代和合并之前当事人关于此类事项（包括之前的最终用户许可、服务条款和隐私政策）的讨论和协议；
</p>
<p>每部分的栏目只为阅读之便而无任何法律或合同义务；</p>
<p>
除非我们书面同意，您不得转让本协议所规定的权利义务。任何违反上述规定企图转让的行为均无效。在法律许可的范围内，本公司对本协议享有最终解释权。
</p>
</div>
);
}

52
components/Product/index.jsx
View File

@ -4,38 +4,38 @@ import Link from "next/link";
const Product = ({ title, price, sales, imageUrl, isVip, id }) => {
return (
<div className="bg-white rounded-lg p-4 shadow-sm">
<div className="relative aspect-[16/9]">
<Image
src={imageUrl}
alt={title}
fill
className="object-cover rounded-lg"
/>
</div>
<div className="mt-3">
<h3 className="text-sm text-gray-900 line-clamp-2">{title}</h3>
<div className="mt-2 flex items-center justify-between">
<div className="flex items-center">
<span className="text-red-500 text-lg font-medium">¥{price}</span>
{isVip && (
<span className="ml-1 px-1 text-xs text-yellow-600 border border-yellow-600 rounded">
VIP
</span>
)}
</div>
<span className="text-xs text-gray-500">已售{sales}件</span>
<Link href={`/good/${id}`}>
<div className="bg-white rounded-lg p-4 shadow-sm">
<div className="relative aspect-[16/9]">
<Image
src={imageUrl}
alt={title}
fill
className="object-cover rounded-lg"
/>
</div>
<Link href={`/good/${id}`}>
<div className="mt-3">
<h3 className="text-sm text-gray-900 line-clamp-2">{title}</h3>
<div className="mt-2 flex items-center justify-between">
<div className="flex items-center">
<span className="text-red-500 text-lg font-medium">¥{price}</span>
{isVip && (
<span className="ml-1 px-1 text-xs text-yellow-600 border border-yellow-600 rounded">
VIP
</span>
)}
</div>
<span className="text-xs text-gray-500">已售{sales}件</span>
</div>
<button className="mt-3 w-full bg-yellow-400 text-sm text-white py-2 px-4 rounded-full hover:bg-yellow-500">
购买
</button>
</Link>
</div>
</div>
</div>
</Link>
);
};