77 lines
1.6 KiB
Vue
77 lines
1.6 KiB
Vue
<template>
|
|
<!-- 产品类型页面 -->
|
|
<div class="content">
|
|
<BannerTop :options="bannerTopOptions"/>
|
|
|
|
<section class="container pt-4 pb-4">
|
|
<div class="row">
|
|
<AsideTree
|
|
class="col-md-3 mb-4 mb-md-0"
|
|
:treeData="categoryTree"
|
|
:headerTitle="$t('products.allProducts')"
|
|
baseUrl="/products"
|
|
/>
|
|
<main class="col-md-9">
|
|
<div class="pretty-header">
|
|
<h2>{{$route.query.title}}</h2>
|
|
</div>
|
|
<nuxt-child />
|
|
</main>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'products',
|
|
watchQuery: ['maxCatgId', 'title'],
|
|
data() {
|
|
return {
|
|
|
|
}
|
|
},
|
|
async asyncData({$axios,query}) {
|
|
// 获取产品分类
|
|
const categoryTree = await $axios.$get(`/web/prodCategory?catgId=${query.maxCatgId}`)
|
|
const bannerTopOptions = {
|
|
title: query.title,
|
|
// subTitle: this.$t('products.allProducts'),
|
|
img: require('../assets/image/banner/products-banner.png')
|
|
}
|
|
|
|
return {
|
|
categoryTree,
|
|
bannerTopOptions
|
|
}
|
|
},
|
|
head() {
|
|
return {
|
|
title: this.bannerTopOptions.title, // 页面标题
|
|
meta: [
|
|
{
|
|
hid: 'keywords',
|
|
name: 'keywords',
|
|
content: this.$t('seo.product.keywords')
|
|
},
|
|
{
|
|
hid: 'description',
|
|
name: 'description',
|
|
content: this.$t('seo.product.description')
|
|
}
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.content {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
</style> |