<template>
|
<footer id="app-footer" class="bg-[#003A8F] text-white py-8 text-small">
|
<div class="w-[80%] mx-auto">
|
<div class="flex justify-between">
|
<!-- Logo and Contact Info -->
|
<div class="flex flex-col gap-2">
|
<img :src="logo" alt="工效汇聚平台" class="h-[54px] mb-4" style="object-fit: cover" />
|
<div class="text-sm">
|
<div class="flex items-center gap-2">
|
<span class="inline-flex"><el-icon color="#fff" :size="16"><PhoneFilled /></el-icon></span>
|
<span class="text-[16px]" style="line-height: 32px;">联系方式: 021-34306562</span>
|
</div>
|
<div class="flex items-center gap-2">
|
<span class="inline-flex"><el-icon color="#fff" :size="16"><Message /></el-icon></span>
|
<span class="text-[16px]" style="line-height: 32px;">电子邮箱: eventech@163.com</span>
|
</div>
|
</div>
|
</div>
|
|
<!-- Navigation Links -->
|
<div class="flex">
|
<div class="flex flex-col gap-2">
|
<div class="pl-8 pr-8 border-l border-[#73AF28]">
|
<div class="font-medium mb-2 footer-link">
|
<router-link to="/home" class="text-white hover:text-[#73AF2B] footer-link">首页</router-link>
|
</div>
|
|
<div class="flex flex-col gap-2 text-sm">
|
<router-link to="/certified-products" class="text-white hover:text-[#73AF2B] footer-link">能效产品</router-link>
|
<router-link to="/eec-label-search" class="text-white hover:text-[#73AF2B] footer-link">证书查询</router-link>
|
<router-link to="/news-detail/99" class="text-white hover:text-[#73AF2B] footer-link">补贴政策</router-link>
|
<span @click="linkClick('http://www.xpump.net/web/#/CN/Index')" class="text-white hover:text-[#73AF2B] cursor-pointer footer-link">查泵网</span>
|
</div>
|
</div>
|
</div>
|
|
<div class="flex flex-col gap-4 ">
|
<div class="pl-8 pr-8 border-l border-[#73AF28]">
|
<div class="font-medium mb-2 footer-link">
|
<router-link to="" class="text-white hover:text-[#73AF2B] footer-link">帮助中心</router-link>
|
</div>
|
<div class="flex flex-col gap-2 text-sm">
|
<router-link to="/brand-center" class="text-white hover:text-[#73AF2B] footer-link">品牌中心</router-link>
|
<router-link to="/payment" class="text-white hover:text-[#73AF2B] footer-link">付款方式</router-link>
|
<router-link to="/payment-info" class="text-white hover:text-[#73AF2B] footer-link">付款开票信息</router-link>
|
</div>
|
</div>
|
</div>
|
|
<div class="flex flex-col gap-4 ">
|
<div class="pl-8 pr-8 border-l border-[#73AF28]">
|
<div class="font-medium mb-2 footer-link">
|
<router-link to="" class="text-white hover:text-[#73AF2B] footer-link">服务政策</router-link>
|
</div>
|
<div class="flex flex-col gap-2 text-sm">
|
<router-link to="/delivery" class="text-white hover:text-[#73AF2B] footer-link">配送服务</router-link>
|
<router-link to="/after-sales" class="text-white hover:text-[#73AF2B] footer-link">售后服务</router-link>
|
<router-link to="/privacy" class="text-white hover:text-[#73AF2B] footer-link">隐私政策</router-link>
|
</div>
|
</div>
|
</div>
|
|
<div class="flex flex-col gap-4 ">
|
<div class="pl-8 pr-8 border-l border-[#73AF28]">
|
<div class="font-medium mb-2 footer-link">
|
<router-link to="" class="text-white hover:text-[#73AF2B] footer-link">公司介绍</router-link>
|
</div>
|
<div class="flex flex-col gap-2 text-sm">
|
<router-link to="/contact" class="text-white hover:text-[#73AF2B] footer-link">联系我们</router-link>
|
<router-link to="/about" class="text-white hover:text-[#73AF2B] footer-link">关于我们</router-link>
|
</div>
|
</div>
|
</div>
|
</div>
|
|
<!-- QR Codes -->
|
<div class="flex gap-6">
|
<div class="text-center">
|
<img src="@/assets/footer/上海经济和信息化委员会.jpg" alt="上海经济和信息化委员会" class="w-24 h-24 mb-2" />
|
<div class="text-xs footer-link">上海经济和信息化委员会</div>
|
</div>
|
<div class="text-center">
|
<img src="@/assets/footer/上海质检院.jpg" alt="上海质检院" class="w-24 h-24 mb-2" />
|
<div class="text-xs footer-link">上海质检院</div>
|
</div>
|
<div class="text-center">
|
<img src="@/assets/footer/PumpMgrQr.jpg" alt="泵管家" class="w-24 h-24 mb-2" />
|
<div class="text-xs footer-link">泵管家</div>
|
</div>
|
</div>
|
</div>
|
|
<!-- Copyright -->
|
<div class="pt-5 mt-4 text-center text-sm border-t border-[#ffffff33]">
|
<span class="footer-link">Copyright © 2025-2026 All Rights Reserved. 版权所有</span>
|
<a href="https://beian.miit.gov.cn/" target="_blank" class="text-white hover:text-[#73AF2B] ml-2 footer-link" style="color: #73AF2B !important;">沪ICP备14049296号-2</a>
|
</div>
|
</div>
|
</footer>
|
</template>
|
|
<script setup lang="ts">
|
import logo from "@/assets/logo/footer_logo.png"
|
const linkClick = (url: string) => {
|
window.open(url, '_blank');
|
};
|
</script>
|
|
<style scoped>
|
.footer-link {
|
font-family: SimSun;
|
font-weight: 400;
|
font-size: 16px;
|
/* color: #FFFFFF; */
|
line-height: 32px;
|
}
|
.border-l{
|
border-left: 1px solid #73AF28;
|
}
|
</style>
|
