update
This commit is contained in:
toom1996
@ -2,55 +2,44 @@
|
||||
import Layout from "../../../layouts/Layout_2.astro";
|
||||
import { Image } from "astro:assets";
|
||||
import { getConfig, getExtra } from "../../../../utils/config";
|
||||
import { TP2_COLUMN_CONTACT_US, TP2_COLUMN_CONTACT_US_URL } from "../../../../utils/const";
|
||||
import {
|
||||
TP2_COLUMN_CONTACT_US,
|
||||
TP2_COLUMN_CONTACT_US_URL,
|
||||
TP2_COLUMN_INDEX,
|
||||
TP2_COLUMN_INDEX_URL,
|
||||
} from "../../../../utils/const";
|
||||
import BaijiahaoLogo from '../../../../public/template_2/baijiahao.svg'
|
||||
import Toutiaohao from '../../../../public/template_2/toutiaohao.svg'
|
||||
// import Youxiang from "../../../../public/template_2/contact-us/youxiang.svg";
|
||||
const extra = getExtra('')
|
||||
const config = getConfig(Astro);
|
||||
const breadcrumb = [
|
||||
{ title: '主页', url: '/' },
|
||||
{ title: TP2_COLUMN_INDEX, url: TP2_COLUMN_INDEX_URL },
|
||||
{ title: TP2_COLUMN_CONTACT_US, url: TP2_COLUMN_CONTACT_US_URL }
|
||||
];
|
||||
---
|
||||
<Layout title={TP2_COLUMN_CONTACT_US + ` - ${config.app_name}`} breadcrumb={breadcrumb}>
|
||||
|
||||
<main>
|
||||
<div class="contact-container">
|
||||
<h1 style="font-size: 5rem;margin-bottom: 5rem;">{extra.contact_us.title}</h1>
|
||||
<!-- <Fragment set:html={extra.contact_us.content}/> -->
|
||||
<section class="list-box">
|
||||
<h2 class="list-title">在线客服</h2>
|
||||
<ul>
|
||||
{
|
||||
extra.contact_us.telephone.map(e => {
|
||||
return <li class="list-item">
|
||||
<a href={`tel:${e.number}`}>
|
||||
<div class="item-content">
|
||||
<Image height={50} width={50} src="/template_2/contact-us/hotline.png" alt="联系热线"/>
|
||||
<div class="txt">
|
||||
<h3 style="margin-left: 1rem;font-weight: bold;">{e.number}</h3>
|
||||
<h4 style="margin-left: 1rem;">24小时全国热线</h4>
|
||||
</div>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li>
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
|
||||
<h2 class="list-title">联系邮箱</h2>
|
||||
<ul>
|
||||
<Layout
|
||||
title={TP2_COLUMN_CONTACT_US + ` - ${config.app_name}`}
|
||||
description={`联系我们 - ${config.app_name}`}
|
||||
keywords={config.app_keywords}
|
||||
breadcrumb={breadcrumb}
|
||||
>
|
||||
<main>
|
||||
<div class="contact-container">
|
||||
<h1 style="font-size: 5rem;margin-bottom: 5rem;">{extra.contact_us.title}</h1>
|
||||
<!-- <Fragment set:html={extra.contact_us.content}/> -->
|
||||
<section class="list-box">
|
||||
<h2 class="list-title">在线客服</h2>
|
||||
<ul>
|
||||
{
|
||||
extra.contact_us.email.map(e => {
|
||||
extra.contact_us.telephone.map(e => {
|
||||
return <li class="list-item">
|
||||
<a href={`tel:${e.address}`}>
|
||||
<a href={`tel:${e.number}`}>
|
||||
<div class="item-content">
|
||||
<Image height={50} width={50} src="/template_2/contact-us/hotline.png" alt="联系邮箱"/>
|
||||
<Image height={50} width={50} src="/template_2/contact-us/hotline.png" alt="联系热线"/>
|
||||
<div class="txt">
|
||||
<h3 style="margin-left: 1rem;font-weight: bold;">{e.address}</h3>
|
||||
<h4 style="margin-left: 1rem;"></h4>
|
||||
<h3 style="margin-left: 1rem;font-weight: bold;">{e.number}</h3>
|
||||
<h4 style="margin-left: 1rem;">24小时全国热线</h4>
|
||||
</div>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
@ -58,70 +47,90 @@ const breadcrumb = [
|
||||
</li>
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</ul>
|
||||
|
||||
<h2 class="list-title">官方媒体平台</h2>
|
||||
<ul>
|
||||
{
|
||||
extra.weibo_offical.address ?
|
||||
<li class="list-item">
|
||||
<a href={extra.weibo_offical.address} target="blank">
|
||||
<div class="item-content">
|
||||
<span class="icon-lazy font-ico-weibo" data-name="font-ico-weibo"></span>
|
||||
<div class="txt">
|
||||
<h3>{extra.weibo_offical.name}</h3>
|
||||
<h2 class="list-title">联系邮箱</h2>
|
||||
<ul>
|
||||
{
|
||||
extra.contact_us.email.map(e => {
|
||||
return <li class="list-item">
|
||||
<a href={`tel:${e.address}`}>
|
||||
<div class="item-content">
|
||||
<Image height={50} width={50} src="/template_2/contact-us/hotline.png" alt="联系邮箱"/>
|
||||
<div class="txt">
|
||||
<h3 style="margin-left: 1rem;font-weight: bold;">{e.address}</h3>
|
||||
<h4 style="margin-left: 1rem;"></h4>
|
||||
</div>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li>
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
|
||||
<h2 class="list-title">官方媒体平台</h2>
|
||||
<ul>
|
||||
{
|
||||
extra.weibo_offical.address ?
|
||||
<li class="list-item">
|
||||
<a href={extra.weibo_offical.address} target="blank">
|
||||
<div class="item-content">
|
||||
<span class="icon-lazy font-ico-weibo" data-name="font-ico-weibo"></span>
|
||||
<div class="txt">
|
||||
<h3>{extra.weibo_offical.name}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li> : ''
|
||||
}
|
||||
{
|
||||
extra.gongzhonghao_offical.address ?
|
||||
<li class="list-item">
|
||||
<a href={extra.gongzhonghao_offical.address} target="blank">
|
||||
<div class="item-content">
|
||||
<span class="icon-lazy font-ico-weixin" data-name="font-ico-weixin"></span>
|
||||
<div class="txt">
|
||||
<h3>{extra.gongzhonghao_offical.name}</h3>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li> : ''
|
||||
}
|
||||
{
|
||||
extra.gongzhonghao_offical.address ?
|
||||
<li class="list-item">
|
||||
<a href={extra.gongzhonghao_offical.address} target="blank">
|
||||
<div class="item-content">
|
||||
<span class="icon-lazy font-ico-weixin" data-name="font-ico-weixin"></span>
|
||||
<div class="txt">
|
||||
<h3>{extra.gongzhonghao_offical.name}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li> : ''
|
||||
}
|
||||
{
|
||||
extra.baijiahao_offical.address ?
|
||||
<li class="list-item">
|
||||
<a href={extra.baijiahao_offical.address} target="blank">
|
||||
<div class="item-content">
|
||||
<BaijiahaoLogo class="icon-lazy" />
|
||||
<div class="txt">
|
||||
<h3>{extra.baijiahao_offical.name}</h3>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li> : ''
|
||||
}
|
||||
{
|
||||
extra.baijiahao_offical.address ?
|
||||
<li class="list-item">
|
||||
<a href={extra.baijiahao_offical.address} target="blank">
|
||||
<div class="item-content">
|
||||
<BaijiahaoLogo class="icon-lazy" />
|
||||
<div class="txt">
|
||||
<h3>{extra.baijiahao_offical.name}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li> : ''
|
||||
}
|
||||
{
|
||||
extra.toutiaohao_offical.address ?
|
||||
<li class="list-item">
|
||||
<a href={extra.toutiaohao_offical.address} target="blank">
|
||||
<div class="item-content">
|
||||
<Toutiaohao class="icon-lazy"/>
|
||||
<div class="txt">
|
||||
<h3>{extra.toutiaohao_offical.name}</h3>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li> : ''
|
||||
}
|
||||
{
|
||||
extra.toutiaohao_offical.address ?
|
||||
<li class="list-item">
|
||||
<a href={extra.toutiaohao_offical.address} target="blank">
|
||||
<div class="item-content">
|
||||
<Toutiaohao class="icon-lazy"/>
|
||||
<div class="txt">
|
||||
<h3>{extra.toutiaohao_offical.name}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li> : ''
|
||||
}
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
<i class="fas fa-chevron-right"></i>
|
||||
</a>
|
||||
</li> : ''
|
||||
}
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
</Layout>
|
||||
<style>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user