hengmei-two/pagesB/myCollection/myCollection.vue

164 lines
5.1 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view>
<!-- 状态栏 -->
<status-nav :titleVal="'文章收藏'" :statusTitle="true"></status-nav>
<!-- 自定义二级分类 -->
<!-- 列表 -->
<view>
<view id="daoh" class="bacf pad-zy30 pad-sx20 isTopf" :style="{top:statusHNH+'px'}">
<cate-pu :newCurrent="newCurrent*1" :activeb="publicColor" :isCenter="false" :newbmo="'#E0E0E0'" @choosecateEv="chooseTwo" :newcateList="cateList"></cate-pu>
</view>
<view :style="{paddingTop:(statusHNH+chuTop+30)+'px'}">
<view v-if="dataList.length!=0" class="pad-zy20 pad-s20">
<list-pu :radiu="true" @comfirmev="comfirmev" :list="dataList"></list-pu>
</view>
<view v-else class="disjcac fc" style="margin-top: 50%;">
<image class="zanw-img" src="/static/public/collection.png" style="" mode="aspectFill"></image>
<view class="fon24 col3">您还没有收藏快去收藏吧</view>
</view>
</view>
</view>
<!-- 返回顶部 -->
<!-- <back-top :showTop="showTop" @backTop="backTop"></back-top> -->
</view>
</template>
<script>
import {cancleCollectionEV} from '@/jsFile/publicAPI.js';
export default {
data() {
return {
statusHNH:uni.getStorageSync('statusHNH'),
publicColor:uni.getStorageSync('publicColor'),//主题颜色
dataList:[],
showTop:false,//是否显示返回顶部
newCurrent:0,
cateList:[//所以二级分类
],
page:1,
size:10,
total:'',//总数
isZanw:true,
category_id:0,//栏目ID
chuTop:'',
}
},
onPageScroll(e) {
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
},
onReachBottom() {//触底事件
if(this.total!=this.dataList.length){
this.page++
this.checkConList(this.category_id)//调用自主预约列表事件
} else {
if(this.isZanw) this.$toolAll.tools.showToast('暂无更多列表','none',1000)
this.isZanw = false
}
},
onUnload() {
uni.removeStorageSync('cateList')
},
onLoad() {
this.checkConList(this.category_id)
const query = wx.createSelectorQuery()
query.select('#daoh').boundingClientRect((rect) => {
// console.log('状态栏+标题栏:',rect);
this.chuTop = rect.height
}).exec()
},
methods: {
checkConList(category_id){//查询收藏列表
// this.$toolAll.tools.showToast('加载中...')
let params = {
category_id:category_id,
page:this.page,
size:this.size
}
this.$requst.post('archives/collects',params).then(res=>{
if(res.code==0){
// 栏目类别
if(uni.getStorageSync('cateList')==''){//首次渲染栏目
if(res.data.category.length!=0){
res.data.category.forEach((item,index)=>{
let cateObj = {
id:item.id,//栏目ID
title:item.title,//栏目名称
active:item.active,//是否选中
model_id:item.model_id,//模型ID
model_name:item.model_name,//模型标识
sort:item.sort,
}
this.cateList.push(cateObj)
})
uni.setStorageSync('cateList',this.cateList)
this.category_id = this.cateList[0].id
}
} else {
//获取缓存中的栏目
this.cateList = uni.getStorageSync('cateList')
}
// 获取列表
if(this.page==1) this.dataList = []
this.total = res.data.list.total
if(res.data.list.list.length!=0){
uni.hideToast()
res.data.list.list.forEach(item=>{
let num = item.video.search(".mp4")
let isVideo = false
if(num!='-1') isVideo = true
let tObj = {
category_id:item.category_id,//栏目ID
id:item.id,
is_collected:1,//是否已收藏
collects:item.collects,//收藏量
views:item.views,//查看量
main_img:this.$http + item.cover,//封面图
video:this.$http + item.video,//视频地址
title:item.title,//标题
content:item.subtitle,//副标题
head_img:'/static/public/logo.png',//发布者头像
name:'恒美植发',//发布者昵称
isVideo:isVideo//是否是视频
}
if(this.newCurrent==0 && item.category_id==32) this.dataList.push(tObj)
if(this.newCurrent==1 && item.category_id==33) this.dataList.push(tObj)
if(this.newCurrent==2 && item.category_id==34) this.dataList.push(tObj)
if(this.newCurrent==3 && item.category_id==38) this.dataList.push(tObj)
})
}
}
},error=>{})
},
comfirmev(e){//确认取消收藏事件
this.$toolAll.tools.showToast('正在取消...','loading')
// 调用取消收藏事件
cancleCollectionEV({action:'collect',archive_id:this.dataList[e].id})
setTimeout(()=>{
this.checkConList(this.category_id)
},300)
this.dataList[e].is_collected = 0
},
chooseTwo(index){//二级分类选择
this.newCurrent = index
this.isZanw = true
this.page = 1
this.category_id = this.cateList[index].id
this.checkConList(this.cateList[index].id)
// console.log('二级分类:',index);
},
backTop(){//回到顶部事件
uni.pageScrollTo({
scrollTop: 0,
duration: 300
});
},
}
}
</script>
<style>
</style>