Files
Aida_Purchaser_Front/src/components/Footer.vue
X1627315083@163.com 7f08c52a98 页脚添加跳转地址
2026-06-01 14:16:13 +08:00

84 lines
2.6 KiB
Vue

<template>
<section class="section-footer">
<div class="footer">
<div class="left">
<div @click="skip('about')">{{ $t('footer.About') }}</div>
<div @click="skip('privacy-policy')">{{ $t('footer.PrivacyPolicy') }}</div>
<div @click="skip('terms-of-use')">{{ $t('footer.TermsOfUse') }}</div>
<div @click="skip('disclaimer')">{{ $t('footer.Disclaimer') }}</div>
<div @click="skip('site-map')">{{ $t('footer.SiteMap') }}</div>
</div>
<div class="right">
<img src="@/assets/images/icons/xiaohongshu.png" @click="skip('xiaohongshu')" />
<img src="@/assets/images/icons/linkedin.png" @click="skip('linkedin')" />
<img src="@/assets/images/icons/instagram.png" @click="skip('instagram')" />
<img src="@/assets/images/icons/facebook.png" @click="skip('facebook')" />
<img src="@/assets/images/icons/douyin.png" @click="skip('tiktok')" />
<img src="@/assets/images/icons/youtube.png" @click="skip('youtube')" />
<div class="text" @click="skip('code-create')">© Code-Create 2026</div>
</div>
</div>
</section>
</template>
<script setup lang="ts">
import { computed, ref } from 'vue'
let urlList = ref({
xiaohongshu: 'https://xhslink.com/m/5Ony2FapizV',
linkedin: 'https://www.linkedin.com/company/code-create-limited/posts?feedView=all',
instagram: 'https://www.instagram.com/aida_codecreate?igsh=MzRlODBiNWFlZA== ',
facebook: 'https://www.facebook.com/CodeCreateAI',
tiktok: 'https://www.tiktok.com/@aida_codecreate',
youtube: 'https://www.youtube.com/@Code-Create_AiDA',
'code-create': 'https://www.code-create.com/',
about: 'https://code-create.com.hk/about-us/ ',
'privacy-policy': 'https://code-create.com.hk/privacy-policy/',
'terms-of-use': 'https://code-create.com.hk/terms-of-use/',
disclaimer: 'https://code-create.com.hk/disclaimer/',
'site-map': 'https://code-create.com.hk/site-map/',
})
const skip = (name: string) => {
window.open(urlList.value[name], '_blank')
}
</script>
<style lang="less">
.section-footer {
background-color: #f6f6f6;
border-top: 0.1rem solid #232323;
> .footer {
padding: 0 9rem;
height: var(--footer-height);
display: flex;
align-items: center;
justify-content: space-between;
> .left {
font-family: KaiseiOpti-Regular;
font-size: 1.4rem;
color: #585858;
display: flex;
gap: 4.5rem;
> div {
cursor: pointer;
}
}
> .right {
display: flex;
align-items: center;
> img {
width: 2rem;
height: 2rem;
margin-left: 2rem;
cursor: pointer;
}
.text{
margin-left: 4rem;
font-family: KaiseiOpti-Regular;
font-size: 1.2rem;
color: #585858;
}
}
}
}
</style>