122 lines
3.4 KiB
Vue
122 lines
3.4 KiB
Vue
<template>
|
|
<view>
|
|
<!-- 顶部操作条 -->
|
|
<cu-custom :bgColor="'bg-main-color'" :isBack="true">
|
|
<block slot="backText">返回</block>
|
|
<block slot="content">产品分类</block>
|
|
</cu-custom>
|
|
<vertical-nav v-if="categoryList" :containerHeight="containerHeight" :navList="level0CategoryList" :list="categoryList" :isClick2ShowProducts="true"></vertical-nav>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import verticalNav from '@/components/multi-level-nav/vertical-nav.vue';
|
|
|
|
export default {
|
|
components: {
|
|
verticalNav
|
|
},
|
|
data() {
|
|
return {
|
|
containerHeight: '100vh - ' + this.CustomBar + 'px - 46px',
|
|
level0CategoryList: [],
|
|
categoryList: [],
|
|
deptGoodsCategoryIds: []
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.loadData();
|
|
this.bindEvent();
|
|
},
|
|
onUnload() {
|
|
this.offBindEvent();
|
|
},
|
|
methods: {
|
|
async loadData(params = {}, type = 1) {
|
|
let res0 = await this.$request.listByStep({
|
|
level: 0
|
|
});
|
|
this.level0CategoryList = res0.data;
|
|
this.curUserInfo = this.$request.getCurUserInfo();
|
|
if(this.curUserInfo) {
|
|
const res = await this.$request.getChooseCategories({
|
|
selectionType: 1,
|
|
customerId: this.curUserInfo.customerId
|
|
})
|
|
this.deptGoodsCategoryIds = res[1].data.data
|
|
// this.deptGoodsCategoryIds = [16,234,106,113]
|
|
// [16,234,106,113]
|
|
}
|
|
this.loadTargetTypeCategoryList(params, type);
|
|
},
|
|
async loadTargetTypeCategoryList(params = {}, type = 1) {
|
|
this.categoryList = [];
|
|
// this.categoryList = await this.$api.data('categoryList');
|
|
let res = await this.$request.getProductCategories({
|
|
...params,
|
|
type: type
|
|
});
|
|
res = res[1].data.data;
|
|
res.forEach(firstCategory => {
|
|
if (firstCategory.child && firstCategory.child.length) {
|
|
if(this.deptGoodsCategoryIds.length === 0) {
|
|
this.categoryList = this.categoryList.concat(firstCategory.child)
|
|
} else {
|
|
this.categoryList = this.filterDataInSelect(firstCategory.child)
|
|
console.log(this.categoryList);
|
|
}
|
|
}
|
|
})
|
|
},
|
|
filterDataInSelect(data) {
|
|
const newData = []
|
|
for(let i = 0; i < data.length; i++) {
|
|
const newChild = []
|
|
if(!data[i].child) continue;
|
|
for(let j = 0; j < data[i].child.length; j++) {
|
|
const filterChild = (data[i].child[j].child || []).filter(item => this.deptGoodsCategoryIds.includes(item.goodsCategoryId))
|
|
if(filterChild.length) {
|
|
data[i].child[j].child = filterChild
|
|
newChild.push(data[i].child[j])
|
|
}
|
|
}
|
|
if(newChild.length) {
|
|
data[i].child = newChild
|
|
newData.push(data[i])
|
|
}
|
|
}
|
|
return newData
|
|
},
|
|
bindEvent() {
|
|
uni.$on(this.$globalFun.VERTICAL_NAV_GET_ITEM, this.chooseSubType);
|
|
uni.$on(this.$globalFun.VERTICAL_NAV_SEARCH, this.searchType);
|
|
uni.$on(this.$globalFun.VERTICAL_NAV_CHANGE_MAIN_NAV_ITEM, this.changeLevel0Category);
|
|
},
|
|
offBindEvent() {
|
|
uni.$off(this.$globalFun.VERTICAL_NAV_GET_ITEM);
|
|
uni.$off(this.$globalFun.VERTICAL_NAV_SEARCH);
|
|
uni.$off(this.$globalFun.VERTICAL_NAV_CHANGE_MAIN_NAV_ITEM);
|
|
},
|
|
chooseSubType(item) {
|
|
let params = {
|
|
category: item
|
|
};
|
|
uni.navigateTo({
|
|
url: '/pages/product/filtered-products?params=' + encodeURIComponent(JSON.stringify(params))
|
|
})
|
|
},
|
|
searchType(keyWords) {
|
|
this.loadData({
|
|
goodsCategoryName: keyWords
|
|
});
|
|
},
|
|
changeLevel0Category(category) {
|
|
this.loadTargetTypeCategoryList({}, category.type);
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
</style>
|