头尾多语言

This commit is contained in:
李志鹏
2026-05-18 11:13:48 +08:00
parent 57835e6416
commit e36b17642f
6 changed files with 107 additions and 37 deletions

View File

@@ -25,7 +25,7 @@
> .title {
margin: 0 14px;
color: #fff;
font-size: 15px;
font-size: 14px;
text-decoration: none;
line-height: 37px;
display: inline-block;

View File

@@ -1,11 +1,16 @@
<template>
<footer class="main-footer">
<div class="left">
<span>©2025 Code-Create Limited</span>
<span>{{
$t('MainFooter.Copyright', {
year: new Date().getFullYear(),
name: 'Code-Create'
})
}}</span>
</div>
<div class="right">
<div v-for="item in nav" :key="item.path">
<router-link class="link" :to="item.path">{{ item.name }}</router-link>
<router-link class="link" :to="item.path">{{ $t(item.name) }}</router-link>
</div>
</div>
</footer>
@@ -14,19 +19,19 @@
import { ref, onMounted, onUnmounted, reactive, toRefs } from 'vue'
const nav = ref([
{
name: 'Privacy Policy',
name: 'MainFooter.PrivacyPolicy',
path: '/privacy-policy'
},
{
name: 'Terms of Use',
name: 'MainFooter.TermsOfUse',
path: '/terms-of-use'
},
{
name: 'Disclaimer',
name: 'MainFooter.Disclaimer',
path: '/disclaimer'
},
{
name: 'Site Map',
name: 'MainFooter.SiteMap',
path: '/site-map'
}
])

View File

@@ -3,15 +3,14 @@
<a href="/" class="logo"><img src="../assets/logo-full.png" alt="code-create" /></a>
<div class="center-nav">
<div class="nav-item" v-for="item in navList" :key="item.name">
<down-menu :title="item.name" v-if="item.children">
<router-link :to="child.path" v-for="child in item.children" :key="child.path">
<down-menu :title="$t(item.name)" v-if="item.children">
<router-link :to="child.path" v-for="child in item.children" :key="child.name">
{{ $t(child.name) }}
</router-link>
</down-menu>
<router-link class="link hover-bottom-animation" :to="item.path" v-else>
{{ $t(item.name) }}
<span v-show="item.children" class="iconfont icon-arrow-down-bold"></span>
</router-link>
<router-link class="link hover-bottom-animation" :to="item.path" v-else>{{
$t(item.name)
}}</router-link>
</div>
</div>
<div class="right">
@@ -21,14 +20,19 @@
:to="`/${item.value}`"
v-for="item in langList"
:key="item.value"
v-show="item.value !== locale"
>
{{ item.label }}
</router-link>
</down-menu>
<span class="">
<span class="iconfont icon-wode"></span>
<span>My Account</span>
</span>
<router-link class="link" to="/my-account">
<span class="iconfont icon-tubiao-"></span>
<span>{{ $t('MainHeader.LoginOrSignin') }}</span>
</router-link>
<router-link class="link" to="/my-account">
<span class="iconfont icon-tubiao-"></span>
<span>{{ $t('MainHeader.MyAccount') }}</span>
</router-link>
</div>
</header>
</template>
@@ -66,47 +70,47 @@
path: '/'
},
{
name: 'About Us',
name: 'MainHeader.AboutUs',
path: '/about-us'
},
{
name: 'Our Solutions',
name: 'MainHeader.OurSolutions',
path: '',
children: [
{
name: 'AiDA 3.1',
name: 'MainHeader.AiDA31',
path: '/aida'
},
{
name: 'Mixi',
name: 'MainHeader.Mixi',
path: '/mixi'
}
]
},
{
name: 'Communities',
name: 'MainHeader.Communities',
path: '',
children: [
{
name: 'Events',
name: 'MainHeader.Events',
path: '/events'
},
{
name: 'User Stories',
name: 'MainHeader.UserStories',
path: '/user-stories'
},
{
name: 'Help Centre',
name: 'MainHeader.HelpCentre',
path: '/help-centre'
}
]
},
{
name: 'Media',
name: 'MainHeader.Media',
path: '/media'
},
{
name: 'Contact Us',
name: 'MainHeader.ContactUs',
path: '/contact-us'
}
])
@@ -142,19 +146,14 @@
justify-content: center;
> .nav-item {
position: relative;
&:deep(> .down-menu > .title),
> .link {
margin: 0 14px;
color: #fff;
font-size: 15px;
font-size: 14px;
text-decoration: none;
line-height: 37px;
display: inline-block;
> .iconfont {
opacity: 0.5;
font-size: 10px;
margin-left: 5px;
}
}
> .child {
position: absolute;
@@ -201,14 +200,23 @@
display: flex;
align-items: center;
justify-content: center;
> span {
> .link {
margin: 0 14px;
color: #fff;
font-size: 15px;
font-size: 14px;
text-decoration: none;
line-height: 37px;
display: inline-block;
position: relative;
display: flex;
align-items: center;
justify-content: center;
&:hover {
opacity: 0.8;
}
> .iconfont {
margin-right: 5px;
font-size: 22px;
}
}
}
}

View File

@@ -1,5 +1,24 @@
export default {
MainHeader: {
Home: 'Home',
AboutUs: 'About Us',
OurSolutions: 'Our Solutions',
AiDA31: 'AiDA 3.1',
Mixi: 'Mixi',
Communities: 'Communities',
Events: 'Events',
UserStories: 'User Stories',
HelpCentre: 'Help Centre',
Media: 'Media',
ContactUs: 'Contact Us',
MyAccount: 'My Account',
LoginOrSignin: 'Log in / Sign in',
},
MainFooter: {
Copyright: '©{year} {name} Limited',
PrivacyPolicy: 'Privacy Policy',
TermsOfUse: 'Terms of Use',
Disclaimer: 'Disclaimer',
SiteMap: 'Site Map',
}
}

View File

@@ -1,5 +1,24 @@
export default {
MainHeader: {
Home: '首页',
AboutUs: '关于我们',
OurSolutions: '我们的产品',
AiDA31: 'AiDA 3.1',
Mixi: 'Mixi',
Communities: '社区',
Events: '活动',
UserStories: '使用者故事',
HelpCentre: '支援中心',
Media: '媒体报道',
ContactUs: '联系我们',
MyAccount: '我的账户',
LoginOrSignin: '登入 / 注册',
},
MainFooter: {
Copyright: '©{year} {name} 有限公司',
PrivacyPolicy: '隐私政策',
TermsOfUse: '使用条款',
Disclaimer: '免责声明',
SiteMap: '网站地图',
}
}

View File

@@ -1,5 +1,24 @@
export default {
MainHeader: {
Home: '首頁',
AboutUs: '關於我們',
OurSolutions: '我們的產品',
AiDA31: 'AiDA 3.1',
Mixi: 'Mixi',
Communities: '社區',
Events: '活動',
UserStories: '使用者故事',
HelpCentre: '支援中心',
Media: '媒體報導',
ContactUs: '聯絡我們',
MyAccount: '我的帳號',
LoginOrSignin: '登錄 / 登冊',
},
MainFooter: {
Copyright: '©{year} {name} 有限公司',
PrivacyPolicy: '私隱政策',
TermsOfUse: '使用條款',
Disclaimer: '免責聲明',
SiteMap: '網站地圖',
}
}