218 lines
6.5 KiB
Vue
218 lines
6.5 KiB
Vue
<template>
|
|
<view class="pad-b150">
|
|
<status-nav :ifReturn="false" navBarTitle="分类" :marginBottom="0"></status-nav>
|
|
<!-- 选择厂家 -->
|
|
<view class="pull-all-bg" v-show="isShow" @tap="closeMore"></view>
|
|
<view class="company-top" v-if="businessId==0"></view>
|
|
<view class="company" :style="{'top':topHieght+'px'}" v-if="businessId==0">
|
|
<input type="text" :value="companyList[companyIndex].name?'工厂选择：'+ companyList[companyIndex].name:''" @tap="openMore" disabled>
|
|
<view class="company-list" v-if="isShow">
|
|
<view @tap="checkValue(index,item.id)" class="company-item" :class="companyIndex == index?'cur':''" v-for="(item,index) in companyList">{{item.name}}</view>
|
|
</view>
|
|
</view>
|
|
<!-- 一级分类列表 -->
|
|
<view class="cate-nav-bg" :style="{'height':scrollHeight+'px','top':topHieght+'px'}" :class="businessId==0?'':'to-top'" v-if="cateList.length>0">
|
|
<view class="cate-nav">
|
|
<view class="cate-nav-item" :class="cateIndex == index?'active':''" @tap="changeCate(index,item.id)" v-for="(item,index) in cateList" :key="index">{{item.title}}</view>
|
|
</view>
|
|
</view>
|
|
<!-- 二级分类列表 -->
|
|
<scroll-view class="shop-list-bg" :class="businessId==0?'':'to-top'">
|
|
<view class="shop-list flex">
|
|
<view class="shop-item" @tap="toShop(item.id)" v-for="(item,index) in secondList" :key="index">
|
|
<view class="img flex"><image :src="item.cover" mode="widthFix"></image></view>
|
|
<view class="txt clips1">{{item.title}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="tips" v-if="secondList.length==0 && isTips">---没有更多分类---</view>
|
|
</scroll-view>
|
|
<view class="cate-nothing-tips" v-if="cateList.length==0">---该商户没有分类---</view>
|
|
<!-- 购物车btn -->
|
|
<enter-cart></enter-cart>
|
|
<!-- 底部tab -->
|
|
<foot-tab current="1"></foot-tab>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import statusNav from '@/components/status-navs/status-nav';
|
|
import enterCart from '@/components/enter-cart/enter-cart.vue';
|
|
// 底部组件
|
|
import footTab from '@/components/foot-tab/foot-tab.vue';
|
|
import {getCartNum,userInfoEv} from '@/jsFile/public-api.js';
|
|
import {mapState} from 'vuex'//引入mapState
|
|
export default {
|
|
components:{
|
|
statusNav,
|
|
enterCart,
|
|
footTab
|
|
},
|
|
data() {
|
|
return {
|
|
scrollHeight:uni.getSystemInfoSync().windowHeight - uni.getSystemInfoSync().statusBarHeight - 50,
|
|
newWidth:uni.getSystemInfoSync().windowWidth,
|
|
topHieght: uni.getSystemInfoSync().statusBarHeight + 50,
|
|
companyList:[], //工厂列表
|
|
companyIndex: 0, //当前厂家
|
|
isShow: false, //显示弹窗
|
|
cateList:[], //一级分类列表
|
|
cateIndex:0,
|
|
secondList:[], //二级分类列表
|
|
total:0,
|
|
flag:true,
|
|
ifLoading:false,
|
|
businessId:0, //分类id
|
|
isTips:false, //是否提示
|
|
cacheBusinessId:-1, //商户id
|
|
}
|
|
},
|
|
computed:{
|
|
...mapState({
|
|
footHeight: state => state.moduleA.footHeight,
|
|
}),
|
|
},
|
|
onLoad(op) {
|
|
if(op.business_id){
|
|
this.cacheBusinessId = op.business_id;
|
|
}
|
|
},
|
|
onShow() {
|
|
this.companyIndex = 0;
|
|
if(this.cacheBusinessId !== -1){
|
|
this.$requst.post('/api/index/change-business',{business_id:this.cacheBusinessId}).then(res=>{
|
|
if(res.code == 0){
|
|
this.getUserInfo();
|
|
userInfoEv();
|
|
}
|
|
})
|
|
}else{
|
|
this.getUserInfo();
|
|
userInfoEv();
|
|
}
|
|
},
|
|
onReachBottom(e) {
|
|
|
|
},
|
|
// 分享到微信
|
|
onShareAppMessage() {
|
|
let path = uni.getStorageSync('page-path-options')+'?business_id='+uni.getStorageSync('business_id');
|
|
return {
|
|
path:path
|
|
}
|
|
},
|
|
// 分享到朋友圈
|
|
onShareTimeline(res){
|
|
let path = uni.getStorageSync('page-path-options')+'?business_id='+uni.getStorageSync('business_id');
|
|
return {
|
|
path:path
|
|
}
|
|
},
|
|
methods: {
|
|
// 获取用户信息
|
|
getUserInfo(){
|
|
this.$requst.get('/api/user/info').then(res=>{
|
|
if(res.code==0) {
|
|
this.businessId = res.data.business_id;
|
|
this.getCompanyList(res.data.business_id); //查询商户
|
|
this.getCateList(res.data.business_id); //查询一级分类
|
|
}
|
|
})
|
|
},
|
|
// 弹出厂家选择框
|
|
openMore(){
|
|
if(!this.isShow){
|
|
this.isShow = true;
|
|
}else{
|
|
this.isShow = false;
|
|
}
|
|
},
|
|
// 关闭厂家选择
|
|
closeMore(){
|
|
this.isShow = false;
|
|
},
|
|
// 选择厂家
|
|
checkValue(index,id){
|
|
this.companyIndex = index;
|
|
this.getCateList(id); //查询一级分类
|
|
// 关闭厂家选择
|
|
this.closeMore();
|
|
},
|
|
// 选择分类
|
|
changeCate(index,id){
|
|
this.cateIndex = index;
|
|
// 查询二级
|
|
this.isTips = false;
|
|
this.secondList=[];
|
|
this.getSecondList(this.cateIndex);
|
|
},
|
|
// 查询工厂列表
|
|
getCompanyList(business_id){
|
|
this.$requst.get('/api/spu/business',{business_id:business_id}).then(res=>{
|
|
if(res.code==0) {
|
|
this.companyList = res.data; //商户列表
|
|
console.log(this.companyList,11111)
|
|
// 查询一级分类
|
|
if(this.companyList.length>0){
|
|
this.getCateList(this.companyList[0].id);
|
|
}else{
|
|
this.getCateList(0);
|
|
}
|
|
|
|
}
|
|
})
|
|
},
|
|
// 查询一级分类
|
|
getCateList(pid){
|
|
uni.showLoading({
|
|
title: '加载中'
|
|
});
|
|
this.$requst.get('/api/spu/category',{business_id:pid}).then(res=>{
|
|
if(res.code==0) {
|
|
// uni.setStorageSync('businessId',this.businessId); //工厂id
|
|
this.cateIndex = 0;
|
|
this.cateList = [];
|
|
this.cateList = res.data; //一级分类
|
|
// 查询二级
|
|
this.getSecondList(this.cateIndex);
|
|
// if(res.data.length>0){
|
|
// uni.setStorageSync('companyIndex',this.companyIndex); //工厂index
|
|
// uni.setStorageSync('businessId',this.businessId); //工厂id
|
|
// this.cateIndex = 0;
|
|
// this.cateList = [];
|
|
// this.cateList = res.data; //一级分类
|
|
// // 查询二级
|
|
// this.getSecondList(this.cateIndex);
|
|
// }else{
|
|
// this.$toolAll.tools.showToast('该商户不能选择');
|
|
// this.companyIndex = uni.getStorageSync('companyIndex'); //还原工厂index
|
|
// this.businessId = uni.getStorageSync('businessId'); //还原工厂id
|
|
// }
|
|
}
|
|
})
|
|
},
|
|
// 查询二级分类
|
|
getSecondList(index){
|
|
this.secondList=[];
|
|
if(this.cateList.length>0){
|
|
if(this.cateList[index].has_children){
|
|
this.secondList = this.cateList[index].children;
|
|
}else{
|
|
this.isTips = true;
|
|
}
|
|
}
|
|
uni.hideLoading();
|
|
},
|
|
// 跳转详情页
|
|
toShop(id) {
|
|
uni.navigateTo({
|
|
url:`/pagesA/shop/shop?category_id=${id}&company_id=${this.companyList[this.companyIndex].id}`
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|