125 lines
4.4 KiB
TypeScript
125 lines
4.4 KiB
TypeScript
import Wrap from '@/components/wrap'
|
||
|
||
export type FooterProps = {}
|
||
|
||
export default function Footer(props: FooterProps) {
|
||
return (
|
||
<footer className="bg-gray-900 text-white overflow-hidden">
|
||
<Wrap className="flex flex-col px-4 py-8 lg:p-12">
|
||
<div className="flex-auto overflow-hidden flex flex-wrap justify-between">
|
||
<div className="flex flex-col lg:items-center gap-2 lg:gap-6 max-lg:w-1/2">
|
||
<img src="/qrcode.svg" alt="logo" className="flex-none w-20 h-20 sm:w-44 sm:h-44 bg-gray-100"/>
|
||
<span className="text-sm ">关注我们查看更多资讯</span>
|
||
</div>
|
||
|
||
<div className="flex flex-col gap-2 lg:gap-4 max-lg:w-1/2">
|
||
<h3>商务合作</h3>
|
||
<p className={`text-sm text-gray-500 `}>大客户经理:张经理</p>
|
||
<p className={`text-sm text-gray-500 `}>电话/微信:18751847847</p>
|
||
<p className={`text-sm text-gray-500 `}>QQ号:800180559</p>
|
||
<h3 className="hidden sm:block">服务保障</h3>
|
||
<p className="text-sm text-gray-500 hidden sm:block">售前服务</p>
|
||
<p className="text-sm text-gray-500 hidden sm:block">技术支持</p>
|
||
</div>
|
||
|
||
<SiteNavList
|
||
title="站点导航"
|
||
items={[
|
||
{name: `产品订购`, href: `#`},
|
||
{name: `获取代理`, href: `#`},
|
||
{name: `帮助中心`, href: `#`},
|
||
{name: `企业服务`, href: `#`},
|
||
{name: `推广返利`, href: `#`},
|
||
]}
|
||
/>
|
||
<SiteNavList
|
||
title="国内代理"
|
||
items={[
|
||
{name: `短效代理`, href: `/product?type=short`},
|
||
{name: `长效代理`, href: `/product?type=long`},
|
||
{name: `固定IP代理`, href: `/product?type=fixed`},
|
||
]}
|
||
/>
|
||
<SiteNavList
|
||
title="全球代理"
|
||
items={[
|
||
{name: `动态代理`, href: `#`},
|
||
{name: `静态代理`, href: `#`},
|
||
]}
|
||
/>
|
||
<SiteNavList
|
||
title="使用案例"
|
||
items={[
|
||
{name: `数据抓取`, href: `/data-capture`},
|
||
{name: `媒体矩阵`, href: `#`},
|
||
{name: `广告验证`, href: `#`},
|
||
{name: `价格监控`, href: `#`},
|
||
{name: `市场调研`, href: `#`},
|
||
{name: `金融数据`, href: `#`},
|
||
{name: `SEO优化`, href: `#`},
|
||
{name: `网站测试`, href: `#`},
|
||
]}
|
||
/>
|
||
<SiteNavList
|
||
title="获取代理"
|
||
items={[
|
||
{name: `API提取`, href: `/collect`},
|
||
{name: `代码示例`, href: `#`},
|
||
{name: `热门地区`, href: `#`},
|
||
]}
|
||
/>
|
||
<SiteNavList
|
||
title="代理资讯"
|
||
items={[
|
||
{name: `产品功能`, href: `#`},
|
||
{name: `使用教程`, href: `#`},
|
||
{name: `行业资讯`, href: `#`},
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div className="flex-none mt-6 pt-6 border-t border-gray-300 flex flex-col items-center">
|
||
<p className={`text-sm `}>
|
||
声明：啊啊HTTP仅提供代理IP服务；严禁用户使用啊啊HTTP从事任何违法犯罪行为，产生的相关责任用户自负，对此啊啊HTTP不承担任何法律责任。
|
||
<a href="#">自律公约</a>
|
||
</p>
|
||
<p className={`text-sm mt-3 `}>
|
||
南京啊啊啊啊科技有限公司 版权所有网站地图
|
||
地址：啊啊啊啊啊啊啊啊啊大街57号楚翘城7幢404-405室
|
||
</p>
|
||
<p className={`text-sm mt-3 `}>
|
||
电信业务经营许可证：B1-11111111
|
||
苏ICP备111111111号-1
|
||
苏公网安备11111111111111号
|
||
</p>
|
||
</div>
|
||
</Wrap>
|
||
</footer>
|
||
)
|
||
}
|
||
|
||
function SiteNavList(props: {
|
||
title: string
|
||
items: {
|
||
name: string
|
||
href: string
|
||
}[]
|
||
}) {
|
||
return (
|
||
<div className="max-lg:mt-4 w-full lg:w-auto">
|
||
<h3>{props.title}</h3>
|
||
<ul
|
||
className={[
|
||
`mt-1 flex flex-wrap gap-2 `,
|
||
`lg:mt-4 lg:h-[184px] lg:flex-col lg:gap-4 lg:gap-x-6`,
|
||
].join(' ')}>
|
||
{props.items.map((item, index) => (
|
||
<li key={index}>
|
||
<a href={item.href} className="text-sm text-gray-500">{item.name}</a>
|
||
</li>
|
||
))}
|
||
</ul>
|
||
</div>
|
||
)
|
||
}
|