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.
90 lines
1.9 KiB
90 lines
1.9 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 route = useRoute();
|
|
const router = useRouter();
|
|
|
|
const bannerObj = {
|
|
"bImg":bannerImg,
|
|
"pageName":"Social",
|
|
"path":"News",
|
|
"title":"最新消息"
|
|
}
|
|
|
|
const menuList = [
|
|
{
|
|
"name":"產業動態",
|
|
"path":"/social/news"
|
|
},
|
|
{
|
|
"name":"公司活動",
|
|
"path":"/social/activity"
|
|
},
|
|
]
|
|
|
|
const currentRoute = ref(0);
|
|
|
|
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 === item.path }"
|
|
href="javascript:;"
|
|
v-for="(item,index) in menuList" :key="index"
|
|
@click="router.push(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>
|