调取课程列表分类接口、课程列表接口、商品详情接口
parent
a1a3edb942
commit
2b2afbb814
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<view class="disjbac fw">
|
<view class="disjbac fw">
|
||||||
<view @tap="goDetail(item.id)" class="radius8 bacf pad12 boxshow1 width48_6 mar-s20 flexs" v-for="(item,index) in list" :key="index">
|
<view @tap="goDetail(item.id)" class="radius8 bacf pad12 boxshow1 width48_6 mar-s20 flexs " v-for="(item,index) in list" :key="index">
|
||||||
<image :src="item.cover" style="height: 226rpx;" mode="aspectFill" class="width100" lazy-load></image>
|
<image :src="item.cover" style="height: 226rpx;" mode="aspectFill" class="width100 animated fadeIn" lazy-load></image>
|
||||||
<view class="fon24 pad-zy8 disjb fc" style="color: #262626;">
|
<view class="fon24 pad-zy8 disjb fc" style="color: #262626;">
|
||||||
<view class="clips2 mar-sx10" style="height: 64rpx;">{{item.name}}</view>
|
<view class="clips2 mar-sx10" style="height: 64rpx;">{{item.name}}</view>
|
||||||
<view class="disjbac ae pad-x10">
|
<view class="disjbac ae pad-x10">
|
||||||
|
|
|
@ -12,7 +12,7 @@ const refreshTokenPage = () => {
|
||||||
provider: 'weixin',
|
provider: 'weixin',
|
||||||
success: (result)=> {
|
success: (result)=> {
|
||||||
uni.request({
|
uni.request({
|
||||||
url: `${getApp().globalData.hostapi}user/login`,
|
url: `${getApp().globalData.hostapi}/api/user/login`,
|
||||||
method: 'post',
|
method: 'post',
|
||||||
data: {code:result.code},
|
data: {code:result.code},
|
||||||
success: res => {
|
success: res => {
|
||||||
|
|
|
@ -5,19 +5,19 @@
|
||||||
<view class="posi-sticky" :style="{top:newtop+'px'}">
|
<view class="posi-sticky" :style="{top:newtop+'px'}">
|
||||||
<view class="pad-sx26 pad-zy20" style="border-bottom: 2rpx solid #fcede8;">
|
<view class="pad-sx26 pad-zy20" style="border-bottom: 2rpx solid #fcede8;">
|
||||||
<view class="radius40 pad-sx2 disjbac pad-zy20" style="background-color: #fff6f5;border: 2rpx solid #ece6e6;">
|
<view class="radius40 pad-sx2 disjbac pad-zy20" style="background-color: #fff6f5;border: 2rpx solid #ece6e6;">
|
||||||
<input type="text" class="fon24 width100 pad-sx6" placeholder="关键字搜索" placeholder-style="color:#aaa4a3">
|
<input v-model="keyword" @confirm="getCourseList" type="text" class="fon24 width100 pad-sx6" placeholder="关键字搜索" placeholder-style="color:#aaa4a3">
|
||||||
<image class="flexs" src="/static/tabbar/icon-search.png" mode="" style="width: 28rpx;height: 28rpx;" lazy-load></image>
|
<view class="disjcac pad-sx6 pad-zy10" @tap="getCourseList">
|
||||||
|
<image class="flexs" src="/static/tabbar/icon-search.png" mode="" style="width: 28rpx;height: 28rpx;" lazy-load></image>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<swiper-tab id="tab" :list="dataList" v-model="current" @changeEv="clickTab" :itemColor="'#e42417'" :lineColor="'#e42417'"></swiper-tab>
|
<swiper-tab id="tab" :list="dataList" v-model="current" @changeEv="clickTab" :itemColor="'#e42417'" :lineColor="'#e42417'"></swiper-tab>
|
||||||
</view>
|
</view>
|
||||||
<view class="pad-zy20">
|
<view class="pad-zy20">
|
||||||
<list @goDetail="goDetail"></list>
|
<list ref="refcourse" @goDetail="goDetail"></list>
|
||||||
<list @goDetail="goDetail"></list>
|
<view class="" v-if="noMore">
|
||||||
<list @goDetail="goDetail"></list>
|
<pitera textStr="上滑加载更多/到底了~~" textColor="#b0aaa9" paddingStr="40rpx 0 20rpx 0"></pitera>
|
||||||
<list @goDetail="goDetail"></list>
|
</view>
|
||||||
<list @goDetail="goDetail"></list>
|
|
||||||
<pitera textStr="上滑加载更多/到底了~~" textColor="#b0aaa9" paddingStr="40rpx 0 20rpx 0"></pitera>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</status-container>
|
</status-container>
|
||||||
|
@ -39,21 +39,71 @@
|
||||||
newtop:uni.getSystemInfoSync().statusBarHeight + 42,
|
newtop:uni.getSystemInfoSync().statusBarHeight + 42,
|
||||||
// newtop:uni.getSystemInfoSync().statusBarHeight + (140 / 750 * uni.getSystemInfoSync().windowWidth),
|
// newtop:uni.getSystemInfoSync().statusBarHeight + (140 / 750 * uni.getSystemInfoSync().windowWidth),
|
||||||
current:0,
|
current:0,
|
||||||
dataList:[
|
dataList:[],//分类列表
|
||||||
{title:'课堂讲解'},
|
classId:'',//分类id
|
||||||
{title:'武德教育'},
|
keyword:'',//关键字
|
||||||
{title:'爱国主义教育'},
|
page:1,
|
||||||
{title:'示范动作讲解'},
|
size:10,
|
||||||
],
|
total:0,
|
||||||
|
noMore:false,//是否没有更多
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
|
// 调用获取分类列表
|
||||||
|
this.getCourseCate();
|
||||||
|
},
|
||||||
|
onReachBottom() {
|
||||||
|
if(this.total!=this.$refs.refcourse.list.length){
|
||||||
|
this.page++;
|
||||||
|
// 调用获取商品产品列表
|
||||||
|
this.getCourseList();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// tab点击事件
|
// tab点击事件
|
||||||
clickTab(index){
|
clickTab(index){
|
||||||
this.current = index;
|
this.current = index;
|
||||||
|
this.page = 1;
|
||||||
|
this.noMore = false;
|
||||||
|
// 设置分类id
|
||||||
|
this.classId = this.dataList[index].id;
|
||||||
|
// 调用获取商品产品列表
|
||||||
|
this.getCourseList();
|
||||||
|
},
|
||||||
|
// 获取分类列表
|
||||||
|
getCourseCate(){
|
||||||
|
this.$requst.get('/api/spu/category',{type:'course'}).then(res=>{
|
||||||
|
// 设置分类列表
|
||||||
|
this.dataList = res.data;
|
||||||
|
// 如果分类列表不为空
|
||||||
|
if(this.dataList.length){
|
||||||
|
// 设置分类id
|
||||||
|
this.classId = this.dataList[0].id;
|
||||||
|
// 调用获取商品产品列表
|
||||||
|
this.getCourseList();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 获取商品产品列表
|
||||||
|
getCourseList(){
|
||||||
|
let params = {
|
||||||
|
category_id:this.classId,
|
||||||
|
page:this.page,
|
||||||
|
size:this.size,
|
||||||
|
keyword:this.keyword
|
||||||
|
}
|
||||||
|
this.$requst.post('/api/spu/course',params).then(res=>{
|
||||||
|
if(res.code==0){
|
||||||
|
// 设置总数
|
||||||
|
this.total = res.data.total;
|
||||||
|
if(this.page==1){this.$refs.refcourse.list=[];}
|
||||||
|
// 设置产品列表
|
||||||
|
this.$refs.refcourse.list = [...this.$refs.refcourse.list,...res.data.list];
|
||||||
|
if(this.total==this.$refs.refcourse.list.length && this.page!=1){
|
||||||
|
this.noMore = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
},
|
},
|
||||||
// 去课程详情
|
// 去课程详情
|
||||||
goDetail(id){
|
goDetail(id){
|
||||||
|
|
|
@ -7,7 +7,9 @@
|
||||||
</view>
|
</view>
|
||||||
<view class="pad-zy20">
|
<view class="pad-zy20">
|
||||||
<list ref="refproduct" @goDetail="goDetail"></list>
|
<list ref="refproduct" @goDetail="goDetail"></list>
|
||||||
<pitera textStr="上滑加载更多/到底了~~" textColor="#b0aaa9" paddingStr="40rpx 0 20rpx 0"></pitera>
|
<view class="" v-if="noMore">
|
||||||
|
<pitera textStr="上滑加载更多/到底了~~" textColor="#b0aaa9" paddingStr="40rpx 0 20rpx 0"></pitera>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</status-container>
|
</status-container>
|
||||||
|
@ -36,26 +38,36 @@
|
||||||
dataList:[],//分类列表
|
dataList:[],//分类列表
|
||||||
classId:'',//分类id
|
classId:'',//分类id
|
||||||
page:1,
|
page:1,
|
||||||
size:20,
|
size:10,
|
||||||
total:0,
|
total:0,
|
||||||
|
noMore:false,//是否没有更多
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
// 调用获取分类列表
|
// 调用获取分类列表
|
||||||
this.getHomeCate();
|
this.getHomeCate();
|
||||||
},
|
},
|
||||||
|
onReachBottom() {
|
||||||
|
if(this.total!=this.$refs.refproduct.list.length){
|
||||||
|
this.page++;
|
||||||
|
// 调用获取商品产品列表
|
||||||
|
this.getProductList();
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// tab点击事件
|
// tab点击事件
|
||||||
clickTab(index){
|
clickTab(index){
|
||||||
this.current = index;
|
this.current = index;
|
||||||
|
this.page = 1;
|
||||||
|
this.noMore = false;
|
||||||
// 设置分类id
|
// 设置分类id
|
||||||
this.classId = this.dataList[index].id;
|
this.classId = this.dataList[index].id;
|
||||||
// 调用获取商品产品列表
|
// 调用获取商品产品列表
|
||||||
this.getProductList();
|
this.getProductList();
|
||||||
},
|
},
|
||||||
// 获取首页分类
|
// 获取分类列表
|
||||||
getHomeCate(){
|
getHomeCate(){
|
||||||
this.$requst.get('/api/spu/category').then(res=>{
|
this.$requst.get('/api/spu/category',{type:'normal',need_all:1}).then(res=>{
|
||||||
// 设置分类列表
|
// 设置分类列表
|
||||||
this.dataList = res.data;
|
this.dataList = res.data;
|
||||||
// 如果分类列表不为空
|
// 如果分类列表不为空
|
||||||
|
@ -81,6 +93,9 @@
|
||||||
if(this.page==1){this.$refs.refproduct.list=[];}
|
if(this.page==1){this.$refs.refproduct.list=[];}
|
||||||
// 设置产品列表
|
// 设置产品列表
|
||||||
this.$refs.refproduct.list = [...this.$refs.refproduct.list,...res.data.list];
|
this.$refs.refproduct.list = [...this.$refs.refproduct.list,...res.data.list];
|
||||||
|
if(this.total==this.$refs.refproduct.list.length && this.page!=1){
|
||||||
|
this.noMore = true;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
|
@ -5,10 +5,10 @@
|
||||||
<view class="bacf boxshowb">
|
<view class="bacf boxshowb">
|
||||||
<swiper-pu newBottom="20rpx" newHeight="520rpx"></swiper-pu>
|
<swiper-pu newBottom="20rpx" newHeight="520rpx"></swiper-pu>
|
||||||
<view class="pad-zy30 pad-sx24">
|
<view class="pad-zy30 pad-sx24">
|
||||||
<view class="fon26 col26">武,止戈为武;术,思通造化、随通而 行为术基础动作教学</view>
|
<view class="fon26 col26">{{shopInfo.name}}</view>
|
||||||
<view class="col-e42417 dis ae fon24 mar-s20">
|
<view class="col-e42417 dis ae fon24 mar-s20">
|
||||||
<view class="bold">¥199.00</view>
|
<view class="bold">¥{{shopInfo.price}}</view>
|
||||||
<view class="tline-through fon20 col-969696 mar-z10">¥220.00</view>
|
<view class="tline-through fon20 col-969696 mar-z10">¥{{shopInfo.original_price}}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -47,6 +47,8 @@
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
richText:'',
|
richText:'',
|
||||||
|
shopId:'',//产品id
|
||||||
|
shopInfo:'',//产品详情
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onShow() {
|
onShow() {
|
||||||
|
@ -57,10 +59,23 @@
|
||||||
// 关闭banner图自动轮播
|
// 关闭banner图自动轮播
|
||||||
this.$store.commit('setAutoplay',false);
|
this.$store.commit('setAutoplay',false);
|
||||||
},
|
},
|
||||||
onLoad() {
|
onLoad(op) {
|
||||||
|
this.shopId = op.id;
|
||||||
|
// 调用产品详情
|
||||||
|
this.getDetail();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 获取产品详情
|
||||||
|
getDetail(){
|
||||||
|
this.$requst.post('/api/spu/detail',{id:this.shopId}).then(res=>{
|
||||||
|
if(res.code==0){
|
||||||
|
// 设置产品详情
|
||||||
|
this.shopInfo = res.data.detail;
|
||||||
|
// 富文本
|
||||||
|
this.richText = this.$toolAll.tools.escape2Html(this.shopInfo.content);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
// 前往确认订单页
|
// 前往确认订单页
|
||||||
goConfirmOrder(){
|
goConfirmOrder(){
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
|
|
Loading…
Reference in New Issue