You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
104 lines
2.2 KiB
104 lines
2.2 KiB
<script setup>
|
|
import { ref, onMounted, watch } from "vue";
|
|
import { useRoute, useRouter } from "vue-router";
|
|
|
|
import PageBanner from "@/components/PageBanner.vue";
|
|
|
|
import featureImg from '@/assets/img/feature.jpg';
|
|
import bannerImg from '@/assets/img/pageBanner/p1.jpg';
|
|
|
|
const { t } = useI18n();
|
|
|
|
const route = useRoute();
|
|
const router = useRouter();
|
|
|
|
const bannerObj = computed(() => {
|
|
let title, path;
|
|
|
|
if( route.path.includes('/social/news') ){
|
|
title = t('Social.news');
|
|
path = t('Social.news');
|
|
}else{
|
|
title = t('Social.activity');
|
|
path = t('Social.activity');
|
|
}
|
|
|
|
return {
|
|
"bImg": bannerImg,
|
|
"pageName": t('news'),
|
|
"path": path,
|
|
"title": title
|
|
}
|
|
});
|
|
|
|
const menuList = [
|
|
{
|
|
"name":t('Social.news'),
|
|
"path":"/social/news"
|
|
},
|
|
{
|
|
"name":t('Social.activity'),
|
|
"path":"/social/activity"
|
|
},
|
|
]
|
|
|
|
const currentRoute = ref('');
|
|
|
|
onMounted(() => {
|
|
currentRoute.value = route.path;
|
|
});
|
|
|
|
watch(() => route.params,
|
|
(n,o) => {
|
|
currentRoute.value = route.path;
|
|
}
|
|
)
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<div class="main social">
|
|
<PageBanner :item="bannerObj"/>
|
|
|
|
<section class="section leftMenu">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-12 col-lg-auto">
|
|
<div class="list-group">
|
|
<a class="list-group-item"
|
|
:class="{ 'active': currentRoute.includes(item.path) }"
|
|
href="javascript:;"
|
|
v-for="(item,index) in menuList" :key="index"
|
|
@click="router.push(localeLocation(item.path));"
|
|
>
|
|
{{ item.name }}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-lg">
|
|
<NuxtPage/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<!-- <router-view v-slot="{ Component }">
|
|
<template v-if="$route.meta.keepAlive">
|
|
<KeepAlive>
|
|
<component :is="Component" />
|
|
</KeepAlive>
|
|
</template>
|
|
<template v-else>
|
|
<component :is="Component" />
|
|
</template>
|
|
</router-view> -->
|
|
</div>
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<style lang="less">
|
|
|
|
</style>
|