nuxt_site/pages/about.vue
2024-05-02 21:28:18 +08:00

113 lines
3.6 KiB
Vue

<template>
<Head>
<Title>{{ tdk?.tdk_title }}</Title>
<Meta :content=tdk?.tdk_keyword name="keywords" />
<Meta :content=tdk?.tdk_description name="description" />
<Meta name="baidu-site-verification" content="" />
</Head>
<Header></Header>
<Poster :type=1 :title="$t('common.poster.about')"></Poster>
<div class="Home-main">
<div class="container">
<article>
<section>
<h1>Company Profile</h1>
<h2>{{ $t("about.profile") }}</h2>
<p> {{ $t('about.intro') }} </p>
<img :src="aboutUs.about_us_profile" alt="">
<div class="bg-gray">
<p>{{ $t('about.futhermore') }}</p>
</div>
<img :src="aboutUs.about_us_profile_history" alt="">
</section>
<section>
<h1>Our honor</h1>
<h2>{{ $t("about.honor") }}</h2>
<img :src="aboutUs.about_us_honor" alt="">
<div class="row gy-3">
<template v-for="item in ourHonor">
<img class="col-lg-3 col-md-6 col-sm-12" @click="openPreview(item)" :src="item" alt="">
</template>
</div>
</section>
<section>
<h1>Factory Photo</h1>
<h2>{{ $t("about.factory") }}</h2>
<div class="row gy-3">
<template v-for="item in factoryPhoto">
<img class="col-lg-3 col-md-6 col-sm-12" @click="openPreview(item)" :src="item" alt="">
</template>
</div>
</section>
<section>
<h1>Our exhibition</h1>
<h2>{{ $t("about.exhibition") }}</h2>
<div class="row gy-3">
<template v-for="item in ourExhibition">
<img class="col-lg-3 col-md-6 col-sm-12" @click="openPreview(item)" :src="item" alt="">
</template>
</div>
</section>
</article>
</div>
</div>
<Final></Final>
<PopupSidebar></PopupSidebar>
<PopupMessageUs></PopupMessageUs>
<PopupImagePreview :images="images" v-model="current"></PopupImagePreview>
</template>
<script setup>
const { l, locale } = useI18n()
const current = ref("");
const openPreview = (item) => {
current.value = item
}
const ourHonor = ref([])
const factoryPhoto = ref([])
const ourExhibition = ref([])
const images = ref([]);
let aboutUs = ref({})
useFetch('/api/aboutUs/getAboutUs', { params: { locale: locale.value } }).then(res => {
aboutUs.value = JSON.parse(res.data.value).data || {}
ourHonor.value = aboutUs.value.about_us_honor_more.split(',')
factoryPhoto.value = aboutUs.value.about_us_factory.split(',')
ourExhibition.value = aboutUs.value.about_us_exhibition.split(',')
images.value = [
...ourHonor.value,
...factoryPhoto.value,
...ourExhibition.value,
]
})
// 获取Tdk
let tdk = ref({})
useFetch('/api/tdk/getTdk', { params: { tdk_type: 1, locale: locale.value } }).then(res => {
tdk.value = JSON.parse(res.data.value).data
})
onMounted(() => {
fontSizeReactive({
880: 1,
480: 1,
})
htmlAddAnimations({
tagDom: 'Home-main', preload: 1.3
})
})
/**export**/
defineExpose({
middleware: 'auth'
})
</script>
<style scoped src="~/assets/css/About/index.scss"></style>