luban-mall/pages/tabbar/news/collection.vue

202 lines
4.8 KiB
Vue
Raw Normal View History

2022-07-08 08:15:29 +00:00
<template>
<view>
<status-nav :ifReturn="true" navBarTitle="收藏" :marginBottom="0"></status-nav>
<!-- 导航 -->
<view class="nav-list-bg" :style="{top:newTop+'px'}">
<nav-tab :list="navTabList" @chooseEv="chooseEv"></nav-tab>
</view>
<!-- 列表 -->
<view class="news-list-bg">
<pull-list :list="collectionList" :collection="1" :isShop="isShop" @toDetail="toArticleDetail" @collectionEv="collectionEv"></pull-list>
</view>
<!-- 暂无更多内容 -->
<view class="more-txt more-txt-other" v-if="total == 0"></view>
</view>
</template>
<script>
import statusNav from '@/components/status-navs/status-nav';
import navTab from '@/components/nav-tab/nav-tab.vue';
import pullList from '@/components/pull-list/pull-list.vue';
import {getCartNum} from '@/jsFile/public-api.js';
import { mapState } from 'vuex'//引入mapState
export default {
components:{
statusNav,
navTab,
pullList
},
data() {
return {
scrollHeight:uni.getSystemInfoSync().windowHeight - uni.getSystemInfoSync().statusBarHeight - 50,
newWidth:uni.getSystemInfoSync().windowWidth,
newTop:uni.getSystemInfoSync().statusBarHeight + 50,
collectionList:[], //解答&资讯列表
navTabList:[ //导航列表
{name:'商品'},
{name:'文章'},
],
currentIndex:0, //当前位置
page:1, //第几页
size:10, //查询条数
total:0, //总数
totalAll:-1, //计算总数
isShop:true, //是否商品
}
},
computed:{
...mapState({
footHeight: state => state.moduleA.footHeight,
}),
},
onLoad() {
},
onReady() {
this.getCollectionList();
},
onReachBottom(e) {
if(this.collectionList.length<this.total){
this.page++;
this.getArticleList();
}else{
this.totalAll = this.total;
return false;
}
this.page++;
this.getCollectionList();
},
// 分享到微信
onShareAppMessage() {
2022-07-11 10:35:14 +00:00
let path = uni.getStorageSync('page-path-options')+'?business_id='+uni.getStorageSync('business_id');
return {
path:path
}
2022-07-08 08:15:29 +00:00
},
// 分享到朋友圈
2022-07-11 10:35:14 +00:00
onShareTimeline(res){
let path = uni.getStorageSync('page-path-options')+'?business_id='+uni.getStorageSync('business_id');
return {
path:path
}
2022-07-08 08:15:29 +00:00
},
methods: {
// 切换事件
chooseEv(type){
if(type == 0){
this.isShop = true;
}
if(type == 1){
this.isShop = false;
}
if(this.currentIndex !== type){
this.page = 1;
this.currentIndex = type;
this.getCollectionList();
}
},
// 获取收藏列表
getCollectionList(){
let params = {
page:this.page,
size:this.size
}
if(this.currentIndex == 0){
uni.showLoading();
this.$requst.get('/api/spu/collection',params).then(res=>{
if(res.code == 0){
this.total = res.data.total;
let newArr = [];
res.data.list.forEach(item=>{
let obj = {
id:item.id,
src:item.cover,
title:item.name,
time:'',
}
newArr.push(obj)
})
this.collectionList = newArr;
}
uni.hideLoading();
})
}
if(this.currentIndex == 1){
this.$requst.get('/api/archives/collects',params).then(res=>{
if(res.code == 0){
this.total = res.data.total;
let newArr = [];
res.data.list.forEach(item=>{
let obj = {
id:item.id,
src:item.cover,
title:item.title,
time:this.dateFormat(item.published_at)
}
newArr.push(obj)
})
this.collectionList = newArr;
}
})
}
},
// 时间格式转换
dateFormat (dateData) {
var date = new Date(dateData)
var y = date.getFullYear()
var m = date.getMonth() + 1
m = m < 10 ? '0' + m : m
var d = date.getDate()
d = d < 10 ? '0' + d : d
const time = y + '.' + m + '.' + d
return time
},
//收藏
collectionEv(id){
console.log(id,12121)
if(this.currentIndex == 0){
let params = {
id:id.id,
action:'collect'
}
this.$requst.post('/api/spu/un-record',params).then(res=>{
if(res.code==0) {
this.$toolAll.tools.showToast('取消收藏成功');
this.getCollectionList();
}
})
}
if(this.currentIndex == 1){
let params = {
archive_id:id.id,
action:'collect'
}
this.$requst.post('/api/archives/un-record',params).then(res=>{
if(res.code==0) {
this.$toolAll.tools.showToast('取消收藏成功');
this.getCollectionList();
}
})
}
},
//去文章详情
toArticleDetail(id){
if(this.currentIndex == 0){
uni.navigateTo({
url:`/pagesA/shop/detail?id=${id.id}&source=shop`
})
}
if(this.currentIndex == 1){
uni.navigateTo({
url:`/pages/tabbar/news/detail?id=${id.id}`
})
}
}
}
}
</script>
<style>
</style>